diff --git a/.gitignore b/.gitignore index bacbcac..6d90f51 100644 --- a/.gitignore +++ b/.gitignore @@ -3,4 +3,5 @@ src/spec/tmp.json tags example/assets/*.blend* 2wa.gitlab.io/* +src/3rd/js/aframe/build/aframe diff --git a/doc/RFC_XR_Fragments.md b/doc/RFC_XR_Fragments.md index 316096c..4b8f6e3 100644 --- a/doc/RFC_XR_Fragments.md +++ b/doc/RFC_XR_Fragments.md @@ -180,6 +180,8 @@ 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: the essential goal is to allow a Hypermediatic FeedbackLoop (HFL) between external and internal 4D navigation. + +Traditional webbrowsers can become 4D document-ready by: # Hypermediatic FeedbackLoop for XR browsers diff --git a/example/aframe/sandbox/other.gltf b/example/aframe/sandbox/other.gltf deleted file mode 120000 index 72026a1..0000000 --- a/example/aframe/sandbox/other.gltf +++ /dev/null @@ -1 +0,0 @@ -../../assets/other.gltf \ No newline at end of file diff --git a/example/three/sandbox/index.html b/example/three/sandbox/index.html index d8d9773..b974a3e 100644 --- a/example/three/sandbox/index.html +++ b/example/three/sandbox/index.html @@ -36,6 +36,8 @@ import { VRButton } from 'three/addons/webxr/VRButton.js'; import { GLTFLoader } from 'three/addons/loaders/GLTFLoader.js'; import { FBXLoader } from 'three/addons/loaders/FBXLoader.js'; + import { USDZLoader } from 'three/addons/loaders/USDZLoader.js'; + import { OBJLoader } from 'three/addons/loaders/OBJLoader.js'; import { HTMLMesh } from 'three/addons/interactive/HTMLMesh.js'; import { InteractiveGroup } from 'three/addons/interactive/InteractiveGroup.js'; import { XRControllerModelFactory } from 'three/addons/webxr/XRControllerModelFactory.js'; diff --git a/make b/make index 0cc47a3..f83bc90 100755 --- a/make +++ b/make @@ -52,6 +52,18 @@ server(){ 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(){ try rm dist/xrfragment.* 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/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 # add license headers diff --git a/src/3rd/js/aframe/build/three.module.js b/src/3rd/js/aframe/build/three.module.js new file mode 100644 index 0000000..b82b158 --- /dev/null +++ b/src/3rd/js/aframe/build/three.module.js @@ -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; diff --git a/src/3rd/js/aframe/index.js b/src/3rd/js/aframe/index.js index f52f6fd..fc6b015 100644 --- a/src/3rd/js/aframe/index.js +++ b/src/3rd/js/aframe/index.js @@ -3,13 +3,13 @@ window.AFRAME.registerComponent('xrf', { http: { 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.) if( typeof this.data == "string" ){ let searchIsUri = document.location.search && !document.location.search.match(/=/) && - document.location.search.match("://") + document.location.search.match("/") if( searchIsUri || document.location.hash.length > 1 ){ // override url this.data = `${document.location.search.substr(1)}${document.location.hash}` } @@ -32,8 +32,11 @@ window.AFRAME.registerComponent('xrf', { renderer: aScene.renderer, loaders: { gltf: THREE.GLTFLoader, // which 3D assets (exts) to check for XR fragments? - glb: THREE.GLTFLoader, - obj: THREE.OBJLoader + glb: THREE.GLTFLoader, + obj: THREE.OBJLoader, + fbx: THREE.FBXLoader, + usdz: THREE.USDZLoader, + col: THREE.ColladaLoader } }) aScene.renderer.toneMapping = THREE.ACESFilmicToneMapping; diff --git a/src/3rd/js/three/xrf/src/fbx.js b/src/3rd/js/three/xrf/src/fbx.js index 7c79857..42516f5 100644 --- a/src/3rd/js/three/xrf/src/fbx.js +++ b/src/3rd/js/three/xrf/src/fbx.js @@ -8,8 +8,9 @@ xrf.frag.src.type['fbx'] = function( url, opts ){ let {urlObj,dir,file,hash,ext} = xrf.parseUrl(url) let loader - //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 {THREE} = await import('https://unpkg.com/three@0.161.0/build/three.module.js') + let { FBXLoader } = await import('three/addons/loaders/FBXLoader.js') + debugger //const Loader = xrf.loaders[ext] //if( !Loader ) throw 'xrfragment: no loader passed to xrfragment for extension .'+ext diff --git a/src/3rd/js/three/xrf/src/non-euclidian.js b/src/3rd/js/three/xrf/src/non-euclidian.js index 534b829..75fcf69 100644 --- a/src/3rd/js/three/xrf/src/non-euclidian.js +++ b/src/3rd/js/three/xrf/src/non-euclidian.js @@ -164,18 +164,14 @@ xrf.portalNonEuclidian.setMaterial = function(mesh){ mesh.material.colorWrite = false; mesh.material.stencilWrite = true; mesh.material.stencilRef = xrf.portalNonEuclidian.stencilRef; - // mesh.renderOrder = 0;//xrf.portalNonEuclidian.stencilRef; mesh.material.stencilFunc = xrf.THREE.AlwaysStencilFunc; mesh.material.stencilZPass = 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 } xrf.addEventListener('parseModel',(opts) => { const scene = opts.model.scene - //for( let i in scene.children ) scene.children[i].renderOrder = 10 // render outer layers last (worldspheres e.g.) }) diff --git a/test/helloworld/dist b/test/helloworld/dist new file mode 120000 index 0000000..7724b92 --- /dev/null +++ b/test/helloworld/dist @@ -0,0 +1 @@ +../../dist \ No newline at end of file