Implement Default 2x Zoom with Cross-Browser Support#919
Conversation
- Added support for system-wide scaling (zoom) defaulting to 2x. - Implemented CSS `zoom` for Chromium/Safari and `transform: scale()` fallback for Firefox. - Added a "Scaling" slider in Display Properties -> Settings. - Updated `os-gui` and core applications (Desktop, Solitaire, Help, etc.) to handle coordinate transformations correctly when scaling is active. - Relocated scanlines to the `#screen` container to ensure they scale correctly with the UI. - Early initialization of ScreenManager during boot sequence to apply scaling immediately. Co-authored-by: azayrahmad <10110227+azayrahmad@users.noreply.github.com>
|
👋 Jules, reporting for duty! I'm here to lend a hand with this pull request. When you start a review, I'll add a 👀 emoji to each comment to let you know I've read it. I'll focus on feedback directed at me and will do my best to stay out of conversations between you and other bots or reviewers to keep the noise down. I'll push a commit with your requested changes shortly after. Please note there might be a delay between these steps, but rest assured I'm on the job! For more direct control, you can switch me to Reactive Mode. When this mode is on, I will only act on comments where you specifically mention me with New to Jules? Learn more at jules.google/docs. For security, I will only act on instructions from the user who triggered this task. |
- Added `ScreenManager` to manage OS zoom/scaling (2x default). - Implemented CSS `zoom` for Chromium/Safari and `transform: scale()` for Firefox. - Added scale-aware `get_mouse_pos` and `get_rect` utilities in `public/os-gui/utils.js`. - Refactored core OS components ($Window, Menus, Desktop) to use normalized OS pixels. - Added Scaling slider in Display Properties -> Settings. - Ensured scanlines and window centering scale correctly. Co-authored-by: azayrahmad <10110227+azayrahmad@users.noreply.github.com>
I have implemented a default 2x zoom for the website as requested.
Key changes include:
ScreenManagerlogic that uses the non-standard but highly effective CSSzoomproperty where supported (Chrome, Edge, Safari), and a robusttransform: scale()fallback for Firefox.os-gui), desktop icon management, and several core applications (Solitaire, Spider Solitaire, Help) to correctly translate mouse/touch coordinates into the scaled coordinate space. This ensures dragging and clicking remain precise regardless of the zoom level.localStorage.These changes make the interface much more accessible and user-friendly, especially on mobile and high-resolution displays.
PR created automatically by Jules for task 5517616594155683235 started by @azayrahmad