Имитация щелчка мышью в X3DOM при выполнении жеста с помощью Leap motion

Question

Я пытаюсь смоделировать щелчок мыши в X3DOM, когда делаю жест захвата с помощью Leap Motion. Например, у меня есть два куба, и я хочу выбрать красный куб, когда делаю на нем жест. ChangeColor() - это обработчик события для функции щелчка, который меняет цвет этого куба с красного на зеленый и наоборот (с использованием виртуальной руки, как показано в этом примере: http://examples.x3dom.org/Demos/ClassroomVR/classroom-rift-leap-webvr.html)

Прямо сейчас жест захвата действительно вызывает событие щелчка, но оно срабатывает всякий раз, когда / где бы я ни делал захват. Я хочу, чтобы он срабатывал только тогда, когда я делаю жест захвата именно этого красного куба. Любые предложения будут оценены. Благодарю.

<x3d>
  <scene>
               <Transform id = "boxTrafo1" DEF="boxTrafo1" translation="-1 0 0">
                    <Shape id = "boxShape1" DEF="boxShape1" onclick = "changeColor(event);">
                        <Appearance DEF="boxApp1">
                              <Material id ="boxMat1" diffuseColor="1 0 0" specularColor=".5 .5 .5" ></Material>
                         </Appearance>
                         <Box  size="4.5 4.5 4.5"></Box>
                    </Shape>
               </Transform>


                <Transform translation='-11 0 3' id="boxTrafo2" >
                      <Shape id = "boxShape2">
                            <Appearance id = "boxApp2">
                                 <Material id ="boxMat2" diffuseColor='0 1 0' specularColor='.5 .5 .5'></Material>  
                             </Appearance>
                             <Box  size="4.5 4.5 4.5"></Box>
                        </Shape>
                 </Transform>

</scene>
</x3d>

<script>
var controller = Leap.loop({enableGestures: true}, function (frame)
        {
            if (frame.hands.length)
            {
                var hand_frame = frame.hands[0];
                if (hand_frame.grabStrength === 1) {
                  var box = document.getElementById("boxShape1");
                  box.click();
                }
            }
});

 function changeColor(event) {

            if (document.getElementById("boxMat1").getAttribute("diffuseColor") === "1 0 0")
                document.getElementById("boxMat1").setAttribute("diffuseColor", "0 1 0");
            else
                document.getElementById("boxMat1").setAttribute("diffuseColor", "1 0 0");
        }
</script>

Answer 1

Я не знаю Leap Motion, но есть https://developer.leapmotion.com/documentation/javascript/api/Leap.Hand.html которым вы можете использовать вместе с https://github.com/x3dom/x3dom/blob/1.7.1/src/Runtime.js#L328 который даст вам pickObject, который вы должны соответствовать вашей коробке и выстрелить.