added src+href startingpoints

dist/xrfragment.js

@@ -254,7 +254,7 @@ xrfragment_Parser.parse = function(key,value,resultMap) {
 			return false;
 		}
 		if(xrfragment_Parser.debug) {
-			console.log("src/xrfragment/Parser.hx:78:","✔  XR Fragment '" + key + "': '" + v.string + "'");
+			console.log("src/xrfragment/Parser.hx:78:","✔ " + key + ": " + v.string);
 		}
 		resultMap[key] = v;
 	}

dist/xrfragment.lua

@@ -1617,7 +1617,7 @@ __xrfragment_Parser.parse = function(key,value,resultMap)
       do return false end;
     end;
     if (__xrfragment_Parser.debug) then 
-      __haxe_Log.trace(Std.string(Std.string(Std.string(Std.string("✔  XR Fragment '") .. Std.string(key)) .. Std.string("': '")) .. Std.string(v.string)) .. Std.string("'"), _hx_o({__fields__={fileName=true,lineNumber=true,className=true,methodName=true},fileName="src/xrfragment/Parser.hx",lineNumber=78,className="xrfragment.Parser",methodName="parse"}));
+      __haxe_Log.trace(Std.string(Std.string(Std.string("✔ ") .. Std.string(key)) .. Std.string(": ")) .. Std.string(v.string), _hx_o({__fields__={fileName=true,lineNumber=true,className=true,methodName=true},fileName="src/xrfragment/Parser.hx",lineNumber=78,className="xrfragment.Parser",methodName="parse"}));
     end;
     resultMap[key] = v;
   end;

dist/xrfragment.module.js

@@ -254,7 +254,7 @@ xrfragment_Parser.parse = function(key,value,resultMap) {
 			return false;
 		}
 		if(xrfragment_Parser.debug) {
-			console.log("src/xrfragment/Parser.hx:78:","✔  XR Fragment '" + key + "': '" + v.string + "'");
+			console.log("src/xrfragment/Parser.hx:78:","✔ " + key + ": " + v.string);
 		}
 		resultMap[key] = v;
 	}

dist/xrfragment.py

@@ -1330,7 +1330,7 @@ class xrfragment_Parser:
                 print(str((((("⚠ fragment '" + ("null" if key is None else key)) + "' has incompatible value (") + ("null" if value is None else value)) + ")")))
                 return False
             if xrfragment_Parser.debug:
-                print(str((((("✔  XR Fragment '" + ("null" if key is None else key)) + "': '") + HxOverrides.stringOrNull(v.string)) + "'")))
+                print(str(((("✔ " + ("null" if key is None else key)) + ": ") + HxOverrides.stringOrNull(v.string))))
             setattr(resultMap,(("_hx_" + key) if ((key in python_Boot.keywords)) else (("_hx_" + key) if (((((len(key) > 2) and ((ord(key[0]) == 95))) and ((ord(key[1]) == 95))) and ((ord(key[(len(key) - 1)]) != 95)))) else key)),v)
         return True
 

dist/xrfragment.three.js

@@ -254,7 +254,7 @@ xrfragment_Parser.parse = function(key,value,resultMap) {
 			return false;
 		}
 		if(xrfragment_Parser.debug) {
-			console.log("src/xrfragment/Parser.hx:78:","✔  XR Fragment '" + key + "': '" + v.string + "'");
+			console.log("src/xrfragment/Parser.hx:78:","✔ " + key + ": " + v.string);
 		}
 		resultMap[key] = v;
 	}
@@ -602,6 +602,7 @@ xrfragment.init = function(opts){
     alert("ja")
   }
   for ( let i in opts           ) XRF[i] = xrfragment[i] = opts[i]
+  for ( let i in xrfragment     ) XRF[i] = xrfragment[i]
   for ( let i in xrfragment.XRF ) XRF[i] = xrfragment.XRF[i] // shortcuts to constants (NAVIGATOR e.g.)
   xrfragment.Parser.debug = xrfragment.debug 
   if( opts.loaders ) opts.loaders.map( xrfragment.patchLoader )
@@ -618,9 +619,14 @@ xrfragment.patchLoader = function(loader){
   })(loader.prototype.load)
 }
 
+xrfragment.getFile = (url) => url.split("/").pop().replace(/#.*/,'')
+
 xrfragment.parseModel = function(model,url){
-  let file = url.split("/").pop().replace(/#.*/,'')
+  let file               = xrfragment.getFile(url)
+  model.file             = file
+  model.render           = function(){}
   xrfragment.model[file] = model
+
   model.scene.traverse( (mesh) => {
     if( mesh.userData ){
       let frag = {}
@@ -650,10 +656,97 @@ xrfragment.xrf.env = function(v, opts){
   renderer.toneMapping = THREE.ACESFilmicToneMapping;
   renderer.toneMappingExposure = 1;
 }
+xrfragment.xrf.href = function(v, opts){
+  let { mesh, model, camera, scene, renderer, THREE} = opts
+  return
+
+	// Create a shader material that treats the texture as an equirectangular map
+	mesh.texture = mesh.material.map // backup texture
+	const equirectShader = THREE.ShaderLib[ 'equirect' ];
+	const equirectMaterial = new THREE.ShaderMaterial( {
+		  uniforms: THREE.UniformsUtils.merge([
+				THREE.UniformsLib.equirect,
+				equirectShader.uniforms,
+			]),
+			vertexShader: equirectShader.vertexShader,
+			fragmentShader: equirectShader.fragmentShader,
+			side: THREE.DoubleSide //THREE.FrontSide //THREE.DoubleSide //THREE.BackSide
+	} );
+	equirectMaterial.uniforms[ 'tEquirect' ].value = mesh.texture
+	// Define the tEquirectInvProjection uniform
+	equirectMaterial.uniforms.tEquirectInvProjection = {
+		value: new THREE.Matrix4(),
+	};
+	// Assign the new material to the mesh
+	mesh.material = equirectMaterial; 
+	console.dir(mesh.material)
+  mesh.texture.wrapS = THREE.RepeatWrapping;
+
+  // patch custom model renderloop
+	model.render = ((render) => (scene,camera) => {
+
+		// Store the original projection matrix of the camera
+		const originalProjectionMatrix = camera.projectionMatrix.clone();
+		// Calculate the current camera view matrix
+		const aspectRatio = mesh.texture.image.width / mesh.texture.image.height;
+		camera.projectionMatrix.makePerspective(camera.fov, aspectRatio, camera.near, camera.far);
+
+		const viewMatrix = camera.matrixWorldInverse;
+		const worldMatrix = mesh.matrixWorld;
+
+		const equirectInvProjection = new THREE.Matrix4();
+		equirectInvProjection.copy(camera.projectionMatrix).multiply(viewMatrix).invert();
+
+		// Update the equirectangular material's tEquirect uniform
+		equirectMaterial.uniforms.tEquirect.value = mesh.texture;
+		equirectMaterial.uniforms.tEquirectInvProjection.value.copy(
+			equirectInvProjection
+		);
+
+		// Reset the camera projection matrix
+		camera.projectionMatrix.copy(originalProjectionMatrix);
+
+
+		render(scene,camera)
+
+	})(model.render)	
+
+  console.dir(mesh)
+}
 xrfragment.xrf.pos = function(v, opts){
   let { mesh, model, camera, scene, renderer, THREE} = opts
   camera.position.x = v.x
   camera.position.y = v.y
   camera.position.z = v.z
 }
+xrfragment.xrf.src = function(v, opts){
+  let { mesh, model, camera, scene, renderer, THREE} = opts
+
+  if( v.string[0] == "#" ){ // local 
+    let args = xrfragment.URI.parse(v.string)
+    // Get an instance of the original model
+    const modelInstance = new THREE.Group();
+    modelInstance.add(model.scene.clone());
+    modelInstance.position.z = mesh.position.x
+    modelInstance.position.y = mesh.position.y
+    modelInstance.position.x = mesh.position.z
+    modelInstance.scale.z = mesh.scale.x
+    modelInstance.scale.y = mesh.scale.y
+    modelInstance.scale.x = mesh.scale.z
+    // now apply XR Fragments overrides from URI
+    // *TODO* move to a central location (pull-up)
+    for( var i in args ){
+      if( i == "scale" ){
+      console.log("setting scale")
+        modelInstance.scale.x = args[i].x
+        modelInstance.scale.y = args[i].y
+        modelInstance.scale.z = args[i].z
+      }
+    }
+    // Add the instance to the scene
+    scene.add(modelInstance);
+    console.dir(model)
+    console.dir(modelInstance)
+  }
+}
 export default xrfragment;

example/assets/style.css

@@ -73,7 +73,7 @@ input[type="submit"] {
 
 a#source{
   position: absolute;
-  bottom: 20px;
+  bottom: 31px;
   right: 20px;
   color: #888;
   font-weight: bold;

example/threejs/sandbox/index.html

@@ -9,17 +9,17 @@
     <link type="text/css" rel="stylesheet" href="./../../assets/style.css"/>
 	</head>
 	<body>
-    <div id="overlay" x-data="{ urls: ['example1.gltf#pos=0,2,3'] }">
+    <div id="overlay" x-data="{ urls: ['#pos=0,2,3'] }">
       <img src="./../../assets/logo.png" class="logo"/>
 			<input type="submit" value="load 3D asset"></input>
-			<input type="text" id="uri" list="urls" value="example1.gltf#pos=0,2,3" x-on:change="XRF.eval( $('#uri').value, XRF.getLastModel() )"/>
+			<input type="text" id="uri" list="urls" value="#pos=0,2,3" x-on:change="XRF.eval( $('#uri').value, XRF.getLastModel() )"/>
       <datalist id="urls" >
 				 <template x-for="url in urls">
 						<option x-text="url"></option>
 				</template>
 			</datalist>
     </div>
-    <a id="source" target="_blank" href="https://github.com/coderofsalvation/xrfragment/blob/main/example/threejs/sandbox/index.html#L87-L105">source</a> 
+    <a id="source" target="_blank" href="https://github.com/coderofsalvation/xrfragment/blob/main/example/threejs/sandbox/index.html#L92-L112">sourcecode</a> 
 		<textarea style="display:none"></textarea>
 		
 		<script async src="./../../assets/alpine.min.js"></script>
@@ -96,7 +96,7 @@
           scene,
           renderer,
           debug: true,
-          loaders: [ GLTFLoader, FBXLoader ],   // which 3D assets to check for fragments?
+          loaders: [ GLTFLoader, FBXLoader ],   // which 3D assets to check for XR fragments?
         })
 
         // optional: react/extend/hook into XR fragment
@@ -111,7 +111,7 @@
           console.log("hello custom property 'foobar'")
         }
 
-        // *TODO* lowhanging fruit: during XR fragments-query milestone, repurpose XR fragment queries 
+        // *TODO* lowhanging fruit: during XR fragments-query milestone, target objects using XR fragment queries
         //                          to provide jquery-ish interface for three.js)
         //
         // XRF('example1.gltf#q=.foo', (objs) => {
@@ -148,7 +148,7 @@
 					render();
 
 				};
-				loader.load( $('#uri').value, loadGLTF ); 
+				loader.load( 'example2.gltf#pos=0,1,2', loadGLTF ); 
 
 
 				// setup mouse controls
@@ -261,6 +261,8 @@
 				//torus.rotation.x = time * 0.4;
 				//torus.rotation.y = time;
 
+				if( XRF.getLastModel() ) XRF.getLastModel().render(scene,camera)
+
 				controls.update()
 				renderer.render( scene, camera );
 				stats.update();

src/three/index.js

@@ -7,6 +7,7 @@ xrfragment.init = function(opts){
     alert("ja")
   }
   for ( let i in opts           ) XRF[i] = xrfragment[i] = opts[i]
+  for ( let i in xrfragment     ) XRF[i] = xrfragment[i]
   for ( let i in xrfragment.XRF ) XRF[i] = xrfragment.XRF[i] // shortcuts to constants (NAVIGATOR e.g.)
   xrfragment.Parser.debug = xrfragment.debug 
   if( opts.loaders ) opts.loaders.map( xrfragment.patchLoader )
@@ -23,9 +24,14 @@ xrfragment.patchLoader = function(loader){
   })(loader.prototype.load)
 }
 
+xrfragment.getFile = (url) => url.split("/").pop().replace(/#.*/,'')
+
 xrfragment.parseModel = function(model,url){
-  let file = url.split("/").pop().replace(/#.*/,'')
+  let file               = xrfragment.getFile(url)
+  model.file             = file
+  model.render           = function(){}
   xrfragment.model[file] = model
+
   model.scene.traverse( (mesh) => {
     if( mesh.userData ){
       let frag = {}

src/three/xrf/href.js

@@ -0,0 +1,57 @@
+xrfragment.xrf.href = function(v, opts){
+  let { mesh, model, camera, scene, renderer, THREE} = opts
+  return
+
+	// Create a shader material that treats the texture as an equirectangular map
+	mesh.texture = mesh.material.map // backup texture
+	const equirectShader = THREE.ShaderLib[ 'equirect' ];
+	const equirectMaterial = new THREE.ShaderMaterial( {
+		  uniforms: THREE.UniformsUtils.merge([
+				THREE.UniformsLib.equirect,
+				equirectShader.uniforms,
+			]),
+			vertexShader: equirectShader.vertexShader,
+			fragmentShader: equirectShader.fragmentShader,
+			side: THREE.DoubleSide //THREE.FrontSide //THREE.DoubleSide //THREE.BackSide
+	} );
+	equirectMaterial.uniforms[ 'tEquirect' ].value = mesh.texture
+	// Define the tEquirectInvProjection uniform
+	equirectMaterial.uniforms.tEquirectInvProjection = {
+		value: new THREE.Matrix4(),
+	};
+	// Assign the new material to the mesh
+	mesh.material = equirectMaterial; 
+	console.dir(mesh.material)
+  mesh.texture.wrapS = THREE.RepeatWrapping;
+
+  // patch custom model renderloop
+	model.render = ((render) => (scene,camera) => {
+
+		// Store the original projection matrix of the camera
+		const originalProjectionMatrix = camera.projectionMatrix.clone();
+		// Calculate the current camera view matrix
+		const aspectRatio = mesh.texture.image.width / mesh.texture.image.height;
+		camera.projectionMatrix.makePerspective(camera.fov, aspectRatio, camera.near, camera.far);
+
+		const viewMatrix = camera.matrixWorldInverse;
+		const worldMatrix = mesh.matrixWorld;
+
+		const equirectInvProjection = new THREE.Matrix4();
+		equirectInvProjection.copy(camera.projectionMatrix).multiply(viewMatrix).invert();
+
+		// Update the equirectangular material's tEquirect uniform
+		equirectMaterial.uniforms.tEquirect.value = mesh.texture;
+		equirectMaterial.uniforms.tEquirectInvProjection.value.copy(
+			equirectInvProjection
+		);
+
+		// Reset the camera projection matrix
+		camera.projectionMatrix.copy(originalProjectionMatrix);
+
+
+		render(scene,camera)
+
+	})(model.render)	
+
+  console.dir(mesh)
+}

src/three/xrf/src.js

@@ -0,0 +1,30 @@
+xrfragment.xrf.src = function(v, opts){
+  let { mesh, model, camera, scene, renderer, THREE} = opts
+
+  if( v.string[0] == "#" ){ // local 
+    let args = xrfragment.URI.parse(v.string)
+    // Get an instance of the original model
+    const modelInstance = new THREE.Group();
+    modelInstance.add(model.scene.clone());
+    modelInstance.position.z = mesh.position.x
+    modelInstance.position.y = mesh.position.y
+    modelInstance.position.x = mesh.position.z
+    modelInstance.scale.z = mesh.scale.x
+    modelInstance.scale.y = mesh.scale.y
+    modelInstance.scale.x = mesh.scale.z
+    // now apply XR Fragments overrides from URI
+    // *TODO* move to a central location (pull-up)
+    for( var i in args ){
+      if( i == "scale" ){
+      console.log("setting scale")
+        modelInstance.scale.x = args[i].x
+        modelInstance.scale.y = args[i].y
+        modelInstance.scale.z = args[i].z
+      }
+    }
+    // Add the instance to the scene
+    scene.add(modelInstance);
+    console.dir(model)
+    console.dir(modelInstance)
+  }
+}

src/xrfragment/Parser.hx

@@ -75,7 +75,7 @@ class Parser {
           trace("⚠ fragment '"+key+"' has incompatible value ("+value+")");
           return false;
         }
-        if( debug ) trace("✔  XR Fragment '"+key+"': '"+v.string+"'");
+        if( debug ) trace("✔ "+key+": "+v.string);
         resultMap.set(key, v );
       }
 

test/generated/test.js

@@ -364,7 +364,7 @@ xrfragment_Parser.parse = function(key,value,resultMap) {
 			return false;
 		}
 		if(xrfragment_Parser.debug) {
-			console.log("src/xrfragment/Parser.hx:78:","✔  XR Fragment '" + key + "': '" + v.string + "'");
+			console.log("src/xrfragment/Parser.hx:78:","✔ " + key + ": " + v.string);
 		}
 		resultMap[key] = v;
 	}

test/generated/test.py

@@ -1444,7 +1444,7 @@ class xrfragment_Parser:
                 print(str((((("⚠ fragment '" + ("null" if key is None else key)) + "' has incompatible value (") + ("null" if value is None else value)) + ")")))
                 return False
             if xrfragment_Parser.debug:
-                print(str((((("✔  XR Fragment '" + ("null" if key is None else key)) + "': '") + HxOverrides.stringOrNull(v.string)) + "'")))
+                print(str(((("✔ " + ("null" if key is None else key)) + ": ") + HxOverrides.stringOrNull(v.string))))
             setattr(resultMap,(("_hx_" + key) if ((key in python_Boot.keywords)) else (("_hx_" + key) if (((((len(key) > 2) and ((ord(key[0]) == 95))) and ((ord(key[1]) == 95))) and ((ord(key[(len(key) - 1)]) != 95)))) else key)),v)
         return True
 
@@ -1591,8 +1591,8 @@ class xrfragment_Query:
         fails = 0
         qualify = 0
         def _hx_local_2(expr):
-            nonlocal fails
             nonlocal conds
+            nonlocal fails
             conds = (conds + 1)
             fails = (fails + (0 if expr else 1))
             return expr