From d0331720b4064335d6787c991fd4e716a7d58fa0 Mon Sep 17 00:00:00 2001
From: Sam El-Husseini <16690124+samelhusseini@users.noreply.github.com>
Date: Fri, 13 Apr 2018 15:52:38 -0700
Subject: [PATCH] Fix slider gradient bug when loading components from a
 previous sim run. (#514)

---
 sim/visuals/controls/colorWheel.ts     | 8 ++------
 sim/visuals/controls/distanceSlider.ts | 8 ++------
 2 files changed, 4 insertions(+), 12 deletions(-)

diff --git a/sim/visuals/controls/colorWheel.ts b/sim/visuals/controls/colorWheel.ts
index f7c56c68..7748e7e2 100644
--- a/sim/visuals/controls/colorWheel.ts
+++ b/sim/visuals/controls/colorWheel.ts
@@ -54,7 +54,8 @@ namespace pxsim.visuals {
             this.group = svg.elt("g") as SVGGElement;
 
             let gc = "gradient-color-" + this.getPort();
-            this.colorGradient = svg.linearGradient(globalDefs, gc, false);
+            const prevColorGradient = globalDefs.querySelector(`#${gc}`) as SVGLinearGradientElement;
+            this.colorGradient = prevColorGradient ? prevColorGradient : svg.linearGradient(globalDefs, gc, false);
             svg.setGradientValue(this.colorGradient, "50%");
             svg.setGradientColors(this.colorGradient, "black", "yellow");
 
@@ -99,10 +100,5 @@ namespace pxsim.visuals {
 
             return this.group;
         }
-
-        public dispose() {
-            if (this.colorGradient) this.colorGradient.parentElement.removeChild(this.colorGradient);
-            super.dispose();
-        }
     }
 }
\ No newline at end of file
diff --git a/sim/visuals/controls/distanceSlider.ts b/sim/visuals/controls/distanceSlider.ts
index 6265cca6..dc81513e 100644
--- a/sim/visuals/controls/distanceSlider.ts
+++ b/sim/visuals/controls/distanceSlider.ts
@@ -15,7 +15,8 @@ namespace pxsim.visuals {
         getInnerView(parent: SVGSVGElement, globalDefs: SVGDefsElement) {
             let gid = "gradient-slider-" + this.getPort();
             this.group = svg.elt("g") as SVGGElement;
-            this.gradient = createGradient(gid, this.getGradientDefinition());
+            const prevGradient = globalDefs.querySelector(`#${gid}`) as SVGLinearGradientElement;
+            this.gradient = prevGradient ? prevGradient : createGradient(gid, this.getGradientDefinition());
             this.gradient.setAttribute('x1', '0%');
             this.gradient.setAttribute('y1', '0%');
             this.gradient.setAttribute('x2', '0%');
@@ -74,11 +75,6 @@ namespace pxsim.visuals {
             return this.group;
         }
 
-        public dispose() {
-            if (this.gradient) this.gradient.parentElement.removeChild(this.gradient);
-            super.dispose();
-        }
-
         getInnerHeight() {
             return 192;
         }