example of writing to glTF then loading back with interpretable code

gltf-jxr
Fabien Benetou 6 months ago
parent 63d787dc08
commit 0843d858aa
  1. 4
      index.html
  2. 25
      jxr.js

@ -31,7 +31,7 @@
<!-- still experimenting, see webdav.html -->
<script src='dependencies/webdav.js'></script>
<script src='jxr.js?12344'></script>
<script src='jxr.js?12345'></script>
<!-- replacing with local copies as CDNs are like unpkg tend to be slow
<script type="module" src="https://unpkg.com/immers-client/dist/destination.bundle.js"></script>
<script src="https://aframe.io/releases/1.3.0/aframe.min.js"></script>
@ -303,7 +303,7 @@ AFRAME.registerComponent('wristright',{
<a-box position="-1 1.6 -5" animation="property: position; to: 1 8 -10; dir: alternate; dur: 2000; easing: linear; loop: true" color="tomato"></a-box>
<a-entity gltf-model="url(../content/PlayerSkater_Animations2.glb)" position="-2 0 0" animation-mixer="clip: *Hawk"></a-entity>
<a-entity gltf-jxr gltf-model="url(../content/PopsicleChocolate-jxr.glb)" position="-.6 1.5 0"></a-entity>
<a-tube control-points path="0 1 0,-5 1 -7,-20 1 -12,-25 1 0,-25 1 10,0 1 10,25 1 12,25 1 -12,-5 1 -12" radius="1" material="color: red;wireframe:true"></a-tube>
<a-entity levels-to-load>

@ -3674,6 +3674,31 @@ function loadLevel(elementIdName){
el.setAttribute('position', '0 0 0')
}
AFRAME.registerComponent('gltf-jxr', {
events: {
"model-loaded": function (evt) {
this.el.object3D.traverse( n => { if (n.userData.jxr) {
console.log(n.userData)
// need to make gltf become a child of a note to be executable on pinch
// try reparenting first... otherwise var clone = this.el.cloneNode(true)
// might not be great, cf https://github.com/aframevr/aframe/issues/2425
let pos = this.el.object3D.position.clone()
let rot = this.el.object3D.rotation.clone()
this.el.remove()
let note = addNewNote( n.userData.jxr, pos, "0.1 0.1 0.1", null, "gltf-jxr-source")
let clone = this.el.cloneNode(true)
clone.setAttribute('position', '0 0 0')
clone.setAttribute('scale', '10 10 10') // assuming not scaled until now, surely wrong
// need rescaling to current scale by 1/0.1, clone.setAttribute(
clone.removeAttribute('gltf-jxr')
note.appendChild(clone)
}
})
},
},
});
// used for testing, now that jxr.js is outside of index.html, could consider putting this back in index.html instead to keep behavior one would expect from a library
// does indeed create problems, namely other pages relying on it do get this testing behavior
AFRAME.registerComponent('startfunctions', {

Loading…
Cancel
Save