Update app.py

app.py

@@ -703,14 +703,14 @@ 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.xdir = new BABYLON.Vector3(-1, 0, 0);
         window.rdir = new BABYLON.Vector3(0, 0, 0);
 
         document.getElementById("model3D").getElementsByTagName("canvas")[0].addEventListener('pointermove', function(evt) {
         if (md === true) {
           rdir = BABYLON.Engine.LastCreatedScene.activeCamera.getDirection(xdir);
-          BABYLON.Engine.LastCreatedScene.activeCamera.position.x = parallax * rdir.x;
-          BABYLON.Engine.LastCreatedScene.activeCamera.position.z = parallax * rdir.z;
+          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;
           
           x = parseInt(evt.clientX - evt.target.getBoundingClientRect().x);
           y = parseInt(evt.clientY - evt.target.getBoundingClientRect().y);
@@ -1290,8 +1290,8 @@ with gr.Blocks(css=css, js=js, head=head) as demo:
               this.parentNode.childNodes[2].innerText = BABYLON.Engine.LastCreatedScene.activeCamera.fov;
 
               document.getElementById(\"model3D\").getElementsByTagName(\"canvas\")[0].style.filter = \"blur(\" + BABYLON.Engine.LastCreatedScene.getNodes()[parseInt(document.getElementById(\"fnum\").getElementsByTagName(\"input\")[0].value)+1].material.pointSize/2.0*Math.sqrt(2.0) + \"px)\";
-            '/> <span>0.8</span></span><br/>
-            <span><label for='pan' style='width:8em'>Pan</label><input id='pan' type='range' style='width:128px;height:1em;' value='0' min='-128' max='128' step='0.001' oninput='
+            '/><span>0.8</span></span><br/>
+            <span><label for='pan' style='width:8em'>Pan</label><input id='pan' type='range' style='width:128px;height:1em;' value='0' min='-16' max='16' step='0.001' oninput='
               if (!BABYLON.Engine.LastCreatedScene.activeCamera.metadata) {
                 var evt = document.createEvent(\"Event\");
                 evt.initEvent(\"click\", true, false);
@@ -1299,12 +1299,10 @@ with gr.Blocks(css=css, js=js, head=head) as demo:
               }
               parallax = this.value;
               rdir = BABYLON.Engine.LastCreatedScene.activeCamera.getDirection(xdir);
-              alert(rdir);
-              BABYLON.Engine.LastCreatedScene.activeCamera.position.x = parallax * rdir.x;
-              BABYLON.Engine.LastCreatedScene.activeCamera.position.z = parallax * rdir.z;
-              alert(BABYLON.Engine.LastCreatedScene.activeCamera.position);
+              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;
               this.parentNode.childNodes[2].innerText = parallax;
-            '/> <span>0.0</span></span><br/>
+            '/><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='
               if (!BABYLON.Engine.LastCreatedScene.activeCamera.metadata) {
                 var evt = document.createEvent(\"Event\");
@@ -1313,7 +1311,7 @@ with gr.Blocks(css=css, js=js, head=head) as demo:
               } 
               BABYLON.Engine.LastCreatedScene.activeCamera.metadata.pipeline.imageProcessing.contrast = this.value;
               this.parentNode.childNodes[2].innerText = BABYLON.Engine.LastCreatedScene.activeCamera.metadata.pipeline.imageProcessing.contrast;
-            '/> <span>1.0</span></span><br/>
+            '/><span>1.0</span></span><br/>
             <span><label for='exposure' style='width:8em'>Exposure</label><input id='exposure' type='range' style='width:128px;height:1em;' value='1.0' min='0' max='2' step='0.001' oninput='
               if (!BABYLON.Engine.LastCreatedScene.activeCamera.metadata) {
                 var evt = document.createEvent(\"Event\");
@@ -1322,7 +1320,7 @@ with gr.Blocks(css=css, js=js, head=head) as demo:
               } 
               BABYLON.Engine.LastCreatedScene.activeCamera.metadata.pipeline.imageProcessing.exposure = this.value;
               this.parentNode.childNodes[2].innerText = BABYLON.Engine.LastCreatedScene.activeCamera.metadata.pipeline.imageProcessing.exposure;
-            '/> <span>1.0</span></span><br/>
+            '/><span>1.0</span></span><br/>
               <a href='#' onclick='snapshot();'>Screenshot</a>
               <a href='#' onclick='record_video();'>Record</a>
               <a href='#' onclick='stop_recording();'>Stop rec.</a>