From 093d5bbafd868550751445de1cf98025d28a7522 Mon Sep 17 00:00:00 2001
From: Miodec <bartnikjack@gmail.com>
Date: Sun, 28 Mar 2021 02:45:26 +0100
Subject: [PATCH] added mini result chart module. #495

---
 gulpfile.js                   |  1 +
 src/js/account.js             | 65 +++--------------------------------
 src/js/global-dependencies.js |  1 +
 src/js/mini-result-chart.js   | 57 ++++++++++++++++++++++++++++++
 4 files changed, 64 insertions(+), 60 deletions(-)
 create mode 100644 src/js/mini-result-chart.js

diff --git a/gulpfile.js b/gulpfile.js
index 417f2c1db..75198e202 100644
--- a/gulpfile.js
+++ b/gulpfile.js
@@ -133,6 +133,7 @@ const refactoredSrc = [
   "./src/js/custom-mode2-popup.js",
   "./src/js/test/test-config.js",
   "./src/js/loader.js",
+  "./src/js/mini-result-chart.js",
 ];
 
 //legacy files
diff --git a/src/js/account.js b/src/js/account.js
index f48c45d6b..96f6fe44a 100644
--- a/src/js/account.js
+++ b/src/js/account.js
@@ -477,73 +477,18 @@ function getAccountDataAndInit() {
     });
 }
 
-function updateMiniResultChart(filteredId) {
-  let data = filteredResults[filteredId].chartData;
-  let labels = [];
-  for (let i = 1; i <= data.wpm.length; i++) {
-    labels.push(i.toString());
-  }
-  ChartController.miniResult.data.labels = labels;
-  ChartController.miniResult.data.datasets[0].data = data.wpm;
-  ChartController.miniResult.data.datasets[1].data = data.raw;
-  ChartController.miniResult.data.datasets[2].data = data.err;
-
-  ChartController.miniResult.updateColors();
-
-  let maxChartVal = Math.max(...[Math.max(...data.wpm), Math.max(...data.raw)]);
-  let minChartVal = Math.min(...[Math.min(...data.wpm), Math.min(...data.raw)]);
-  ChartController.miniResult.options.scales.yAxes[0].ticks.max = Math.round(
-    maxChartVal
-  );
-  ChartController.miniResult.options.scales.yAxes[1].ticks.max = Math.round(
-    maxChartVal
-  );
-
-  if (!Config.startGraphsAtZero) {
-    ChartController.miniResult.options.scales.yAxes[0].ticks.min = Math.round(
-      minChartVal
-    );
-    ChartController.miniResult.options.scales.yAxes[1].ticks.min = Math.round(
-      minChartVal
-    );
-  } else {
-    ChartController.miniResult.options.scales.yAxes[0].ticks.min = 0;
-    ChartController.miniResult.options.scales.yAxes[1].ticks.min = 0;
-  }
-
-  ChartController.miniResult.update({ duration: 0 });
-}
-
-function showMiniResultChart() {
-  $(".pageAccount .miniResultChartWrapper").stop(true, true).fadeIn(125);
-  $(".pageAccount .miniResultChartBg").stop(true, true).fadeIn(125);
-}
-
-function hideMiniResultChart() {
-  $(".pageAccount .miniResultChartWrapper").stop(true, true).fadeOut(125);
-  $(".pageAccount .miniResultChartBg").stop(true, true).fadeOut(125);
-}
-
-function updateMiniResultChartPosition(x, y) {
-  $(".pageAccount .miniResultChartWrapper").css({ top: y, left: x });
-}
-
 $(document).on("click", ".pageAccount .miniResultChartButton", (event) => {
   console.log("updating");
-  let filterid = $(event.currentTarget).attr("filteredResultsId");
-  if (filterid === undefined) return;
-  updateMiniResultChart(filterid);
-  showMiniResultChart();
-  updateMiniResultChartPosition(
+  let filteredId = $(event.currentTarget).attr("filteredResultsId");
+  if (filteredId === undefined) return;
+  MiniResultChart.updateData(filteredResults[filteredId].chartData);
+  MiniResultChart.show();
+  MiniResultChart.updatePosition(
     event.pageX - $(".pageAccount .miniResultChartWrapper").outerWidth(),
     event.pageY + 30
   );
 });
 
-$(document).on("click", ".pageAccount .miniResultChartBg", (event) => {
-  hideMiniResultChart();
-});
-
 Misc.getLanguageList().then((languages) => {
   languages.forEach((language) => {
     $(
diff --git a/src/js/global-dependencies.js b/src/js/global-dependencies.js
index 1b1e14e67..4133224ac 100644
--- a/src/js/global-dependencies.js
+++ b/src/js/global-dependencies.js
@@ -51,3 +51,4 @@ import * as ChallengeController from "./challenge-controller";
 import * as CustomMode2Popup from "./custom-mode2-popup";
 import * as TestConfig from "./test-config";
 import * as Loader from "./loader";
+import * as MiniResultChart from "./mini-result-chart";
diff --git a/src/js/mini-result-chart.js b/src/js/mini-result-chart.js
new file mode 100644
index 000000000..9887a8ad0
--- /dev/null
+++ b/src/js/mini-result-chart.js
@@ -0,0 +1,57 @@
+import * as ChartController from "./chart-controller";
+import Config from "./config";
+
+export function updatePosition(x, y) {
+  $(".pageAccount .miniResultChartWrapper").css({ top: y, left: x });
+}
+
+export function show() {
+  $(".pageAccount .miniResultChartWrapper").stop(true, true).fadeIn(125);
+  $(".pageAccount .miniResultChartBg").stop(true, true).fadeIn(125);
+}
+
+function hide() {
+  $(".pageAccount .miniResultChartWrapper").stop(true, true).fadeOut(125);
+  $(".pageAccount .miniResultChartBg").stop(true, true).fadeOut(125);
+}
+
+export function updateData(data) {
+  // let data = filteredResults[filteredId].chartData;
+  let labels = [];
+  for (let i = 1; i <= data.wpm.length; i++) {
+    labels.push(i.toString());
+  }
+  ChartController.miniResult.data.labels = labels;
+  ChartController.miniResult.data.datasets[0].data = data.wpm;
+  ChartController.miniResult.data.datasets[1].data = data.raw;
+  ChartController.miniResult.data.datasets[2].data = data.err;
+
+  ChartController.miniResult.updateColors();
+
+  let maxChartVal = Math.max(...[Math.max(...data.wpm), Math.max(...data.raw)]);
+  let minChartVal = Math.min(...[Math.min(...data.wpm), Math.min(...data.raw)]);
+  ChartController.miniResult.options.scales.yAxes[0].ticks.max = Math.round(
+    maxChartVal
+  );
+  ChartController.miniResult.options.scales.yAxes[1].ticks.max = Math.round(
+    maxChartVal
+  );
+
+  if (!Config.startGraphsAtZero) {
+    ChartController.miniResult.options.scales.yAxes[0].ticks.min = Math.round(
+      minChartVal
+    );
+    ChartController.miniResult.options.scales.yAxes[1].ticks.min = Math.round(
+      minChartVal
+    );
+  } else {
+    ChartController.miniResult.options.scales.yAxes[0].ticks.min = 0;
+    ChartController.miniResult.options.scales.yAxes[1].ticks.min = 0;
+  }
+
+  ChartController.miniResult.update({ duration: 0 });
+}
+
+$(document).on("click", ".pageAccount .miniResultChartBg", (event) => {
+  hide();
+});