From 80be9103b87029f221b2620b1c504ee3d644f47f Mon Sep 17 00:00:00 2001
From: Corey Bergeron <coreybergeron1@gmail.com>
Date: Mon, 19 Oct 2020 23:09:12 -0400
Subject: [PATCH] added toggle account chart lines

---
 public/index.html       |  4 ++++
 public/js/account.js    |  4 ++++
 public/js/userconfig.js | 36 +++++++++++++++++++++++++++++++++++-
 3 files changed, 43 insertions(+), 1 deletion(-)

diff --git a/public/index.html b/public/index.html
index 67f7f1485..9e83ed2e7 100644
--- a/public/index.html
+++ b/public/index.html
@@ -2905,6 +2905,10 @@
                 <i class="fas fa-bullseye"></i>
                 Toggle Accuracy
               </div>
+              <div class="toggleChartStyle button">
+                <i class="fas fa-chart-line"></i>
+                Toggle Chart Style
+              </div>
             </div>
             <div class="group dailyActivityChart">
               <div class="chart" style="height: 200px;">
diff --git a/public/js/account.js b/public/js/account.js
index bcede7b5a..63285f299 100644
--- a/public/js/account.js
+++ b/public/js/account.js
@@ -2507,6 +2507,10 @@ $(".pageAccount .toggleAccuracyOnChart").click((params) => {
   toggleChartAccuracy();
 });
 
+$(".pageAccount .toggleChartStyle").click((params) => {
+  toggleChartStyle();
+});
+
 $(document).on("click", ".pageAccount .group.history #resultEditTags", (f) => {
   if (dbSnapshot.tags.length > 0) {
     let resultid = $(f.target).parents("span").attr("resultid");
diff --git a/public/js/userconfig.js b/public/js/userconfig.js
index 1883e3db1..a57e50beb 100644
--- a/public/js/userconfig.js
+++ b/public/js/userconfig.js
@@ -62,7 +62,8 @@ let defaultConfig = {
   paceCaret: "off",
   paceCaretCustomSpeed: 100,
   pageWidth: "100",
-  chartAccuracy: true
+  chartAccuracy: true,
+  chartStyle: "line"
 };
 
 let cookieConfig = null;
@@ -205,6 +206,7 @@ function applyConfig(configObj) {
     setPaceCaretCustomSpeed(configObj.paceCaretCustomSpeed, true);
     setPageWidth(configObj.pageWidth, true);
     setChartAccuracy(configObj.chartAccuracy, true);
+    setChartStyle(configObj.chartStyle, true);
 
     config.startGraphsAtZero = configObj.startGraphsAtZero;
     // if (
@@ -316,6 +318,19 @@ function updateChartAccuracy() {
   resultHistoryChart.update();
 }
 
+function updateChartStyle() {
+  if (config.chartStyle == "scatter") {
+    resultHistoryChart.data.datasets[0].showLine = false;
+    resultHistoryChart.data.datasets[1].showLine = false;
+
+  } else {
+    resultHistoryChart.data.datasets[0].showLine = true;
+    resultHistoryChart.data.datasets[1].showLine = true;
+
+  }
+  resultHistoryChart.update();
+}
+
 function toggleChartAccuracy() {
   if (config.chartAccuracy) {
     config.chartAccuracy = false;
@@ -335,6 +350,25 @@ function setChartAccuracy(chartAccuracy, nosave) {
   if (!nosave) saveConfigToCookie();
 }
 
+function toggleChartStyle() {
+  if (config.chartStyle == "scatter") {
+    config.chartStyle = "line";
+  } else {
+    config.chartStyle = "scatter";
+  }
+  updateChartStyle();
+  saveConfigToCookie();
+}
+
+function setChartStyle(chartStyle, nosave) {
+  if (chartStyle == undefined) {
+    chartStyle = "line";
+  }
+  config.chartStyle = chartStyle;
+  updateChartStyle();
+  if (!nosave) saveConfigToCookie();
+}
+
 //read ahead mode
 // function toggleReadAheadMode() {
 //   config.readAheadMode = !config.readAheadMode;