utopiah
/
text-code-xr-engine
1
0
Fork 0
Code Issues 81 Pull Requests Projects Releases Wiki Activity

working principle

Browse Source
scaled-linked-editor
Fabien Benetou 1 year ago
parent 08084875c9
commit 34bbc5bf73
2 changed files with 67 additions and 20 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 40
      index.html
  2. 47
      jxr.js

40
index.html
Unescape View File

@ -110,7 +110,7 @@ AFRAME.registerComponent('odometer',{
positions.push( pos ) positions.push( pos )
if (positions.length > 20) { if (positions.length > 20) {
let dist = pos.distanceTo( positions[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)) el.setAttribute('value', dist.toFixed(2))
} }
}}) }})
@ -160,12 +160,12 @@ AFRAME.registerComponent('wristright',{
<a-troika-text anchor=left target value="jxr tiltDownId('codeditor')" position=" -0.3 1.60 0" rotation="0 90 0" scale="0.1 0.1 0.1"></a-troika-text> <a-troika-text anchor=left target value="jxr tiltDownId('codeditor')" position=" -0.3 1.60 0" rotation="0 90 0" scale="0.1 0.1 0.1"></a-troika-text>
--> -->
<a-troika-text anchor=left target value="jxr pushLeftClass('reader')" position=" -0.3 1.55 0" rotation="0 90 0" scale="0.1 0.1 0.1"></a-troika-text> <a-troika-text anchor=left target value="jxr pushLeftClass('editable-target')" position=" -0.3 1.55 0" rotation="0 90 0" scale="0.1 0.1 0.1"></a-troika-text>
<a-troika-text anchor=left target value="jxr pushRightClass('reader')" position=" -0.3 1.50 0" rotation="0 90 0" scale="0.1 0.1 0.1"></a-troika-text> <a-troika-text anchor=left target value="jxr pushRightClass('editable-target')" position=" -0.3 1.50 0" rotation="0 90 0" scale="0.1 0.1 0.1"></a-troika-text>
<a-troika-text anchor=left target value="jxr pushUpClass('reader')" position=" -0.3 1.45 0" rotation="0 90 0" scale="0.1 0.1 0.1"></a-troika-text> <a-troika-text anchor=left target value="jxr pushUpClass('editable-target')" position=" -0.3 1.45 0" rotation="0 90 0" scale="0.1 0.1 0.1"></a-troika-text>
<a-troika-text anchor=left target value="jxr pushDownClass('reader')" position=" -0.3 1.40 0" rotation="0 90 0" scale="0.1 0.1 0.1"></a-troika-text> <a-troika-text anchor=left target value="jxr pushDownClass('editable-target')" position=" -0.3 1.40 0" rotation="0 90 0" scale="0.1 0.1 0.1"></a-troika-text>
<a-troika-text anchor=left target value="jxr pushBackClass('reader')" position=" -0.3 1.35 0" rotation="0 90 0" scale="0.1 0.1 0.1"></a-troika-text> <a-troika-text anchor=left target value="jxr pushBackClass('editable-target')" position=" -0.3 1.35 0" rotation="0 90 0" scale="0.1 0.1 0.1"></a-troika-text>
<a-troika-text anchor=left target value="jxr pushFrontClass('reader')" position=" -0.3 1.30 0" rotation="0 90 0" scale="0.1 0.1 0.1"></a-troika-text> <a-troika-text anchor=left target value="jxr pushFrontClass('editable-target')" position=" -0.3 1.30 0" rotation="0 90 0" scale="0.1 0.1 0.1"></a-troika-text>
<!-- somehow disable hand interaction despite, according to the documentation, it should rely on world position <!-- somehow disable hand interaction despite, according to the documentation, it should rely on world position
<a-text target value="jxr qs #rig sa position 0 0 10" position="0 1.55 .5" rotation="0 180 0" scale="0.1 0.1 0.1"></a-text> <a-text target value="jxr qs #rig sa position 0 0 10" position="0 1.55 .5" rotation="0 180 0" scale="0.1 0.1 0.1"></a-text>
@ -201,19 +201,19 @@ AFRAME.registerComponent('wristright',{
<a-torus position="0 1 -5" color="#43A367" radius="1" radius-tubular="0.01"></a-torus> <a-torus position="0 1 -5" color="#43A367" radius="1" radius-tubular="0.01"></a-torus>
<a-torus position="0 2 -7" color="#43A367" radius=".5" radius-tubular="0.01"></a-torus> <a-torus position="0 2 -7" color="#43A367" radius=".5" radius-tubular="0.01"></a-torus>
<a-torus position="0 1 -5" color="#43A367" radius="1" radius-tubular="0.01"></a-torus> <a-torus editable position="0 1 -5" color="#43A367" radius="1" radius-tubular="0.01"></a-torus>
<a-torus position="0 1 -6" color="#43A367" radius="1" radius-tubular="0.01"></a-torus> <a-torus editable position="0 1 -6" color="#43A367" radius="1" radius-tubular="0.01"></a-torus>
<a-torus position="0 1 -7" color="#43A367" radius="1" radius-tubular="0.01"></a-torus> <a-torus editable position="0 1 -7" color="#43A367" radius="1" radius-tubular="0.01"></a-torus>
<a-torus position="-1 1 -8" rotation="0 20 0" color="#43A367" radius="1" radius-tubular="0.01"></a-torus> <a-torus editable position="-1 1 -8" rotation="0 20 0" color="#43A367" radius="1" radius-tubular="0.01"></a-torus>
<a-torus position="-2 1 -9" rotation="0 40 0"color="#43A367" radius="1" radius-tubular="0.01"></a-torus> <a-torus editable position="-2 1 -9" rotation="0 40 0"color="#43A367" radius="1" radius-tubular="0.01"></a-torus>
<a-torus position="-3 1 -10" rotation="0 60 0"color="#43A367" radius="1" radius-tubular="0.01"></a-torus> <a-torus editable position="-3 1 -10" rotation="0 60 0"color="#43A367" radius="1" radius-tubular="0.01"></a-torus>
<a-torus position="-4 1 -11" rotation="0 80 0"color="#43A367" radius="1" radius-tubular="0.01"></a-torus> <a-torus editable position="-4 1 -11" rotation="0 80 0"color="#43A367" radius="1" radius-tubular="0.01"></a-torus>
<a-torus position="-5 1 -12" rotation="0 90 0"color="#43A367" radius="1" radius-tubular="0.01"></a-torus> <a-torus editable position="-5 1 -12" rotation="0 90 0"color="#43A367" radius="1" radius-tubular="0.01"></a-torus>
<a-torus position="-6 1 -12" rotation="0 90 0"color="#43A367" radius="1" radius-tubular="0.01"></a-torus> <a-torus editable position="-6 1 -12" rotation="0 90 0"color="#43A367" radius="1" radius-tubular="0.01"></a-torus>
<a-torus position="-8 1 -12" rotation="0 90 0"color="#43A367" radius="1" radius-tubular="0.01"></a-torus> <a-torus editable position="-8 1 -12" rotation="0 90 0"color="#43A367" radius="1" radius-tubular="0.01"></a-torus>
<a-torus position="-10 1 -12" rotation="0 90 0"color="#43A367" radius="1" radius-tubular="0.01"></a-torus> <a-torus editable position="-10 1 -12" rotation="0 90 0"color="#43A367" radius="1" radius-tubular="0.01"></a-torus>
<a-torus position="-15 1 -12" rotation="0 90 0"color="#43A367" radius="1" radius-tubular="0.01"></a-torus> <a-torus editable position="-15 1 -12" rotation="0 90 0"color="#43A367" radius="1" radius-tubular="0.01"></a-torus>
<a-torus position="-20 1 -12" rotation="0 90 0"color="#43A367" radius="1" radius-tubular="0.01"></a-torus> <a-torus editable position="-20 1 -12" rotation="0 90 0"color="#43A367" radius="1" radius-tubular="0.01"></a-torus>
<a-entity class="workcone" scale=".2 .5 .2" position="0.5 0 -1"> <a-entity class="workcone" scale=".2 .5 .2" position="0.5 0 -1">
<a-cone position="0 0.2 0" color="darkorange" height=".4" radius-bottom="0.2" radius-top="0.02"></a-cone> <a-cone position="0 0.2 0" color="darkorange" height=".4" radius-bottom="0.2" radius-top="0.02"></a-cone>

47
jxr.js
Unescape View File

@ -3609,6 +3609,53 @@ AFRAME.registerComponent('pull', {
}, },
}); });
AFRAME.registerComponent('linked-editor', {
schema: { sourceid : {type: 'string'} },
events: {
picked: function (evt) {
},
moved: function (evt) {
document.getElementById(this.data.sourceid).setAttribute('rotation', this.el.getAttribute('rotation') )
let sourcePos = document.getElementById(this.data.sourceid).getAttribute('position')
let pos = this.el.getAttribute('position').clone()
const scale = 1/50 // could be based on distance from furthest object
//pos.z-=2 // group selection, i.e push...Class functions, can be used for manual adjustement
pos.y--
pos.multiplyScalar(1/scale) // might not well, should probably shift first within x,y,z>0
sourcePos.copy(pos)
},
released: function (evt) {
},
},
});
AFRAME.registerComponent('editable', {
init: function(){
const scale = 1/50 // could be based on distance from furthest object
// with a lower bound that can't be too far from precision selection threshold
let cloned = this.el.cloneNode(true) // might need a DOM flush first
if (!this.el.id) this.el.id = Date.now()+' '+Math.random()
cloned.setAttribute('linked-editor', 'sourceid', this.el.id)
cloned.id = Date.now()+' '+Math.random()
cloned.removeAttribute('editable')
cloned.setAttribute('target', '')
cloned.setAttribute('scale', scale + ' ' + scale + ' ' +scale + ' ' )
cloned.className = 'editable-target'
//cloned.setAttribute('rotation', this.el.getAttribute('rotation') )
let pos = this.el.getAttribute('position').clone()
pos.multiplyScalar(scale) // might not well, should probably shift first within x,y,z>0
pos.y++
//pos.z+=2 // group selection, i.e push...Class functions, can be used for manual adjustement
cloned.setAttribute('position', AFRAME.utils.coordinates.stringify( pos )) // loses position
AFRAME.scenes[0].appendChild(cloned)
// need to add target then insuring live link
// History of transformations to revert for linked sources of editables
// might skip the push...Class functions though but needs to be shared to moved event
// acctually would be moved on the newly created element, not the source
}
});
// 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 // 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 // does indeed create problems, namely other pages relying on it do get this testing behavior
AFRAME.registerComponent('startfunctions', { AFRAME.registerComponent('startfunctions', {

Write Preview
Loading…
Cancel
Save