Update app.py

app.py

@@ -694,6 +694,7 @@ async(c, o, p, d, n, m, s)=>{
         BABYLON.Engine.LastCreatedScene.meshes[BABYLON.Engine.LastCreatedScene.meshes.length-1].visibility = 0.9999;
 
         window.md = false;
+        window.rd = false;
         window.compass = document.getElementById("compass");
         window.x = 0;
         window.y = 0;
@@ -703,8 +704,8 @@ async(c, o, p, d, n, m, s)=>{
         window.ctx = null;
         window.video = document.getElementById("depth_video").getElementsByTagName("video")[0];
         window.parallax = 0;
-        window.xdir = new BABYLON.Vector3(1, 0, 0);
-        window.rdir = new BABYLON.Vector3(1, 0, 0);
+        window.xdir = new BABYLON.Vector3(0, 0, 1);
+        window.rdir = new BABYLON.Vector3(0, 0, 1);
 
         document.getElementById("model3D").getElementsByTagName("canvas")[0].addEventListener('pointermove', function(evt) {
         if (md === true) {
@@ -715,7 +716,7 @@ async(c, o, p, d, n, m, s)=>{
           x = parseInt(evt.clientX - evt.target.getBoundingClientRect().x);
           y = parseInt(evt.clientY - evt.target.getBoundingClientRect().y);
           
-          if (Math.abs(x-xold)>16 || Math.abs(y-yold)>16) {
+          if (rd === true && Math.abs(x-xold)>16 || Math.abs(y-yold)>16) {
             if (Math.abs(BABYLON.Engine.LastCreatedScene.activeCamera.radius) > (1.57-0.157)*16) {
               BABYLON.Engine.LastCreatedScene.activeCamera.radius = (1.57-0.157)*16;
             } else {
@@ -737,15 +738,28 @@ async(c, o, p, d, n, m, s)=>{
         });
         document.getElementById("model3D").getElementsByTagName("canvas")[0].addEventListener('pointerup', function() {
           md = false;
+          rd = false;
         });
         document.getElementById("model3D").getElementsByTagName("canvas")[0].addEventListener('pointercancel', function() {
           md = false;
+          rd = false;
         });
         document.getElementById("model3D").getElementsByTagName("canvas")[0].addEventListener('pointerleave', function() {
           md = false;
+          rd = false;
         });
         document.getElementById("model3D").getElementsByTagName("canvas")[0].addEventListener('pointerout', function() {
           md = false;
+          rd = false;
+        });
+        document.getElementById("model3D").getElementsByTagName("canvas")[0].addEventListener('contextmenu', function() {
+          rd = true;
+        });
+        document.getElementById("model3D").getElementsByTagName("canvas")[0].addEventListener('gesturestart', function() {
+          rd = true;
+        });
+        document.getElementById("model3D").getElementsByTagName("canvas")[0].addEventListener('gestureend', function() {
+          rd = false;
         });
         
 
@@ -1301,7 +1315,6 @@ with gr.Blocks(css=css, js=js, head=head) as demo:
               rdir = BABYLON.Engine.LastCreatedScene.activeCamera.getDirection(xdir);
               BABYLON.Engine.LastCreatedScene.meshes[BABYLON.Engine.LastCreatedScene.meshes.length-1].position.x = parallax * rdir.x;
               BABYLON.Engine.LastCreatedScene.meshes[BABYLON.Engine.LastCreatedScene.meshes.length-1].position.z = parallax * rdir.z;
-              alert(BABYLON.Engine.LastCreatedScene.meshes[BABYLON.Engine.LastCreatedScene.meshes.length-1].position);
               this.parentNode.childNodes[2].innerText = parallax;
             '/><span>0.0</span></span><br/>
             <span><label for='contrast' style='width:8em'>Contrast</label><input id='contrast' type='range' style='width:128px;height:1em;' value='1.0' min='0' max='2' step='0.001' oninput='