xrsh/xrsh
1
1
Fork 0
Code Issues 7 Pull requests Projects Releases 1 Packages Wiki Activity Actions

gesture management demo and gesture template via removable event
Some checks failed
/ test (push) Has been cancelled
Details

Browse source
This commit is contained in:
Fabien Benetou 2025-07-18 11:08:05 +02:00
parent e806106aa0
commit d253a5d26b
3 changed files with 24 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

18
src/gestures.html
View file

@ -17,8 +17,8 @@
<script src="https://xrsh.isvery.ninja/xrsh.js"></script>
<script src="jxr-core.js"></script>
<script src="drumkbd.js"></script>
<script src="uglyph.js"></script>
<script src="uglyph_tests.js"></script>
<script src="gestures.js"></script>
<script src="gestures_tests.js"></script>
</head>
<body>
<a-scene>
@ -103,6 +103,13 @@
//window.test = function( event ){ console.log('custom callback showcase:', event.detail) }
//AFRAME.scenes[0].setAttribute('template-gesture-detector', 'callback:test;') // no customization
let el2 = document.createElement("a-torus")
el2.id = "demotarget2"
el2.setAttribute("scale", ".1 .1 .1")
el2.setAttribute("color", "darkblue")
el2.setAttribute("position", "-.5 1.6 -1")
AFRAME.scenes[0].appendChild(el2)
let el = document.createElement("a-box")
el.id = "demotarget"
el.setAttribute("scale", ".1 .1 .1")
@ -111,6 +118,13 @@
AFRAME.scenes[0].appendChild(el)
AFRAME.scenes[0].setAttribute('template-gesture-detector', 'target:#demotarget;') // no customization
setTimeout( _ => {
AFRAME.scenes[0].removeAttribute('template-gesture-detector')
console.log('removed template-gesture-detector')
leftHand.setAttribute("pinchsecondary", "")
}, 8000 )
addNewNote('jxr ' + "AFRAME.scenes[0].setAttribute('template-gesture-detector', 'target:#demotarget2;')")
/*
AFRAME component 'template-gesture-detector' :

15
src/uglyph.js → src/gestures.js
View file

@ -174,16 +174,17 @@ AFRAME.registerComponent('template-gesture-detector', {
callback: {type: 'string', default: ''},
},
init: function () {
this.tick = AFRAME.utils.throttleTick(this.tick, this.data.frequency, this);
let target = this.data.target
let callback = this.data.callback
AFRAME.scenes[0].addEventListener('gesture', event => {
this.tick = AFRAME.utils.throttleTick(this.tick, this.data.frequency, this)
},
events: {
gesture : function (event) {
if (event.detail.type == 'template-gesture-detector'+'_gesture') { // filtering for this specific gesture
if (target) target.setAttribute("position", AFRAME.utils.coordinates.stringify( event.detail.targetPosition ) )
// example of action, could have a different result
if (this.data.target) this.data.target.setAttribute("position", AFRAME.utils.coordinates.stringify( event.detail.targetPosition ) )
// optional callback
if (callback) window[callback]( event )
if (this.data.callback) window[callback]( event )
}
}
} )
},
tick: function (t, dt) {
const myScene = AFRAME.scenes[0].object3D // optional simplification

0
src/uglyph_tests.js → src/gestures_tests.js
View file