style: format docs markdown
This commit is contained in:
@@ -4,41 +4,78 @@
|
||||
|
||||
## 1. Что получается
|
||||
|
||||
Четыре инструмента новой категории «Текст»: надпись на изображении, дата-штамп, защитная плитка (повторяющийся полупрозрачный текст под углом), водяной знак картинкой. Каталог вырастает с 69 до 73. Это первые операции, рисующие через canvas 2D — класс perceptual по роадмапу: точные пиксельные тесты на них не пишутся, юнит-тестами покрывается чистая математика раскладки.
|
||||
Четыре инструмента новой категории «Текст»: надпись на изображении, дата-штамп,
|
||||
защитная плитка (повторяющийся полупрозрачный текст под углом), водяной знак
|
||||
картинкой. Каталог вырастает с 69 до 73. Это первые операции, рисующие через
|
||||
canvas 2D — класс perceptual по роадмапу: точные пиксельные тесты на них не
|
||||
пишутся, юнит-тестами покрывается чистая математика раскладки.
|
||||
|
||||
## 2. Решения
|
||||
|
||||
- Вся геометрия — чистые функции без DOM: якорь из 9-позиционной сетки → координаты, перенос текста по ширине с инъекцией измерителя, раскладка плитки с углом и шагом. Canvas-вызовы — тонкий слой рядом (`core/textdraw.ts`), в юнит-тесты не попадает.
|
||||
- Один движок рендера текста на все три текстовых инструмента: шрифт из системного набора (sans/serif/mono), размер, цвет, жирность, прозрачность, поворот. Различия инструментов — только в пресетах параметров и количестве слоёв (одна надпись vs плитка).
|
||||
- Дата-штамп — надпись с автотекстом: строка формата (`YYYY-MM-DD hh:mm`) разворачивается в текущую дату в момент запуска; свой мини-форматтер без зависимостей.
|
||||
- Водяной знак картинкой — первый двухисточниковый инструмент: вторая картинка грузится отдельной зоной в этапе, живёт только в состоянии страницы и сознательно не сохраняется ни в workspace-pipeline, ни в экспорте JSON; после восстановления цепочки знак нужно выбрать заново. Ограничение фиксируем в описании инструмента.
|
||||
- Новая категория `text` встаёт после «Фильтров»; названия в обоих словарях, порядок в CATEGORIES один.
|
||||
- Вся геометрия — чистые функции без DOM: якорь из 9-позиционной сетки →
|
||||
координаты, перенос текста по ширине с инъекцией измерителя, раскладка плитки
|
||||
с углом и шагом. Canvas-вызовы — тонкий слой рядом (`core/textdraw.ts`), в
|
||||
юнит-тесты не попадает.
|
||||
- Один движок рендера текста на все три текстовых инструмента: шрифт из
|
||||
системного набора (sans/serif/mono), размер, цвет, жирность, прозрачность,
|
||||
поворот. Различия инструментов — только в пресетах параметров и количестве
|
||||
слоёв (одна надпись vs плитка).
|
||||
- Дата-штамп — надпись с автотекстом: строка формата (`YYYY-MM-DD hh:mm`)
|
||||
разворачивается в текущую дату в момент запуска; свой мини-форматтер без
|
||||
зависимостей.
|
||||
- Водяной знак картинкой — первый двухисточниковый инструмент: вторая картинка
|
||||
грузится отдельной зоной в этапе, живёт только в состоянии страницы и
|
||||
сознательно не сохраняется ни в workspace-pipeline, ни в экспорте JSON; после
|
||||
восстановления цепочки знак нужно выбрать заново. Ограничение фиксируем в
|
||||
описании инструмента.
|
||||
- Новая категория `text` встаёт после «Фильтров»; названия в обоих словарях,
|
||||
порядок в CATEGORIES один.
|
||||
|
||||
## 3. Инструменты
|
||||
|
||||
- `add-text-png` — параметры: текст (строка), размер (слайдер 8–200), цвет, шрифт (select), жирность (чекбокс), позиция (select 3×3: углы/стороны/центр), отступ (слайдер). Опциональная подложка: цвет + прозрачность плашки за текстом.
|
||||
- `date-stamp-png` — тот же набор минус текст, плюс формат даты; дефолт — нижний правый угол.
|
||||
- `watermark-tile-png` — текст, размер, цвет, прозрачность (0–100), угол (-90…90), шаг по X/Y; плитка заполняет весь холст.
|
||||
- `watermark-image-png` — второй источник (загрузка PNG с альфой), масштаб знака (% от ширины холста), прозрачность, позиция 3×3, отступ.
|
||||
- `add-text-png` — параметры: текст (строка), размер (слайдер 8–200), цвет,
|
||||
шрифт (select), жирность (чекбокс), позиция (select 3×3: углы/стороны/центр),
|
||||
отступ (слайдер). Опциональная подложка: цвет + прозрачность плашки за
|
||||
текстом.
|
||||
- `date-stamp-png` — тот же набор минус текст, плюс формат даты; дефолт — нижний
|
||||
правый угол.
|
||||
- `watermark-tile-png` — текст, размер, цвет, прозрачность (0–100), угол
|
||||
(-90…90), шаг по X/Y; плитка заполняет весь холст.
|
||||
- `watermark-image-png` — второй источник (загрузка PNG с альфой), масштаб знака
|
||||
(% от ширины холста), прозрачность, позиция 3×3, отступ.
|
||||
|
||||
## 4. Этапы и проверки
|
||||
|
||||
Каждый этап заканчивается зелёными test/check/build и ревью.
|
||||
|
||||
- **A. Фундамент** — категория `text` (categories + словари + порядок), `core/textdraw.ts`: anchor9, wrap, tileLayout с юнит-тестами на математике (координаты углов/центра, переносы слов, плотность плитки), тонкий canvas-модуль `domText.ts` (без тестов). Реестр пока пуст в категории.
|
||||
- **B. Надпись и дата** — `add-text-png`, `date-stamp-png` на общем движке; иконки, переводы, записи реестра. Смоук: обе локали, тёмная тема (плашка читаема), длинный текст переносится и не вылезает за край.
|
||||
- **C. Плитка** — `watermark-tile-png`; смоук: отрицательные и нулевой угол, прозрачность 0/50/100, мелкий шаг не подвешивает страницу на больших холстах (ограничение количества плиток капом).
|
||||
- **D. Знак картинкой** — двухисточниковый UX: вторая drop-зона в этапе (компонент рядом с SourceCard, виден только у этого инструмента), масштаб/позиция/отступ; ограничение про сохранение — в описании и подсказке. Этап режется без ущерба остальным, если решим отложить.
|
||||
- **A. Фундамент** — категория `text` (categories + словари + порядок),
|
||||
`core/textdraw.ts`: anchor9, wrap, tileLayout с юнит-тестами на математике
|
||||
(координаты углов/центра, переносы слов, плотность плитки), тонкий
|
||||
canvas-модуль `domText.ts` (без тестов). Реестр пока пуст в категории.
|
||||
- **B. Надпись и дата** — `add-text-png`, `date-stamp-png` на общем движке;
|
||||
иконки, переводы, записи реестра. Смоук: обе локали, тёмная тема (плашка
|
||||
читаема), длинный текст переносится и не вылезает за край.
|
||||
- **C. Плитка** — `watermark-tile-png`; смоук: отрицательные и нулевой угол,
|
||||
прозрачность 0/50/100, мелкий шаг не подвешивает страницу на больших холстах
|
||||
(ограничение количества плиток капом).
|
||||
- **D. Знак картинкой** — двухисточниковый UX: вторая drop-зона в этапе
|
||||
(компонент рядом с SourceCard, виден только у этого инструмента),
|
||||
масштаб/позиция/отступ; ограничение про сохранение — в описании и подсказке.
|
||||
Этап режется без ущерба остальным, если решим отложить.
|
||||
- **E. Итог** — полный прогон, смоук §6, архивация плана.
|
||||
|
||||
## 5. Критерии готовности
|
||||
|
||||
- 73 инструмента; вся математика раскладки покрыта юнит-тестами; canvas-слой изолирован в одном модуле.
|
||||
- test/check/build зелёные; новые инструменты работают в цепочке как обычные шаги (кроме источника знака — см. ограничение).
|
||||
- 73 инструмента; вся математика раскладки покрыта юнит-тестами; canvas-слой
|
||||
изолирован в одном модуле.
|
||||
- test/check/build зелёные; новые инструменты работают в цепочке как обычные
|
||||
шаги (кроме источника знака — см. ограничение).
|
||||
|
||||
## 6. Что сознательно не делаем
|
||||
|
||||
- Выбор произвольных пользовательских шрифтов (файлами) и веб-шрифтов — только системный набор.
|
||||
- Кернинг/линии/многострочное редактирование с абзацами — один абзац с автопереносом.
|
||||
- Выбор произвольных пользовательских шрифтов (файлами) и веб-шрифтов — только
|
||||
системный набор.
|
||||
- Кернинг/линии/многострочное редактирование с абзацами — один абзац с
|
||||
автопереносом.
|
||||
- Сохранение картинки-знака в пайплайне и её передача между сессиями.
|
||||
- Текст по контуру, градиентные заливки текста.
|
||||
|
||||
Reference in New Issue
Block a user