first commit

2025-11-15 18:01:18 -05:00
commit d9fc362e34
5 changed files with 223 additions and 0 deletions
@@ -0,0 +1,68 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
+  <title>Fan Speed Control</title>
+  <style>
+    body { font-family: Arial; text-align: center; padding: 2rem; background: #f4f4f4; }
+    .btn { 
+      font-size: 1.5rem; padding: 1rem 1.5rem; margin: 0.5rem;
+      background: #007bff; color: white; border: none; border-radius: 8px;
+      cursor: pointer; width: 80px;
+    }
+    .btn:hover { background: #0056b3; }
+    .btn.stop { background: #dc3545; }
+    .btn.stop:hover { background: #b02a37; }
+    .btn.full { background: #28a745; }
+    .btn.full:hover { background: #218838; }
+    #status { margin-top: 1rem; font-size: 1.2rem; color: #333; }
+    .keys { margin-top: 2rem; font-size: 1rem; color: #666; }
+  </style>
+</head>
+<body>
+  <h1>Fan Speed Control</h1>
+  <p>Click buttons or press keys: <strong>0–9, f, s</strong></p>
+
+  <div>
+    <button class="btn stop"   onclick="send('s')">S<br>Stop</button>
+    <button class="btn"        onclick="send('1')">1<br>~11%</button>
+    <button class="btn"        onclick="send('2')">2<br>~20%</button>
+    <button class="btn"        onclick="send('3')">3<br>~30%</button>
+    <button class="btn"        onclick="send('4')">4<br>~40%</button>
+    <button class="btn"        onclick="send('5')">5<br>50%</button>
+    <button class="btn"        onclick="send('6')">6<br>~60%</button>
+    <button class="btn"        onclick="send('7')">7<br>~70%</button>
+    <button class="btn"        onclick="send('8')">8<br>~80%</button>
+    <button class="btn"        onclick="send('9')">9<br>~90%</button>
+    <button class="btn full"   onclick="send('f')">F<br>Full</button>
+  </div>
+
+  <div id="status">Ready. Press keys or click buttons.</div>
+  <div class="keys">Keyboard: 0–9, f = full, s = stop</div>
+
+  <script>
+    function send(key) {
+      fetch(`/cmd/${key}`)
+        .then(r => r.json())
+        .then(data => {
+          if (data.status === 'ok') {
+            document.getElementById('status').textContent = `Sent: ${key.toUpperCase()} → Fan updated`;
+          }
+        })
+        .catch(() => {
+          document.getElementById('status').textContent = 'Error: Is Arduino connected?';
+        });
+    }
+
+    // Keyboard control
+    document.addEventListener('keydown', (e) => {
+      const k = e.key.toLowerCase();
+      if ('0123456789fs'.includes(k)) {
+        e.preventDefault();
+        send(k);
+      }
+    });
+  </script>
+</body>
+</html>