Update app.py

app.py

@@ -636,10 +636,50 @@ async(c, o, p, d, n, m)=>{
           //BABYLON.Engine.LastCreatedScene.meshes[BABYLON.Engine.LastCreatedScene.meshes.length-1].material.needDepthPrePass = true;
           BABYLON.Engine.LastCreatedScene.meshes[BABYLON.Engine.LastCreatedScene.meshes.length-1].scaling.z = -1;
           BABYLON.Engine.LastCreatedScene.meshes[BABYLON.Engine.LastCreatedScene.meshes.length-1].alphaIndex = o_.length-j;
+          BABYLON.Engine.LastCreatedScene.meshes[BABYLON.Engine.LastCreatedScene.meshes.length-1].visibility = 0.9999;
           BABYLON.Engine.LastCreatedScene.meshes[BABYLON.Engine.LastCreatedScene.meshes.length-1].material.diffuseTexture.hasAlpha = true;
           BABYLON.Engine.LastCreatedScene.meshes[BABYLON.Engine.LastCreatedScene.meshes.length-1].material.useAlphaFromDiffuseTexture = true;
           BABYLON.Engine.LastCreatedScene.meshes[BABYLON.Engine.LastCreatedScene.meshes.length-1].applyDisplacementMap(m[o_[j]].url, 0, 255, function(m){try{alert(BABYLON.Engine.Version);}catch(e){alert(e);}}, null, null, true, function(e){alert(e);});
         }
+
+        window.md = false;
+        window.r_old = 1.0;
+        window.a_old = 0;
+        window.b_old = Math.PI / 2;
+
+        document.getElementById("model3D").getElementsByTagName("canvas")[0].addEventListener('pointermove', function() {
+          if (md === true) {
+            if (Math.abs(BABYLON.Engine.LastCreatedScene.activeCamera.radius - r_old) > 1/16) {
+              BABYLON.Engine.LastCreatedScene.activeCamera.radius = r_old;
+            } else {
+              r_old = BABYLON.Engine.LastCreatedScene.activeCamera.radius;
+            }
+            BABYLON.Engine.LastCreatedScene.activeCamera.fov = 0.8 * BABYLON.Engine.LastCreatedScene.activeCamera.radius;
+    
+            if (BABYLON.Engine.LastCreatedScene.activeCamera.fov < 0.157) {
+              BABYLON.Engine.LastCreatedScene.activeCamera.fov = 0.157;
+            } else if (BABYLON.Engine.LastCreatedScene.activeCamera.fov > 1.57) {
+              BABYLON.Engine.LastCreatedScene.activeCamera.fov = 1.57;
+            }
+            document.getElementById('zoom').value = BABYLON.Engine.LastCreatedScene.activeCamera.fov;
+            document.getElementById('zoom').parentNode.childNodes[2].innerText = document.getElementById('zoom').value;
+    
+            try {
+              compass.style.transform = "rotateX(" + (BABYLON.Engine.LastCreatedScene.activeCamera.beta-Math.PI/2) + "rad) rotateZ(" + BABYLON.Engine.LastCreatedScene.activeCamera.alpha + "rad)";
+              document.getElementById("cdata").innerHTML = compass.style.transform + '<br/>radius: ' + BABYLON.Engine.LastCreatedScene.activeCamera.radius + ',<br/> heading: ' + BABYLON.Engine.LastCreatedScene.activeCamera.alpha + ',<br/> pitch: ' + BABYLON.Engine.LastCreatedScene.activeCamera.beta + ',<br/> x: ' + BABYLON.Engine.LastCreatedScene.activeCamera.position.x + ',<br/> y: ' + BABYLON.Engine.LastCreatedScene.activeCamera.position.y + ',<br/> z: ' + BABYLON.Engine.LastCreatedScene.activeCamera.position.z + '<hr/>';
+            } catch(e) {alert(e);}
+          }
+        });
+        document.getElementById("model3D").getElementsByTagName("canvas")[0].addEventListener('pointerdown', function() {
+          md = true;
+        });
+        document.getElementById("model3D").getElementsByTagName("canvas")[0].addEventListener('pointerup', function() {
+          md = false;
+        });
+        document.getElementById("model3D").getElementsByTagName("canvas")[0].addEventListener('pointerleave', function() {
+          md = false;
+        });
+        
         if (document.getElementById("model")) {
           document.getElementById("model").appendChild(document.getElementById("model3D"));
           toggleDisplay("model");
@@ -964,6 +1004,9 @@ with gr.Blocks(css=css, js=js, head=head) as demo:
                 }
               } 
               BABYLON.Engine.LastCreatedScene.activeCamera.radius = 0;
+              BABYLON.Engine.LastCreatedScene.activeCamera.alpha = 0;
+              BABYLON.Engine.LastCreatedScene.activeCamera.beta = Math.PI / 2;
+    
               BABYLON.Engine.LastCreatedScene.activeCamera.metadata.pipeline.samples = 4; 
               BABYLON.Engine.LastCreatedScene.activeCamera.fov = document.getElementById(\"zoom\").value;
               BABYLON.Engine.LastCreatedScene.activeCamera.metadata.pipeline.imageProcessing.contrast = document.getElementById(\"contrast\").value;