From 5b8d0e08bc3a5dfc99dd20ae07754e69cca4c862 Mon Sep 17 00:00:00 2001
From: Sam <samual.shop@proton.me>
Date: Tue, 6 Aug 2024 12:03:42 +0100
Subject: [PATCH] Modify js charts to use standard js

---
 static/js/bitcoin-price.js      | 22 ++++++++++++++++------
 static/js/chart-params.js       |  2 +-
 static/js/feerate-percentile.js | 21 +++++++++++++++------
 static/js/hashrate.js           | 21 +++++++++++++++------
 static/js/miner-rewards.js      | 21 +++++++++++++++------
 5 files changed, 62 insertions(+), 25 deletions(-)

diff --git a/static/js/bitcoin-price.js b/static/js/bitcoin-price.js
index 13886cb..e437bee 100644
--- a/static/js/bitcoin-price.js
+++ b/static/js/bitcoin-price.js
@@ -1,13 +1,21 @@
 let dataArr = [];
 const myChart = echarts.init(document.getElementById("chart"));
 
-$.get("https://api.bitlab21.com/price", {}, (response) => {
-  dataArr = response;
-  console.log(dataArr);
-  initEchart();
-});
+async function fetchDataForChart() {
+  try {
+    const apiEndpoint = "https://api.bitlab21.com/price";
+    const response = await fetch(apiEndpoint);
+    if (!response.ok) {
+      throw new Error(`HTTP error! status: ${response.status}`);
+    }
+    const dataArr = await response.json();
+    initEchart(dataArr);
+  } catch (error) {
+    console.error("Fetching data failed:", error);
+  }
+}
 
-function initEchart() {
+function initEchart(dataArr) {
   const option = {
     backgroundColor: backgroundColor,
     tooltip: {
@@ -56,3 +64,5 @@ function initEchart() {
 
   myChart.setOption(option);
 }
+
+fetchDataForChart();
diff --git a/static/js/chart-params.js b/static/js/chart-params.js
index 82481e0..5ed8368 100644
--- a/static/js/chart-params.js
+++ b/static/js/chart-params.js
@@ -97,7 +97,7 @@ function nFormatter(value, digits) {
     : "0";
 }
 
-$(window).on("resize", function () {
+window.addEventListener("resize", function () {
   if (myChart != null && myChart != undefined) {
     myChart.resize();
   }
diff --git a/static/js/feerate-percentile.js b/static/js/feerate-percentile.js
index 73ba8ad..e3a9dd9 100644
--- a/static/js/feerate-percentile.js
+++ b/static/js/feerate-percentile.js
@@ -1,13 +1,21 @@
 let dataArr = [];
 const myChart = echarts.init(document.getElementById("chart"));
 
-$.get("https://api.bitlab21.com/feerates", {}, (response) => {
-  dataArr = response;
-  console.log(dataArr);
-  initEchart();
-});
+async function fetchDataForChart() {
+  try {
+    const apiEndpoint = "https://api.bitlab21.com/feerates";
+    const response = await fetch(apiEndpoint);
+    if (!response.ok) {
+      throw new Error(`HTTP error! status: ${response.status}`);
+    }
+    const dataArr = await response.json();
+    initEchart(dataArr);
+  } catch (error) {
+    console.error("Fetching data failed:", error);
+  }
+}
 
-function initEchart() {
+function initEchart(dataArr) {
   const option = {
     backgroundColor: backgroundColor,
     tooltip: {
@@ -99,3 +107,4 @@ function initEchart() {
 
   myChart.setOption(option);
 }
+fetchDataForChart();
diff --git a/static/js/hashrate.js b/static/js/hashrate.js
index 9482456..3f90066 100644
--- a/static/js/hashrate.js
+++ b/static/js/hashrate.js
@@ -1,13 +1,21 @@
 let dataArr = [];
 const myChart = echarts.init(document.getElementById("chart"));
 
-$.get("https://api.bitlab21.com/hashrate", {}, (response) => {
-  dataArr = response;
-  console.log(dataArr);
-  initEchart();
-});
+async function fetchDataForChart() {
+  try {
+    const apiEndpoint = "https://api.bitlab21.com/hashrate";
+    const response = await fetch(apiEndpoint);
+    if (!response.ok) {
+      throw new Error(`HTTP error! status: ${response.status}`);
+    }
+    const dataArr = await response.json();
+    initEchart(dataArr);
+  } catch (error) {
+    console.error("Fetching data failed:", error);
+  }
+}
 
-function initEchart() {
+function initEchart(dataArr) {
   const option = {
     backgroundColor: backgroundColor,
     tooltip: {
@@ -106,3 +114,4 @@ function initEchart() {
 
   myChart.setOption(option);
 }
+fetchDataForChart();
diff --git a/static/js/miner-rewards.js b/static/js/miner-rewards.js
index 1a5c4d3..a2a2afc 100644
--- a/static/js/miner-rewards.js
+++ b/static/js/miner-rewards.js
@@ -1,13 +1,21 @@
 let dataArr = [];
 const myChart = echarts.init(document.getElementById("chart"));
 
-$.get("https://api.bitlab21.com/miner_rewards", {}, (response) => {
-  dataArr = response;
-  console.log(dataArr);
-  initEchart();
-});
+async function fetchDataForChart() {
+  try {
+    const apiEndpoint = "https://api.bitlab21.com/miner_rewards";
+    const response = await fetch(apiEndpoint);
+    if (!response.ok) {
+      throw new Error(`HTTP error! status: ${response.status}`);
+    }
+    const dataArr = await response.json();
+    initEchart(dataArr);
+  } catch (error) {
+    console.error("Fetching data failed:", error);
+  }
+}
 
-function initEchart() {
+function initEchart(dataArr) {
   const option = {
     backgroundColor: backgroundColor,
     tooltip: {
@@ -138,3 +146,4 @@ checkboxLog.addEventListener("change", (e) => {
     dataZoom: dataZoom((start = isChecked ? 0 : 90)),
   });
 });
+fetchDataForChart();