b-dev-mobile
131 lines
9.5 KiB
Markdown
131 lines
9.5 KiB
Markdown
# Карта приложений (forbion.f7cloud.ru)
|
||
|
||
Рабочая карта UI каждого приложения на боевом forbion — **источник, по которому фич-роли
|
||
сверяют и строят нативный мобильный клиент**. Составляется наблюдением живого сервера
|
||
(аккаунт `cloude`), **строго read-only** — ничего не создавать/не менять/не удалять, почту
|
||
не отправлять (см. mail/073).
|
||
|
||
> ‼️ **ТОЛЬКО МОБИЛЬНАЯ ВЕРСИЯ САЙТА.** Карта строится по мобильной вёрстке forbion (узкий
|
||
> вьюпорт ~390–420px: браузер в device-режиме, реальный телефон или эмулятор), НЕ по
|
||
> десктопной — они принципиально разные, наш клиент повторяет мобильную. Признак мобильной
|
||
> версии: снизу плавающая панель + шторка приложений по «трём полоскам» (как в `_mobile-*.css`),
|
||
> а не десктопный сайдбар. Десктопный layout в карте недопустим.
|
||
|
||
## Источники кода (стили + кнопки окон)
|
||
На боевом forbion приложения стоят **скомпилированными** — читаемого `src/` там нет (кроме
|
||
`f7mail`). Поэтому «в коде найти стили и кнопки» = три локальных источника (прод-SSH для этого
|
||
не нужен):
|
||
|
||
1. **Стили + карта элементов окна** — тема forbion, локально:
|
||
`/root/claude/design-reference/forbion-theme/` (мобильные `css/pages/pages-mobile/_mobile-*.css`
|
||
и `css/pages/app-<app>/`). Селекторы в этих CSS **перечисляют каждую кнопку/элемент окна**
|
||
(тема их адресует для стилизации) — это и есть стили + список элементов по окнам.
|
||
2. **Читаемые компоненты (реальные кнопки/меню/обработчики)** — апстрим-исходник под ТОЧНУЮ
|
||
версию, установленную на forbion:
|
||
|
||
| Приложение | Репозиторий / источник | Версия на forbion |
|
||
|---|---|---|
|
||
| files | nextcloud/server → `apps/files/src` | 2.4.0 (или тема+web) |
|
||
| mail | **локально `design-reference/forbion-apps/f7mail/src`** (форк F7) + nextcloud/mail | f7mail 0.2.3 / mail 5.7.15 |
|
||
| calendar | nextcloud/calendar | v6.4.0 |
|
||
| contacts | nextcloud/contacts | v8.3.10 |
|
||
| deck | nextcloud/deck | v1.16.4 |
|
||
| notes | nextcloud/notes | v5.0.0 |
|
||
| notifications | nextcloud/notifications | 5.0.0-dev.0 (ближайший тег/master) |
|
||
| tasks | nextcloud/tasks | v0.17.1 |
|
||
| talk (conf) | форк F7 `vendor/talk-android` + nextcloud/spreed | v22.0.12 |
|
||
|
||
Рецепт (свой app+версия): `git clone --depth 1 --branch <тег> --filter=blob:none \
|
||
https://github.com/nextcloud/<repo>.git`, читать `src/` (`*.vue`).
|
||
3. **Иконки/шаблоны/скомпилированный css** всех приложений — локально
|
||
`/root/claude/design-reference/forbion-apps/<app>/` (снято с forbion read-only).
|
||
|
||
Связка: тема (мобильные стили + селекторы окна) ↔ апстрим `src` (какая кнопка что делает) ↔
|
||
живой мобильный web (как это выглядит) → полная карта.
|
||
|
||
## Где что лежит
|
||
Одна карта на приложение: `docs/app-map/<module>.md`. Владелец карты = фич-роль модуля.
|
||
Коммитит в свой файл автором `b-mob-<x>`, обычным ритуалом (`git pull --rebase` → правка).
|
||
|
||
| Файл | Роль | Приложение |
|
||
|---|---|---|
|
||
| `shell.md` | b-dev-mobile | Оболочка: нижняя панель, шторка приложений, бургер |
|
||
| `files.md` | b-mob-files | Файлы |
|
||
| `mail.md` | b-mob-mail | Почта (вход `cloude@forbion.ru`) |
|
||
| `talk.md` | b-mob-conf | Конференции |
|
||
| `tasks.md` | b-mob-tasks | Задачи |
|
||
| `notes.md` | b-mob-notes | Заметки |
|
||
| `notifications.md` | b-mob-notify | Уведомления (лента) |
|
||
| `deck.md` | b-mob-deck | Карточки |
|
||
| `calendar.md` | b-mob-calendar | Календарь |
|
||
| `contacts.md` | b-mob-contacts | Контакты |
|
||
|
||
## Формат (единый для всех)
|
||
|
||
Карта — это **дерево переходов**: экран → его кнопки/пункты → куда каждая ведёт → экран с
|
||
кнопками, и так вглубь. Для каждого экрана:
|
||
|
||
```markdown
|
||
# Карта: <Приложение>
|
||
|
||
## Вход
|
||
Как попадаем: нижняя панель / шторка / пункт меню — что именно нажать.
|
||
|
||
## Экран: <Название экрана>
|
||
**Шапка:** <кнопка → действие/экран>, <кнопка → …>
|
||
**Тело:** что показывается (список/сетка/форма/пусто-состояние).
|
||
**Действия:**
|
||
- «<Кнопка/пункт>» → <что делает: открывает экран X / диалог Y / выполняет действие Z>
|
||
- (если ведёт в подэкран — раскрыть его тем же блоком: Шапка/Тело/Действия)
|
||
- «<⋯ / long-press / контекстное меню>» → пункты: «A» → …, «B» → …
|
||
- «<+ / FAB / создать>» → форма «<Название>»: поля <перечислить>, кнопки <Сохранить/Отмена>
|
||
|
||
## Экран: <Следующий>
|
||
…
|
||
```
|
||
|
||
Правила:
|
||
- Пиши ЧТО видит пользователь и КУДА ведёт — без реализации/CSS-классов.
|
||
- Каждую кнопку/иконку — отдельной строкой с назначением. Если назначение неочевидно —
|
||
пометь `(?)` и опиши гипотезу.
|
||
- Модалки/шиты/выпадающие меню — тоже экраны, раскрывай их.
|
||
- Отмечай, где мобильная веб-версия отличается от того, что уже есть в нативном клиенте
|
||
(`расхождение:` …) — это сразу твой бэклог на добивку.
|
||
- Пустые состояния и состояния ошибки — фиксируй (это отдельные экраны в дизайне).
|
||
|
||
Готовую карту используем как чек-лист: сверка вёрстки и функционала нативного экрана идёт
|
||
по этому дереву.
|
||
|
||
## Diff-списки и метрика ≤2% (программа 1:1, mail/081, mail/083)
|
||
|
||
После карты — по каждому приложению `docs/app-map/<app>.diff.md`: список расхождений веб↔натив.
|
||
Функционал и дизайн считаем РАЗДЕЛЬНО, каждая ≥98%.
|
||
|
||
Каждый пункт: `[Ф|Д]` (функционал/дизайн) · `[open|done|n-a]` (n-a = осознанно
|
||
мобильно-неприменимо, в знаменатель не входит, но остаётся в финальном списке).
|
||
|
||
На экран:
|
||
- `Ff = 1 − open-Ф / всего-Ф` (Ф = все действия/функции окна в вебе),
|
||
- `Fd = 1 − open-Д / всего-Д` (Д по элементам: композиция, порядок, размеры/отступы, цвет,
|
||
типографика, иконки).
|
||
|
||
По приложению `Ff_app`/`Fd_app` = среднее по экранам (до 0.1%). Цель: обе ≥98%. Итерации сверки
|
||
повторяем до порога; в конце — `Ff% / Fd%` + остаточный список (open + n-a с обоснованием).
|
||
|
||
Шапку diff начинайте счётчиком, например:
|
||
```
|
||
# Diff: <Приложение> — итерация N (ГГГГ-ММ-ДД)
|
||
Ff: 96.4% (5 open Ф / 138) · Fd: 98.1% (3 open Д / 160) · n-a: 4
|
||
```
|
||
|
||
## Медиа-просмотрщики (нативно, mail/083)
|
||
Открытие медиа — нативным слоем (зона b-mob-files): Coil (изображения/gif/svg), Media3/ExoPlayer
|
||
(видео/аудио, стрим по WebDAV через media3-datasource-okhttp + Basic-auth), PdfRenderer (PDF),
|
||
Collabora (офис — есть). Роутинг по типу в `FilesViewModel.openItem`.
|
||
|
||
## Всплывающее меню — обязательно поимённо (mail/087)
|
||
В каждом приложении всплывающее меню СВОЁ (контекстное «⋯»/overflow, «+»/FAB, long-press,
|
||
выпадающие селекторы). Раскрывай КАЖДОЕ отдельным блоком с полным списком пунктов по порядку;
|
||
в diff — построчная сверка веб↔натив (состав/порядок/иконка/подменю). Не «меню совпало» общей
|
||
строкой — именно тут прячутся пропущенные действия.
|