package.json

@@ -15,7 +15,8 @@
     "webpack-cli": "^4.7.2"
   },
   "dependencies": {
-    "chart.js": "^4.4.0",
+    "cash-dom": "^8.1.5",
+    "chart.js": "^4.3.0",
     "chartjs-adapter-dayjs-3": "^1.2.3",
     "css-minimizer-webpack-plugin": "^5.0.0",
     "dayjs": "^1.11.7"

src/index.js

@@ -9,6 +9,7 @@ import {
     Title,
     Tooltip
 } from 'chart.js';
+import $ from 'cash-dom';
 import 'chartjs-adapter-dayjs-3';
 import "./style.css"
 
@@ -194,7 +195,7 @@ async function pullChartData() {
 }
 
 function formatToken() {
-    document.getElementById("token").innerText = currentPriceHash[currentRegionSelection].toLocaleString();
+    $("#token").html(currentPriceHash[currentRegionSelection].toLocaleString());
 }
 
 // TODO: These maybe able to be collapsed into a single function with params or a lambda
@@ -292,21 +293,7 @@ function toolTipMouseOut() {
     tooltip.innerHTML = "Copy to clipboard";
 }
 
-function registerEventHandles() {
+$(document).ready(function() {
-    registerCopyHandlers();
-    registerOptionHandlers();
-}
-
-function registerCopyHandlers() {
-    document.getElementById('copyURLButton').addEventListener('click', function (event) {
-        copyURL();
-    })
-    document.getElementById('copyURLButton').addEventListener('mouseout', function (event) {
-        toolTipMouseOut();
-    })
-}
-
-function registerOptionHandlers() {
     document.getElementById('region').addEventListener('change', function() {
         updateRegionPreference(this.value);
     });
@@ -318,13 +305,15 @@ function registerOptionHandlers() {
     document.getElementById('aggregate').addEventListener('change', function () {
         updateAggregatePreference(this.value);
     })
+    document.getElementById('copyURLButton').addEventListener('click', function (event) {
+        copyURL();
+    })
+    document.getElementById('copyURLButton').addEventListener('mouseout', function (event) {
+        toolTipMouseOut();
+    })
     currentAggregateSelection = document.getElementById('aggregate').value;
-}
-
-document.addEventListener('DOMContentLoaded', function () {
-    registerEventHandles();
     detectURLQuery();
     Promise.all([callUpdateURL(), pullChartData()]).then(populateChart)
     setInterval(callUpdateURL, 60*1000);
-}, false);
+});