From 0d444c0dee27dc6434a8978744ce3d98a16da414 Mon Sep 17 00:00:00 2001
From: Ali Abid <aliabid94@gmail.com>
Date: Thu, 25 Jul 2019 21:50:00 -0700
Subject: [PATCH] changed color to blue

---
 gradio/static/js/interfaces/input/sketchpad.js |  4 ++--
 gradio/static/js/interfaces/input/textbox.js   |  2 +-
 gradio/static/js/utils.js                      | 10 +---------
 3 files changed, 4 insertions(+), 12 deletions(-)

diff --git a/gradio/static/js/interfaces/input/sketchpad.js b/gradio/static/js/interfaces/input/sketchpad.js
index a041fa1e6d..123fc00ce2 100644
--- a/gradio/static/js/interfaces/input/sketchpad.js
+++ b/gradio/static/js/interfaces/input/sketchpad.js
@@ -54,9 +54,9 @@ const sketchpad_input = {
   },
   output: function(data) {
     this.target.find(".saliency_holder").removeClass("hide");
-    var ctx = this.target.find(".saliency")[0].getContext('2d');
+    let ctx = this.target.find(".saliency")[0].getContext('2d');
     let dimension = this.target.find(".saliency").width();
-    console.log(data, dimension, dimension);
+    ctx.clearRect(0,0,dimension,dimension);
     paintSaliency(data, dimension, dimension, ctx);
   },
   clear: function() {
diff --git a/gradio/static/js/interfaces/input/textbox.js b/gradio/static/js/interfaces/input/textbox.js
index 8ca0ab1611..23ec89b13a 100644
--- a/gradio/static/js/interfaces/input/textbox.js
+++ b/gradio/static/js/interfaces/input/textbox.js
@@ -16,7 +16,7 @@ const textbox_input = {
     let text = this.target.find(".input_text").val();
     let index = 0;
     data.forEach(function(value, index) {
-      html += `<span style='background-color:rgba(255,0,0,${value})'>${text.charAt(index)}</span>`;
+      html += `<span style='background-color:rgba(0,0,255,${value})'>${text.charAt(index)}</span>`;
     })
     $(".input_text_saliency").html(html);
   },
diff --git a/gradio/static/js/utils.js b/gradio/static/js/utils.js
index 553deefabd..64d81ea280 100644
--- a/gradio/static/js/utils.js
+++ b/gradio/static/js/utils.js
@@ -47,15 +47,7 @@ function paintSaliency(data, width, height, ctx) {
   data.forEach(function(row) {
     var c = 0
     row.forEach(function(cell) {
-      if (cell < 0.25) {
-        ctx.fillStyle = "white";
-      } else if (cell < 0.5) {
-        ctx.fillStyle = "yellow";
-      } else if (cell < 0.75) {
-        ctx.fillStyle = "orange";
-      } else {
-        ctx.fillStyle = "red";
-      }
+      ctx.fillStyle = `rgba(${(1 - cell) * 255},${(1 - cell) * 255},255,0.5)`;
       ctx.fillRect(c * cell_width, r * cell_height, cell_width, cell_height);
       c++;
     })