add more data and make it clickable

WantClue · Aug 29, 2024 · 87d1ae5 · 87d1ae5
1 parent 0e4b652
commit 87d1ae5
Show file tree

Hide file tree

Showing 4 changed files with 68 additions and 19 deletions.
diff --git a/background.js b/background.js
@@ -1,20 +1,30 @@
-async function fetchHashRate(ip) {
+async function fetchData(ip) {
     try {
         const response = await fetch(`http://${ip}/api/system/info`, { timeout: 1000 });
         if (response.ok) {
             const data = await response.json();
+            const result = { ip };
+
             if (data.hashRate_1h !== undefined) {
-                chrome.runtime.sendMessage({
-                    type: 'partialResult', 
-                    data: { ip, hashRate: data.hashRate_1h }
-                });
-                return { ip, hashRate: data.hashRate_1h };
+                result.hashRate = data.hashRate_1h;
             } else if (data.hashRate !== undefined) {
+                result.hashRate = data.hashRate;
+            }
+
+            if (data.temp !== undefined) {
+                result.temp = data.temp;
+            }
+
+            if (data.power !== undefined) {
+                result.power = data.power;
+            }
+
+            if (Object.keys(result).length > 1) {  // More than just IP
                 chrome.runtime.sendMessage({
                     type: 'partialResult', 
-                    data: { ip, hashRate: data.hashRate }
+                    data: result
                 });
-                return { ip, hashRate: data.hashRate };
+                return result;
             }
         }
     } catch (error) {
@@ -29,7 +39,7 @@ async function scanNetwork(baseAddress) {
 
     for (let i = 1; i <= 255; i++) {
         const ip = `${baseAddress}${i}`;
-        promises.push(fetchHashRate(ip));
+        promises.push(fetchData(ip));
     }
 
     const responses = await Promise.all(promises);

diff --git a/manifest.json b/manifest.json
@@ -2,15 +2,16 @@
     "manifest_version": 3,
     "name": "Bitaxe Viewer",
     "short_name": "Bitaxe Viewer",
-    "version": "1.0",
+    "version": "1.2",
     "description": "Scans the network for Bitaxe devices and retrieves their values.",
     "action": {
         "default_icon": "img/mining.png",
         "default_title": "Bitaxe Viewer",
         "default_popup": "popup.html"
     },
     "permissions": [
-        "storage"
+        "storage",
+        "tabs"
     ],
     "host_permissions": [
         "http://*/api/system/info"

diff --git a/popup.js b/popup.js
@@ -3,6 +3,10 @@ function formatHashRate(hashRate) {
     return hashRate.toFixed(2) + ' GH/s';
 }
 
+function formatPower(power) {
+    if(power >= 1e0) return (power / 1e0).toFixed(2);
+}
+
 function getLocalIPAddress(callback) {
     const pc = new RTCPeerConnection({ iceServers: [{ urls: 'stun:stun.l.google.com:19302' }] });
     pc.createDataChannel("");
@@ -40,16 +44,30 @@ function displayResults(results) {
     } else {
         // Use a Set to keep track of unique IPs
         const uniqueIPs = new Set();
-        
+
         results.forEach(result => {
             if (!uniqueIPs.has(result.ip)) {
                 uniqueIPs.add(result.ip);
                 const resultElement = document.createElement('div');
                 resultElement.className = 'result-item';
-                resultElement.innerHTML = `
-                    <span class="ip">IP: ${result.ip}</span>
-                    <span class="hash-rate">HashRate: ${formatHashRate(result.hashRate)}</span>
-                `;
+                let innerHTML = `<span class="ip">IP: ${result.ip}</span>`;
+
+                if (result.hashRate !== undefined) {
+                    innerHTML += `<span class="hash-rate">HashRate: ${formatHashRate(result.hashRate)}</span>`;
+                }
+                if (result.temp !== undefined) {
+                    innerHTML += `<span class="temp">Temp: ${result.temp}°C</span>`;
+                }
+                if (result.power !== undefined) {
+                    innerHTML += `<span class="power">Power: ${formatPower(result.power)}W</span>`;
+                }
+
+                resultElement.innerHTML = innerHTML;
+                resultElement.style.cursor = 'pointer';
+                resultElement.title = 'Click to open device interface';
+                resultElement.addEventListener('click', () => {
+                    chrome.tabs.create({ url: `http://${result.ip}` });
+                });
                 resultsDiv.appendChild(resultElement);
             }
         });
@@ -65,7 +83,9 @@ async function refreshStoredData(storedEndpoints) {
                 const data = await response.json();
                 refreshedResults.push({
                     ip: endpoint.ip,
-                    hashRate: data.hashRate_1h !== undefined ? data.hashRate_1h : data.hashRate
+                    hashRate: data.hashRate_1h !== undefined ? data.hashRate_1h : data.hashRate,
+                    temp: data.temp,
+                    power: data.power
                 });
             }
         } catch (error) {
@@ -143,7 +163,7 @@ document.addEventListener('DOMContentLoaded', function () {
             const existingIndex = currentResults.findIndex(item => item.ip === message.data.ip);
             if (existingIndex !== -1) {
                 // Update existing entry
-                currentResults[existingIndex] = message.data;
+                currentResults[existingIndex] = {...currentResults[existingIndex], ...message.data};
             } else {
                 // Add new entry
                 currentResults.push(message.data);

diff --git a/styles.css b/styles.css
@@ -105,15 +105,33 @@ h1 {
     border-radius: 5px;
 }
 
+.result-item:hover {
+    background-color: #40444b;
+}
+
 .result-item .ip {
     font-weight: bold;
     color: #ffffff;
     display: block;
     margin-bottom: 5px;
 }
 
+.result-item:hover .ip {
+    color: #d62a2a;
+}
+
 .result-item .hash-rate {
-    color: #43b581;
+    color: #27e9a8;
+    display: block;
+}
+
+.result-item .temp {
+    color: #ff9800; 
+    display: block;
+}
+
+.result-item .power {
+    color: #28d345;
     display: block;
 }