Replace inline onclick handlers with addEventListener for CSP compliance (#142)

CSP header 'script-src-attr: none' blocks inline event handlers on
the production site, making range buttons non-functional. Move click
handling to the external JS files using addEventListener on
data-range attributes.

Author: TaprootFreak

src/assets/monitoring-btc.html

@@ -85,9 +85,9 @@ <h1>lightning.space - BTC Monitoring</h1>
   <div class="section">
     <h2>BTC Balance History</h2>
     <div class="range-buttons">
-      <button class="active" onclick="loadChart('24h')">24h</button>
-      <button onclick="loadChart('7d')">7d</button>
-      <button onclick="loadChart('30d')">30d</button>
+      <button class="active" data-range="24h">24h</button>
+      <button data-range="7d">7d</button>
+      <button data-range="30d">30d</button>
     </div>
     <div class="chart-container">
       <canvas id="btcChart"></canvas>

src/assets/monitoring-btc.js

@@ -200,3 +200,10 @@ function renderChart(points) {
 
 loadData();
 loadChart('24h');
+
+var rangeButtons = document.querySelectorAll('.range-buttons button[data-range]');
+for (var i = 0; i < rangeButtons.length; i++) {
+  rangeButtons[i].addEventListener('click', function () {
+    loadChart(this.getAttribute('data-range'));
+  });
+}

src/assets/monitoring-usd.html

@@ -85,9 +85,9 @@ <h1>lightning.space - USD Monitoring</h1>
   <div class="section">
     <h2>USD Balance History</h2>
     <div class="range-buttons">
-      <button class="active" onclick="loadChart('24h')">24h</button>
-      <button onclick="loadChart('7d')">7d</button>
-      <button onclick="loadChart('30d')">30d</button>
+      <button class="active" data-range="24h">24h</button>
+      <button data-range="7d">7d</button>
+      <button data-range="30d">30d</button>
     </div>
     <div class="chart-container">
       <canvas id="usdChart"></canvas>

src/assets/monitoring-usd.js

@@ -162,3 +162,10 @@ function renderChart(points) {
 
 loadData();
 loadChart('24h');
+
+var rangeButtons = document.querySelectorAll('.range-buttons button[data-range]');
+for (var i = 0; i < rangeButtons.length; i++) {
+  rangeButtons[i].addEventListener('click', function () {
+    loadChart(this.getAttribute('data-range'));
+  });
+}