Show only the game view in fullscreen, in the editor and the link (#267)
game-maker / gate (push) Successful in 4m10s
game-maker / suite (push) Failing after 11m53s

A game is easier to judge and to play without the editor around it.
The Game tab and the game link now both have a button that puts the
game view itself into fullscreen, not just the browser window.

- The Game tab header has a fullscreen button on the right. It hides
  toolbar, panels, tab headers and console and keeps the zoom from the
  picker. A running game keeps running.
- A corner button at the top right, or Esc, leaves fullscreen and puts
  the view back into the tab where it was.
- The game link shows the same corner button. Over a running game it
  hides after 2 s without mouse movement and returns on the next move.
- A click on the corner button never reaches the game.
- Stop ends fullscreen. Stop switches back to the Scene tab, and any
  switch away from the Game tab ends fullscreen, so no empty screen is
  left behind.
- src/viewport/fullscreen.ts wraps the Fullscreen API and holds the
  rule for when the button shows. FullscreenCorner.ts is the button
  used by both pages. Two SVG icons are new.
- Editor.showGameFullscreen moves the GameViewport into the root while
  fullscreen is on.

Tests:
- ./check.sh: 195 files, 2815 tests, exit 0 (3 new unit tests).
- e2e 60: 2 new checks for the corner button on the game link.
- e2e 61 (new): 4 checks for fullscreen in the editor.
- Full e2e run (local): ALL PASSED, 1580 checks.
- Counter-checks fail as expected: rule without "no game running",
  no stopPropagation (60h), no end on tab switch (61c), no reparenting
  of the view (61a).

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
adminandClaude Opus 5.5 committed 2026-09-29 14:44:14 +02:00
1 parent 24d360aeec
commit cab1c0177f
17 files changed
+356 -8

No files matched your search

+3 -1
View File
@@ -3,7 +3,9 @@
* come from whatever font the system has, so they are SVG files like every other icon.
*/
import current from './icons/current.svg?raw';
import fullscreenExit from './icons/fullscreen-exit.svg?raw';
import fullscreen from './icons/fullscreen.svg?raw';
import ticked from './icons/ticked.svg?raw';
import unticked from './icons/unticked.svg?raw';
export const UI_ICON_SVG = { current, ticked, unticked };
export const UI_ICON_SVG = { current, fullscreen, fullscreenExit, ticked, unticked };
+6
View File
@@ -0,0 +1,6 @@
<svg xmlns="http://www.w3.org/2000/svg" id="fullscreen-exit" viewBox="-8 -8 16 16" width="16" height="16">
<path d="M-6 -2 L-2 -2 L-2 -6" fill="none" stroke="currentColor" stroke-width="1.5" />
<path d="M2 -6 L2 -2 L6 -2" fill="none" stroke="currentColor" stroke-width="1.5" />
<path d="M6 2 L2 2 L2 6" fill="none" stroke="currentColor" stroke-width="1.5" />
<path d="M-2 6 L-2 2 L-6 2" fill="none" stroke="currentColor" stroke-width="1.5" />
</svg>

After

Width:  |  Height:  |  Size: 458 B

+6
View File
@@ -0,0 +1,6 @@
<svg xmlns="http://www.w3.org/2000/svg" id="fullscreen" viewBox="-8 -8 16 16" width="16" height="16">
<path d="M-6 -2 L-6 -6 L-2 -6" fill="none" stroke="currentColor" stroke-width="1.5" />
<path d="M2 -6 L6 -6 L6 -2" fill="none" stroke="currentColor" stroke-width="1.5" />
<path d="M6 2 L6 6 L2 6" fill="none" stroke="currentColor" stroke-width="1.5" />
<path d="M-2 6 L-6 6 L-6 2" fill="none" stroke="currentColor" stroke-width="1.5" />
</svg>

After

Width:  |  Height:  |  Size: 453 B