Update app.py

app.py

@@ -344,32 +344,6 @@ with gr.Blocks(css=css) as demo:
               this.parentNode.childNodes[2].innerText = BABYLON.Engine.LastCreatedScene.activeCamera.fov;
               document.getElementsByClassName(\"model3D\")[0].getElementsByTagName(\"canvas\")[0].style.filter = \"blur(\" + BABYLON.Engine.LastCreatedScene.getNodes()[1].material.pointSize/Math.sqrt(2.0) + \"px)\";
             '/><span>0.8</span>""")
-            parallax = gr.HTML(value="""<label for='parallax'>Parallax</label><input id='parallax' type='range' style='width:256px;height:1em;' min='-1' max='1' step='0.001' oninput='
-              if (!BABYLON.Engine.LastCreatedScene.activeCamera.metadata) {
-                BABYLON.Engine.LastCreatedScene.activeCamera.metadata = { 
-                  screenshot: true,
-                  pipeline: new BABYLON.DefaultRenderingPipeline(\"default\", true, BABYLON.Engine.LastCreatedScene, [BABYLON.Engine.LastCreatedScene.activeCamera]) 
-                }
-              } 
-              BABYLON.Engine.LastCreatedScene.activeCamera.metadata.pipeline.samples = 4; 
-              document.getElementsByClassName(\"model3D\")[0].getElementsByTagName(\"canvas\")[0].onpointerdown = function() {
-                BABYLON.Engine.LastCreatedScene.activeCamera.setTarget(BABYLON.Engine.LastCreatedScene.activeCamera.metadata.zero);
-                BABYLON.Engine.LastCreatedScene.activeCamera.radius = 0;
-              }
-              try {
-              var x = -255 * Math.cos(BABYLON.Engine.LastCreatedScene.activeCamera.alpha) * Math.sin(BABYLON.Engine.LastCreatedScene.activeCamera.beta)
-              var y = -255 * Math.cos(BABYLON.Engine.LastCreatedScene.activeCamera.beta)
-              var z = -255 * Math.sin(BABYLON.Engine.LastCreatedScene.activeCamera.alpha) * Math.sin(BABYLON.Engine.LastCreatedScene.activeCamera.beta)
-              
-              BABYLON.Engine.LastCreatedScene.activeCamera.metadata.zero = new BABYLON.Vector3(0,0,0);
-              BABYLON.Engine.LastCreatedScene.activeCamera.metadata.CoR_At = new BABYLON.Vector3(x, y, z);
-
-              BABYLON.Engine.LastCreatedScene.activeCamera.setTarget(BABYLON.Engine.LastCreatedScene.activeCamera.metadata.CoR_At);
-              BABYLON.Engine.LastCreatedScene.activeCamera.radius = 255;
-              BABYLON.Engine.LastCreatedScene.activeCamera.alpha = this.value;
-              this.parentNode.childNodes[2].innerText = BABYLON.Engine.LastCreatedScene.activeCamera.alpha;
-              } catch(e) {alert(e);}
-            '/><span>0.0</span>""")
             camera = gr.HTML(value="<a href='#' onclick=\"BABYLON.Engine.LastCreatedScene.activeCamera.radius=0;\">reset camera</a>")
             contrast = gr.HTML(value="""<label for='contrast'>Contrast</label><input id='contrast' type='range' style='width:256px;height:1em;' min='0' max='2' step='0.001' oninput='
               if (!BABYLON.Engine.LastCreatedScene.activeCamera.metadata) {
@@ -400,8 +374,8 @@ with gr.Blocks(css=css) as demo:
                   pipeline: new BABYLON.DefaultRenderingPipeline(\"default\", true, BABYLON.Engine.LastCreatedScene, [BABYLON.Engine.LastCreatedScene.activeCamera]) 
                 }
               } 
-              var cntxt = document.getElementsByClassName(\"model3D\")[0].getElementsByTagName(\"canvas\")[0].getContext(\"webgl2\");
-              this.innerText = cntxt;
+              //var cntxt = document.getElementsByClassName(\"model3D\")[0].getElementsByTagName(\"canvas\")[0].getContext(\"webgl2\");
+              //this.innerText = cntxt;
               BABYLON.Engine.LastCreatedScene.activeCamera.metadata.screenshot = true;
 
               BABYLON.Engine.LastCreatedScene.getEngine().onEndFrameObservable.add(function() {
@@ -410,6 +384,7 @@ with gr.Blocks(css=css) as demo:
                   try {
                     BABYLON.Tools.CreateScreenshotUsingRenderTarget(BABYLON.Engine.LastCreatedScene.getEngine(), BABYLON.Engine.LastCreatedScene.activeCamera, 
                       { precision: 1.0 }, (durl) => { 
+                        document.getElementById(\"img_out\").src = durl;
                         document.getElementById(\"img_out\").onload = function() {
                           var svgd = `<svg id=\"svg_out\" viewBox=\"0 0 ` + document.getElementById(\"img_out\").width + ` ` + document.getElementById(\"img_out\").height + `\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\">
                             <defs>
@@ -419,14 +394,13 @@ with gr.Blocks(css=css) as demo:
                             </defs>
                             <image filter=\"url(#blur)\" id=\"svg_img\" x=\"0\" y=\"0\" width=\"` + document.getElementById(\"img_out\").width + `\" height=\"` + document.getElementById(\"img_out\").height + `\" xlink:href=\"` + durl + `\"/>
                           </svg>`;
+                          document.getElementById(\"img_out\").src = \"data:image/svg+xml;base64,\" + btoa(svgd); 
                           document.getElementById(\"img_out\").onload = function() {
                             document.getElementById(\"cnv_out\").width = document.getElementById(\"img_out\").width;
                             document.getElementById(\"cnv_out\").height = document.getElementById(\"img_out\").height;
                             document.getElementById(\"cnv_out\").getContext(\"2d\").drawImage(img_out, 0, 0); 
                           }
-                          document.getElementById(\"img_out\").src = \"data:image/svg+xml;base64,\" + btoa(svgd); 
                         }
-                        document.getElementById(\"img_out\").src = durl;
                       }
                     );
                   } catch(e) { alert(e); }