diff --git a/docs/mvp-plan.md b/docs/archive/mvp-plan.md similarity index 83% rename from docs/mvp-plan.md rename to docs/archive/mvp-plan.md index c9083c2..bb9252b 100644 --- a/docs/mvp-plan.md +++ b/docs/archive/mvp-plan.md @@ -1,10 +1,23 @@ # План начальной реализации: минимальный рабочий MVP -Сопутствующие документы: [roadmap.md](./roadmap.md) — общий план по фазам, [analysis.md](./analysis.md) — перечень утилит. +> **СТАТУС: ВЫПОЛНЕН И ЗАКРЫТ 2026-08-22. Документ перенесён в архив** (`docs/archive/`) и больше не развивается. +> +> **Что сделано по плану:** +> - Шаг 0 — каркас: SvelteKit + adapter-static, design-токены на CSS, лейаут с навигацией по категориям ✔ +> - Шаг 1 — ядро: `PixelImage`, декодирование файлов, кодирование PNG/JPEG/WebP, скачивание ✔ +> - Шаг 2 — операции ядра: color / geometry / alpha / analyze, чистые функции без DOM ✔ +> - Шаг 3 — реестр из 11 инструментов + санитизация параметров ✔ +> - Шаг 4 — универсальные UI-компоненты (DropZone, Preview, ParamForm, DownloadButton, InfoPanel, ToolPage) ✔ +> - Шаг 5 — маршруты: `/tools/[id]` с prerender всех страниц, главная-каталог по категориям ✔ +> - Шаги 6–7 — обработка ошибок, состояния, полировка; верификация ✔ +> +> **Checkpoint пройден:** все 11 инструментов вручную проверены в браузере (загрузка → применение → скачивание), включая найденный и исправленный баг resize с сохранением пропорций. Тесты 75/75, svelte-check 0 ошибок, статический экспорт собирается. +> +> **Попутные улучшения сверх плана:** корневой скрипт `pnpm dev`; `sanitizeParams` против пустых/невалидных значений полей; семантика «вписать в размеры» для resize. ## 0. Зафиксированные решения -- **Объём MVP:** только одиночные инструменты «загрузил → настроил → скачал». Пайплайн-workspace (`/workspace`) — сразу следующим шагом после checkpoint'а, не внутри MVP. +- **Объём MVP:** только одиночные инструменты «загрузил → настроил → скачал». Пайплайн-workspace (`/workspace`) вне скоупа этого плана. - **Набор инструментов первого среза:** ~11 базовых EASY (см. §3). Достаточно, чтобы проверить насквозь ядро → реестр → универсальную страницу. - **Стили:** обычный CSS без фреймворка — design-токены на CSS custom properties, ноль зависимостей. - **Стек:** SvelteKit + `@sveltejs/adapter-static` + TypeScript, пакетный менеджер pnpm (уже зафиксирован в корневом `package.json`). Весь код сайта — в `web/`. @@ -50,7 +63,7 @@ - `color.ts`: `grayscale(img)` (luma), `invert(img)`, `brightnessContrast(img, brightness −100..100, contrast −100..100)`. - `geometry.ts`: `flip(img, axis)`, `rotate90(img, turns)`, `crop(img, x, y, w, h)` — индексная математика; `resize(img, w, h)` — билинейная интерполяция на TS (не `drawImage`, чтобы ядро осталось DOM-free и воспроизводимым бит-в-бит). -- `alpha.ts`: `removeColorToAlpha(img, hex, tolerancePercent)` — цветовое расстояние → альфа 0; остальное — позже. +- `alpha.ts`: `removeColorToAlpha(img, hex, tolerancePercent)` — цветовое расстояние → альфа 0. - `analyze.ts`: `imageInfo(img)` → `{ width, height, hasAlpha, colorCount }`. **Проверка:** vitest на маленьких матрицах пикселей (2×2, 3×3): flip, rotate, crop, grayscale — ожидаемые значения руками. @@ -150,15 +163,3 @@ cd web && pnpm test # vitest: ядро (геометрия/цвет) + ц Ручной smoke-тест каждого из 11 инструментов: загрузка PNG → применить → скачать → открыть результат. **Checkpoint MVP:** любой из 11 инструментов доступен по прямому URL с главной страницы; PNG загружается drag&drop; параметры применяются; результат скачивается; всё работает офлайн со статического хостинга; ни одной серверной зависимости. - ---- - -## 9. Сразу после MVP (не входит в план) - -По roadmap.md §Фаза 1, в порядке следования: - -1. Пайплайн-workspace `/workspace` (шаги, превью шагов, localStorage, экспорт/импорт JSON). -2. Расширение набора до ~40 топовых EASY из analysis.md §6.2. -3. Web Worker для тяжёлых операций, полировка UX, SEO-описания. - -Что сознательно отложено: wasm/Rust, эталонные файлы, Playwright, CLI — фазы 2+ из roadmap.md. diff --git a/docs/backlog.md b/docs/backlog.md index 4ceef1c..ee5042f 100644 --- a/docs/backlog.md +++ b/docs/backlog.md @@ -14,3 +14,12 @@ - **Range slider вместо полей ввода** там, где это удобнее (яркость/контраст, качество JPEG/WebP, порог похожести) — желательно slider с присоединённым числовым значением. - **Пипетка для цвета** — выбор цвета удаления/подложки кликом прямо по превью изображения (в дополнение к ``). + +## 3. Загрузка изображений и раскладка страницы + +Убрать отдельное состояние «страница загрузки» и сделать постоянную двухпанельную раскладку: + +- **Слева — исходная картинка**, всегда присутствует: если не загружена, панель — пустое поле, на которое можно перетащить файл (или кликнуть для выбора). +- **Справа — результат работы инструмента** (до загрузки — пустое состояние/подсказка). +- **Ctrl+V** — вставка изображения из буфера обмена сразу в исходник. +- **Drag&drop поверх загруженной картинки** — перетаскивание нового файла на левую панель заменяет текущее исходное изображение.