Update app.py

app.py

@@ -76,7 +76,7 @@ def findNormals(gray_depth, format):
 
 load_svg="""
 async(img, dpt)=>{
-  document.getElementById('inimage').outerHTML = '<image id="inimage" crossorigin="anonymous" href="' + img['composite'] + '" x="0" y="0" height="100%" width="100%" style="filter: url(#displacementFilter)"/>';
+  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 + '"/>';
 }
 """
@@ -110,7 +110,8 @@ with gr.Blocks(js=js, css=css) as demo:
         input_image = gr.ImageEditor(label="Input Image", layers=True, sources=('upload', 'clipboard'), show_download_button=True, type="numpy", interactive=True, transforms=(None,), eraser=gr.Eraser(), brush=gr.Brush(default_size=1, colors=['black', '#505050', '#a0a0a0', 'white']), elem_id="img-display-input")
         with gr.Tab("Depth"):
             depth_image_slider = ImageSlider(label="Depth Map with Slider View", elem_id='img-display-output', position=0.5)
-            gray_depth_file = gr.File(label="Grayscale depth map", elem_id="download",)
+            orig_image_file = gr.File(label="Original image", elem_id="original")
+            gray_depth_file = gr.File(label="Grayscale depth map", elem_id="download")
             submit = gr.Button(value="Compute Depth")
             svg = gr.HTML("""
         <svg id='svg'
@@ -128,7 +129,7 @@ with gr.Blocks(js=js, css=css) as demo:
         </svg>
         """)
             scale = gr.Slider(label="Scale", minimum="-128", maximum="128", value="0", step="1", elem_id="scale")
-            gray_depth_file.change(fn=None, inputs=[input_image, gray_depth_file], outputs=None, js=load_svg)
+            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"])
@@ -158,14 +159,18 @@ with gr.Blocks(js=js, css=css) as demo:
         tmp_gray_depth = tempfile.NamedTemporaryFile(suffix='.png', delete=False)
         gray_depth.save(tmp_gray_depth.name)
 
-        return [(original_image, colored_depth), tmp_gray_depth.name, tmp_raw_depth.name]
+        orig_image = Image.fromarray(image)
+        tmp_orig_image = tempfile.NamedTemporaryFile(suffix='.png', delete=False)
+        orig_image.save(tmp_orig_image.name)
 
-    submit.click(on_submit, inputs=[input_image], outputs=[depth_image_slider, gray_depth_file, raw_file])
+        return [(original_image, colored_depth), tmp_orig_image.name, tmp_gray_depth.name, tmp_raw_depth.name]
+
+    submit.click(on_submit, inputs=[input_image], outputs=[depth_image_slider, orig_image_file, gray_depth_file, raw_file])
 
     example_files = os.listdir('assets/drawn_examples')
     example_files.sort()
     example_files = [os.path.join('assets/drawn_examples', filename) for filename in example_files]
-    examples = gr.Examples(examples=example_files, inputs=[input_image], outputs=[depth_image_slider, gray_depth_file, raw_file], fn=on_submit)
+    examples = gr.Examples(examples=example_files, inputs=[input_image], outputs=[depth_image_slider, orig_image_file, gray_depth_file, raw_file], fn=on_submit)
 
 
 if __name__ == '__main__':