From a1a31f6a95b7de1a9e5f69ec40b084d6e76afd6e Mon Sep 17 00:00:00 2001
From: rhansolo <robinh@andrew.cmu.edu>
Date: Tue, 28 Jul 2020 17:28:32 -0400
Subject: [PATCH] fixed switching to 7-day trend bug

---
 src/components/Legend.svelte | 44 ++++++++++++++++++------------------
 src/components/MapBox.svelte | 12 ++++++++--
 2 files changed, 32 insertions(+), 24 deletions(-)

diff --git a/src/components/Legend.svelte b/src/components/Legend.svelte
index 5495eeb51..71ab9036a 100644
--- a/src/components/Legend.svelte
+++ b/src/components/Legend.svelte
@@ -410,28 +410,28 @@
       </div>
     </div>
   </div>
-  {#if $encoding === 'color'}
-    {#if $signalType === 'direction'}
-      <div class="trend-legend-grouping">
-        <ul class="legend-labels">
-          <li>
-            <div class="color-block" style="background-color: {DIRECTION_THEME.increasing}" />
-            {@html DIRECTION_THEME.increasingIcon}
-            Increasing
-          </li>
-          <li>
-            <div class="color-block" style="background-color: {DIRECTION_THEME.steady}" />
-            {@html DIRECTION_THEME.steadyIcon}
-            Steady
-          </li>
-          <li>
-            <div class="color-block" style="background-color: {DIRECTION_THEME.decreasing}" />
-            {@html DIRECTION_THEME.decreasingIcon}
-            Decreasing
-          </li>
-        </ul>
-      </div>
-    {:else if isCountSignal($currentSensor)}
+  {#if $signalType === 'direction'}
+    <div class="trend-legend-grouping">
+      <ul class="legend-labels">
+        <li>
+          <div class="color-block" style="background-color: {DIRECTION_THEME.increasing}" />
+          {@html DIRECTION_THEME.increasingIcon}
+          Increasing
+        </li>
+        <li>
+          <div class="color-block" style="background-color: {DIRECTION_THEME.steady}" />
+          {@html DIRECTION_THEME.steadyIcon}
+          Steady
+        </li>
+        <li>
+          <div class="color-block" style="background-color: {DIRECTION_THEME.decreasing}" />
+          {@html DIRECTION_THEME.decreasingIcon}
+          Decreasing
+        </li>
+      </ul>
+    </div>
+  {:else if $encoding === 'color'}
+    {#if isCountSignal($currentSensor)}
       <div class="legend-grouping">
         <ul class="legend-labels">
           {#each labels as [label1, label2]}
diff --git a/src/components/MapBox.svelte b/src/components/MapBox.svelte
index 071e6d0a9..1128e2a8c 100644
--- a/src/components/MapBox.svelte
+++ b/src/components/MapBox.svelte
@@ -547,7 +547,11 @@
       hideAll([SPIKE_LAYER, outline(SPIKE_LAYER), highlight(SPIKE_LAYER), highlight(outline(SPIKE_LAYER))]);
 
       // show bubble layers
-      showAll([BUBBLE_LAYER, highlight(BUBBLE_LAYER)]);
+      if ($signalType === 'direction') {
+        hideAll([BUBBLE_LAYER, highlight(BUBBLE_LAYER)]);
+      } else {
+        showAll([BUBBLE_LAYER, highlight(BUBBLE_LAYER)]);
+      }
 
       // color scale (color + stroke color)
       let flatStops = stops.flat();
@@ -584,7 +588,11 @@
       map.setPaintProperty($currentLevel, 'fill-color', MAP_THEME.countyFill);
       hideAll([BUBBLE_LAYER, highlight(BUBBLE_LAYER)]);
 
-      showAll([SPIKE_LAYER, outline(SPIKE_LAYER), highlight(SPIKE_LAYER), highlight(outline(SPIKE_LAYER))]);
+      if ($signalType === 'direction') {
+        hideAll([SPIKE_LAYER, outline(SPIKE_LAYER), highlight(SPIKE_LAYER), highlight(outline(SPIKE_LAYER))]);
+      } else {
+        showAll([SPIKE_LAYER, outline(SPIKE_LAYER), highlight(SPIKE_LAYER), highlight(outline(SPIKE_LAYER))]);
+      }
 
       const valueMax = valueMinMax[1],
         maxHeight = ENCODING_SPIKE_THEME.maxHeight[$currentLevel],