Update app.py

app.py

@@ -74,23 +74,21 @@ def findNormals(gray_depth, format):
     return (normal[:, :, ::-1]).astype(np.uint8)
 
 
-load_svg="""
-async(img, dpt)=>{
-try {
-  document.getElementById('inimage').outerHTML = '<image id="inimage" crossorigin="anonymous" href="' + img + '" x="0" y="0" height="100%" width="100%" style="filter: url(#displacementFilter)"/>';
-  document.getElementById('feimage').outerHTML = '<feImage id="feimage" crossorigin="anonymous" width="100%" height="100%" x="0" y="0" result="10_MAP" href="' + dpt + '"/>';
-} catch(e) {alert(e)}
-}
-"""
-
-
 js="""
 async()=>{
-  document.getElementById('scale').getElementsByTagName('input')[0].addEventListener('input', displace);
+  document.getElementById('scale').addEventListener('input', displace);
 
   function displace(e) {
     document.getElementById('dmap').setAttributeNS(null, 'scale', ''+e.target.value);
   }
+
+  document.getElementById('img-display-output').getElementsByTagName('img')[1].onload = function(e) {
+    document.getElementById('feimage').outerHTML = '<feImage id="feimage" crossorigin="anonymous" width="100%" height="100%" x="0" y="0" result="10_MAP" href="' + e.target.src + '"/>';
+  }
+
+  document.getElementById('img-display-output').getElementsByTagName('img')[0].onload = function(e) {
+    document.getElementById('inimage').outerHTML = '<image id="inimage" crossorigin="anonymous" href="' + e.target.src + '" x="0" y="0" height="100%" width="100%" style="filter: url(#displacementFilter)"/>';
+  }
 }
 """
 
@@ -128,10 +126,9 @@ with gr.Blocks(js=js, css=css) as demo:
             <feDisplacementMap id='dmap' result='fedm' in2='blurred' in='SourceGraphic' scale='2' xChannelSelector='G' yChannelSelector='A' />
           </filter>
           <image id='inimage' crossorigin='anonymous' href='https://freeali.se/panoramera/examples/basic/f0.jpg' x='0' y='0' height='100%' width='100%' style='filter: url(#displacementFilter)'/>
-        </svg>
+        </svg><br/>
+        <input type='range' min='-128' max='128' value='0' step='1' id='scale'/>
         """)
-            scale = gr.Slider(label="Scale", minimum="-128", maximum="128", value="0", step="1", elem_id="scale")
-            gray_depth_file.change(fn=None, inputs=[orig_image_file, gray_depth_file], outputs=None, js=load_svg)
         with gr.Tab("Normals"):
             normals_out = gr.Image(label="Normal map", interactive=False)
             format_normals = gr.Radio(choices=["directx", "opengl"])