mirror of
https://github.com/netbymatt/ws4kp.git
synced 2026-04-21 11:09:30 -07:00
Add comprehensive responsive scanline scaling system with anti-aliasing
- Attempt pixel-perfect scanline rendering for scaled displays and zoom scenarios - Implement dynamic scanline thickness calculation to prevent sub-pixel rendering issues - Add enhanced kiosk detection via isKioskLike for better fullscreen optimization - Optimize scanlines for specific kiosk resolutions (1024x768, 1023x767) - Add responsive SCSS media queries for different display densities - Include extensive debugging utilities for scanline troubleshooting - Improve noSleep error handling with proper promise rejection handling - Update to modern fullscreen API method names - Add async/await error handling for fullscreen requests - Trigger resize after fullscreen engagement to apply optimal scaling
This commit is contained in:
@@ -89,6 +89,7 @@ const init = () => {
|
||||
const query = parsedParameters.latLonQuery ?? localStorage.getItem('latLonQuery');
|
||||
const latLon = parsedParameters.latLon ?? localStorage.getItem('latLon');
|
||||
const fromGPS = localStorage.getItem('latLonFromGPS') && !loadFromParsed;
|
||||
|
||||
if (query && latLon && !fromGPS) {
|
||||
const txtAddress = document.querySelector(TXT_ADDRESS_SELECTOR);
|
||||
txtAddress.value = query;
|
||||
@@ -171,16 +172,29 @@ const btnFullScreenClick = () => {
|
||||
return false;
|
||||
};
|
||||
|
||||
const enterFullScreen = () => {
|
||||
// This is async because modern browsers return a Promise from requestFullscreen
|
||||
const enterFullScreen = async () => {
|
||||
const element = document.querySelector('#divTwc');
|
||||
|
||||
// Supports most browsers and their versions.
|
||||
const requestMethod = element.requestFullScreen || element.webkitRequestFullScreen
|
||||
|| element.mozRequestFullScreen || element.msRequestFullscreen;
|
||||
const requestMethod = element.requestFullscreen || element.webkitRequestFullscreen
|
||||
|| element.mozRequestFullscreen || element.msRequestFullscreen;
|
||||
|
||||
if (requestMethod) {
|
||||
// Native full screen.
|
||||
requestMethod.call(element, { navigationUI: 'hide' });
|
||||
try {
|
||||
// Native full screen with options for optimal display
|
||||
await requestMethod.call(element, {
|
||||
navigationUI: 'hide',
|
||||
allowsInlineMediaPlayback: true,
|
||||
});
|
||||
|
||||
// Allow a moment for fullscreen to engage, then optimize
|
||||
setTimeout(() => {
|
||||
resize();
|
||||
}, 100);
|
||||
} catch (error) {
|
||||
console.error('❌ Fullscreen request failed:', error);
|
||||
}
|
||||
} else {
|
||||
// iOS doesn't support FullScreen API.
|
||||
window.scrollTo(0, 0);
|
||||
@@ -202,8 +216,8 @@ const exitFullscreen = () => {
|
||||
document.exitFullscreen();
|
||||
} else if (document.webkitExitFullscreen) {
|
||||
document.webkitExitFullscreen();
|
||||
} else if (document.mozCancelFullScreen) {
|
||||
document.mozCancelFullScreen();
|
||||
} else if (document.mozCancelFullscreen) {
|
||||
document.mozCancelFullscreen();
|
||||
} else if (document.msExitFullscreen) {
|
||||
document.msExitFullscreen();
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user