Merge branch 'abidlabs/similarity' of github.com:gradio-app/gradio into abidlabs/similarity

build/lib/gradio/static/js/all_io.js

@@ -48,7 +48,7 @@ var io_master_template = {
       output = output["data"];
       this.target.find(".loading").addClass("invisible");
       this.target.find(".output_interfaces").css("opacity", 1);
-      this.order_mapping = sortWithIndices(output);
+      this.order_mapping = sortWithIndices(output).reverse();
       callback();
     })
   },

build/lib/gradio/static/js/interfaces/input/image.js

@@ -87,14 +87,18 @@ const image_input = {
         dest_height: dim,
       })
       Webcam.attach(this.target.find(".webcam_box")[0]);
-      io.target.find(".webcam").click(function() {
+      if (io.io_master.config.live) {
-        Webcam.snap(function(image_data) {
+        io.target.find(".webcam span").hide();
-          io.target.find(".webcam").hide();
+      } else {
-          io.target.find(".image_display").removeClass("hide");
+        io.target.find(".webcam").click(function() {
-          io.set_image_data(image_data, /*update_editor=*/true);
+          Webcam.snap(function(image_data) {
-          io.state = "IMAGE_LOADED";
+            io.target.find(".webcam").hide();
-        });    
+            io.target.find(".image_display").removeClass("hide");
-      })
+            io.set_image_data(image_data, /*update_editor=*/true);
+            io.state = "IMAGE_LOADED";
+          });    
+        })  
+      }
     } else if (this.source == "canvas") {
       io.target.find(".sketchpad").removeClass("hide");
       var dimension = Math.min(this.target.find(".canvas_holder").width(),
@@ -156,12 +160,20 @@ const image_input = {
         io.io_master.input(io.id, this.image_data);
       }
     } else if (this.source == "webcam") {
+      if (!Webcam.loaded) {
+        io.io_master.no_input();
+        return;
+      }
       Webcam.snap(function(image_data) {
-        io.target.find(".webcam").hide();
+        if (io.io_master.config.live) {
-        io.target.find(".image_display").removeClass("hide");
+          io.io_master.input(io.id, image_data);  
-        io.set_image_data(image_data, /*update_editor=*/true);
+        } else {
-        io.state = "IMAGE_LOADED";
+          io.target.find(".webcam").hide();
-        io.io_master.input(io.id, image_data);
+          io.target.find(".image_display").removeClass("hide");
+          io.set_image_data(image_data, /*update_editor=*/true);
+          io.state = "IMAGE_LOADED";
+          io.io_master.input(io.id, image_data);  
+        }
       });    
     } else {
       io.io_master.no_input();

demo/image_classifier.py

@@ -1,7 +1,7 @@
 # Demo: (Image) -> (Label)
 
 import gradio as gr
-# import tensorflow as tf
+import tensorflow as tf
 
 import numpy as np
 from PIL import Image
@@ -15,13 +15,12 @@ current_dir = os.path.dirname(os.path.realpath(__file__))
 with open(os.path.join(current_dir, "files/imagenet_labels.json")) as labels_file:
     labels = json.load(labels_file)
 
-# mobile_net = tf.keras.applications.MobileNetV2()
+mobile_net = tf.keras.applications.MobileNetV2()
 
 
 def image_classifier(im):
-    return 0
     arr = np.expand_dims(im, axis=0)
-    # arr = tf.keras.applications.mobilenet.preprocess_input(arr)
+    arr = tf.keras.applications.mobilenet.preprocess_input(arr)
     prediction = mobile_net.predict(arr).flatten()
     return {labels[i]: float(prediction[i]) for i in range(1000)}
 
@@ -38,4 +37,4 @@ iface = gr.Interface(image_classifier, image, label,
     ])
 
 if __name__ == "__main__":
-    iface.launch()
+    iface.launch(share=True)

demo/webcam.py

@@ -8,7 +8,7 @@ def snap(image):
     return np.flipud(image)
 
 
-iface = gr.Interface(snap, gr.inputs.Image(shape=(100,100), image_mode="L", source="webcam"), "image")
+iface = gr.Interface(snap, gr.inputs.Image(shape=(100,100), image_mode="L", source="webcam"), "image", live=True)
 
 iface.test_launch()
 if __name__ == "__main__":

gradio/static/js/interfaces/input/image.js

@@ -87,14 +87,18 @@ const image_input = {
         dest_height: dim,
       })
       Webcam.attach(this.target.find(".webcam_box")[0]);
-      io.target.find(".webcam").click(function() {
+      if (io.io_master.config.live) {
-        Webcam.snap(function(image_data) {
+        io.target.find(".webcam span").hide();
-          io.target.find(".webcam").hide();
+      } else {
-          io.target.find(".image_display").removeClass("hide");
+        io.target.find(".webcam").click(function() {
-          io.set_image_data(image_data, /*update_editor=*/true);
+          Webcam.snap(function(image_data) {
-          io.state = "IMAGE_LOADED";
+            io.target.find(".webcam").hide();
-        });    
+            io.target.find(".image_display").removeClass("hide");
-      })
+            io.set_image_data(image_data, /*update_editor=*/true);
+            io.state = "IMAGE_LOADED";
+          });    
+        })  
+      }
     } else if (this.source == "canvas") {
       io.target.find(".sketchpad").removeClass("hide");
       var dimension = Math.min(this.target.find(".canvas_holder").width(),
@@ -156,12 +160,20 @@ const image_input = {
         io.io_master.input(io.id, this.image_data);
       }
     } else if (this.source == "webcam") {
+      if (!Webcam.loaded) {
+        io.io_master.no_input();
+        return;
+      }
       Webcam.snap(function(image_data) {
-        io.target.find(".webcam").hide();
+        if (io.io_master.config.live) {
-        io.target.find(".image_display").removeClass("hide");
+          io.io_master.input(io.id, image_data);  
-        io.set_image_data(image_data, /*update_editor=*/true);
+        } else {
-        io.state = "IMAGE_LOADED";
+          io.target.find(".webcam").hide();
-        io.io_master.input(io.id, image_data);
+          io.target.find(".image_display").removeClass("hide");
+          io.set_image_data(image_data, /*update_editor=*/true);
+          io.state = "IMAGE_LOADED";
+          io.io_master.input(io.id, image_data);  
+        }
       });    
     } else {
       io.io_master.no_input();