From 4f2346b28e6194e594ff8d439f6b63f790d06d22 Mon Sep 17 00:00:00 2001
From: Jon <git@jonstarkey.co.uk>
Date: Fri, 12 Jun 2026 16:55:20 +0100
Subject: [PATCH] Add wake lock to prevent screen sleep on mobile

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 dashcam.html     | 10 +++++++++-
 speedometer.html | 27 ++++++++++++++++++---------
 2 files changed, 27 insertions(+), 10 deletions(-)

diff --git a/dashcam.html b/dashcam.html
index 82f5cb0..583b0ae 100644
--- a/dashcam.html
+++ b/dashcam.html
@@ -400,7 +400,15 @@ function toggleUnit() {
   document.getElementById('big-speed-unit').textContent=unit;
 }
 
-window.addEventListener('DOMContentLoaded', () => startDashcam());
+let wakeLock = null;
+async function requestWakeLock() {
+  try { wakeLock = await navigator.wakeLock.request('screen'); } catch(e) {}
+}
+document.addEventListener('visibilitychange', () => {
+  if (document.visibilityState === 'visible') requestWakeLock();
+});
+
+window.addEventListener('DOMContentLoaded', () => { startDashcam(); requestWakeLock(); });
 
 function toggleFullscreen() {
   const app=document.getElementById('app'), btn=document.getElementById('fs-btn');
diff --git a/speedometer.html b/speedometer.html
index 01ce1c7..0818901 100644
--- a/speedometer.html
+++ b/speedometer.html
@@ -20,7 +20,7 @@
     }
 
     #speed-val {
-      font-size: clamp(80px, 22vw, 160px);
+      font-size: clamp(100px, 22vh, 240px);
       font-weight: 700;
       color: #fff;
       line-height: 1;
@@ -28,37 +28,37 @@
     }
 
     #speed-unit {
-      font-size: clamp(14px, 3vw, 22px);
+      font-size: clamp(16px, 4vh, 36px);
       color: #aaa;
       letter-spacing: 3px;
-      margin-top: 8px;
+      margin-top: clamp(6px, 1vh, 12px);
       text-align: center;
     }
 
     #gps-info {
-      margin-top: 28px;
+      margin-top: clamp(20px, 4vh, 48px);
       text-align: center;
       display: flex;
       flex-direction: column;
-      gap: 8px;
+      gap: clamp(8px, 1.5vh, 18px);
     }
 
     .data-row {
       display: flex;
-      gap: 24px;
+      gap: clamp(16px, 5vw, 36px);
       justify-content: center;
       flex-wrap: wrap;
     }
 
     .di {
-      font-size: clamp(11px, 2vw, 15px);
+      font-size: clamp(13px, 2.4vh, 24px);
       color: #ccc;
       display: flex;
-      gap: 6px;
+      gap: clamp(4px, 0.8vh, 8px);
       align-items: center;
     }
 
-    .dl { color: #555; font-size: clamp(9px, 1.5vw, 12px); letter-spacing: 0.5px; }
+    .dl { color: #555; font-size: clamp(10px, 1.8vh, 18px); letter-spacing: 0.5px; }
     .dv { color: #fff; font-weight: 500; }
 
     #gps-dot {
@@ -230,6 +230,15 @@
   setInterval(updateClock, 1000);
   updateClock();
   startGPS();
+
+  let wakeLock = null;
+  async function requestWakeLock() {
+    try { wakeLock = await navigator.wakeLock.request('screen'); } catch(e) {}
+  }
+  document.addEventListener('visibilitychange', () => {
+    if (document.visibilityState === 'visible') requestWakeLock();
+  });
+  requestWakeLock();
 </script>
 </body>
 </html>