mirror of
https://github.com/Ku6epXBOCTuK/easy-png-tools.git
synced 2026-09-14 21:46:35 +00:00
docs: update plan
This commit is contained in:
@@ -1,9 +1,10 @@
|
|||||||
# План: составные типы параметров и полная типизация pipeline
|
# План: составные типы параметров и полная типизация pipeline
|
||||||
|
|
||||||
> Статус: **обсуждение завершено, решения приняты. Реализация пока НЕ начата**
|
> Статус: **в реализации.** Фаза 0 (фундамент) — сделана. Следующее: Фаза 1 —
|
||||||
> (ждут готовности UI). Док отражает итоговую целевую архитектуру.
|
> один полноценный рабочий инструмент в preview, затем масштабирование.
|
||||||
>
|
>
|
||||||
> Файлы: `web/src/lib/registry.ts` (3918 строк), `web/src/lib/preview/tool-views.ts` (193 строки).
|
> Файлы: `web/src/lib/registry.ts` (3918 строк), `web/src/lib/preview/tool-views.ts` (193 строки),
|
||||||
|
> `web/src/lib/registry-schema.ts`.
|
||||||
|
|
||||||
## Ключевая стратегия: параллельная сборка, старый UI не трогаем
|
## Ключевая стратегия: параллельная сборка, старый UI не трогаем
|
||||||
|
|
||||||
@@ -210,36 +211,45 @@ add-text-png, date-stamp-png
|
|||||||
> схемы (`params` остаётся), не ломает старый UI. Инструмент получает ДОПОЛНИТЕЛЬНО
|
> схемы (`params` остаётся), не ломает старый UI. Инструмент получает ДОПОЛНИТЕЛЬНО
|
||||||
> новое поле `schema` + `interface Params`, старое `run`/`params` не трогаем.
|
> новое поле `schema` + `interface Params`, старое `run`/`params` не трогаем.
|
||||||
> Это гарантирует, что старый UI продолжает работать без регресса.
|
> Это гарантирует, что старый UI продолжает работать без регресса.
|
||||||
|
>
|
||||||
|
> **Новый подход (решение пользователя):** сначала делаем **один полноценный
|
||||||
|
> рабочий инструмент в preview** — не эталон «на бумаге», а реально юзабельный,
|
||||||
|
> чтобы руками оценить, насколько это рабочее решение и какие возникнут сложности.
|
||||||
|
> Оцениваем, при необходимости правим инфраструктуру, и только потом переводим
|
||||||
|
> остальные инструменты тем же проверенным паттерном.
|
||||||
|
|
||||||
### Фаза 0 — фундамент (без инструментов, ещё не мигрируем)
|
### Фаза 0 — фундамент ✔ (сделано)
|
||||||
|
|
||||||
1. **Typed field builders** (`field.slider`, `field.color`, …) + тип `Field<T>`
|
Typed field builders + `Field<T>` + `toolSchema<P>()` + `ToolSchema<P>` —
|
||||||
— отдельный файл `web/src/lib/registry-schema.ts` (или рядом с registry).
|
в `web/src/lib/registry-schema.ts`. `ToolEntry<P>` generic + опциональное
|
||||||
Diff: новый файл ~60-100 строк. Только типы, без изменения registry.
|
поле `schema`. Новые `defaultSchemaParams`/`sanitizeSchemaParams`.
|
||||||
2. **`toolSchema<P>()`** + тип `ToolSchema<P>` — проверка соответствия схемы
|
Старый `ParamDef[]`/pipeline не тронуты. Проверено: compile-time-защита
|
||||||
полям Params. Diff: добавление функции в тот же файл. Без изменений registry.
|
(лишний/неверный/отсутствующий ключ ловит TS), тесты, svelte-check без новых
|
||||||
3. **`ToolEntry<P>` generic + поле `schema`** (рядом с `params`). Diff: правка
|
ошибок.
|
||||||
типа `ToolEntry` в registry.ts (~10 строк). Компилируется, поведения не
|
|
||||||
меняет — `schema` опционален.
|
|
||||||
4. **Новые `defaultParams`/`sanitizeParams`** для схемы (старые не трогаем).
|
|
||||||
Diff: добавление функций рядом. Никто ещё не вызывает — просто присутствуют.
|
|
||||||
|
|
||||||
Результат фазы 0: инфраструктура готова, registry работает как раньше, ни один
|
### Фаза 1 — ОДИН полноценный рабочий инструмент в preview (срез)
|
||||||
инструмент не изменён. Старый UI/тесты не затронуты.
|
|
||||||
|
|
||||||
### Фаза 1 — эталонный инструмент (вертикальный срез)
|
5. **Инструмент «добавить рамку» (`add-border-png`)** — сделать полностью
|
||||||
|
рабочим в preview:
|
||||||
|
- `interface AddBorderParams { thickness: number; color: string }`
|
||||||
|
- `addBorderSchema = toolSchema<AddBorderParams>(...)` + `schema: ...` в entry
|
||||||
|
(старый `params`/`run` остаются — старый UI не регрессит).
|
||||||
|
- **Новый рендер в preview** (`kit/ToolView` → `ParamControl` или новый
|
||||||
|
компонент схемы): читает `ToolSchema<P>`, рисует поля рамки, применение
|
||||||
|
реально работает (end-to-end до картинки).
|
||||||
|
- Дефолты/валидация/значения — из схемы (`defaultSchemaParams`,
|
||||||
|
`sanitizeSchemaParams`).
|
||||||
|
- **Ревью-оценка:** удобно ли это, что сломалось/усложнилось, что поправить
|
||||||
|
в инфраструктуре до масштабирования. Принимается макет/решение.
|
||||||
|
|
||||||
5. **Инструмент «добавить рамку» (`add-border-png`)** — первый пилот:
|
Результат: один реально рабочий инструмент на новой системе = доказываем паттерн,
|
||||||
- добавить `interface AddBorderParams { thickness: number; color: string }`
|
прежде чем переводить остальных.
|
||||||
- добавить `const addBorderSchema = toolSchema<AddBorderParams>({...})`
|
|
||||||
- добавить `schema: addBorderSchema` в `ToolEntry` (старый `params`/`run` остаются)
|
|
||||||
Diff: ~25-35 строк в одном месте. **Ревью макета** здесь решает, как выглядит
|
|
||||||
вертикальный срез, перед масштабированием.
|
|
||||||
|
|
||||||
### Фаза 2 — простые инструменты без составных типов (1 инструмент = 1 шаг)
|
### Фаза 2 — простые инструменты без составных типов (1 инструмент = 1 шаг)
|
||||||
|
|
||||||
Одиночные/небольшие инструменты, где `interface Params` + `schema` не требуют
|
Одиночные/небольшие инструменты, где `interface Params` + `schema` не требуют
|
||||||
составных типов. Каждый — отдельный маленький diff (~15-30 строк):
|
составных типов. Каждый — отдельный маленький diff (~15-30 строк), тем самым
|
||||||
|
проверенным в Фазе 1 паттерном:
|
||||||
|
|
||||||
6. add-stroke-png (color + slider)
|
6. add-stroke-png (color + slider)
|
||||||
7. find-contour-png (color + slider)
|
7. find-contour-png (color + slider)
|
||||||
@@ -279,19 +289,18 @@ add-text-png, date-stamp-png
|
|||||||
30. `gradient` — собрать из dimension + color-pair + direction на
|
30. `gradient` — собрать из dimension + color-pair + direction на
|
||||||
linear-gradient (зависит от решения по gradient, см. план)
|
linear-gradient (зависит от решения по gradient, см. план)
|
||||||
|
|
||||||
### Фаза 4 — связка с новым UI
|
### Фаза 4 — масштаб UI на остальные инструменты
|
||||||
|
|
||||||
31. Новый рендер (`kit/ParamControl`) читает `ToolSchema<P>`; собрать макет
|
31. По мере перевода инструментов в Фазе 2-3 — рендер схемы (из Фазы 1)
|
||||||
на пилоте add-border-png из Фазы 1.
|
покрывает их автоматически; составные виджеты (dimension, color-pair,
|
||||||
32. Составные виджеты (dimension, color-pair, offset, position9, font-style,
|
offset, position9, font-style, plate, gradient) — по одному, каждый с ревью.
|
||||||
plate, gradient) — по одному, каждый с ревью.
|
32. Пер-инструмент layout (`schema.layout`): группировка полей рамки и т.п.
|
||||||
33. Пер-инструмент layout (`schema.layout`): группировка полей рамки и т.п.
|
33. Для каждого переведённого инструмента — UI-макет, принимается отдельно.
|
||||||
34. Для каждого переведённого инструмента — UI-макет, принимается отдельно.
|
|
||||||
|
|
||||||
### Фаза 5 — зачистка
|
### Фаза 5 — зачистка
|
||||||
|
|
||||||
35. Поглощение `tool-views.ts` (preview/lede/layout → meta инструмента).
|
34. Поглощение `tool-views.ts` (preview/lede/layout → meta инструмента).
|
||||||
36. После перехода на новый дизайн — удаление старого UI и старого `ParamDef[]`.
|
35. После перехода на новый дизайн — удаление старого UI и старого `ParamDef[]`.
|
||||||
|
|
||||||
### Как ревьюить каждый шаг
|
### Как ревьюить каждый шаг
|
||||||
|
|
||||||
@@ -302,7 +311,8 @@ add-text-png, date-stamp-png
|
|||||||
`pnpm --dir web test` и `pnpm --dir web exec svelte-check`.
|
`pnpm --dir web test` и `pnpm --dir web exec svelte-check`.
|
||||||
- Порядок полей в `interface Params` и в `schema` совпадает; дефолты в сeme
|
- Порядок полей в `interface Params` и в `schema` совпадает; дефолты в сeme
|
||||||
равны старым `default` из `params`.
|
равны старым `default` из `params`.
|
||||||
- После принятия макета — можно делать UI инструмента, не блокируя остальных.
|
- Пилот из Фазы 1 проверяется **руками в preview**: применяется рамка,
|
||||||
|
дефолты/валидация/смена значений работают end-to-end.
|
||||||
|
|
||||||
## Поток данных (runtime)
|
## Поток данных (runtime)
|
||||||
|
|
||||||
@@ -358,14 +368,17 @@ add-text-png, date-stamp-png
|
|||||||
«Пошаговый план перевода инструментов» выше. Здесь краткая сводка фаз:
|
«Пошаговый план перевода инструментов» выше. Здесь краткая сводка фаз:
|
||||||
|
|
||||||
1. **Фаза 0** — фундамент: builders + `toolSchema<P>` + `ToolEntry<P>.schema` +
|
1. **Фаза 0** — фундамент: builders + `toolSchema<P>` + `ToolEntry<P>.schema` +
|
||||||
новые default/sanitize. Ни одного инструмента не изменено.
|
новые default/sanitize. Ни одного инструмента не изменено. ✔
|
||||||
2. **Фаза 1** — эталонный пилот «добавить рамку» (вертикальный срез), ревью.
|
2. **Фаза 1** — **один полноценный рабочий инструмент в preview**
|
||||||
3. **Фаза 2** — простые/одиночные инструменты, 1 инструмент = 1 диф.
|
(«добавить рамку»): schema + рендер + end-to-end применение. Ручная оценка
|
||||||
|
работоспособности решения/сложностей.
|
||||||
|
3. **Фаза 2** — простые/одиночные инструменты (проверенный паттерн Фазы 1),
|
||||||
|
1 инструмент = 1 диф.
|
||||||
4. **Фаза 3** — инструменты с составными типами (dimension → color-pair →
|
4. **Фаза 3** — инструменты с составными типами (dimension → color-pair →
|
||||||
offset → position9 → font-style → plate → gradient), пилот каждого типа
|
offset → position9 → font-style → plate → gradient), пилот каждого типа
|
||||||
отдельно.
|
отдельно.
|
||||||
5. **Фаза 4** — связка с новым UI: рендер `ToolSchema<P>`, составные виджеты,
|
5. **Фаза 4** — масштаб UI на остальные: составные виджеты, пер-инструмент
|
||||||
пер-инструмент layout (для каждого инструмента — UI-макет).
|
layout (для каждого инструмента — UI-макет).
|
||||||
6. **Фаза 5** — поглощение `tool-views.ts`, затем удаление старого UI/`ParamDef[]`
|
6. **Фаза 5** — поглощение `tool-views.ts`, затем удаление старого UI/`ParamDef[]`
|
||||||
|
|
||||||
## Зависимости
|
## Зависимости
|
||||||
|
|||||||
Reference in New Issue
Block a user