Add fullscreen mode with 2x3 button grid and logo-tile exit

developer commented

2026-09-26 11:39:13 +00:00

Collaborator

Closes #23

Что сделано

Кнопка «Fullscreen режим» в настройках. На странице настроек появился чекбокс «Открывать fullscreen режим по умолчанию» (включён по умолчанию, постановка: «должен открываться по умолчанию»). Значение хранится в localStorage (ключ keba-panel-settings, поле defaultFullscreen) — старые сохранённые настройки мигрируют автоматически.

Сам fullscreen:

Приложение стартует в fullscreen: на экране только сетка кнопок. Убрано всё: шапка с логотипом, индикатор связи, кнопки «?» и «Настройки», строка «Маска: 0x…», журнал нажатий и подсказки.
Кнопки POWER, MOVE OUT, MOVE IN, ACK, PU разложены матрицей 2×3 (2 колонки, 3 ряда), растягиваются на весь экран. Клавиатурные нажатия 1–5 и вся логика масок работают как раньше — fullscreen влияет только на отображение.
Шестая кнопка — логотип компании (HH Service, тот же актив, что в шапке/модалке поддержки), визуально того же размера, что остальные кнопки.
Выход: 10 нажатий подряд на кнопку с логотипом (пауза дольше 2 секунд сбрасывает счётчик — защита от случайного выхода при протирке экрана). После 10-го нажатия открывается обычный режим.
В обычном режиме в шапке добавлена кнопка «⛶ Fullscreen режим» для ручного возврата в fullscreen.

Замечание к постановке: «открываться по умолчанию» трактовано как «при загрузке страницы приложение стартует во fullscreen» (а не как браузерный requestFullscreen на весь монитор — это невозможно сделать автоматически без жеста пользователя). Если нужен и браузерный fullscreen — скажите, добавлю кнопку/поведение.

Как проверить

make web-build   # или cd web && npm run dev

Открыть панель — стартует fullscreen: только 6 плиток 2×3.
Зажать/отпустить кнопки — состояние и маски работают, на экране только плитки.
Нажать 10 раз на плитку с логотипом — открывается обычный режим (шапка, маска, журнал).
«⚙ Настройки» → раздел «Fullscreen режим» → снять галочку, перезагрузить страницу — открывается обычный режим; кнопка «⛶ Fullscreen режим» в шапке возвращает fullscreen.

Тесты

npm test — 42/42 зелёные (было 33; +9 на fullscreen: рендер по умолчанию, скрытие лишнего, выход 10 тапами, вход кнопкой, чекбокс настройки, миграция настроек).
npm run build — собирается; npm run lint — без новых предупреждений.
Дополнительно прогнано в реальном браузере (Chrome): сетка 2×3 и равные размеры плиток, счётчик тапов и выход на 10-м нажатии, вход/выход из обычного режима.

Closes #23 ## Что сделано **Кнопка «Fullscreen режим» в настройках.** На странице настроек появился чекбокс «Открывать fullscreen режим по умолчанию» (включён по умолчанию, постановка: «должен открываться по умолчанию»). Значение хранится в `localStorage` (ключ `keba-panel-settings`, поле `defaultFullscreen`) — старые сохранённые настройки мигрируют автоматически. **Сам fullscreen:** - Приложение стартует в fullscreen: на экране только сетка кнопок. Убрано всё: шапка с логотипом, индикатор связи, кнопки «?» и «Настройки», строка «Маска: 0x…», журнал нажатий и подсказки. - Кнопки POWER, MOVE OUT, MOVE IN, ACK, PU разложены матрицей **2×3** (2 колонки, 3 ряда), растягиваются на весь экран. Клавиатурные нажатия 1–5 и вся логика масок работают как раньше — fullscreen влияет только на отображение. - **Шестая кнопка** — логотип компании (HH Service, тот же актив, что в шапке/модалке поддержки), визуально того же размера, что остальные кнопки. - **Выход:** 10 нажатий подряд на кнопку с логотипом (пауза дольше 2 секунд сбрасывает счётчик — защита от случайного выхода при протирке экрана). После 10-го нажатия открывается обычный режим. - В обычном режиме в шапке добавлена кнопка «⛶ Fullscreen режим» для ручного возврата в fullscreen. Замечание к постановке: «открываться по умолчанию» трактовано как «при загрузке страницы приложение стартует во fullscreen» (а не как браузерный `requestFullscreen` на весь монитор — это невозможно сделать автоматически без жеста пользователя). Если нужен и браузерный fullscreen — скажите, добавлю кнопку/поведение. ## Как проверить ```bash make web-build # или cd web && npm run dev ``` - Открыть панель — стартует fullscreen: только 6 плиток 2×3. - Зажать/отпустить кнопки — состояние и маски работают, на экране только плитки. - Нажать 10 раз на плитку с логотипом — открывается обычный режим (шапка, маска, журнал). - «⚙ Настройки» → раздел «Fullscreen режим» → снять галочку, перезагрузить страницу — открывается обычный режим; кнопка «⛶ Fullscreen режим» в шапке возвращает fullscreen. ## Тесты - `npm test` — **42/42** зелёные (было 33; +9 на fullscreen: рендер по умолчанию, скрытие лишнего, выход 10 тапами, вход кнопкой, чекбокс настройки, миграция настроек). - `npm run build` — собирается; `npm run lint` — без новых предупреждений. - Дополнительно прогнано в реальном браузере (Chrome): сетка 2×3 и равные размеры плиток, счётчик тапов и выход на 10-м нажатии, вход/выход из обычного режима.

developer added 2 commits

2026-09-26 11:39:13 +00:00

Add fullscreen mode: settings toggle, 2x3 grid, logo tile exit 9c4af96c63

- 'Fullscreen режим' opens by default (defaultFullscreen setting, on by
  default) and from the header button; only the button grid stays on
  screen — no header, mask display, log or hints (issue #23)
- buttons fill a 2x3 grid; the 6th cell is a company-logo tile of the
  same size that returns to the normal UI after 10 consecutive quick
  taps (counter is ref-based: rapid taps land in one React batch)
- settings page gains a Fullscreen section to toggle the default

Cover fullscreen mode with unit tests b92b5f4990

- App: fullscreen opens by default and hides everything else, 10 taps on
  the logo tile exit, header button enters fullscreen; mask-related tests
  seed localStorage with defaultFullscreen=false
- SettingsPage: four groups incl. the new Fullscreen checkbox
- settings/useSettings: defaultFullscreen default, normalization and
  persistence coverage

developer referenced this pull request

2026-09-26 11:39:25 +00:00

Добавить fullscreen режим работы #23

forgejo-admin commented

2026-09-26 11:41:02 +00:00

Owner

Добавь скрины, как это выглядит

fs_light.png

86 KiB

fs_pressed.png

94 KiB

normal_mode.png

87 KiB

developer commented

2026-09-26 11:49:04 +00:00

Author

Collaborator

Скриншоты (1280×800):

Fullscreen при старте: только матрица 2×3 — пять кнопок панели + шестая плитка с логотипом того же размера. Шапки, масок, журнала нет.

Зажатая POWER подсвечивается фирменным акцентом, остальной fullscreen не меняется.

Обычный режим после 10 нажатий на плитку с логотипом: шапка, маска, журнал и кнопка «⛶ Fullscreen режим» для возврата.

Скриншоты (1280×800): ![fullscreen по умолчанию](http://10.10.1.7:3000/attachments/e606c5c8-2b49-4f17-b142-98cec383cdd5) *Fullscreen при старте: только матрица 2×3 — пять кнопок панели + шестая плитка с логотипом того же размера. Шапки, масок, журнала нет.* ![нажатая POWER](http://10.10.1.7:3000/attachments/7e386764-5b97-431f-8703-af125551ae06) *Зажатая POWER подсвечивается фирменным акцентом, остальной fullscreen не меняется.* ![обычный режим](http://10.10.1.7:3000/attachments/a2842426-29e8-46fd-8313-407f6f10870d) *Обычный режим после 10 нажатий на плитку с логотипом: шапка, маска, журнал и кнопка «⛶ Fullscreen режим» для возврата.*

forgejo-admin merged commit 1fad0d273d into main

2026-09-26 11:50:44 +00:00

forgejo-admin referenced this pull request from a commit

2026-09-26 11:50:46 +00:00

Merge pull request 'Add fullscreen mode with 2x3 button grid and logo-tile exit' (#24) from feature/23_fullscreen_mode into main

forgejo-admin deleted branch feature/23_fullscreen_mode

2026-09-26 11:50:52 +00:00

developer referenced this pull request from a commit

2026-09-26 11:58:24 +00:00

Merge main into feature/9_dynamic_button_labels

developer referenced this pull request

2026-09-26 11:58:36 +00:00

Add dynamic button labels via ui_config.json and /api/config #12

developer commented

2026-09-26 12:02:04 +00:00

Author

Collaborator

Закрыто: PR смержен, скриншоты приложены выше (fullscreen по умолчанию, зажатая POWER, обычный режим после 10 нажатий на плитку с логотипом). Спасибо за ревью!

Rows
Columns

Add fullscreen mode with 2x3 button grid and logo-tile exit #24

Что сделано

Как проверить

Тесты