Skip to content

Improve fullscreen mode in remote viewer - #9

Merged
Undermozes merged 2 commits into
masterfrom
copilot/introduce-fullscreen-mode
Mar 11, 2026
Merged

Undermozes merged 2 commits into
masterfrom
copilot/introduce-fullscreen-mode

Conversation

Copilot AI commented Mar 11, 2026 •

Copy link
Copy Markdown

The viewer's fullscreen button had broken state sync (button stayed toggled after pressing Escape) and no keyboard shortcut. This adds proper fullscreen lifecycle handling and UX polish.

Changes

  • fullscreenchange handler: Syncs button state when fullscreen exits via Escape or any external trigger — previously the button remained "toggled" permanently after Escape
  • F11 keyboard shortcut: Intercepts F11 locally before it's forwarded to the remote machine, toggling fullscreen the way users expect
  • Dynamic icon + tooltip: Button icon swaps between fa-window-maximize (enter) and fa-compress (exit); title text updates accordingly
  • Auto-collapse menu on fullscreen enter: Closes the menu bar when entering fullscreen to maximize the remote desktop viewport
document.addEventListener("fullscreenchange", () => {
    if (document.fullscreenElement) {
        FullScreenButton.classList.add("toggled");
        FullScreenButton.title = "Exit fullscreen mode.";
        const icon = FullScreenButton.querySelector("i");
        if (icon) icon.className = "fas fa-compress";
        MenuFrame.classList.remove("open");
        MenuButton.classList.remove("open");
    } else {
        FullScreenButton.classList.remove("toggled");
        FullScreenButton.title = "Enter fullscreen mode.";
        const icon = FullScreenButton.querySelector("i");
        if (icon) icon.className = "fas fa-window-maximize";
    }
});

Both the TypeScript source and compiled JavaScript are updated (the project commits both).


Please read the following. Do not delete below this line.

Thank you for your contribution to the Remotely project. It is required that contributors assign copyright to Immense Networks so we retain full ownership of the project.

This makes it easier for other entities to use the software because they only have to deal with one copyright holder. It also gives me assurance that we'll be able to make decisions in the future without gathering and consulting all contributors.

While this may seem odd, many open source maintainers practice this. Here are a couple well-known examples:

A nice article on the topic can be found here: https://haacked.com/archive/2006/01/26/WhoOwnstheCopyrightforAnOpenSourceProject.aspx/

By submitting this PR, you agree to the following:

You hereby assign copyright in this PR's code to the Remotely project and its copyright holder, Immense Networks, to be licensed under the same terms as the rest of the code. You agree to relinquish any and all copyright interest in the software, to the detriment of your heirs and successors.


🔒 GitHub Advanced Security automatically protects Copilot coding agent pull requests. You can protect all pull requests by enabling Advanced Security for your repositories. Learn more about Advanced Security.

…ler, icon/title updates, auto-hide menu

Co-authored-by: Undermozes <58026189+Undermozes@users.noreply.github.com>
Copilot AI changed the title [WIP] Add fullscreen mode to viewer Improve fullscreen mode in remote viewer Mar 11, 2026
@Undermozes
Undermozes marked this pull request as ready for review March 11, 2026 20:58
@Undermozes
Undermozes merged commit fabeca5 into master Mar 11, 2026
1 check passed
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.

2 participants