diff --git a/dist/xrfragment.aframe.js b/dist/xrfragment.aframe.js
index f1a2c53..172a929 100644
--- a/dist/xrfragment.aframe.js
+++ b/dist/xrfragment.aframe.js
@@ -956,20 +956,33 @@ xrf.frag.env = function(v, opts){
console.log(` └ applied image '${v.string}' as environment map`)
}
/**
+ *
* navigation, portals & mutations
- *
+ *
* | fragment | type | scope | example value |
- * |`href`| string (uri or [predefined view](#predefined_view )) | 🔒 |`#pos=1,1,0`
`#pos=1,1,0&rot=90,0,0`
`#pos=pyramid`
`#pos=lastvisit\|pyramid`
`://somefile.gltf#pos=1,1,0`
|
+ * |`href`| string (uri or predefined view) | 🔒 |`#pos=1,1,0`
`#pos=1,1,0&rot=90,0,0`
`#pos=pyramid`
`#pos=lastvisit|pyramid`
`://somefile.gltf#pos=1,1,0`
|
+ *
+ * [[» example implementation|https://github.com/coderofsalvation/xrfragment/blob/main/src/3rd/three/xrf/href.js]]
+ * [[» example 3D asset|https://github.com/coderofsalvation/xrfragment/blob/main/example/assets/href.gltf#L192]]
+ * [[» discussion|https://github.com/coderofsalvation/xrfragment/issues/1]]
*
* [img[xrfragment.jpg]]
- *
+ *
+ *
* !!!spec 1.0
- *
- * 1. a ''external''- or ''file URI'' fully replaces the current scene and assumes `pos=0,0,0&rot=0,0,0` by default (unless specified)
- *
+ *
+ * 1. an ''external''- or ''file URI'' fully replaces the current scene and assumes `pos=0,0,0&rot=0,0,0` by default (unless specified)
+ *
* 2. navigation should not happen when queries (`q=`) are present in local url: queries will apply (`pos=`, `rot=` e.g.) to the targeted object(s) instead.
- *
+ *
* 3. navigation should not happen ''immediately'' when user is more than 2 meter away from the portal/object containing the href (to prevent accidental navigation e.g.)
+ *
+ * 4. URL navigation should always be reflected in the client (in case of javascript: see [[here|https://github.com/coderofsalvation/xrfragment/blob/dev/src/3rd/three/navigator.js]] for an example navigator).
+ *
+ * 5. In XR mode, the navigator back/forward-buttons should be always visible (using a wearable e.g., see [[here|https://github.com/coderofsalvation/xrfragment/blob/dev/example/aframe/sandbox/index.html#L26-L29]] for an example wearable)
+ *
+ * [img[navigation.png]]
+ *
*/
xrf.frag.href = function(v, opts){
@@ -1084,10 +1097,15 @@ xrf.frag.href = function(v, opts){
}
/**
- * > above was abducted from [[this|https://i.imgur.com/E3En0gJ.png]] and [[this|https://i.imgur.com/lpnTz3A.png]] survey result
+ * > above solutions were abducted from [[this|https://i.imgur.com/E3En0gJ.png]] and [[this|https://i.imgur.com/lpnTz3A.png]] survey result
*
- * [[» discussion|https://github.com/coderofsalvation/xrfragment/issues/1]]
- * [[» implementation example|https://github.com/coderofsalvation/xrfragment/blob/main/src/three/xrf/pos.js]]
+ * !!!Demo
+ *
+ * <$videojs controls="controls" aspectratio="16:9" preload="auto" poster="" fluid="fluid" class="vjs-big-play-centered">
+ *
+ * $videojs>
+ *
+ * > capture of aframe/sandbox
*/
xrf.frag.pos = function(v, opts){
//if( renderer.xr.isPresenting ) return // too far away
@@ -1158,6 +1176,10 @@ xrf.frag.rot = function(v, opts){
v.y * Math.PI / 180,
v.z * Math.PI / 180
)
+// camera.rotation.x = v.x
+// camera.rotation.y = v.y
+// camera.rotation.z = v.z
+ camera.updateMatrixWorld()
}
// *TODO* use webgl instancing
@@ -1231,15 +1253,24 @@ window.AFRAME.registerComponent('xrf', {
// override the camera-related XR Fragments so the camera-rig is affected
let camOverride = (xrf,v,opts) => {
opts.camera = document.querySelector('[camera]').object3D.parent
- console.dir(opts.camera)
xrf(v,opts)
}
XRF.pos = camOverride
- XRF.rot = camOverride
- XRF.href = (xrf,v,opts) => { // convert portal to a-entity so AFRAME
- camOverride(xrf,v,opts) // raycaster can find & execute it
+ // in order to set the rotation programmatically
+ // we need to disable look-controls
+ XRF.rot = (xrf,v,opts) => {
+ let {renderer} = opts;
+ let look = document.querySelector('[look-controls]')
+ if( look ) look.removeAttribute("look-controls")
+ camOverride(xrf,v,opts)
+ }
+
+ // convert portal to a-entity so AFRAME
+ // raycaster can find & execute it
+ XRF.href = (xrf,v,opts) => {
+ camOverride(xrf,v,opts)
let {mesh,camera} = opts;
let el = document.createElement("a-entity")
el.setAttribute("xrf-get",mesh.name )
diff --git a/dist/xrfragment.three.js b/dist/xrfragment.three.js
index 0a5036b..0a1174d 100644
--- a/dist/xrfragment.three.js
+++ b/dist/xrfragment.three.js
@@ -956,20 +956,33 @@ xrf.frag.env = function(v, opts){
console.log(` └ applied image '${v.string}' as environment map`)
}
/**
+ *
* navigation, portals & mutations
- *
+ *
* | fragment | type | scope | example value |
- * |`href`| string (uri or [predefined view](#predefined_view )) | 🔒 |`#pos=1,1,0`
`#pos=1,1,0&rot=90,0,0`
`#pos=pyramid`
`#pos=lastvisit\|pyramid`
`://somefile.gltf#pos=1,1,0`
|
+ * |`href`| string (uri or predefined view) | 🔒 |`#pos=1,1,0`
`#pos=1,1,0&rot=90,0,0`
`#pos=pyramid`
`#pos=lastvisit|pyramid`
`://somefile.gltf#pos=1,1,0`
|
+ *
+ * [[» example implementation|https://github.com/coderofsalvation/xrfragment/blob/main/src/3rd/three/xrf/href.js]]
+ * [[» example 3D asset|https://github.com/coderofsalvation/xrfragment/blob/main/example/assets/href.gltf#L192]]
+ * [[» discussion|https://github.com/coderofsalvation/xrfragment/issues/1]]
*
* [img[xrfragment.jpg]]
- *
+ *
+ *
* !!!spec 1.0
- *
- * 1. a ''external''- or ''file URI'' fully replaces the current scene and assumes `pos=0,0,0&rot=0,0,0` by default (unless specified)
- *
+ *
+ * 1. an ''external''- or ''file URI'' fully replaces the current scene and assumes `pos=0,0,0&rot=0,0,0` by default (unless specified)
+ *
* 2. navigation should not happen when queries (`q=`) are present in local url: queries will apply (`pos=`, `rot=` e.g.) to the targeted object(s) instead.
- *
+ *
* 3. navigation should not happen ''immediately'' when user is more than 2 meter away from the portal/object containing the href (to prevent accidental navigation e.g.)
+ *
+ * 4. URL navigation should always be reflected in the client (in case of javascript: see [[here|https://github.com/coderofsalvation/xrfragment/blob/dev/src/3rd/three/navigator.js]] for an example navigator).
+ *
+ * 5. In XR mode, the navigator back/forward-buttons should be always visible (using a wearable e.g., see [[here|https://github.com/coderofsalvation/xrfragment/blob/dev/example/aframe/sandbox/index.html#L26-L29]] for an example wearable)
+ *
+ * [img[navigation.png]]
+ *
*/
xrf.frag.href = function(v, opts){
@@ -1084,10 +1097,15 @@ xrf.frag.href = function(v, opts){
}
/**
- * > above was abducted from [[this|https://i.imgur.com/E3En0gJ.png]] and [[this|https://i.imgur.com/lpnTz3A.png]] survey result
+ * > above solutions were abducted from [[this|https://i.imgur.com/E3En0gJ.png]] and [[this|https://i.imgur.com/lpnTz3A.png]] survey result
*
- * [[» discussion|https://github.com/coderofsalvation/xrfragment/issues/1]]
- * [[» implementation example|https://github.com/coderofsalvation/xrfragment/blob/main/src/three/xrf/pos.js]]
+ * !!!Demo
+ *
+ * <$videojs controls="controls" aspectratio="16:9" preload="auto" poster="" fluid="fluid" class="vjs-big-play-centered">
+ *
+ * $videojs>
+ *
+ * > capture of aframe/sandbox
*/
xrf.frag.pos = function(v, opts){
//if( renderer.xr.isPresenting ) return // too far away
@@ -1158,6 +1176,10 @@ xrf.frag.rot = function(v, opts){
v.y * Math.PI / 180,
v.z * Math.PI / 180
)
+// camera.rotation.x = v.x
+// camera.rotation.y = v.y
+// camera.rotation.z = v.z
+ camera.updateMatrixWorld()
}
// *TODO* use webgl instancing
diff --git a/src/3rd/aframe/index.js b/src/3rd/aframe/index.js
index fb5ad06..f966ad6 100644
--- a/src/3rd/aframe/index.js
+++ b/src/3rd/aframe/index.js
@@ -32,15 +32,24 @@ window.AFRAME.registerComponent('xrf', {
// override the camera-related XR Fragments so the camera-rig is affected
let camOverride = (xrf,v,opts) => {
opts.camera = document.querySelector('[camera]').object3D.parent
- console.dir(opts.camera)
xrf(v,opts)
}
XRF.pos = camOverride
- XRF.rot = camOverride
- XRF.href = (xrf,v,opts) => { // convert portal to a-entity so AFRAME
- camOverride(xrf,v,opts) // raycaster can find & execute it
+ // in order to set the rotation programmatically
+ // we need to disable look-controls
+ XRF.rot = (xrf,v,opts) => {
+ let {renderer} = opts;
+ let look = document.querySelector('[look-controls]')
+ if( look ) look.removeAttribute("look-controls")
+ camOverride(xrf,v,opts)
+ }
+
+ // convert portal to a-entity so AFRAME
+ // raycaster can find & execute it
+ XRF.href = (xrf,v,opts) => {
+ camOverride(xrf,v,opts)
let {mesh,camera} = opts;
let el = document.createElement("a-entity")
el.setAttribute("xrf-get",mesh.name )
diff --git a/src/3rd/three/xrf/rot.js b/src/3rd/three/xrf/rot.js
index 9d6cb2a..f751281 100644
--- a/src/3rd/three/xrf/rot.js
+++ b/src/3rd/three/xrf/rot.js
@@ -6,4 +6,5 @@ xrf.frag.rot = function(v, opts){
v.y * Math.PI / 180,
v.z * Math.PI / 180
)
+ camera.updateMatrixWorld()
}