Skip to content

Implement Default 2x Zoom with Cross-Browser Support#919

Open
azayrahmad wants to merge 2 commits into
mainfrom
feature/default-2x-zoom-5517616594155683235
Open

Implement Default 2x Zoom with Cross-Browser Support#919
azayrahmad wants to merge 2 commits into
mainfrom
feature/default-2x-zoom-5517616594155683235

Conversation

@azayrahmad

Copy link
Copy Markdown
Owner

I have implemented a default 2x zoom for the website as requested.

Key changes include:

  1. System-Wide Scaling: The OS now starts with a 2x scale by default. This is handled by a new ScreenManager logic that uses the non-standard but highly effective CSS zoom property where supported (Chrome, Edge, Safari), and a robust transform: scale() fallback for Firefox.
  2. Coordinate Accuracy: To ensure "ctrl-scroll" like behavior, I've updated the window management system (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.
  3. User Control: A new "Scaling" slider has been added to the Display Properties application under the Settings tab, allowing users to adjust the zoom level between 1x and 3x. The setting is persisted in localStorage.
  4. Visual Improvements: The CRT scanlines effect has been moved to the main screen container so it scales naturally with the rest of the UI, maintaining the retro look at higher zoom levels.
  5. Boot Integration: The scaling is applied early in the boot process, ensuring the BIOS-style boot terminal is also correctly sized.

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

- 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>
@google-labs-jules

Copy link
Copy Markdown
Contributor

👋 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 @jules. You can find this option in the Pull Request section of your global Jules UI settings. You can always switch back!

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>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant