Fire HD 8 tablet mode: auto-detect Silk UA, optimised layout + touch targets

This commit is contained in:
2026-06-19 16:17:48 +00:00
parent ab1aa16ac8
commit 52ddee3e78
2 changed files with 182 additions and 18 deletions
+26 -18
View File
@@ -1755,49 +1755,57 @@ document.addEventListener('keydown', function(e) {
}
});
// ── KIOSK MODE ───────────────────────────────────────────────────────────────────────
// ── FIRE HD 8 TABLET DETECTION ────────────────────────────────────────────────────────
const IS_SILK = /Silk\//i.test(navigator.userAgent);
const IS_FIRE = /KFTT|KFOT|KFJWI|KFSOWI|KFTHWI|KFTHWA|KFAPWI|KFAPWA|KFARWI|KFASWI|KFMEWI|KFFOWI|KFSAWA|KFMAWI|KFGIWI|KFDOWI|KFTBWI|KFTRWI|KFKAWI/i.test(navigator.userAgent);
function isTablet() { return IS_SILK || IS_FIRE; }
function applyTabletMode() {
document.body.classList.add("tablet-mode");
const kb = document.getElementById("kioskBtn");
if (kb) kb.title = "Full-screen kiosk (Fire HD 8 layout active)";
}
if (isTablet()) applyTabletMode();
// ── KIOSK MODE ────────────────────────────────────────────────────────────────────────
let _wakeLock = null;
async function toggleKiosk() {
const btn = document.getElementById("kioskBtn");
const btn = document.getElementById("kioskBtn");
const isFs = !!(document.fullscreenElement || document.webkitFullscreenElement);
if (!isFs) {
const el = document.documentElement;
applyTabletMode();
const el = document.documentElement;
const req = el.requestFullscreen || el.webkitRequestFullscreen || el.mozRequestFullScreen || el.msRequestFullscreen;
if (req) req.call(el).catch(() => {});
// Screen Wake Lock — keeps tablet display on
if ("wakeLock" in navigator) {
try { _wakeLock = await navigator.wakeLock.request("screen"); } catch(e) {}
}
if (btn) { btn.textContent = " EXIT"; btn.style.color = "var(--cyan)"; }
if (btn) { btn.textContent = " EXIT"; btn.style.color = "var(--cyan)"; }
} else {
const ex = document.exitFullscreen || document.webkitExitFullscreen || document.mozCancelFullScreen || document.msExitFullscreen;
if (ex) ex.call(document).catch(() => {});
if (_wakeLock) { _wakeLock.release().catch(() => {}); _wakeLock = null; }
if (btn) { btn.textContent = " KIOSK"; btn.style.color = ""; }
if (btn) { btn.textContent = " KIOSK"; btn.style.color = ""; }
if (!isTablet()) document.body.classList.remove("tablet-mode");
}
}
// Re-acquire wake lock if released by system (e.g. tab switch)
document.addEventListener("visibilitychange", async () => {
if (_wakeLock && document.visibilityState === "visible") {
try { _wakeLock = await navigator.wakeLock.request("screen"); } catch(e) {}
}
});
// Sync button label when fullscreen is exited via Esc key
document.addEventListener("fullscreenchange", () => {
function _onFsChange() {
const btn = document.getElementById("kioskBtn");
if (!document.fullscreenElement && !document.webkitFullscreenElement) {
if (_wakeLock) { _wakeLock.release().catch(() => {}); _wakeLock = null; }
if (btn) { btn.textContent = " KIOSK"; btn.style.color = ""; }
if (btn) { btn.textContent = " KIOSK"; btn.style.color = ""; }
if (!isTablet()) document.body.classList.remove("tablet-mode");
}
});
document.addEventListener("webkitfullscreenchange", () => {
const btn = document.getElementById("kioskBtn");
if (!document.webkitFullscreenElement && !document.fullscreenElement) {
if (_wakeLock) { _wakeLock.release().catch(() => {}); _wakeLock = null; }
if (btn) { btn.textContent = "⛶ KIOSK"; btn.style.color = ""; }
}
});
}
document.addEventListener("fullscreenchange", _onFsChange);
document.addEventListener("webkitfullscreenchange", _onFsChange);