From 7921d9301554c456e4321466bc970000949486e9 Mon Sep 17 00:00:00 2001
From: Yang Qi <60582494+YangQi007@users.noreply.github.com>
Date: Wed, 13 Nov 2024 17:27:07 -0700
Subject: [PATCH 1/2] Reset back the color when bam file changes

---
 index.html | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/index.html b/index.html
index 2138d7e..9629712 100644
--- a/index.html
+++ b/index.html
@@ -389,16 +389,18 @@ <h1 id="home-button" data-link="/">bam2.iobio</h1>
 
       const broker_ = getDataBroker(broker);
       broker_.addEventListener('mapped-reads-from-index-file', (event) => {
+        const chart = document.querySelector('#mapped-reads-chart');
         // Determine the number of mapped reads and unmapped reads from the index file
         if (event.detail.mappedReads && event.detail.unmappedReads) {
           const val = event.detail.mappedReads;
           const total = event.detail.mappedReads + event.detail.unmappedReads;
           const data = [ val, total - val ];
-
-          const chart = document.querySelector('#mapped-reads-chart');
           chart.update(data);
           chart.style.setProperty('--iobio-data-color', 'rgb(9,176,135)');
           chart.style.setProperty('--iobio-data-color-secondary', 'rgba(9,176,135,0.5)');
+        } else {
+          chart.style.setProperty('--iobio-data-color', '#2d8fc1');
+          chart.style.setProperty('--iobio-data-color-secondary', 'rgba(45,143,193,0.2)');
         }
       });
     </script>

From b34a97ce31f43bc3934a5f3c5737ddb9e6a04ac3 Mon Sep 17 00:00:00 2001
From: Yang Qi <60582494+YangQi007@users.noreply.github.com>
Date: Fri, 15 Nov 2024 13:59:00 -0700
Subject: [PATCH 2/2] Unset the custom color

---
 index.html | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/index.html b/index.html
index 9629712..3267fa4 100644
--- a/index.html
+++ b/index.html
@@ -399,8 +399,8 @@ <h1 id="home-button" data-link="/">bam2.iobio</h1>
           chart.style.setProperty('--iobio-data-color', 'rgb(9,176,135)');
           chart.style.setProperty('--iobio-data-color-secondary', 'rgba(9,176,135,0.5)');
         } else {
-          chart.style.setProperty('--iobio-data-color', '#2d8fc1');
-          chart.style.setProperty('--iobio-data-color-secondary', 'rgba(45,143,193,0.2)');
+          chart.style.setProperty('--iobio-data-color', 'unset');
+          chart.style.setProperty('--iobio-data-color-secondary', 'unset');
         }
       });
     </script>