diff --git a/gradio/static/css/gradio.css b/gradio/static/css/gradio.css
index 9eedf92c04..9e2da838a7 100644
--- a/gradio/static/css/gradio.css
+++ b/gradio/static/css/gradio.css
@@ -110,7 +110,6 @@
}
.label {
width: 60px;
- text-align: right;
}
.confidence_intervals .level {
font-size: 14px;
diff --git a/gradio/static/js/class-output.js b/gradio/static/js/class-output.js
index 3761cd143d..22babf9ba3 100644
--- a/gradio/static/js/class-output.js
+++ b/gradio/static/js/class-output.js
@@ -27,6 +27,19 @@ try {
sleep(300).then(() => {
// $(".output_class").text(event.data);
var data = JSON.parse(event.data)
+ data = {
+ label: "happy",
+ confidences : [
+ {
+ label : "happy",
+ confidence: 0.7
+ },
+ {
+ label : "sad",
+ confidence: 0.3
+ },
+ ]
+ }
$(".output_class").text(data["label"])
$(".confidence_intervals").empty()
if ("confidences" in data) {
diff --git a/gradio/static/js/image-upload-input.js b/gradio/static/js/image-upload-input.js
index 6c2b2d1231..6dec0cdc98 100644
--- a/gradio/static/js/image-upload-input.js
+++ b/gradio/static/js/image-upload-input.js
@@ -1,8 +1,10 @@
-$(".input_image").click(function (e) {
+var cropper;
+
+$('body').on('click', ".input_image.drop_mode", function (e) {
$(this).parent().find(".hidden_upload").click();
})
-$(".input_image").on('drag dragstart dragend dragover dragenter dragleave drop', function(e) {
+$('body').on('drag dragstart dragend dragover dragenter dragleave drop', ".input_image.drop_mode", function(e) {
e.preventDefault();
e.stopPropagation();
})
@@ -13,7 +15,12 @@ function loadPreviewFromFiles(files) {
ReaderObj.onloadend = function() {
$(".input_caption").hide()
$(".input_image").removeClass("drop_mode")
- $(".input_image img").attr("src", this.result)
+ var image = $(".input_image img")
+ image.attr("src", this.result)
+ image.cropper({aspectRatio : 1.0});
+ if (!cropper) {
+ cropper = image.data('cropper');
+ }
}
}
@@ -43,6 +50,10 @@ $('body').on('click', '.submit', function(e) {
})
$('body').on('click', '.clear', function(e) {
+ if (cropper) {
+ cropper.destroy();
+ cropper = null
+ }
$(".input_caption").show()
$(".input_image img").removeAttr("src");
$(".input_image").addClass("drop_mode")
diff --git a/gradio/templates/image_upload_input.html b/gradio/templates/image_upload_input.html
index 739e49eb52..ee02413ecb 100644
--- a/gradio/templates/image_upload_input.html
+++ b/gradio/templates/image_upload_input.html
@@ -6,4 +6,6 @@
+
+