working example

control-points
Fabien Benetou 6 months ago
parent 42ef7ff120
commit 9dd35eb462
  1. 4
      index.html
  2. 37
      jxr.js

@ -112,7 +112,7 @@ AFRAME.registerComponent('odometer',{
positions.push( pos )
if (positions.length > 20) {
let dist = pos.distanceTo( positions[positions.length-20] )
console.log(dist) // could be done via setFeedbackHUD() instead
//console.log(dist) // could be done via setFeedbackHUD() instead
el.setAttribute('value', dist.toFixed(2))
}
}})
@ -303,7 +303,7 @@ AFRAME.registerComponent('wristright',{
<a-entity gltf-model="url(../content/PlayerSkater_Animations2.glb)" position="0 0 -2" animation-mixer="clip: *Hawk"></a-entity>
<a-tube 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-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-scene>
</body>
</script>

@ -3564,7 +3564,7 @@ AFRAME.registerComponent('changeover', {
.map( t => { return { el: t, dist : pos.distanceTo(t.getAttribute("position") ) } })
.filter( t => t.dist < 0.02 )
.sort( (a,b) => a.dist > b.dist)
console.log(hits.length)
//console.log(hits.length)
if (hits.length>0) {
setFeedbackHUD('touching cone')
console.log('touching cone')
@ -3609,6 +3609,41 @@ AFRAME.registerComponent('pull', {
},
});
AFRAME.registerComponent('control-points', {
init: function () {
let cPoints = this.el.getAttribute("path").split(",")
if (!this.el.id) this.el.id = 'control-point-target' + Date.now()
cPoints.map( (p,n) => {
let controlSphere = document.createElement("a-sphere")
controlSphere.setAttribute("radius", 0.05)
controlSphere.setAttribute("color", "red")
controlSphere.setAttribute("wireframe", "true")
controlSphere.setAttribute("segments-width", 8)
controlSphere.setAttribute("segments-height", 8)
controlSphere.setAttribute("target", '')
controlSphere.setAttribute("move-target-point", 'target:'+this.el.id+';number:'+n)
controlSphere.setAttribute("position", p)
controlSphere.setAttribute("value", '')
AFRAME.scenes[0].appendChild(controlSphere)
})
},
});
AFRAME.registerComponent('move-target-point', {
schema: {
target: {type: 'string'},
number: {type: 'number'},
},
events: {
moved: function (evt) {
let targetEl = document.getElementById(this.data.target)
let newPath = targetEl.getAttribute("path").split(",")
newPath[this.data.number] = AFRAME.utils.coordinates.stringify( this.el.getAttribute('position') )
targetEl.setAttribute( 'path', newPath.join(',') )
},
},
});
// 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