From 3fd90c628939c8fd8de2db9000cb30f72df1f40e Mon Sep 17 00:00:00 2001
From: deecay <daiju.kito@gmail.com>
Date: Tue, 11 Jul 2017 10:15:47 +0900
Subject: [PATCH 1/5] Fix: Custom code didn't load into editor

---
 client/app/visualizations/chart/index.js | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/client/app/visualizations/chart/index.js b/client/app/visualizations/chart/index.js
index b9f93b9074..ea7d519ee0 100644
--- a/client/app/visualizations/chart/index.js
+++ b/client/app/visualizations/chart/index.js
@@ -87,10 +87,12 @@ function ChartEditor(ColorPalette, clientConfig) {
 
       scope.showSizeColumnPicker = () => some(scope.options.seriesOptions, options => options.type === 'bubble');
 
-      scope.options.customCode = `// Available variables are x, ys, element, and Plotly
+      if (scope.options.customCode === undefined) {
+        scope.options.customCode = `// Available variables are x, ys, element, and Plotly
 // Type console.log(x, ys); for more info about x and ys
 // To plot your graph call Plotly.plot(element, ...)
 // Plotly examples and docs: https://plot.ly/javascript/`;
+      }
 
       function refreshColumns() {
         scope.columns = scope.queryResult.getColumns();

From 73466dc0e0757a13e68018bbcc4e0844dce62c0b Mon Sep 17 00:00:00 2001
From: deecay <daiju.kito@gmail.com>
Date: Tue, 11 Jul 2017 15:43:09 +0900
Subject: [PATCH 2/5] Make custom js textarea resizable

---
 client/app/assets/css/superflat_redash.css        | 3 +++
 client/app/visualizations/chart/chart-editor.html | 2 +-
 2 files changed, 4 insertions(+), 1 deletion(-)

diff --git a/client/app/assets/css/superflat_redash.css b/client/app/assets/css/superflat_redash.css
index b30dd11a64..b39b72bf74 100644
--- a/client/app/assets/css/superflat_redash.css
+++ b/client/app/assets/css/superflat_redash.css
@@ -1781,6 +1781,9 @@ fieldset[disabled] .form-control {
 textarea.form-control {
   height: auto;
 }
+textarea.v-resizable {
+  resize: vertical;
+}
 input[type="search"] {
   -webkit-appearance: none;
 }
diff --git a/client/app/visualizations/chart/chart-editor.html b/client/app/visualizations/chart/chart-editor.html
index 80b23a88d5..b2af8a1577 100644
--- a/client/app/visualizations/chart/chart-editor.html
+++ b/client/app/visualizations/chart/chart-editor.html
@@ -134,7 +134,7 @@
 
   <div class="form-group" ng-if="options.globalSeriesType == 'custom'">
     <label class="control-label">Custom code</label>
-    <textarea ng-model="options.customCode" class="form-control" rows="10">
+    <textarea ng-model="options.customCode" class="form-control v-resizable" rows="10">
     </textarea>
   </div>
 

From 605a70d55485bcd7b3592eac15b523e883f65dd7 Mon Sep 17 00:00:00 2001
From: deecay <daiju.kito@gmail.com>
Date: Tue, 11 Jul 2017 17:31:16 +0900
Subject: [PATCH 3/5] Add toggle for automatically updating graph

---
 .../app/visualizations/chart/chart-editor.html   | 16 +++++++++++-----
 client/app/visualizations/chart/plotly.js        |  6 ++++--
 2 files changed, 15 insertions(+), 7 deletions(-)

diff --git a/client/app/visualizations/chart/chart-editor.html b/client/app/visualizations/chart/chart-editor.html
index b2af8a1577..f29f35ac5f 100644
--- a/client/app/visualizations/chart/chart-editor.html
+++ b/client/app/visualizations/chart/chart-editor.html
@@ -139,12 +139,18 @@
   </div>
 
   <div class="checkbox" ng-if="options.globalSeriesType == 'custom'">
-      <label>
-        <input type="checkbox" ng-model="options.enableConsoleLogs">
-        <i class="input-helper"></i> Show errors in the console
-      </label>
-    </div>
+    <label>
+      <input type="checkbox" ng-model="options.enableConsoleLogs">
+      <i class="input-helper"></i> Show errors in the console
+    </label>
+  </div>
 
+  <div class="checkbox" ng-if="options.globalSeriesType == 'custom'">
+    <label>
+      <input type="checkbox" ng-model="options.autoRedraw">
+      <i class="input-helper"></i> Auto update graph
+    </label>
+  </div>
 
   <div ng-show="currentTab == 'xAxis'">
     <div class="form-group">
diff --git a/client/app/visualizations/chart/plotly.js b/client/app/visualizations/chart/plotly.js
index e94e97cf4a..8243d2924c 100644
--- a/client/app/visualizations/chart/plotly.js
+++ b/client/app/visualizations/chart/plotly.js
@@ -514,9 +514,11 @@ const CustomPlotlyChart = (clientConfig) => {
           });
         });
       };
-      scope.$watch('options.customCode', () => {
+      scope.$watch('[options.customCode, options.autoRedraw]', () => {
         try {
-          refresh();
+          if (scope.options.autoRedraw) {
+            refresh();
+          }
         } catch (err) {
           if (scope.options.enableConsoleLogs) {
             // eslint-disable-next-line no-console

From aacc4b7b4624c15e7eea265cc5c5c4089027e544 Mon Sep 17 00:00:00 2001
From: deecay <daiju.kito@gmail.com>
Date: Tue, 11 Jul 2017 17:44:05 +0900
Subject: [PATCH 4/5] Fix: Custom code keeps appending trace per refresh

---
 client/app/visualizations/chart/plotly.js | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/client/app/visualizations/chart/plotly.js b/client/app/visualizations/chart/plotly.js
index 8243d2924c..6049c14fee 100644
--- a/client/app/visualizations/chart/plotly.js
+++ b/client/app/visualizations/chart/plotly.js
@@ -499,6 +499,9 @@ const CustomPlotlyChart = (clientConfig) => {
         return;
       }
       const refresh = () => {
+        // Clear existing data
+        element[0].children[0].calcdata = [];
+        element[0].children[0].data = [];
         // eslint-disable-next-line no-eval
         const codeCall = eval(`codeCall = function(x, ys, element, Plotly){ ${scope.options.customCode} }`);
         codeCall(scope.x, scope.ys, element[0].children[0], Plotly);

From 1a8078ab0345108ef91ca5a17835b3c6816f15ba Mon Sep 17 00:00:00 2001
From: deecay <daiju.kito@gmail.com>
Date: Mon, 31 Jul 2017 19:22:25 +0900
Subject: [PATCH 5/5] Fix: Custom code keeps appending trace per refresh

---
 client/app/visualizations/chart/plotly.js | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/client/app/visualizations/chart/plotly.js b/client/app/visualizations/chart/plotly.js
index 6049c14fee..696c2dbb3b 100644
--- a/client/app/visualizations/chart/plotly.js
+++ b/client/app/visualizations/chart/plotly.js
@@ -499,9 +499,9 @@ const CustomPlotlyChart = (clientConfig) => {
         return;
       }
       const refresh = () => {
-        // Clear existing data
-        element[0].children[0].calcdata = [];
-        element[0].children[0].data = [];
+        // Clear existing data with blank data for succeeding codeCall adds data to existing plot.
+        Plotly.newPlot(element[0].children[0]);
+
         // eslint-disable-next-line no-eval
         const codeCall = eval(`codeCall = function(x, ys, element, Plotly){ ${scope.options.customCode} }`);
         codeCall(scope.x, scope.ys, element[0].children[0], Plotly);