coderofsalvation
/
xrfragment
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

custom aframe build with extra loaders + cleanup

This commit is contained in:
Leon van Kammen 2024-02-23 22:02:07 +00:00
parent 5131b4f99b
commit 77760a4dd1
9 changed files with 80 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
doc/RFC_XR_Fragments.md
View File

@ -161,7 +161,7 @@ Below you can see how this translates back into good-old URLs:
│ the soul of any URL: ://macro /meso ?micro #nano │ │ the soul of any URL: ://macro /meso ?micro #nano │
│ │ │ │
│ 2D URL: ://library.com /document ?search #chapter │ │ 2D URL: ://library.com /document ?search #chapter │
│ │ │ xrf:// │
│ 4D URL: ://park.com /4Dscene.fbx ─> ?other.glb ─> #view ───> hashbus │ │ 4D URL: ://park.com /4Dscene.fbx ─> ?other.glb ─> #view ───> hashbus │
│ │ #filter │ │ │ │ #filter │ │
│ │ #tag │ │ │ │ #tag │ │
@ -179,7 +179,7 @@ Below you can see how this translates back into good-old URLs:
``` ```
> ?-linked and #-linked navigation are JUST one possible way to implement XR Fragments, to allow a Hypermediatic FeedbackLoop (HFL) between external and internal 4D navigation. > ?-linked and #-linked navigation are JUST one possible way to implement XR Fragments: the essential goal is to allow a Hypermediatic FeedbackLoop (HFL) between external and internal 4D navigation.
Traditional webbrowsers can become 4D document-ready by: Traditional webbrowsers can become 4D document-ready by:
@ -190,16 +190,20 @@ Traditional webbrowsers can become 4D document-ready by:
XR Fragments itself are [hypermediatic](https://github.com/coderofsalvation/hypermediatic) and HTML-agnostic, though pseudo-XR Fragment browsers **can** be implemented on top of HTML/Javascript. XR Fragments itself are [hypermediatic](https://github.com/coderofsalvation/hypermediatic) and HTML-agnostic, though pseudo-XR Fragment browsers **can** be implemented on top of HTML/Javascript.
| principle | XR 4D URL | HTML 2D URL | | principle | XR 4D URL | HTML 2D URL |
|----------------------|-------------------------------------------------|---------------------------------------| |-----------------------------|-------------------------------------------------|---------------------------------------|
| the XRWG | wordgraph (collapses 3D scene to tags) | Ctrl-F (find) | | the XRWG | wordgraph (collapses 3D scene to tags) | Ctrl-F (find) |
| the hashbus | hashtags alter camera/scene/object-projections | hashtags alter document positions | | the hashbus | hashtags alter camera/scene/object-projections | hashtags alter document positions |
| src metadata | renders content and offers sourceportation | renders content | | src metadata | renders content and offers sourceportation | renders content |
| href metadata | teleports to other XR document | jumps to other HTML document | | href metadata | teleports to other XR document | jumps to other HTML document |
| href metadata | triggers predefined view | Media fragments | | href metadata | triggers predefined view | Media fragments |
| href metadata | triggers camera/scene/object/projections | n/a | | href metadata | triggers camera/scene/object/projections | n/a |
| href metadata | draws visible connection(s) for XRWG 'tag' | n/a | | href metadata | draws visible connection(s) for XRWG 'tag' | n/a |
| href metadata | filters certain (in)visible objects | n/a | | href metadata | filters certain (in)visible objects | n/a |
| href metadata | href="xrf://#-foo&bar" | href="javascript:hideFooAndShowBar()` |
| | (this does not update topLevel URI) | (this is non-standard, non-hypermediatic) |
> An important aspect of HFL is that URI Fragments can be triggered without updating the top-level URI (default href-behaviour) thru their own 'bus' (`xrf://#.....`). This decoupling between navigation and interaction prevents non-standard things like (`href`:`javascript:dosomething()`).
# Conventions and Definitions # Conventions and Definitions
@ -234,7 +238,7 @@ That way, if the link gets shared, the XR Fragments implementation at `https://m
|-------------------|------------|--------------------|----------------------------------------------------------------------| |-------------------|------------|--------------------|----------------------------------------------------------------------|
| `#pos` | vector3 | `#pos=0.5,0,0` | positions camera (or XR floor) to xyz-coord 0.5,0,0, | | `#pos` | vector3 | `#pos=0.5,0,0` | positions camera (or XR floor) to xyz-coord 0.5,0,0, |
| `#rot` | vector3 | `#rot=0,90,0` | rotates camera to xyz-coord 0.5,0,0 | | `#rot` | vector3 | `#rot=0,90,0` | rotates camera to xyz-coord 0.5,0,0 |
| [W3C Media Fragments](https://www.w3.org/TR/media-frags/) | [media fragment](#media%20fragments%20and%20datatypes) | `#t=0,2&loop` | play (and loop) 3D animation from 0 seconds till 2 seconds| | [Media Fragments](https://www.w3.org/TR/media-frags/) | [media fragment](#media%20fragments%20and%20datatypes) | `#t=0,2&loop` | play (and loop) 3D animation from 0 seconds till 2 seconds|
| | | | but can also crop, animate & configure uv-coordinates/shader uniforms | | | | | but can also crop, animate & configure uv-coordinates/shader uniforms |
## List of metadata for 3D nodes ## List of metadata for 3D nodes

18
make
View File

@ -52,6 +52,18 @@ server(){
build(){ build(){
aframe(){
test -d src/3rd/js/aframe/build/aframe || git clone https://github.com/aframevr/aframe src/3rd/js/aframe/build/aframe --depth=1
curdir=$(pwd)
cd src/3rd/js/aframe/build && cp three.module.js aframe/src/lib/. # override to add extra loaders like fbx/collada e.g.
cd aframe && npm run dist
cd "$curdir"
cp src/3rd/js/aframe/build/aframe/dist/aframe-master.min.js dist/aframe.min.js
test -f dist/aframe-blink-controls.min.js || {
wget "https://cdn.jsdelivr.net/npm/aframe-blink-controls/dist/aframe-blink-controls.min.js" -O dist/aframe-blink-controls.min.js
}
}
parser(){ parser(){
try rm dist/xrfragment.* try rm dist/xrfragment.*
haxe build.hxml || exit 1 haxe build.hxml || exit 1
@ -92,12 +104,6 @@ build(){
jscat src/3rd/js/plugin/matrix/{matrix-crdt,matrix}.js > dist/xrfragment.plugin.matrix.js jscat src/3rd/js/plugin/matrix/{matrix-crdt,matrix}.js > dist/xrfragment.plugin.matrix.js
jscat src/3rd/js/plugin/p2p/{trystero-torrent.min,trystero}.js > dist/xrfragment.plugin.p2p.js jscat src/3rd/js/plugin/p2p/{trystero-torrent.min,trystero}.js > dist/xrfragment.plugin.p2p.js
# fat all-in-one standalone xrf release
test -f dist/aframe.min.js || {
wget "https://aframe.io/releases/1.5.0/aframe.min.js" -O dist/aframe.min.js
wget "https://cdn.jsdelivr.net/npm/aframe-blink-controls/dist/aframe-blink-controls.min.js" -O dist/aframe-blink-controls.min.js
}
cat dist/aframe.min.js dist/aframe-blink-controls.min.js dist/xrfragment.aframe.js > dist/xrfragment.aframe.all.js cat dist/aframe.min.js dist/aframe-blink-controls.min.js dist/xrfragment.aframe.js > dist/xrfragment.aframe.all.js
# add license headers # add license headers

30
src/3rd/js/aframe/build/three.module.js Normal file
View File

@ -0,0 +1,30 @@
import * as SUPER_THREE from 'super-three';
import { DRACOLoader } from 'super-three/examples/jsm/loaders/DRACOLoader';
import { GLTFLoader } from 'super-three/examples/jsm/loaders/GLTFLoader';
import { KTX2Loader } from 'super-three/examples/jsm/loaders/KTX2Loader';
import { OBB } from 'super-three/addons/math/OBB.js';
import { OBJLoader } from 'super-three/examples/jsm/loaders/OBJLoader';
import { FBXLoader } from 'super-three/examples/jsm/loaders/FBXLoader';
import { USDZLoader } from 'super-three/examples/jsm/loaders/USDZLoader';
import { ColladaLoader } from 'super-three/examples/jsm/loaders/ColladaLoader';
import { MTLLoader } from 'super-three/examples/jsm/loaders/MTLLoader';
import * as BufferGeometryUtils from 'super-three/examples/jsm/utils/BufferGeometryUtils';
import { LightProbeGenerator } from 'super-three/examples/jsm/lights/LightProbeGenerator';
var THREE = window.THREE = SUPER_THREE;
// TODO: Eventually include these only if they are needed by a component.
require('../../vendor/DeviceOrientationControls'); // THREE.DeviceOrientationControls
THREE.DRACOLoader = DRACOLoader;
THREE.GLTFLoader = GLTFLoader;
THREE.KTX2Loader = KTX2Loader;
THREE.OBJLoader = OBJLoader;
THREE.MTLLoader = MTLLoader;
THREE.FBXLoader = FBXLoader;
THREE.USDZLoader = USDZLoader;
THREE.ColladaLoader = ColladaLoader;
THREE.OBB = OBB;
THREE.BufferGeometryUtils = BufferGeometryUtils;
THREE.LightProbeGenerator = LightProbeGenerator;
export default THREE;

11
src/3rd/js/aframe/index.js
View File

@ -3,13 +3,13 @@ window.AFRAME.registerComponent('xrf', {
http: { type:'string'}, http: { type:'string'},
https: { type:'string'}, https: { type:'string'},
}, },
init: function () { init: async function () {
// override this.data when URL has passed (`://....com/?https://foo.com/index.glb` e.g.) // override this.data when URL has passed (`://....com/?https://foo.com/index.glb` e.g.)
if( typeof this.data == "string" ){ if( typeof this.data == "string" ){
let searchIsUri = document.location.search && let searchIsUri = document.location.search &&
!document.location.search.match(/=/) && !document.location.search.match(/=/) &&
document.location.search.match("://") document.location.search.match("/")
if( searchIsUri || document.location.hash.length > 1 ){ // override url if( searchIsUri || document.location.hash.length > 1 ){ // override url
this.data = `${document.location.search.substr(1)}${document.location.hash}` this.data = `${document.location.search.substr(1)}${document.location.hash}`
} }
@ -32,8 +32,11 @@ window.AFRAME.registerComponent('xrf', {
renderer: aScene.renderer, renderer: aScene.renderer,
loaders: { loaders: {
gltf: THREE.GLTFLoader, // which 3D assets (exts) to check for XR fragments? gltf: THREE.GLTFLoader, // which 3D assets (exts) to check for XR fragments?
glb: THREE.GLTFLoader, glb: THREE.GLTFLoader,
obj: THREE.OBJLoader obj: THREE.OBJLoader,
fbx: THREE.FBXLoader,
usdz: THREE.USDZLoader,
col: THREE.ColladaLoader
} }
}) })
aScene.renderer.toneMapping = THREE.ACESFilmicToneMapping; aScene.renderer.toneMapping = THREE.ACESFilmicToneMapping;

5
src/3rd/js/three/xrf/src/fbx.js
View File

@ -8,8 +8,9 @@ xrf.frag.src.type['fbx'] = function( url, opts ){
let {urlObj,dir,file,hash,ext} = xrf.parseUrl(url) let {urlObj,dir,file,hash,ext} = xrf.parseUrl(url)
let loader let loader
//let {THREE} = await import('https://unpkg.com/three@0.161.0/build/three.module.js') let {THREE} = await import('https://unpkg.com/three@0.161.0/build/three.module.js')
//let { FBXLoader } = await import('three/addons/loaders/FBXLoader.js') let { FBXLoader } = await import('three/addons/loaders/FBXLoader.js')
debugger
//const Loader = xrf.loaders[ext] //const Loader = xrf.loaders[ext]
//if( !Loader ) throw 'xrfragment: no loader passed to xrfragment for extension .'+ext //if( !Loader ) throw 'xrfragment: no loader passed to xrfragment for extension .'+ext

4
src/3rd/js/three/xrf/src/non-euclidian.js
View File

@ -164,18 +164,14 @@ xrf.portalNonEuclidian.setMaterial = function(mesh){
mesh.material.colorWrite = false; mesh.material.colorWrite = false;
mesh.material.stencilWrite = true; mesh.material.stencilWrite = true;
mesh.material.stencilRef = xrf.portalNonEuclidian.stencilRef; mesh.material.stencilRef = xrf.portalNonEuclidian.stencilRef;
// mesh.renderOrder = 0;//xrf.portalNonEuclidian.stencilRef;
mesh.material.stencilFunc = xrf.THREE.AlwaysStencilFunc; mesh.material.stencilFunc = xrf.THREE.AlwaysStencilFunc;
mesh.material.stencilZPass = xrf.THREE.ReplaceStencilOp; mesh.material.stencilZPass = xrf.THREE.ReplaceStencilOp;
mesh.material.stencilZFail = xrf.THREE.ReplaceStencilOp; mesh.material.stencilZFail = xrf.THREE.ReplaceStencilOp;
//n.material.depthFunc = stencilRef > 0 ? xrf.THREE.AlwaysDepth : xrf.THREE.LessEqualDepth
//mesh.material.depthTest = false;
return mesh return mesh
} }
xrf.addEventListener('parseModel',(opts) => { xrf.addEventListener('parseModel',(opts) => {
const scene = opts.model.scene const scene = opts.model.scene
//for( let i in scene.children ) scene.children[i].renderOrder = 10 // render outer layers last (worldspheres e.g.)
}) })

1
test/helloworld/dist Symbolic link
View File

@ -0,0 +1 @@
../../dist

4
test/helloworld/test.js Normal file
View File

@ -0,0 +1,4 @@
xrfragment = require('./dist/xrfragment.js').xrfragment
console.dir(xrfragment.URI.parse("#pos=foo"))
console.log("hello world")

6
test/helloworld/test.py Normal file
View File

@ -0,0 +1,6 @@
from dist import xrfragment
frag = xrfragment.xrfragment_XRF.toDict( xrfragment.xrfragment_URI.parse("#pos=foo",None) )
print("hello world")
print( frag.keys() )