Add wake lock to prevent screen sleep on mobile
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
10
dashcam.html
10
dashcam.html
@@ -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');
|
||||||
|
|||||||
@@ -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>
|
||||||
|
|||||||
Reference in New Issue
Block a user