Add wake lock to prevent screen sleep on mobile

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Jon
2026-06-12 16:55:20 +01:00
parent 3abd43bdfe
commit 4f2346b28e
2 changed files with 27 additions and 10 deletions

View File

@@ -400,7 +400,15 @@ function toggleUnit() {
document.getElementById('big-speed-unit').textContent=unit; 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() { function toggleFullscreen() {
const app=document.getElementById('app'), btn=document.getElementById('fs-btn'); const app=document.getElementById('app'), btn=document.getElementById('fs-btn');

View File

@@ -20,7 +20,7 @@
} }
#speed-val { #speed-val {
font-size: clamp(80px, 22vw, 160px); font-size: clamp(100px, 22vh, 240px);
font-weight: 700; font-weight: 700;
color: #fff; color: #fff;
line-height: 1; line-height: 1;
@@ -28,37 +28,37 @@
} }
#speed-unit { #speed-unit {
font-size: clamp(14px, 3vw, 22px); font-size: clamp(16px, 4vh, 36px);
color: #aaa; color: #aaa;
letter-spacing: 3px; letter-spacing: 3px;
margin-top: 8px; margin-top: clamp(6px, 1vh, 12px);
text-align: center; text-align: center;
} }
#gps-info { #gps-info {
margin-top: 28px; margin-top: clamp(20px, 4vh, 48px);
text-align: center; text-align: center;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: 8px; gap: clamp(8px, 1.5vh, 18px);
} }
.data-row { .data-row {
display: flex; display: flex;
gap: 24px; gap: clamp(16px, 5vw, 36px);
justify-content: center; justify-content: center;
flex-wrap: wrap; flex-wrap: wrap;
} }
.di { .di {
font-size: clamp(11px, 2vw, 15px); font-size: clamp(13px, 2.4vh, 24px);
color: #ccc; color: #ccc;
display: flex; display: flex;
gap: 6px; gap: clamp(4px, 0.8vh, 8px);
align-items: center; 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; } .dv { color: #fff; font-weight: 500; }
#gps-dot { #gps-dot {
@@ -230,6 +230,15 @@
setInterval(updateClock, 1000); setInterval(updateClock, 1000);
updateClock(); updateClock();
startGPS(); 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> </script>
</body> </body>
</html> </html>