Ku6epXBOCTuK/easy-png-tools2
1
0
Fork 0
mirror of https://github.com/Ku6epXBOCTuK/easy-png-tools.git synced 2026-11-13 17:08:20 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: change id - remove png intents

Browse Source
This commit is contained in:
Ku6epXBOCTuK
2026-09-27 16:48:20 +05:00
parent d09c954694
commit 7b7e12fafc
21 changed files with 433 additions and 433 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/src/lib/executor/executor.test.ts
+3 -3
View File
@@ -281,7 +281,7 @@ describe("handleWorkerRequest", () => {
it("serializes image results and preserves ToolError keys", async () => {
const imageResult = await handleWorkerRequest({
id: 1,
toolId: "flip-png",
toolId: "flip",
params: {},
source: image(),
});
@@ -295,7 +295,7 @@ describe("handleWorkerRequest", () => {
const errorResult = await handleWorkerRequest({
id: 2,
toolId: "bytes-to-png",
toolId: "from-bytes",
params: { width: 32 },
text: Array.from({ length: 132 }, () => "1").join(" "),
});
@@ -310,7 +310,7 @@ describe("handleWorkerRequest", () => {
it("serializes FileResult transfers", async () => {
const result = await handleWorkerRequest({
id: 3,
toolId: "split-into-parts-png",
toolId: "split-into-parts",
params: { columns: 2, rows: 2 },
source: image(),
});
web/src/lib/i18n/en.ts
+37 -37
View File
@@ -337,83 +337,83 @@ export const en: Dict = {
// EN-строка из реестра страниц (`web/src/lib/registry/pages/`).
pages: {},
tools: {
"png-file-size": {
"file-size": {
results: {
line: "PNG size: {kb} KB",
},
},
"verify-is-png": {
"verify-png": {
results: {
verifyYes: "Yes — this is a valid PNG signature.",
verifyNo: "No — the signature does not match a PNG file.",
},
},
"png-is-grayscale": {
"is-grayscale": {
results: {
grayscaleYes: "Yes — all pixels are shades of gray.",
grayscaleNo: "No — colored pixels were found.",
},
},
"png-is-transparent": {
"is-transparent": {
results: {
transparentYes:
"Yes — there are transparent or semi-transparent pixels.",
transparentNo: "No — all pixels are fully opaque.",
},
},
"png-orientation": {
orientation: {
results: {
orientationPortrait: "Portrait — height is greater than width.",
orientationLandscape: "Landscape — width is greater than height.",
orientationSquare: "Square — the sides are equal.",
},
},
"show-transparent-png": {
"show-transparent": {
options: {
mode: { binary: "Black & white mask", highlight: "Color highlight" },
},
},
"show-grayscale-pixels-png": {
"show-grayscale-pixels": {
options: {
mode: { binary: "Black & white mask", highlight: "Color highlight" },
},
},
"show-color-pixels-png": {
"show-color-pixels": {
options: {
mode: { binary: "Black & white mask", highlight: "Color highlight" },
},
},
"light-pixel-mask-png": {
"light-pixel-mask": {
options: {
mode: { binary: "Black & white mask", highlight: "Color highlight" },
},
},
"dark-pixel-mask-png": {
"dark-pixel-mask": {
options: {
mode: { binary: "Black & white mask", highlight: "Color highlight" },
},
},
"unique-color-mask-png": {
"unique-color-mask": {
options: {
mode: { binary: "Black & white mask", highlight: "Color highlight" },
},
},
"add-noise-png": {
"add-noise": {
options: {
mode: { mono: "Monochrome grain", color: "Color noise" },
},
},
"dithering-png": {
dithering: {
options: {
pattern: { "floyd-steinberg": "Floyd–Steinberg", bayer: "Bayer 4x4" },
},
},
"extract-channel-png": {
"extract-channel": {
options: {
channel: { red: "Red", green: "Green", blue: "Blue" },
},
},
"swap-channels-png": {
"swap-channels": {
options: {
pair: {
"r-g": "Red ↔ Green",
@@ -422,7 +422,7 @@ export const en: Dict = {
},
},
},
"decrease-color-count-png": {
"decrease-color-count": {
options: {
maxColors: {
"2": "2",
@@ -439,37 +439,37 @@ export const en: Dict = {
},
},
},
"png-to-hsl": {
"to-hsl": {
options: {
display: { gray: "Grayscale", color: "Space as RGB" },
},
},
"png-to-hsv": {
"to-hsv": {
options: {
display: { gray: "Grayscale", color: "Space as RGB" },
},
},
"png-to-hsi": {
"to-hsi": {
options: {
display: { gray: "Grayscale", color: "Space as RGB" },
},
},
"png-to-cmyk": {
"to-cmyk": {
options: {
display: { gray: "Grayscale", color: "Space as RGB" },
},
},
"png-to-ycbcr": {
"to-ycbcr": {
options: {
display: { gray: "Grayscale", color: "Space as RGB" },
},
},
"png-to-lab": {
"to-lab": {
options: {
display: { gray: "Grayscale", color: "Space as RGB" },
},
},
"rotate-png": {
rotate: {
options: {
angle: {
"90": "90° clockwise",
@@ -478,7 +478,7 @@ export const en: Dict = {
},
},
},
"flip-png": {
flip: {
options: {
axis: {
horizontal: "Horizontal (left to right)",
@@ -486,7 +486,7 @@ export const en: Dict = {
},
},
},
"change-canvas-size-png": {
"change-canvas-size": {
options: {
anchor: {
"top-left": "Top left",
@@ -501,7 +501,7 @@ export const en: Dict = {
},
},
},
"change-aspect-ratio-png": {
"change-aspect-ratio": {
options: {
ratio: {
"1:1": "1:1",
@@ -515,12 +515,12 @@ export const en: Dict = {
mode: { crop: "Crop to fill", pad: "Pad to fit" },
},
},
"swap-orientation-png": {
"swap-orientation": {
options: {
target: { portrait: "Portrait", landscape: "Landscape" },
},
},
"symmetric-copy-png": {
"symmetric-copy": {
options: {
axis: {
vertical: "Vertical (double width)",
@@ -534,47 +534,47 @@ export const en: Dict = {
},
},
},
"color-spectrum-png": {
"color-spectrum": {
options: {
direction: { horizontal: "Horizontal", vertical: "Vertical" },
},
},
"step-colors-png": {
"step-colors": {
options: {
layout: { grid: "Grid", strip: "Strip" },
},
},
"complementary-png": {
complementary: {
options: {
layout: { grid: "Grid", strip: "Strip" },
},
},
"triadic-png": {
triadic: {
options: {
layout: { grid: "Grid", strip: "Strip" },
},
},
"tetradic-png": {
tetradic: {
options: {
layout: { grid: "Grid", strip: "Strip" },
},
},
"analogous-png": {
analogous: {
options: {
layout: { grid: "Grid", strip: "Strip" },
},
},
"monochromatic-png": {
monochromatic: {
options: {
layout: { grid: "Grid", strip: "Strip" },
},
},
"shades-png": {
shades: {
options: {
layout: { grid: "Grid", strip: "Strip" },
},
},
"sort-colors-png": {
"sort-colors": {
options: {
order: { hue: "Hue", luma: "Brightness", sat: "Saturation" },
layout: { grid: "Grid", strip: "Strip" },
web/src/lib/i18n/ru.ts
+105 -105
View File
@@ -932,17 +932,17 @@ export const ru: Dict = {
},
tools: {
"hex-to-png": {
"from-hex": {
params: { width: "Ширина изображения" },
},
"resize-png": {
resize: {
params: {
width: "Ширина (0 — авто)",
height: "Высота (0 — авто)",
keepAspect: "Сохранять пропорции",
},
},
"crop-png": {
crop: {
params: {
x: "X (слева)",
y: "Y (сверху)",
@@ -950,7 +950,7 @@ export const ru: Dict = {
height: "Высота области",
},
},
"rotate-png": {
rotate: {
params: { angle: "Угол поворота" },
options: {
angle: {
@@ -960,7 +960,7 @@ export const ru: Dict = {
},
},
},
"flip-png": {
flip: {
params: { axis: "Ось отражения" },
options: {
axis: {
@@ -969,17 +969,17 @@ export const ru: Dict = {
},
},
},
"add-padding-png": {
"add-padding": {
params: {
padding: "Поля, px",
transparent: "Прозрачные поля",
color: "Цвет полей",
},
},
"add-border-png": {
"add-border": {
params: { thickness: "Толщина рамки, px", color: "Цвет рамки" },
},
"fit-on-background-png": {
"fit-on-background": {
params: {
width: "Ширина полотна",
height: "Высота полотна",
@@ -987,29 +987,29 @@ export const ru: Dict = {
color: "Цвет фона",
},
},
"tile-png": {
tile: {
params: { columns: "Столбцов", rows: "Строк" },
},
"blur-png": {
blur: {
params: { radius: "Радиус, px" },
},
"sharpen-png": {
sharpen: {
params: { strength: "Сила, %" },
},
"adjust-brightness-contrast-png": {
"adjust-brightness-contrast": {
params: { brightness: "Яркость", contrast: "Контраст" },
},
"change-png-opacity": {
"change-opacity": {
params: { percent: "Прозрачность, %" },
},
"change-png-hue": {
"change-hue": {
params: { degrees: "Сдвиг тона, °" },
},
"extract-channel-png": {
"extract-channel": {
params: { channel: "Канал" },
options: { channel: { red: "Красный", green: "Зелёный", blue: "Синий" } },
},
"swap-channels-png": {
"swap-channels": {
params: { pair: "Пара каналов" },
options: {
pair: {
@@ -1019,62 +1019,62 @@ export const ru: Dict = {
},
},
},
"png-to-hsl": {
"to-hsl": {
options: {
display: { gray: "Оттенки серого", color: "Пространство как RGB" },
},
},
"png-to-hsv": {
"to-hsv": {
options: {
display: { gray: "Оттенки серого", color: "Пространство как RGB" },
},
},
"png-to-hsi": {
"to-hsi": {
options: {
display: { gray: "Оттенки серого", color: "Пространство как RGB" },
},
},
"png-to-cmyk": {
"to-cmyk": {
options: {
display: { gray: "Оттенки серого", color: "Пространство как RGB" },
},
},
"png-to-ycbcr": {
"to-ycbcr": {
options: {
display: { gray: "Оттенки серого", color: "Пространство как RGB" },
},
},
"png-to-lab": {
"to-lab": {
options: {
display: { gray: "Оттенки серого", color: "Пространство как RGB" },
},
},
"black-and-white-png": {
"black-and-white": {
params: { threshold: "Порог яркости, %" },
},
"posterize-png": {
posterize: {
params: { levels: "Уровней на канал" },
},
"two-colors-png": {
"two-colors": {
params: {
lightColor: "Цвет светлых участков",
darkColor: "Цвет тёмных участков",
threshold: "Порог яркости, %",
},
},
"convert-png-to-jpg": {
"to-jpg": {
params: { background: "Цвет подложки", quality: "Качество JPEG" },
},
"convert-png-to-webp": {
"to-webp": {
params: { quality: "Качество WebP" },
},
"set-alpha-channel-png": {
"set-alpha-channel": {
params: { percent: "Прозрачность, %" },
},
"round-corners-png": {
"round-corners": {
params: { radius: "Радиус скругления, %" },
},
"remove-background-png": {
"remove-background": {
params: {
color: "Цвет фона",
tolerance: "Допуск похожести, %",
@@ -1082,34 +1082,34 @@ export const ru: Dict = {
smooth: "Сглаживание границы, проходы",
},
},
"add-stroke-png": {
"add-stroke": {
params: { color: "Цвет обводки", thickness: "Толщина, px" },
},
"find-contour-png": {
"find-contour": {
params: { color: "Цвет линии", thickness: "Толщина линии, px" },
},
"make-thicker-png": {
"make-thicker": {
params: { radius: "На сколько px" },
},
"make-thinner-png": {
"make-thinner": {
params: { radius: "На сколько px" },
},
"harden-alpha-png": {
"harden-alpha": {
params: { threshold: "Порог альфы, %" },
},
"despeckle-alpha-png": {
"despeckle-alpha": {
params: { radius: "Радиус очистки, px" },
},
"close-holes-png": {
"close-holes": {
params: { radius: "Радиус закрытия, px" },
},
"remove-color-from-png": {
"remove-color-from": {
params: {
targetColor: "Цвет для удаления",
tolerance: "Порог похожести, %",
},
},
"create-empty-png": {
"create-empty": {
params: {
width: "Ширина",
height: "Высота",
@@ -1117,13 +1117,13 @@ export const ru: Dict = {
color: "Цвет",
},
},
"single-color-png": {
"single-color": {
params: { width: "Ширина", height: "Высота", color: "Цвет" },
},
"random-noise-png": {
"random-noise": {
params: { width: "Ширина", height: "Высота", seed: "Зерно" },
},
"linear-gradient-png": {
"linear-gradient": {
params: {
width: "Ширина",
height: "Высота",
@@ -1132,10 +1132,10 @@ export const ru: Dict = {
direction: "Направление",
},
},
"color-wheel-png": {
"color-wheel": {
params: { width: "Размер", lightness: "Светлота, %" },
},
"complementary-png": {
complementary: {
params: {
baseColor: "Базовый цвет",
width: "Ширина",
@@ -1143,7 +1143,7 @@ export const ru: Dict = {
},
options: { layout: { grid: "Сетка", strip: "Полоса" } },
},
"triadic-png": {
triadic: {
params: {
baseColor: "Базовый цвет",
width: "Ширина",
@@ -1151,7 +1151,7 @@ export const ru: Dict = {
},
options: { layout: { grid: "Сетка", strip: "Полоса" } },
},
"tetradic-png": {
tetradic: {
params: {
baseColor: "Базовый цвет",
width: "Ширина",
@@ -1159,7 +1159,7 @@ export const ru: Dict = {
},
options: { layout: { grid: "Сетка", strip: "Полоса" } },
},
"analogous-png": {
analogous: {
params: {
baseColor: "Базовый цвет",
width: "Ширина",
@@ -1169,7 +1169,7 @@ export const ru: Dict = {
},
options: { layout: { grid: "Сетка", strip: "Полоса" } },
},
"monochromatic-png": {
monochromatic: {
params: {
baseColor: "Базовый цвет",
width: "Ширина",
@@ -1179,7 +1179,7 @@ export const ru: Dict = {
},
options: { layout: { grid: "Сетка", strip: "Полоса" } },
},
"shades-png": {
shades: {
params: {
baseColor: "Базовый цвет",
width: "Ширина",
@@ -1189,13 +1189,13 @@ export const ru: Dict = {
},
options: { layout: { grid: "Сетка", strip: "Полоса" } },
},
"mix-colors-png": {
"mix-colors": {
params: { colors: "Цвета (hex через запятую)", width: "Ширина" },
},
"blend-two-png": {
"blend-two": {
params: { colorA: "Цвет A", colorB: "Цвет B", width: "Ширина" },
},
"step-colors-png": {
"step-colors": {
params: {
colorA: "Цвет A",
colorB: "Цвет B",
@@ -1205,7 +1205,7 @@ export const ru: Dict = {
},
options: { layout: { grid: "Сетка", strip: "Полоса" } },
},
"sort-colors-png": {
"sort-colors": {
params: {
colors: "Цвета (hex через запятую)",
order: "Сортировка",
@@ -1217,20 +1217,20 @@ export const ru: Dict = {
layout: { grid: "Сетка", strip: "Полоса" },
},
},
"png-is-grayscale": {
"is-grayscale": {
results: {
grayscaleYes: "Да — все пиксели являются оттенками серого.",
grayscaleNo: "Нет — найдены цветные пиксели.",
},
},
"circle-mask-png": {
"circle-mask": {
params: {
size: "Диаметр, % меньшей стороны",
offsetX: "Смещение X, %",
offsetY: "Смещение Y, %",
},
},
"square-mask-png": {
"square-mask": {
params: {
widthPct: "Ширина, % меньшей стороны",
heightPct: "Высота, % меньшей стороны",
@@ -1238,7 +1238,7 @@ export const ru: Dict = {
offsetY: "Смещение Y, %",
},
},
"star-mask-png": {
"star-mask": {
params: {
points: "Лучи",
innerRadius: "Радиус впадин, %",
@@ -1248,7 +1248,7 @@ export const ru: Dict = {
offsetY: "Смещение Y, %",
},
},
"wavy-mask-png": {
"wavy-mask": {
params: {
size: "Базовый радиус, % меньшей стороны",
amplitude: "Амплитуда волн, %",
@@ -1258,10 +1258,10 @@ export const ru: Dict = {
offsetY: "Смещение Y, %",
},
},
"trim-empty-space-png": {
"trim-empty-space": {
params: { threshold: "Порог альфы" },
},
"change-canvas-size-png": {
"change-canvas-size": {
params: { width: "Ширина", height: "Высота", anchor: "Якорь" },
options: {
anchor: {
@@ -1277,7 +1277,7 @@ export const ru: Dict = {
},
},
},
"change-aspect-ratio-png": {
"change-aspect-ratio": {
params: { ratio: "Целевое отношение", mode: "Режим" },
options: {
ratio: {
@@ -1295,11 +1295,11 @@ export const ru: Dict = {
},
},
},
"swap-orientation-png": {
"swap-orientation": {
params: { target: "Целевая ориентация" },
options: { target: { portrait: "Портрет", landscape: "Ландшафт" } },
},
"symmetric-copy-png": {
"symmetric-copy": {
params: { axis: "Линия зеркала", keepSide: "Какая сторона остаётся" },
options: {
axis: {
@@ -1314,38 +1314,38 @@ export const ru: Dict = {
},
},
},
"feather-edges-png": {
"feather-edges": {
params: { radius: "Радиус растушёвки, px" },
},
"clean-edges-png": {
"clean-edges": {
params: { radius: "Радиус поиска, px" },
},
"pixelate-png": {
pixelate: {
params: { blockSize: "Размер блока, px" },
},
"randomize-pixels-png": {
"randomize-pixels": {
params: { blockSize: "Размер блока, px", seed: "Seed" },
},
"add-noise-png": {
"add-noise": {
params: { amount: "Сила, %", mode: "Тип шума", seed: "Seed" },
options: { mode: { mono: "Монохромное зерно", color: "Цветной шум" } },
},
"silhouette-png": {
silhouette: {
params: { color: "Цвет силуэта", threshold: "Порог видимости, %" },
},
"bytes-to-png": {
"from-bytes": {
params: { width: "Ширина изображения" },
},
"rgb-values-to-png": {
"from-rgb-values": {
params: { width: "Ширина изображения" },
},
"verify-is-png": {
"verify-png": {
results: {
verifyYes: "Да — сигнатура настоящего PNG.",
verifyNo: "Нет — сигнатура не совпадает с PNG-файлом.",
},
},
"text-to-png": {
"from-text": {
params: {
text: "Текст",
fontSize: "Размер шрифта, px",
@@ -1357,10 +1357,10 @@ export const ru: Dict = {
padding: "Отступ, px",
},
},
"emoji-to-png": {
"from-emoji": {
params: { emoji: "Эмодзи / символ", size: "Размер" },
},
"placeholder-png": {
placeholder: {
params: {
width: "Ширина",
height: "Высота",
@@ -1369,7 +1369,7 @@ export const ru: Dict = {
showText: "Печатать размеры",
},
},
"color-spectrum-png": {
"color-spectrum": {
params: {
width: "Ширина",
height: "Высота",
@@ -1381,7 +1381,7 @@ export const ru: Dict = {
direction: { horizontal: "По горизонтали", vertical: "По вертикали" },
},
},
"random-colors-png": {
"random-colors": {
params: {
width: "Ширина",
height: "Высота",
@@ -1389,7 +1389,7 @@ export const ru: Dict = {
seed: "Seed",
},
},
"draw-grid-png": {
"draw-grid": {
params: {
width: "Ширина",
height: "Высота",
@@ -1400,10 +1400,10 @@ export const ru: Dict = {
transparentBg: "Прозрачный фон",
},
},
"quantize-png": {
quantize: {
params: { colors: "Цветов (k)" },
},
"decrease-color-count-png": {
"decrease-color-count": {
params: { maxColors: "Максимум цветов" },
options: {
maxColors: {
@@ -1421,21 +1421,21 @@ export const ru: Dict = {
},
},
},
"custom-palette-png": {
"custom-palette": {
params: { colors: "Палитра (hex через запятую)" },
},
"dithering-png": {
dithering: {
params: { colors: "Цветов (k)", pattern: "Узор" },
options: {
pattern: { "floyd-steinberg": "Флойд–Стейнберг", bayer: "Байер 4×4" },
},
},
"png-file-size": {
"file-size": {
results: {
line: "Размер PNG: {kb} КБ",
},
},
"show-transparent-png": {
"show-transparent": {
params: {
mode: "Режим маски",
color: "Цвет подсветки",
@@ -1445,7 +1445,7 @@ export const ru: Dict = {
mode: { binary: "Чёрно-белая маска", highlight: "Цветная подсветка" },
},
},
"show-grayscale-pixels-png": {
"show-grayscale-pixels": {
params: {
tolerance: "Допуск по каналам",
mode: "Режим маски",
@@ -1456,7 +1456,7 @@ export const ru: Dict = {
mode: { binary: "Чёрно-белая маска", highlight: "Цветная подсветка" },
},
},
"show-color-pixels-png": {
"show-color-pixels": {
params: {
tolerance: "Допуск по каналам",
mode: "Режим маски",
@@ -1467,7 +1467,7 @@ export const ru: Dict = {
mode: { binary: "Чёрно-белая маска", highlight: "Цветная подсветка" },
},
},
"light-pixel-mask-png": {
"light-pixel-mask": {
params: {
threshold: "Порог яркости, %",
mode: "Режим маски",
@@ -1478,7 +1478,7 @@ export const ru: Dict = {
mode: { binary: "Чёрно-белая маска", highlight: "Цветная подсветка" },
},
},
"dark-pixel-mask-png": {
"dark-pixel-mask": {
params: {
threshold: "Порог яркости, %",
mode: "Режим маски",
@@ -1489,7 +1489,7 @@ export const ru: Dict = {
mode: { binary: "Чёрно-белая маска", highlight: "Цветная подсветка" },
},
},
"unique-color-mask-png": {
"unique-color-mask": {
params: {
rarity: "Максимум повторов",
mode: "Режим маски",
@@ -1500,13 +1500,13 @@ export const ru: Dict = {
mode: { binary: "Чёрно-белая маска", highlight: "Цветная подсветка" },
},
},
"extract-color-from-png": {
"extract-color-from": {
params: {
color: "Какой цвет оставить",
tolerance: "Допуск похожести, %",
},
},
"watermark-tile-png": {
"watermark-tile": {
params: {
text: "Текст",
fontSize: "Размер шрифта, px",
@@ -1519,7 +1519,7 @@ export const ru: Dict = {
bold: "Жирный",
},
},
"add-text-png": {
"add-text": {
params: {
text: "Текст",
fontSize: "Размер шрифта, px",
@@ -1533,7 +1533,7 @@ export const ru: Dict = {
plateOpacity: "Прозрачность плашки, %",
},
},
"date-stamp-png": {
"date-stamp": {
params: {
format: "Формат",
fontSize: "Размер шрифта, px",
@@ -1547,47 +1547,47 @@ export const ru: Dict = {
plateOpacity: "Прозрачность плашки, %",
},
},
"skew-png": {
skew: {
params: { degX: "Наклон по X, °", degY: "Наклон по Y, °" },
},
"rotate-free-png": {
"rotate-free": {
params: { angle: "Угол, °" },
},
"zoom-png": {
zoom: {
params: { scale: "Масштаб, %" },
},
"shift-png": {
shift: {
params: {
offsetX: "Смещение X, px",
offsetY: "Смещение Y, px",
color: "Цвет фона",
},
},
"vignette-png": {
vignette: {
params: { strength: "Сила затемнения, %" },
},
"jpeg-artifacts-png": {
"jpeg-artifacts": {
params: { quality: "Качество JPEG" },
},
"gamma-png": {
gamma: {
params: { value: "Гамма" },
},
"temperature-png": {
temperature: {
params: { percent: "Температура" },
},
"tint-png": {
tint: {
params: { color: "Цвет тонирования", strength: "Сила, %" },
},
"svg-to-png": {
"from-svg": {
params: { width: "Ширина результата, px" },
},
"png-is-transparent": {
"is-transparent": {
results: {
transparentYes: "Да — есть прозрачные или полупрозрачные пиксели.",
transparentNo: "Нет — все пиксели полностью непрозрачны.",
},
},
"png-orientation": {
orientation: {
results: {
orientationPortrait: "Портрет — высота больше ширины.",
orientationLandscape: "Ландшафт — ширина больше высоты.",
web/src/lib/i18n/schema-tool-strings.test.ts
+6 -6
View File
@@ -53,34 +53,34 @@ describe("searchPages (кросс-языковой поиск каталога)"
describe("verdictText (вердикт с vars)", () => {
it("интерполирует {vars} в обоих локалях", () => {
setLocale("ru");
expect(verdictText("png-file-size", "line", { kb: "12.3" })).toBe(
expect(verdictText("file-size", "line", { kb: "12.3" })).toBe(
"Размер PNG: 12.3 КБ",
);
setLocale("en");
expect(verdictText("png-file-size", "line", { kb: "12.3" })).toBe(
expect(verdictText("file-size", "line", { kb: "12.3" })).toBe(
"PNG size: 12.3 KB",
);
});
it("без vars возвращает ключ как есть при отсутствии в словаре", () => {
expect(verdictText("png-file-size", "нет-такого")).toBe("нет-такого");
expect(verdictText("file-size", "нет-такого")).toBe("нет-такого");
});
it.each([
[
"verify-is-png",
"verify-png",
"verifyYes",
"Да — сигнатура настоящего PNG.",
"Yes — this is a valid PNG signature.",
],
[
"png-is-transparent",
"is-transparent",
"transparentNo",
"Нет — все пиксели полностью непрозрачны.",
"No — all pixels are fully opaque.",
],
[
"png-orientation",
"orientation",
"orientationLandscape",
"Ландшафт — ширина больше высоты.",
"Landscape — width is greater than height.",
web/src/lib/registry/pages/alpha.ts
+20 -20
View File
@@ -7,7 +7,7 @@ export const alphaPages: Page[] = [
description:
"Adds a colored ring outline around the opaque content with the chosen thickness.",
category: "alpha",
steps: [{ id: "add-stroke-png" }],
steps: [{ id: "add-stroke" }],
},
{
slug: "find-contour-png",
@@ -15,7 +15,7 @@ export const alphaPages: Page[] = [
description:
"Leaves only a line along the boundary of opaque regions in the chosen color and thickness.",
category: "alpha",
steps: [{ id: "find-contour-png" }],
steps: [{ id: "find-contour" }],
},
{
slug: "remove-color-from-png",
@@ -23,7 +23,7 @@ export const alphaPages: Page[] = [
description:
"Makes all pixels close to the chosen color transparent. The tolerance sets the allowed deviation as a percentage of the maximum color distance.",
category: "alpha",
steps: [{ id: "remove-color-from-png" }],
steps: [{ id: "remove-color-from" }],
},
{
slug: "circle-mask-png",
@@ -31,7 +31,7 @@ export const alphaPages: Page[] = [
description:
"Cuts the image into a circle. Diameter is set as a share of the smaller side.",
category: "alpha",
steps: [{ id: "circle-mask-png" }],
steps: [{ id: "circle-mask" }],
},
{
slug: "square-mask-png",
@@ -39,7 +39,7 @@ export const alphaPages: Page[] = [
description:
"Cuts the image into a rectangle with sides as a share of the smaller side.",
category: "alpha",
steps: [{ id: "square-mask-png" }],
steps: [{ id: "square-mask" }],
},
{
slug: "star-mask-png",
@@ -47,7 +47,7 @@ export const alphaPages: Page[] = [
description:
"Cuts the image into an n-pointed star with adjustable inner radius and rotation.",
category: "alpha",
steps: [{ id: "star-mask-png" }],
steps: [{ id: "star-mask" }],
},
{
slug: "wavy-mask-png",
@@ -55,7 +55,7 @@ export const alphaPages: Page[] = [
description:
"Cuts the image into a wavy-edged circle: radius is modulated by a sine with chosen amplitude and frequency.",
category: "alpha",
steps: [{ id: "wavy-mask-png" }],
steps: [{ id: "wavy-mask" }],
},
{
slug: "remove-alpha-channel-png",
@@ -63,7 +63,7 @@ export const alphaPages: Page[] = [
description:
"Composites the image over a white background and saves without transparency.",
category: "alpha",
steps: [{ id: "remove-alpha-channel-png" }],
steps: [{ id: "remove-alpha-channel" }],
},
{
slug: "set-alpha-channel-png",
@@ -71,14 +71,14 @@ export const alphaPages: Page[] = [
description:
"Assigns the same opacity to all pixels; colors stay unchanged.",
category: "alpha",
steps: [{ id: "set-alpha-channel-png" }],
steps: [{ id: "set-alpha-channel" }],
},
{
slug: "extract-alpha-mask-png",
title: "Extract alpha mask PNG",
description: "Turns transparency into a black-and-white opaque mask.",
category: "alpha",
steps: [{ id: "extract-alpha-mask-png" }],
steps: [{ id: "extract-alpha-mask" }],
},
{
slug: "round-corners-png",
@@ -86,14 +86,14 @@ export const alphaPages: Page[] = [
description:
"Clips corners by a radius set as a percentage of half the smaller side.",
category: "alpha",
steps: [{ id: "round-corners-png" }],
steps: [{ id: "round-corners" }],
},
{
slug: "invert-alpha-png",
title: "Invert alpha PNG",
description: "Opaque areas become transparent and vice versa.",
category: "alpha",
steps: [{ id: "invert-alpha-png" }],
steps: [{ id: "invert-alpha" }],
},
{
slug: "remove-background-png",
@@ -101,14 +101,14 @@ export const alphaPages: Page[] = [
description:
"Removes a solid background: by color with tolerance, outer regions from the edges only, or every matching pixel. Can smooth the boundary.",
category: "alpha",
steps: [{ id: "remove-background-png" }],
steps: [{ id: "remove-background" }],
},
{
slug: "make-thicker-png",
title: "Thicken PNG",
description: "Expands opaque areas by the given number of pixels.",
category: "alpha",
steps: [{ id: "make-thicker-png" }],
steps: [{ id: "make-thicker" }],
},
{
slug: "make-thinner-png",
@@ -116,7 +116,7 @@ export const alphaPages: Page[] = [
description:
"Shrinks opaque areas — thins the strokes of text and details.",
category: "alpha",
steps: [{ id: "make-thinner-png" }],
steps: [{ id: "make-thinner" }],
},
{
slug: "feather-edges-png",
@@ -124,7 +124,7 @@ export const alphaPages: Page[] = [
description:
"Blurs only the alpha channel: hard cutout edges become soft and gradual, colors stay untouched.",
category: "alpha",
steps: [{ id: "feather-edges-png" }],
steps: [{ id: "feather-edges" }],
},
{
slug: "clean-edges-png",
@@ -132,7 +132,7 @@ export const alphaPages: Page[] = [
description:
"Replaces edge-halo colors of semi-transparent pixels with the nearest fully opaque color. Alpha stays as is.",
category: "alpha",
steps: [{ id: "clean-edges-png" }],
steps: [{ id: "clean-edges" }],
},
{
slug: "harden-alpha-png",
@@ -140,7 +140,7 @@ export const alphaPages: Page[] = [
description:
"Binarizes the alpha channel by threshold: semi-transparent pixels become either fully transparent or fully opaque.",
category: "alpha",
steps: [{ id: "harden-alpha-png" }],
steps: [{ id: "harden-alpha" }],
},
{
slug: "despeckle-alpha-png",
@@ -148,13 +148,13 @@ export const alphaPages: Page[] = [
description:
"Opening: removes lone semi-transparent pixels and small specks.",
category: "alpha",
steps: [{ id: "despeckle-alpha-png" }],
steps: [{ id: "despeckle-alpha" }],
},
{
slug: "close-holes-png",
title: "Close holes PNG",
description: "Closing: fills lone transparent dots inside the object.",
category: "alpha",
steps: [{ id: "close-holes-png" }],
steps: [{ id: "close-holes" }],
},
];
web/src/lib/registry/pages/analyze.ts
+12 -12
View File
@@ -7,7 +7,7 @@ export const analyzePages: Page[] = [
description:
"Keeps only pixels close to the chosen color and makes everything else transparent — the inverse of Remove Color.",
category: "analyze",
steps: [{ id: "extract-color-from-png" }],
steps: [{ id: "extract-color-from" }],
},
{
slug: "show-transparent-png",
@@ -15,7 +15,7 @@ export const analyzePages: Page[] = [
description:
"Highlights every transparent or semi-transparent pixel with the chosen color so gaps become obvious.",
category: "analyze",
steps: [{ id: "show-transparent-png" }],
steps: [{ id: "show-transparent" }],
},
{
slug: "show-grayscale-pixels-png",
@@ -23,7 +23,7 @@ export const analyzePages: Page[] = [
description:
"Finds pixels whose channels are nearly equal and renders them as a mask. Tolerance is in channel units.",
category: "analyze",
steps: [{ id: "show-grayscale-pixels-png" }],
steps: [{ id: "show-grayscale-pixels" }],
},
{
slug: "show-color-pixels-png",
@@ -31,21 +31,21 @@ export const analyzePages: Page[] = [
description:
"Finds colored (non-gray) pixels beyond the channel tolerance and renders them as a mask.",
category: "analyze",
steps: [{ id: "show-color-pixels-png" }],
steps: [{ id: "show-color-pixels" }],
},
{
slug: "light-pixel-mask-png",
title: "Light Pixel Mask PNG",
description: "Selects pixels brighter than the luminance threshold.",
category: "analyze",
steps: [{ id: "light-pixel-mask-png" }],
steps: [{ id: "light-pixel-mask" }],
},
{
slug: "dark-pixel-mask-png",
title: "Dark Pixel Mask PNG",
description: "Selects pixels darker than the luminance threshold.",
category: "analyze",
steps: [{ id: "dark-pixel-mask-png" }],
steps: [{ id: "dark-pixel-mask" }],
},
{
slug: "unique-color-mask-png",
@@ -53,7 +53,7 @@ export const analyzePages: Page[] = [
description:
"Selects colors that occur no more than the given number of times — rare and one-off pixels.",
category: "analyze",
steps: [{ id: "unique-color-mask-png" }],
steps: [{ id: "unique-color-mask" }],
},
{
slug: "verify-is-png",
@@ -61,14 +61,14 @@ export const analyzePages: Page[] = [
description:
"Checks the signature of pasted base64 / data-uri content and reports whether it is a real PNG.",
category: "analyze",
steps: [{ id: "verify-is-png" }],
steps: [{ id: "verify-png" }],
},
{
slug: "png-is-grayscale",
title: "Check: is PNG grayscale?",
description: "Reports whether the image consists only of shades of gray.",
category: "analyze",
steps: [{ id: "png-is-grayscale" }],
steps: [{ id: "is-grayscale" }],
},
{
slug: "png-file-size",
@@ -76,7 +76,7 @@ export const analyzePages: Page[] = [
description:
"Encodes the image as PNG and reports the resulting file size.",
category: "analyze",
steps: [{ id: "png-file-size" }],
steps: [{ id: "file-size" }],
},
{
slug: "png-is-transparent",
@@ -84,13 +84,13 @@ export const analyzePages: Page[] = [
description:
"Reports whether the image contains transparent or semi-transparent pixels.",
category: "analyze",
steps: [{ id: "png-is-transparent" }],
steps: [{ id: "is-transparent" }],
},
{
slug: "png-orientation",
title: "PNG orientation",
description: "Reports whether it is portrait, landscape or square.",
category: "analyze",
steps: [{ id: "png-orientation" }],
steps: [{ id: "orientation" }],
},
];
web/src/lib/registry/pages/color.ts
+25 -25
View File
@@ -7,7 +7,7 @@ export const colorPages: Page[] = [
description:
"Recolors the image into two chosen colors by luminance threshold.",
category: "color",
steps: [{ id: "two-colors-png" }],
steps: [{ id: "two-colors" }],
},
{
slug: "gamma-png",
@@ -15,7 +15,7 @@ export const colorPages: Page[] = [
description:
"Corrects midtone brightness. <1 darker, >1 lighter, 1 — unchanged.",
category: "color",
steps: [{ id: "gamma-png" }],
steps: [{ id: "gamma" }],
},
{
slug: "temperature-png",
@@ -23,7 +23,7 @@ export const colorPages: Page[] = [
description:
"Positive values make the image warmer (more orange), negative ones cooler (more blue).",
category: "color",
steps: [{ id: "temperature-png" }],
steps: [{ id: "temperature" }],
},
{
slug: "tint-png",
@@ -31,7 +31,7 @@ export const colorPages: Page[] = [
description:
"Multiplies color channels by the chosen tint with the given strength.",
category: "color",
steps: [{ id: "tint-png" }],
steps: [{ id: "tint" }],
},
{
slug: "quantize-png",
@@ -39,7 +39,7 @@ export const colorPages: Page[] = [
description:
"Reduces the image to k colors via median-cut palette. Transparent pixels are preserved.",
category: "color",
steps: [{ id: "quantize-png" }],
steps: [{ id: "quantize" }],
},
{
slug: "custom-palette-png",
@@ -47,7 +47,7 @@ export const colorPages: Page[] = [
description:
"Maps every pixel to the nearest color from your comma-separated hex list.",
category: "color",
steps: [{ id: "custom-palette-png" }],
steps: [{ id: "custom-palette" }],
},
{
slug: "dithering-png",
@@ -55,7 +55,7 @@ export const colorPages: Page[] = [
description:
"Applies Floyd–Steinberg error diffusion or ordered Bayer dithering while reducing to k colors.",
category: "color",
steps: [{ id: "dithering-png" }],
steps: [{ id: "dithering" }],
},
{
slug: "grayscale-png",
@@ -63,7 +63,7 @@ export const colorPages: Page[] = [
description:
"Converts the image to shades of gray using the BT.601 luminance formula. Alpha is preserved.",
category: "color",
steps: [{ id: "grayscale-png" }],
steps: [{ id: "grayscale" }],
},
{
slug: "invert-colors-png",
@@ -71,7 +71,7 @@ export const colorPages: Page[] = [
description:
"Inverts each color channel (255 − value). Alpha is unchanged.",
category: "color",
steps: [{ id: "invert-colors-png" }],
steps: [{ id: "invert-colors" }],
},
{
slug: "adjust-brightness-contrast-png",
@@ -79,7 +79,7 @@ export const colorPages: Page[] = [
description:
"Adjusts brightness and contrast in the range from −100 to +100. Zero means no change.",
category: "color",
steps: [{ id: "adjust-brightness-contrast-png" }],
steps: [{ id: "adjust-brightness-contrast" }],
},
{
slug: "change-png-opacity",
@@ -87,14 +87,14 @@ export const colorPages: Page[] = [
description:
"Multiplies the alpha channel by a percentage: 0% — fully transparent, 100% — unchanged.",
category: "color",
steps: [{ id: "change-png-opacity" }],
steps: [{ id: "change-opacity" }],
},
{
slug: "sepia-png",
title: "Sepia effect",
description: "Tints the image into the warm brown tones of classic sepia.",
category: "color",
steps: [{ id: "sepia-png" }],
steps: [{ id: "sepia" }],
},
{
slug: "change-png-hue",
@@ -102,7 +102,7 @@ export const colorPages: Page[] = [
description:
"Shifts the hue around the circle. Saturation and lightness are preserved.",
category: "color",
steps: [{ id: "change-png-hue" }],
steps: [{ id: "change-hue" }],
},
{
slug: "extract-channel-png",
@@ -110,7 +110,7 @@ export const colorPages: Page[] = [
description:
"Keeps only the chosen channel — red, green or blue — as shades of gray.",
category: "color",
steps: [{ id: "extract-channel-png" }],
steps: [{ id: "extract-channel" }],
},
{
slug: "swap-channels-png",
@@ -118,7 +118,7 @@ export const colorPages: Page[] = [
description:
"Swaps two color channels — a quick way to get unusual coloring.",
category: "color",
steps: [{ id: "swap-channels-png" }],
steps: [{ id: "swap-channels" }],
},
{
slug: "black-and-white-png",
@@ -126,14 +126,14 @@ export const colorPages: Page[] = [
description:
"Hard binarization by luminance: every pixel becomes black or white.",
category: "color",
steps: [{ id: "black-and-white-png" }],
steps: [{ id: "black-and-white" }],
},
{
slug: "posterize-png",
title: "Posterize PNG",
description: "Reduces the number of levels per channel — a poster effect.",
category: "color",
steps: [{ id: "posterize-png" }],
steps: [{ id: "posterize" }],
},
{
slug: "auto-contrast-png",
@@ -141,7 +141,7 @@ export const colorPages: Page[] = [
description:
"Stretches each channel's range across the full available brightness range.",
category: "color",
steps: [{ id: "auto-contrast-png" }],
steps: [{ id: "auto-contrast" }],
},
{
slug: "decrease-color-count-png",
@@ -149,7 +149,7 @@ export const colorPages: Page[] = [
description:
"Median-cut engine as a quick way to drop to 2–256 colors. Presets marked (extreme/strong/balanced/light) match the classic compression levels.",
category: "color",
steps: [{ id: "decrease-color-count-png" }],
steps: [{ id: "decrease-color-count" }],
},
{
slug: "png-to-hsl",
@@ -157,7 +157,7 @@ export const colorPages: Page[] = [
description:
"Decomposes the image into Hue, Saturation and Lightness components.",
category: "color",
steps: [{ id: "png-to-hsl" }],
steps: [{ id: "to-hsl" }],
},
{
slug: "png-to-hsv",
@@ -165,7 +165,7 @@ export const colorPages: Page[] = [
description:
"Decomposes the image into Hue, Saturation and Value (brightness) components.",
category: "color",
steps: [{ id: "png-to-hsv" }],
steps: [{ id: "to-hsv" }],
},
{
slug: "png-to-hsi",
@@ -173,7 +173,7 @@ export const colorPages: Page[] = [
description:
"Decomposes the image into Hue, Saturation and Intensity components.",
category: "color",
steps: [{ id: "png-to-hsi" }],
steps: [{ id: "to-hsi" }],
},
{
slug: "png-to-cmyk",
@@ -181,7 +181,7 @@ export const colorPages: Page[] = [
description:
"Decomposes the image into print-style Cyan, Magenta, Yellow and Key (black) components.",
category: "color",
steps: [{ id: "png-to-cmyk" }],
steps: [{ id: "to-cmyk" }],
},
{
slug: "png-to-ycbcr",
@@ -189,7 +189,7 @@ export const colorPages: Page[] = [
description:
"Decomposes the image into Luma (Y) and Blue-difference / Red-difference chroma components.",
category: "color",
steps: [{ id: "png-to-ycbcr" }],
steps: [{ id: "to-ycbcr" }],
},
{
slug: "png-to-lab",
@@ -197,6 +197,6 @@ export const colorPages: Page[] = [
description:
"Decomposes the image into perceptual Lightness and green–magenta / blue–yellow opponents.",
category: "color",
steps: [{ id: "png-to-lab" }],
steps: [{ id: "to-lab" }],
},
];
web/src/lib/registry/pages/convert.ts
+14 -14
View File
@@ -7,7 +7,7 @@ export const convertPages: Page[] = [
description:
"Transparency is composited over the chosen backdrop color (white by default) and saved as JPEG.",
category: "convert",
steps: [{ id: "convert-png-to-jpg" }],
steps: [{ id: "to-jpg" }],
},
{
slug: "convert-png-to-webp",
@@ -15,7 +15,7 @@ export const convertPages: Page[] = [
description:
"Re-encodes the image into WebP with adjustable quality. Transparency is preserved.",
category: "convert",
steps: [{ id: "convert-png-to-webp" }],
steps: [{ id: "to-webp" }],
},
{
slug: "png-to-bmp",
@@ -23,7 +23,7 @@ export const convertPages: Page[] = [
description:
"Saves the image as 24-bit BMP without an alpha channel: transparency is replaced with a black background.",
category: "convert",
steps: [{ id: "png-to-bmp" }],
steps: [{ id: "to-bmp" }],
},
{
slug: "png-to-base64",
@@ -31,7 +31,7 @@ export const convertPages: Page[] = [
description:
"Encodes the image into a base64 string for embedding in code or styles.",
category: "convert",
steps: [{ id: "png-to-base64" }],
steps: [{ id: "to-base64" }],
},
{
slug: "png-to-data-uri",
@@ -39,7 +39,7 @@ export const convertPages: Page[] = [
description:
"Builds a full data-uri (data:image/png;base64,…) for embedding in HTML/CSS.",
category: "convert",
steps: [{ id: "png-to-data-uri" }],
steps: [{ id: "to-data-uri" }],
},
{
slug: "png-to-hex",
@@ -47,7 +47,7 @@ export const convertPages: Page[] = [
description:
"Shows all pixels as rrggbbaa hex values — row by row, space separated.",
category: "convert",
steps: [{ id: "png-to-hex" }],
steps: [{ id: "to-hex" }],
},
{
slug: "png-to-bytes",
@@ -55,7 +55,7 @@ export const convertPages: Page[] = [
description:
"Lists every pixel as four decimal bytes (R G B A), one image row per line.",
category: "convert",
steps: [{ id: "png-to-bytes" }],
steps: [{ id: "to-bytes" }],
},
{
slug: "png-to-rgb-values",
@@ -63,7 +63,7 @@ export const convertPages: Page[] = [
description:
"Lists every pixel as rgba(r, g, b, a), one image row per line.",
category: "convert",
steps: [{ id: "png-to-rgb-values" }],
steps: [{ id: "to-rgb-values" }],
},
{
slug: "base64-to-png",
@@ -71,14 +71,14 @@ export const convertPages: Page[] = [
description:
"Decodes a base64 string or data-uri back into an image. Paste the string on the left.",
category: "convert",
steps: [{ id: "base64-to-png" }],
steps: [{ id: "from-base64" }],
},
{
slug: "data-uri-to-png",
title: "Data URI to PNG",
description: "Decodes data:image/…;base64,… back into an image file.",
category: "convert",
steps: [{ id: "data-uri-to-png" }],
steps: [{ id: "from-data-uri" }],
},
{
slug: "hex-to-png",
@@ -86,7 +86,7 @@ export const convertPages: Page[] = [
description:
"Assembles an image from rrggbbaa hex values (space separated). Set the width — the height is computed automatically.",
category: "convert",
steps: [{ id: "hex-to-png" }],
steps: [{ id: "from-hex" }],
},
{
slug: "bytes-to-png",
@@ -94,7 +94,7 @@ export const convertPages: Page[] = [
description:
"Assembles an image from decimal RGBA byte numbers (any separators). Set the width — height is computed automatically.",
category: "convert",
steps: [{ id: "bytes-to-png" }],
steps: [{ id: "from-bytes" }],
},
{
slug: "rgb-values-to-png",
@@ -102,7 +102,7 @@ export const convertPages: Page[] = [
description:
"Assembles an image from rgba(r, g, b, a) numbers. Set the width — height is computed automatically.",
category: "convert",
steps: [{ id: "rgb-values-to-png" }],
steps: [{ id: "from-rgb-values" }],
},
{
slug: "svg-to-png",
@@ -110,6 +110,6 @@ export const convertPages: Page[] = [
description:
"Decodes SVG markup into a raster image. Paste the SVG code on the left.",
category: "convert",
steps: [{ id: "svg-to-png" }],
steps: [{ id: "from-svg" }],
},
];
web/src/lib/registry/pages/filters.ts
+8 -8
View File
@@ -7,7 +7,7 @@ export const filtersPages: Page[] = [
description:
"Gaussian blur: three passes of separable box blur — fast at any radius. Transparent edges do not darken.",
category: "filters",
steps: [{ id: "blur-png" }],
steps: [{ id: "blur" }],
},
{
slug: "sharpen-png",
@@ -15,7 +15,7 @@ export const filtersPages: Page[] = [
description:
"Emphasizes edges with a sharpening kernel; strength sets the blend with the original. 0% means no change.",
category: "filters",
steps: [{ id: "sharpen-png" }],
steps: [{ id: "sharpen" }],
},
{
slug: "silhouette-png",
@@ -23,7 +23,7 @@ export const filtersPages: Page[] = [
description:
"Turns all visible pixels into a single solid color while keeping their transparency — instant silhouette.",
category: "filters",
steps: [{ id: "silhouette-png" }],
steps: [{ id: "silhouette" }],
},
{
slug: "vignette-png",
@@ -31,7 +31,7 @@ export const filtersPages: Page[] = [
description:
"Smoothly darkens the edges of the image, leaving the center untouched.",
category: "filters",
steps: [{ id: "vignette-png" }],
steps: [{ id: "vignette" }],
},
{
slug: "pixelate-png",
@@ -39,7 +39,7 @@ export const filtersPages: Page[] = [
description:
"Averages every blockSize×blockSize area into one color — classic mosaic.",
category: "filters",
steps: [{ id: "pixelate-png" }],
steps: [{ id: "pixelate" }],
},
{
slug: "randomize-pixels-png",
@@ -47,7 +47,7 @@ export const filtersPages: Page[] = [
description:
"Shuffles blocks of the image between positions. Same seed gives the same arrangement.",
category: "filters",
steps: [{ id: "randomize-pixels-png" }],
steps: [{ id: "randomize-pixels" }],
},
{
slug: "add-noise-png",
@@ -55,7 +55,7 @@ export const filtersPages: Page[] = [
description:
"Adds film-grain style noise. Deterministic by seed; monochrome keeps original hue balance.",
category: "filters",
steps: [{ id: "add-noise-png" }],
steps: [{ id: "add-noise" }],
},
{
slug: "jpeg-artifacts-png",
@@ -63,6 +63,6 @@ export const filtersPages: Page[] = [
description:
"Simulates low-quality JPEG re-compression — visible blocks and smeared colors.",
category: "filters",
steps: [{ id: "jpeg-artifacts-png" }],
steps: [{ id: "jpeg-artifacts" }],
},
];
web/src/lib/registry/pages/generate.ts
+21 -21
View File
@@ -7,14 +7,14 @@ export const generatePages: Page[] = [
description:
"Creates a blank canvas of the chosen dimensions, either transparent or filled with a solid color.",
category: "generate",
steps: [{ id: "create-empty-png" }],
steps: [{ id: "create-empty" }],
},
{
slug: "single-color-png",
title: "Create solid color PNG",
description: "Generates a rectangle of the given size and color.",
category: "generate",
steps: [{ id: "single-color-png" }],
steps: [{ id: "single-color" }],
},
{
slug: "random-noise-png",
@@ -22,7 +22,7 @@ export const generatePages: Page[] = [
description:
"Generates an image with random pixels. The seed fixes the result: one seed — one image.",
category: "generate",
steps: [{ id: "random-noise-png" }],
steps: [{ id: "random-noise" }],
},
{
slug: "linear-gradient-png",
@@ -30,7 +30,7 @@ export const generatePages: Page[] = [
description:
"Generates a smooth transition between two colors along a chosen angle.",
category: "generate",
steps: [{ id: "linear-gradient-png" }],
steps: [{ id: "linear-gradient" }],
},
{
slug: "color-spectrum-png",
@@ -38,7 +38,7 @@ export const generatePages: Page[] = [
description:
"Full hue rainbow 0–360° along the chosen axis with adjustable saturation and lightness.",
category: "generate",
steps: [{ id: "color-spectrum-png" }],
steps: [{ id: "color-spectrum" }],
},
{
slug: "random-colors-png",
@@ -46,7 +46,7 @@ export const generatePages: Page[] = [
description:
"Fills the canvas with random vivid color blocks. Deterministic by seed.",
category: "generate",
steps: [{ id: "random-colors-png" }],
steps: [{ id: "random-colors" }],
},
{
slug: "draw-grid-png",
@@ -54,7 +54,7 @@ export const generatePages: Page[] = [
description:
"Draws a grid with custom columns, rows and line width on a transparent or white background.",
category: "generate",
steps: [{ id: "draw-grid-png" }],
steps: [{ id: "draw-grid" }],
},
{
slug: "placeholder-png",
@@ -62,21 +62,21 @@ export const generatePages: Page[] = [
description:
"Generates a placeholder rectangle with its dimensions printed in the center.",
category: "generate",
steps: [{ id: "placeholder-png" }],
steps: [{ id: "placeholder" }],
},
{
slug: "blend-two-png",
title: "Blend Two Colors PNG",
description: "A continuous horizontal gradient between two colors.",
category: "generate",
steps: [{ id: "blend-two-png" }],
steps: [{ id: "blend-two" }],
},
{
slug: "step-colors-png",
title: "Color Steps PNG",
description: "A discrete set of evenly spaced steps between two colors.",
category: "generate",
steps: [{ id: "step-colors-png" }],
steps: [{ id: "step-colors" }],
},
{
slug: "emoji-to-png",
@@ -84,7 +84,7 @@ export const generatePages: Page[] = [
description:
"Renders an emoji or any Unicode symbol as a transparent PNG of the chosen size.",
category: "generate",
steps: [{ id: "emoji-to-png" }],
steps: [{ id: "from-emoji" }],
},
{
slug: "color-wheel-png",
@@ -92,7 +92,7 @@ export const generatePages: Page[] = [
description:
"Generates an HSL color wheel: hue around the circle, saturation from center to edge, chosen lightness.",
category: "generate",
steps: [{ id: "color-wheel-png" }],
steps: [{ id: "color-wheel" }],
},
{
slug: "complementary-png",
@@ -100,14 +100,14 @@ export const generatePages: Page[] = [
description:
"Two opposite colors on the color wheel — the base and its complement.",
category: "generate",
steps: [{ id: "complementary-png" }],
steps: [{ id: "complementary" }],
},
{
slug: "triadic-png",
title: "Triadic Palette PNG",
description: "Three colors evenly spaced 120° apart on the color wheel.",
category: "generate",
steps: [{ id: "triadic-png" }],
steps: [{ id: "triadic" }],
},
{
slug: "tetradic-png",
@@ -115,7 +115,7 @@ export const generatePages: Page[] = [
description:
"Four colors in two complementary pairs, 90° apart on the wheel.",
category: "generate",
steps: [{ id: "tetradic-png" }],
steps: [{ id: "tetradic" }],
},
{
slug: "analogous-png",
@@ -123,7 +123,7 @@ export const generatePages: Page[] = [
description:
"Neighboring hues around the base color — calm, related color scheme.",
category: "generate",
steps: [{ id: "analogous-png" }],
steps: [{ id: "analogous" }],
},
{
slug: "monochromatic-png",
@@ -131,14 +131,14 @@ export const generatePages: Page[] = [
description:
"Tones of a single hue: lightness varies within the chosen range, hue and saturation stay fixed.",
category: "generate",
steps: [{ id: "monochromatic-png" }],
steps: [{ id: "monochromatic" }],
},
{
slug: "shades-png",
title: "Shade Ramp PNG",
description: "A ramp of the base color getting darker step by step.",
category: "generate",
steps: [{ id: "shades-png" }],
steps: [{ id: "shades" }],
},
{
slug: "mix-colors-png",
@@ -146,7 +146,7 @@ export const generatePages: Page[] = [
description:
"Averages the selected colors into one swatch. Colors become one uniform fill.",
category: "generate",
steps: [{ id: "mix-colors-png" }],
steps: [{ id: "mix-colors" }],
},
{
slug: "sort-colors-png",
@@ -154,7 +154,7 @@ export const generatePages: Page[] = [
description:
"Renders the chosen colors as swatches sorted by hue, brightness or saturation.",
category: "generate",
steps: [{ id: "sort-colors-png" }],
steps: [{ id: "sort-colors" }],
},
{
slug: "text-to-png",
@@ -162,6 +162,6 @@ export const generatePages: Page[] = [
description:
"Creates a PNG image from text: the canvas is sized to fit the label plus padding.",
category: "generate",
steps: [{ id: "text-to-png" }],
steps: [{ id: "from-text" }],
},
];
web/src/lib/registry/pages/geometry.ts
+19 -19
View File
@@ -7,7 +7,7 @@ export const geometryPages: Page[] = [
description:
"Draws a colored frame of the chosen thickness around the image.",
category: "geometry",
steps: [{ id: "add-border-png" }],
steps: [{ id: "add-border" }],
},
{
slug: "fit-on-background-png",
@@ -15,7 +15,7 @@ export const geometryPages: Page[] = [
description:
"Places the image centered on a canvas of the given size with a transparent or colored background.",
category: "geometry",
steps: [{ id: "fit-on-background-png" }],
steps: [{ id: "fit-on-background" }],
},
{
slug: "change-canvas-size-png",
@@ -23,7 +23,7 @@ export const geometryPages: Page[] = [
description:
"Sets the exact canvas size: overflow is cropped, missing space is filled with transparency. Anchor picks which part of the image stays.",
category: "geometry",
steps: [{ id: "change-canvas-size-png" }],
steps: [{ id: "change-canvas-size" }],
},
{
slug: "resize-png",
@@ -31,7 +31,7 @@ export const geometryPages: Page[] = [
description:
"Scales the image with bilinear interpolation. With aspect kept, one side defines the scale; if both are set, the image fits inside them.",
category: "geometry",
steps: [{ id: "resize-png" }],
steps: [{ id: "resize" }],
},
{
slug: "crop-png",
@@ -39,21 +39,21 @@ export const geometryPages: Page[] = [
description:
"Cuts out a rectangular area. Coordinates and sizes may go beyond the image — the area is clipped to the intersection.",
category: "geometry",
steps: [{ id: "crop-png" }],
steps: [{ id: "crop" }],
},
{
slug: "rotate-png",
title: "Rotate PNG",
description: "Rotates by 90°, 180° or 270° clockwise without quality loss.",
category: "geometry",
steps: [{ id: "rotate-png" }],
steps: [{ id: "rotate" }],
},
{
slug: "flip-png",
title: "Flip PNG",
description: "Mirrors horizontally or vertically without quality loss.",
category: "geometry",
steps: [{ id: "flip-png" }],
steps: [{ id: "flip" }],
},
{
slug: "add-padding-png",
@@ -61,14 +61,14 @@ export const geometryPages: Page[] = [
description:
"Expands the canvas on all sides by the chosen number of pixels.",
category: "geometry",
steps: [{ id: "add-padding-png" }],
steps: [{ id: "add-padding" }],
},
{
slug: "tile-png",
title: "Tile PNG",
description: "Repeats the image in a grid of the chosen columns and rows.",
category: "geometry",
steps: [{ id: "tile-png" }],
steps: [{ id: "tile" }],
},
{
slug: "split-into-parts-png",
@@ -76,7 +76,7 @@ export const geometryPages: Page[] = [
description:
"Divides the image into a grid of equal-sized parts. The canvas is padded with transparency to keep every part the same size.",
category: "geometry",
steps: [{ id: "split-into-parts-png" }],
steps: [{ id: "split-into-parts" }],
},
{
slug: "center-by-alpha-png",
@@ -84,7 +84,7 @@ export const geometryPages: Page[] = [
description:
"Finds the opaque part of the image and centers it on the original canvas.",
category: "geometry",
steps: [{ id: "center-by-alpha-png" }],
steps: [{ id: "center-by-alpha" }],
},
{
slug: "skew-png",
@@ -92,7 +92,7 @@ export const geometryPages: Page[] = [
description:
"Shifts content horizontally and vertically — a perspective effect.",
category: "geometry",
steps: [{ id: "skew-png" }],
steps: [{ id: "skew" }],
},
{
slug: "rotate-free-png",
@@ -100,7 +100,7 @@ export const geometryPages: Page[] = [
description:
"Rotation by any angle. The canvas grows to fit the new bounds; corners stay transparent.",
category: "geometry",
steps: [{ id: "rotate-free-png" }],
steps: [{ id: "rotate-free" }],
},
{
slug: "zoom-png",
@@ -108,7 +108,7 @@ export const geometryPages: Page[] = [
description:
"Magnifies content toward the center. The canvas keeps its size — edges are cropped.",
category: "geometry",
steps: [{ id: "zoom-png" }],
steps: [{ id: "zoom" }],
},
{
slug: "trim-empty-space-png",
@@ -116,7 +116,7 @@ export const geometryPages: Page[] = [
description:
"Crops transparent borders around the content. Pixels with alpha above the threshold count as content.",
category: "geometry",
steps: [{ id: "trim-empty-space-png" }],
steps: [{ id: "trim-empty-space" }],
},
{
slug: "change-aspect-ratio-png",
@@ -124,7 +124,7 @@ export const geometryPages: Page[] = [
description:
"Fits the image into a target aspect ratio: crop the center to fill, or pad with transparency.",
category: "geometry",
steps: [{ id: "change-aspect-ratio-png" }],
steps: [{ id: "change-aspect-ratio" }],
},
{
slug: "swap-orientation-png",
@@ -132,7 +132,7 @@ export const geometryPages: Page[] = [
description:
"Rotates the image by 90° when its orientation differs from the target — landscape becomes portrait and back. Square images are untouched.",
category: "geometry",
steps: [{ id: "swap-orientation-png" }],
steps: [{ id: "swap-orientation" }],
},
{
slug: "symmetric-copy-png",
@@ -140,13 +140,13 @@ export const geometryPages: Page[] = [
description:
"Doubles the canvas by mirroring the kept side onto the empty half — instant symmetric pattern.",
category: "geometry",
steps: [{ id: "symmetric-copy-png" }],
steps: [{ id: "symmetric-copy" }],
},
{
slug: "shift-png",
title: "Shift PNG",
description: "Moves content by the given X and Y offset.",
category: "geometry",
steps: [{ id: "shift-png" }],
steps: [{ id: "shift" }],
},
];
web/src/lib/registry/pages/text.ts
+3 -3
View File
@@ -7,7 +7,7 @@ export const textPages: Page[] = [
description:
"Draws a text label on the image: font, size, color, bold, position on a 3×3 grid and an optional backing plate.",
category: "text",
steps: [{ id: "add-text-png" }],
steps: [{ id: "add-text" }],
},
{
slug: "date-stamp-png",
@@ -15,7 +15,7 @@ export const textPages: Page[] = [
description:
"Stamps the current date and time using a format string (YYYY MM DD hh mm ss tokens). Same styling options as Add text.",
category: "text",
steps: [{ id: "date-stamp-png" }],
steps: [{ id: "date-stamp" }],
},
{
slug: "watermark-tile-png",
@@ -23,6 +23,6 @@ export const textPages: Page[] = [
description:
"Covers the image with a repeating diagonal semi-transparent text tile — a protection watermark.",
category: "text",
steps: [{ id: "watermark-tile-png" }],
steps: [{ id: "watermark-tile" }],
},
];
web/src/lib/registry/registry.test.ts
+43 -43
View File
@@ -92,7 +92,7 @@ describe("registry-new (переведённые инструменты)", () =>
});
it("guard: input=none работает без источника", async () => {
const tool = TOOLS.find((t) => t.id === "create-empty-png")!;
const tool = TOOLS.find((t) => t.id === "create-empty")!;
const img = asImage(
await tool.run({ params: sanitizeSchemaParams(tool.schema, {}) }),
);
@@ -112,12 +112,12 @@ describe("registry-new (переведённые инструменты)", () =>
it("DOM-dependent tools bypass the worker", () => {
for (const id of [
"png-to-base64",
"png-to-data-uri",
"base64-to-png",
"data-uri-to-png",
"jpeg-artifacts-png",
"placeholder-png",
"to-base64",
"to-data-uri",
"from-base64",
"from-data-uri",
"jpeg-artifacts",
"placeholder",
]) {
expect(TOOLS.find((tool) => tool.id === id)?.domOnly, id).toBe(true);
}
@@ -168,7 +168,7 @@ describe("registry-new (переведённые инструменты)", () =>
it("resize и crop получают размеры текущего source", async () => {
const source = solid(64, 48);
const resize = TOOLS.find((t) => t.id === "resize-png")!;
const resize = TOOLS.find((t) => t.id === "resize")!;
const resizeDefaults = defaultSchemaParams(resize.schema, { source });
expect(resizeDefaults.size).toEqual({ width: 64, height: 48 });
const resized = asImage(
@@ -179,7 +179,7 @@ describe("registry-new (переведённые инструменты)", () =>
);
expect([resized.width, resized.height]).toEqual([64, 48]);
const crop = TOOLS.find((t) => t.id === "crop-png")!;
const crop = TOOLS.find((t) => t.id === "crop")!;
const cropDefaults = defaultSchemaParams(crop.schema, { source });
expect(cropDefaults).toMatchObject({
x: 0,
@@ -196,14 +196,14 @@ describe("registry-new (переведённые инструменты)", () =>
});
it("create-empty: dimension-дефолты корректны", () => {
const tool = TOOLS.find((t) => t.id === "create-empty-png")!;
const tool = TOOLS.find((t) => t.id === "create-empty")!;
const d = defaultSchemaParams(tool.schema);
expect(d.size).toEqual({ width: 800, height: 600 });
expect(d.transparent).toBe(true);
});
it("sanitize клампит dimension к min/max и чинит мусор", () => {
const tool = TOOLS.find((t) => t.id === "create-empty-png")!;
const tool = TOOLS.find((t) => t.id === "create-empty")!;
const s = sanitizeSchemaParams(tool.schema, {
size: { width: 999999, height: -5 },
transparent: false,
@@ -215,7 +215,7 @@ describe("registry-new (переведённые инструменты)", () =>
});
it("executeGenerate для create-empty даёт картинку нужного размера", async () => {
const tool = TOOLS.find((t) => t.id === "create-empty-png")!;
const tool = TOOLS.find((t) => t.id === "create-empty")!;
const params = sanitizeSchemaParams(tool.schema, {
size: { width: 320, height: 200 },
transparent: true,
@@ -228,10 +228,10 @@ describe("registry-new (переведённые инструменты)", () =>
});
it.each([
["single-color-png", { size: { width: 40, height: 30 }, color: "#00ff00" }],
["random-noise-png", { size: { width: 40, height: 30 }, seed: 5 }],
["single-color", { size: { width: 40, height: 30 }, color: "#00ff00" }],
["random-noise", { size: { width: 40, height: 30 }, seed: 5 }],
[
"linear-gradient-png",
"linear-gradient",
{
size: { width: 40, height: 30 },
gradient: {
@@ -242,7 +242,7 @@ describe("registry-new (переведённые инструменты)", () =>
},
],
[
"color-spectrum-png",
"color-spectrum",
{
size: { width: 40, height: 30 },
direction: "horizontal",
@@ -251,11 +251,11 @@ describe("registry-new (переведённые инструменты)", () =>
},
],
[
"random-colors-png",
"random-colors",
{ size: { width: 40, height: 30 }, blockSize: 16, seed: 7 },
],
[
"draw-grid-png",
"draw-grid",
{
size: { width: 40, height: 30 },
cols: 4,
@@ -275,7 +275,7 @@ describe("registry-new (переведённые инструменты)", () =>
});
it("random-noisе детерминирован по seed", async () => {
const tool = TOOLS.find((t) => t.id === "random-noise-png")!;
const tool = TOOLS.find((t) => t.id === "random-noise")!;
const a = asImage(
await tool.run({
params: sanitizeSchemaParams(tool.schema, {
@@ -296,7 +296,7 @@ describe("registry-new (переведённые инструменты)", () =>
});
it("resize: keepAspect с одной стороной сохраняет пропорции", async () => {
const tool = TOOLS.find((t) => t.id === "resize-png")!;
const tool = TOOLS.find((t) => t.id === "resize")!;
const img = solid(100, 50);
const out = asImage(
await tool.run({
@@ -312,7 +312,7 @@ describe("registry-new (переведённые инструменты)", () =>
});
it("crop вырезает область по x/y", async () => {
const tool = TOOLS.find((t) => t.id === "crop-png")!;
const tool = TOOLS.find((t) => t.id === "crop")!;
const img = solid(100, 100);
const out = asImage(
await tool.run({
@@ -329,7 +329,7 @@ describe("registry-new (переведённые инструменты)", () =>
});
it("fit-on-background центрирует картинку на канвасе", async () => {
const tool = TOOLS.find((t) => t.id === "fit-on-background-png")!;
const tool = TOOLS.find((t) => t.id === "fit-on-background")!;
const img = solid(20, 10);
const out = asImage(
await tool.run({
@@ -347,7 +347,7 @@ describe("registry-new (переведённые инструменты)", () =>
});
it("change-canvas-size использует anchor для позиции", async () => {
const tool = TOOLS.find((t) => t.id === "change-canvas-size-png")!;
const tool = TOOLS.find((t) => t.id === "change-canvas-size")!;
const img = solid(10, 10);
const out = asImage(
await tool.run({
@@ -367,7 +367,7 @@ describe("registry-new (переведённые инструменты)", () =>
});
it("blend-two: дефолты пары и работа генератора", async () => {
const tool = TOOLS.find((t) => t.id === "blend-two-png")!;
const tool = TOOLS.find((t) => t.id === "blend-two")!;
const d = defaultSchemaParams(tool.schema);
expect(d.pair).toEqual({ from: "#000000", to: "#ffffff" });
const img = asImage(
@@ -382,7 +382,7 @@ describe("registry-new (переведённые инструменты)", () =>
});
it("step-colors: рендерит steps полос по паре", async () => {
const tool = TOOLS.find((t) => t.id === "step-colors-png")!;
const tool = TOOLS.find((t) => t.id === "step-colors")!;
const img = asImage(
await tool.run({
params: sanitizeSchemaParams(tool.schema, {
@@ -397,7 +397,7 @@ describe("registry-new (переведённые инструменты)", () =>
});
it("two-colors: перекрашивает светлые/тёмные пиксели по паре", async () => {
const tool = TOOLS.find((t) => t.id === "two-colors-png")!;
const tool = TOOLS.find((t) => t.id === "two-colors")!;
// 50×1, левая половина тёмная, правая светлая
const data = new Uint8ClampedArray(50 * 4).fill(255);
const img = { width: 50, height: 1, data };
@@ -426,7 +426,7 @@ describe("registry-new (переведённые инструменты)", () =>
});
it("linear-gradient: дефолты gradient и направление по углу", async () => {
const tool = TOOLS.find((t) => t.id === "linear-gradient-png")!;
const tool = TOOLS.find((t) => t.id === "linear-gradient")!;
const d = defaultSchemaParams(tool.schema);
expect(d.gradient).toEqual({
from: "#000000",
@@ -469,7 +469,7 @@ describe("registry-new (переведённые инструменты)", () =>
});
it("sanitize чинит мусор в gradient и клампит angle в 0..360", () => {
const tool = TOOLS.find((t) => t.id === "linear-gradient-png")!;
const tool = TOOLS.find((t) => t.id === "linear-gradient")!;
const s = sanitizeSchemaParams(tool.schema, {
size: { width: 10, height: 10 },
gradient: {
@@ -487,7 +487,7 @@ describe("registry-new (переведённые инструменты)", () =>
});
it("sanitize чинит мусор в паре и клампит threshold", () => {
const tool = TOOLS.find((t) => t.id === "two-colors-png")!;
const tool = TOOLS.find((t) => t.id === "two-colors")!;
const s = sanitizeSchemaParams(tool.schema, {
pair: { from: "not-a-color", to: "#00ff00", extra: 1 },
threshold: 999,
@@ -497,7 +497,7 @@ describe("registry-new (переведённые инструменты)", () =>
});
it("circle-mask: срезает углы и сохраняет центр", async () => {
const tool = TOOLS.find((t) => t.id === "circle-mask-png")!;
const tool = TOOLS.find((t) => t.id === "circle-mask")!;
const img = asImage(
await tool.run({
source: solid(100, 100),
@@ -514,7 +514,7 @@ describe("registry-new (переведённые инструменты)", () =>
});
it("circle-mask: offset сдвигает фигуру", async () => {
const tool = TOOLS.find((t) => t.id === "circle-mask-png")!;
const tool = TOOLS.find((t) => t.id === "circle-mask")!;
const img = asImage(
await tool.run({
source: solid(100, 100),
@@ -530,7 +530,7 @@ describe("registry-new (переведённые инструменты)", () =>
});
it("star-mask: сохраняет центр, режет углы", async () => {
const tool = TOOLS.find((t) => t.id === "star-mask-png")!;
const tool = TOOLS.find((t) => t.id === "star-mask")!;
const img = asImage(
await tool.run({
source: solid(100, 100),
@@ -548,7 +548,7 @@ describe("registry-new (переведённые инструменты)", () =>
});
it("sanitize клампит offset к min/max и чинит мусор", () => {
const tool = TOOLS.find((t) => t.id === "wavy-mask-png")!;
const tool = TOOLS.find((t) => t.id === "wavy-mask")!;
const s = sanitizeSchemaParams(tool.schema, {
size: 90,
amplitude: 8,
@@ -563,7 +563,7 @@ describe("registry-new (переведённые инструменты)", () =>
});
it("add-text: дефолты position9, font-style, plate и текстовых полей", () => {
const tool = TOOLS.find((t) => t.id === "add-text-png")!;
const tool = TOOLS.find((t) => t.id === "add-text")!;
const d = defaultSchemaParams(tool.schema);
expect(d.position).toBe("bottom-right");
expect(d.text).toBe("Hello!");
@@ -581,7 +581,7 @@ describe("registry-new (переведённые инструменты)", () =>
});
it("sanitize чинит мусор в position9, font-style, plate и оставляет валидные значения", () => {
const tool = TOOLS.find((t) => t.id === "date-stamp-png")!;
const tool = TOOLS.find((t) => t.id === "date-stamp")!;
const s = sanitizeSchemaParams(tool.schema, {
format: "YYYY-MM-DD",
style: {
@@ -624,8 +624,8 @@ describe("registry-new (переведённые инструменты)", () =>
});
});
it("text-to-png: дефолты font-style и sanitize", () => {
const tool = TOOLS.find((t) => t.id === "text-to-png")!;
it("from-text: дефолты font-style и sanitize", () => {
const tool = TOOLS.find((t) => t.id === "from-text")!;
const d = defaultSchemaParams(tool.schema);
expect(d.style).toEqual({
font: "sans",
@@ -647,9 +647,9 @@ describe("registry-new (переведённые инструменты)", () =>
});
});
describe("split-into-parts-png", () => {
describe("split-into-parts", () => {
it("объявлен с result=files и дефолтом 2x2", () => {
const tool = TOOLS.find((t) => t.id === "split-into-parts-png")!;
const tool = TOOLS.find((t) => t.id === "split-into-parts")!;
expect(tool).toBeDefined();
expect(tool.result).toBe("files");
const defaults = sanitizeSchemaParams(tool.schema, {});
@@ -658,7 +658,7 @@ describe("split-into-parts-png", () => {
});
it("на ровном размере даёт cols*rows частей одинакового размера", async () => {
const tool = TOOLS.find((t) => t.id === "split-into-parts-png")!;
const tool = TOOLS.find((t) => t.id === "split-into-parts")!;
const files = asFiles(
await tool.run({
source: solid(100, 100),
@@ -682,7 +682,7 @@ describe("split-into-parts-png", () => {
});
it("на неделимом размере части строго равные (канвас дополняется)", async () => {
const tool = TOOLS.find((t) => t.id === "split-into-parts-png")!;
const tool = TOOLS.find((t) => t.id === "split-into-parts")!;
const files = asFiles(
await tool.run({
source: solid(101, 77),
@@ -700,7 +700,7 @@ describe("split-into-parts-png", () => {
});
it("работает максимум 6x6 = 36 частей", async () => {
const tool = TOOLS.find((t) => t.id === "split-into-parts-png")!;
const tool = TOOLS.find((t) => t.id === "split-into-parts")!;
const files = asFiles(
await tool.run({
source: solid(120, 120),
@@ -714,7 +714,7 @@ describe("split-into-parts-png", () => {
});
it("выбрасывает errors.tooManyParts при переполнении", () => {
const tool = TOOLS.find((t) => t.id === "split-into-parts-png")!;
const tool = TOOLS.find((t) => t.id === "split-into-parts")!;
expect(() =>
tool.run({
source: solid(120, 120),
web/src/lib/registry/tools/alpha.ts
+20 -20
View File
@@ -45,7 +45,7 @@ export const addStrokeSchema = toolSchema<AddStrokeParams>({
});
const addStroke: Tool<AddStrokeParams> = {
id: "add-stroke-png",
id: "add-stroke",
schema: addStrokeSchema,
input: "image",
run: imgTool((img, p) => strokeImage(img, p.thickness, p.color)),
@@ -68,7 +68,7 @@ export const findContourSchema = toolSchema<FindContourParams>({
});
const findContour: Tool<FindContourParams> = {
id: "find-contour-png",
id: "find-contour",
schema: findContourSchema,
input: "image",
run: imgTool((img, p) => contourImage(img, p.thickness, p.color)),
@@ -91,7 +91,7 @@ export const removeColorSchema = toolSchema<RemoveColorParams>({
});
const removeColor: Tool<RemoveColorParams> = {
id: "remove-color-from-png",
id: "remove-color-from",
schema: removeColorSchema,
input: "image",
run: imgTool((img, p) => removeColorToAlpha(img, p.targetColor, p.tolerance)),
@@ -130,7 +130,7 @@ const circleMaskSchema = toolSchema<CircleMaskParams>(
);
const circleMask: Tool<CircleMaskParams> = {
id: "circle-mask-png",
id: "circle-mask",
schema: circleMaskSchema,
input: "image",
run: imgTool((img, p) =>
@@ -188,7 +188,7 @@ const squareMaskSchema = toolSchema<SquareMaskParams>(
);
const squareMask: Tool<SquareMaskParams> = {
id: "square-mask-png",
id: "square-mask",
schema: squareMaskSchema,
input: "image",
run: imgTool((img, p) =>
@@ -262,7 +262,7 @@ const starMaskSchema = toolSchema<StarMaskParams>(
);
const starMask: Tool<StarMaskParams> = {
id: "star-mask-png",
id: "star-mask",
schema: starMaskSchema,
input: "image",
run: imgTool((img, p) =>
@@ -336,7 +336,7 @@ const wavyMaskSchema = toolSchema<WavyMaskParams>(
);
const wavyMask: Tool<WavyMaskParams> = {
id: "wavy-mask-png",
id: "wavy-mask",
schema: wavyMaskSchema,
input: "image",
run: imgTool((img, p) =>
@@ -354,7 +354,7 @@ interface EmptyParams {}
export const removeAlphaChannelSchema = toolSchema<EmptyParams>({});
const removeAlphaChannel: Tool<EmptyParams> = {
id: "remove-alpha-channel-png",
id: "remove-alpha-channel",
schema: removeAlphaChannelSchema,
input: "image",
run: imgTool((img) => flattenOntoColor(img, "#ffffff")),
@@ -375,7 +375,7 @@ export const setAlphaChannelSchema = toolSchema<SetAlphaChannelParams>({
});
const setAlphaChannelTool: Tool<SetAlphaChannelParams> = {
id: "set-alpha-channel-png",
id: "set-alpha-channel",
schema: setAlphaChannelSchema,
input: "image",
run: imgTool((img, p) => setAlphaChannel(img, p.percent)),
@@ -384,7 +384,7 @@ const setAlphaChannelTool: Tool<SetAlphaChannelParams> = {
export const extractAlphaMaskSchema = toolSchema<EmptyParams>({});
const extractAlphaMaskTool: Tool<EmptyParams> = {
id: "extract-alpha-mask-png",
id: "extract-alpha-mask",
schema: extractAlphaMaskSchema,
input: "image",
run: imgTool((img) => extractAlphaMask(img)),
@@ -405,7 +405,7 @@ export const roundCornersSchema = toolSchema<RoundCornersParams>({
});
const roundCornersTool: Tool<RoundCornersParams> = {
id: "round-corners-png",
id: "round-corners",
schema: roundCornersSchema,
input: "image",
run: imgTool((img, p) => roundCorners(img, p.radius)),
@@ -414,7 +414,7 @@ const roundCornersTool: Tool<RoundCornersParams> = {
export const invertAlphaSchema = toolSchema<EmptyParams>({});
const invertAlphaTool: Tool<EmptyParams> = {
id: "invert-alpha-png",
id: "invert-alpha",
schema: invertAlphaSchema,
input: "image",
run: imgTool((img) => invertAlpha(img)),
@@ -461,7 +461,7 @@ export const removeBackgroundSchema = toolSchema<RemoveBackgroundParams>(
);
const removeBackgroundTool: Tool<RemoveBackgroundParams> = {
id: "remove-background-png",
id: "remove-background",
schema: removeBackgroundSchema,
input: "image",
run: imgTool((img, p) =>
@@ -489,7 +489,7 @@ export const makeThickerSchema = toolSchema<MakeThickerParams>({
});
const makeThickerTool: Tool<MakeThickerParams> = {
id: "make-thicker-png",
id: "make-thicker",
schema: makeThickerSchema,
input: "image",
run: imgTool((img, p) => dilateImage(img, p.radius)),
@@ -510,7 +510,7 @@ export const makeThinnerSchema = toolSchema<MakeThinnerParams>({
});
const makeThinnerTool: Tool<MakeThinnerParams> = {
id: "make-thinner-png",
id: "make-thinner",
schema: makeThinnerSchema,
input: "image",
run: imgTool((img, p) => erodeImage(img, p.radius)),
@@ -531,7 +531,7 @@ export const featherEdgesSchema = toolSchema<FeatherEdgesParams>({
});
const featherEdgesTool: Tool<FeatherEdgesParams> = {
id: "feather-edges-png",
id: "feather-edges",
schema: featherEdgesSchema,
input: "image",
run: imgTool((img, p) => featherAlpha(img, p.radius)),
@@ -552,7 +552,7 @@ export const cleanEdgesSchema = toolSchema<CleanEdgesParams>({
});
const cleanEdgesTool: Tool<CleanEdgesParams> = {
id: "clean-edges-png",
id: "clean-edges",
schema: cleanEdgesSchema,
input: "image",
run: imgTool((img, p) => defringe(img, p.radius)),
@@ -573,7 +573,7 @@ export const hardenAlphaSchema = toolSchema<HardenAlphaParams>({
});
const hardenAlphaTool: Tool<HardenAlphaParams> = {
id: "harden-alpha-png",
id: "harden-alpha",
schema: hardenAlphaSchema,
input: "image",
run: imgTool((img, p) => hardenAlpha(img, p.threshold)),
@@ -594,7 +594,7 @@ export const despeckleAlphaSchema = toolSchema<DespeckleAlphaParams>({
});
const despeckleAlphaTool: Tool<DespeckleAlphaParams> = {
id: "despeckle-alpha-png",
id: "despeckle-alpha",
schema: despeckleAlphaSchema,
input: "image",
run: imgTool((img, p) => openingImage(img, p.radius)),
@@ -615,7 +615,7 @@ export const closeHolesSchema = toolSchema<CloseHolesParams>({
});
const closeHolesTool: Tool<CloseHolesParams> = {
id: "close-holes-png",
id: "close-holes",
schema: closeHolesSchema,
input: "image",
run: imgTool((img, p) => closingImage(img, p.radius)),
web/src/lib/registry/tools/analyze.ts
+12 -12
View File
@@ -32,7 +32,7 @@ export const extractColorSchema = toolSchema<ExtractColorParams>({
});
const extractColor: Tool<ExtractColorParams> = {
id: "extract-color-from-png",
id: "extract-color-from",
schema: extractColorSchema,
input: "image",
run: imgTool((img, p) => extractByColor(img, p.color, p.tolerance)),
@@ -88,7 +88,7 @@ export const showTransparentSchema = toolSchema<MaskParams>({
});
const showTransparent: Tool<MaskParams> = {
id: "show-transparent-png",
id: "show-transparent",
schema: showTransparentSchema,
input: "image",
run: imgTool((img, p) => renderMask(img, p, (_r, _g, _b, a) => a < 255)),
@@ -110,7 +110,7 @@ export const showGrayscalePixelsSchema = toolSchema<GrayscalePixelsParams>({
});
const showGrayscalePixels: Tool<GrayscalePixelsParams> = {
id: "show-grayscale-pixels-png",
id: "show-grayscale-pixels",
schema: showGrayscalePixelsSchema,
input: "image",
run: imgTool((img, p) =>
@@ -134,7 +134,7 @@ export const showColorPixelsSchema = toolSchema<ColorPixelsParams>({
});
const showColorPixels: Tool<ColorPixelsParams> = {
id: "show-color-pixels-png",
id: "show-color-pixels",
schema: showColorPixelsSchema,
input: "image",
run: imgTool((img, p) =>
@@ -158,7 +158,7 @@ export const lightPixelMaskSchema = toolSchema<LightPixelParams>({
});
const lightPixelMask: Tool<LightPixelParams> = {
id: "light-pixel-mask-png",
id: "light-pixel-mask",
schema: lightPixelMaskSchema,
input: "image",
run: imgTool((img, p) =>
@@ -182,7 +182,7 @@ export const darkPixelMaskSchema = toolSchema<DarkPixelParams>({
});
const darkPixelMask: Tool<DarkPixelParams> = {
id: "dark-pixel-mask-png",
id: "dark-pixel-mask",
schema: darkPixelMaskSchema,
input: "image",
run: imgTool((img, p) =>
@@ -206,7 +206,7 @@ export const uniqueColorMaskSchema = toolSchema<UniqueColorParams>({
});
const uniqueColorMask: Tool<UniqueColorParams> = {
id: "unique-color-mask-png",
id: "unique-color-mask",
schema: uniqueColorMaskSchema,
input: "image",
run: imgTool((img, p) => renderMask(img, p, rarityPredicate(img, p.rarity))),
@@ -217,7 +217,7 @@ interface NoParams {}
const emptySchema = toolSchema<NoParams>({});
const verifyIsPng: Tool<NoParams> = {
id: "verify-is-png",
id: "verify-png",
schema: emptySchema,
input: "text",
result: "verdict",
@@ -227,7 +227,7 @@ const verifyIsPng: Tool<NoParams> = {
};
const pngIsGrayscale: Tool<NoParams> = {
id: "png-is-grayscale",
id: "is-grayscale",
schema: emptySchema,
input: "image",
result: "verdict",
@@ -235,7 +235,7 @@ const pngIsGrayscale: Tool<NoParams> = {
};
const pngFileSize: Tool<NoParams> = {
id: "png-file-size",
id: "file-size",
schema: emptySchema,
domOnly: true,
input: "image",
@@ -249,7 +249,7 @@ const pngFileSize: Tool<NoParams> = {
};
const pngIsTransparent: Tool<NoParams> = {
id: "png-is-transparent",
id: "is-transparent",
schema: emptySchema,
input: "image",
result: "verdict",
@@ -259,7 +259,7 @@ const pngIsTransparent: Tool<NoParams> = {
};
const pngOrientation: Tool<NoParams> = {
id: "png-orientation",
id: "orientation",
schema: emptySchema,
input: "image",
result: "verdict",
web/src/lib/registry/tools/color.ts
+20 -20
View File
@@ -44,7 +44,7 @@ export const twoColorsSchema = toolSchema<TwoColorsParams>({
});
const twoColorsTool: Tool<TwoColorsParams> = {
id: "two-colors-png",
id: "two-colors",
schema: twoColorsSchema,
input: "image",
run: imgTool((img, p) => twoColors(img, p.pair.from, p.pair.to, p.threshold)),
@@ -65,7 +65,7 @@ export const gammaSchema = toolSchema<GammaParams>({
});
const gammaTool: Tool<GammaParams> = {
id: "gamma-png",
id: "gamma",
schema: gammaSchema,
input: "image",
run: imgTool((img, p) => gammaCorrection(img, p.value)),
@@ -86,7 +86,7 @@ export const temperatureSchema = toolSchema<TemperatureParams>({
});
const temperatureTool: Tool<TemperatureParams> = {
id: "temperature-png",
id: "temperature",
schema: temperatureSchema,
input: "image",
run: imgTool((img, p) => temperature(img, p.percent)),
@@ -109,7 +109,7 @@ export const tintSchema = toolSchema<TintParams>({
});
const tintTool: Tool<TintParams> = {
id: "tint-png",
id: "tint",
schema: tintSchema,
input: "image",
run: imgTool((img, p) => tint(img, p.color, p.strength)),
@@ -130,7 +130,7 @@ export const quantizeSchema = toolSchema<QuantizeParams>({
});
const quantizeTool: Tool<QuantizeParams> = {
id: "quantize-png",
id: "quantize",
schema: quantizeSchema,
input: "image",
run: imgTool((img, p) => quantizeImage(img, p.colors).image),
@@ -145,7 +145,7 @@ export const customPaletteSchema = toolSchema<CustomPaletteParams>({
});
const customPalette: Tool<CustomPaletteParams> = {
id: "custom-palette-png",
id: "custom-palette",
schema: customPaletteSchema,
input: "image",
run: imgTool((img, p) => mapToNearest(img, parseHexList(p.colors))),
@@ -175,7 +175,7 @@ export const ditheringSchema = toolSchema<DitheringParams>({
});
const ditheringTool: Tool<DitheringParams> = {
id: "dithering-png",
id: "dithering",
schema: ditheringSchema,
input: "image",
run: imgTool((img, p) => ditherImage(img, p.colors, p.pattern)),
@@ -186,7 +186,7 @@ interface EmptyParams {}
export const grayscaleSchema = toolSchema<EmptyParams>({});
const grayscaleTool: Tool<EmptyParams> = {
id: "grayscale-png",
id: "grayscale",
schema: grayscaleSchema,
input: "image",
run: imgTool((img) => grayscale(img)),
@@ -195,7 +195,7 @@ const grayscaleTool: Tool<EmptyParams> = {
export const invertColorsSchema = toolSchema<EmptyParams>({});
const invertColorsTool: Tool<EmptyParams> = {
id: "invert-colors-png",
id: "invert-colors",
schema: invertColorsSchema,
input: "image",
run: imgTool((img) => invert(img)),
@@ -233,7 +233,7 @@ export const brightnessContrastSchema = toolSchema<BrightnessContrastParams>(
);
const brightnessContrastTool: Tool<BrightnessContrastParams> = {
id: "adjust-brightness-contrast-png",
id: "adjust-brightness-contrast",
schema: brightnessContrastSchema,
input: "image",
run: imgTool((img, p) => brightnessContrast(img, p.brightness, p.contrast)),
@@ -254,7 +254,7 @@ export const opacitySchema = toolSchema<OpacityParams>({
});
const opacityTool: Tool<OpacityParams> = {
id: "change-png-opacity",
id: "change-opacity",
schema: opacitySchema,
input: "image",
run: imgTool((img, p) => setOpacity(img, p.percent)),
@@ -263,7 +263,7 @@ const opacityTool: Tool<OpacityParams> = {
export const sepiaSchema = toolSchema<EmptyParams>({});
const sepiaTool: Tool<EmptyParams> = {
id: "sepia-png",
id: "sepia",
schema: sepiaSchema,
input: "image",
run: imgTool((img) => sepia(img)),
@@ -284,7 +284,7 @@ export const hueShiftSchema = toolSchema<HueShiftParams>({
});
const hueShiftTool: Tool<HueShiftParams> = {
id: "change-png-hue",
id: "change-hue",
schema: hueShiftSchema,
input: "image",
run: imgTool((img, p) => changeHue(img, p.degrees)),
@@ -307,7 +307,7 @@ export const extractChannelSchema = toolSchema<ExtractChannelParams>({
});
const extractChannelTool: Tool<ExtractChannelParams> = {
id: "extract-channel-png",
id: "extract-channel",
schema: extractChannelSchema,
input: "image",
run: imgTool((img, p) => extractChannel(img, p.channel)),
@@ -330,7 +330,7 @@ export const swapChannelsSchema = toolSchema<SwapChannelsParams>({
});
const swapChannelsTool: Tool<SwapChannelsParams> = {
id: "swap-channels-png",
id: "swap-channels",
schema: swapChannelsSchema,
input: "image",
run: imgTool((img, p) => swapChannels(img, p.pair)),
@@ -351,7 +351,7 @@ export const blackAndWhiteSchema = toolSchema<BlackAndWhiteParams>({
});
const blackAndWhiteTool: Tool<BlackAndWhiteParams> = {
id: "black-and-white-png",
id: "black-and-white",
schema: blackAndWhiteSchema,
input: "image",
run: imgTool((img, p) => thresholdBlackWhite(img, p.threshold)),
@@ -372,7 +372,7 @@ export const posterizeSchema = toolSchema<PosterizeParams>({
});
const posterizeTool: Tool<PosterizeParams> = {
id: "posterize-png",
id: "posterize",
schema: posterizeSchema,
input: "image",
run: imgTool((img, p) => posterize(img, p.levels)),
@@ -381,7 +381,7 @@ const posterizeTool: Tool<PosterizeParams> = {
export const autoContrastSchema = toolSchema<EmptyParams>({});
const autoContrastTool: Tool<EmptyParams> = {
id: "auto-contrast-png",
id: "auto-contrast",
schema: autoContrastSchema,
input: "image",
run: imgTool((img) => autoContrast(img)),
@@ -413,7 +413,7 @@ export const decreaseColorCountSchema = toolSchema<DecreaseColorCountParams>({
});
const decreaseColorCountTool: Tool<DecreaseColorCountParams> = {
id: "decrease-color-count-png",
id: "decrease-color-count",
schema: decreaseColorCountSchema,
input: "image",
run: imgTool((img, p) => quantizeImage(img, Number(p.maxColors)).image),
@@ -432,7 +432,7 @@ function channelEntries(): Tool<ChannelParams>[] {
return CHANNEL_SPACES.map((space) => {
const components = SPACES[space].components;
return {
id: `png-to-${space}`,
id: `to-${space}`,
schema: toolSchema<ChannelParams>({
component: field.select({
label: "fields.component",
web/src/lib/registry/tools/convert.ts
+14 -14
View File
@@ -39,7 +39,7 @@ export const convertToJpgSchema = toolSchema<ConvertToJpgParams>({
});
const convertToJpg: Tool<ConvertToJpgParams> = {
id: "convert-png-to-jpg",
id: "to-jpg",
schema: convertToJpgSchema,
input: "image",
run: imgTool((img, p) => flattenOntoColor(img, p.background)),
@@ -61,7 +61,7 @@ export const convertToWebpSchema = toolSchema<ConvertToWebpParams>({
});
const convertToWebp: Tool<ConvertToWebpParams> = {
id: "convert-png-to-webp",
id: "to-webp",
schema: convertToWebpSchema,
input: "image",
run: imgTool((img) => clonePixelImage(img)),
@@ -73,7 +73,7 @@ interface ConvertToBmpParams {}
export const convertToBmpSchema = toolSchema<ConvertToBmpParams>({});
const convertToBmp: Tool<ConvertToBmpParams> = {
id: "png-to-bmp",
id: "to-bmp",
schema: convertToBmpSchema,
input: "image",
run: imgTool((img) => flattenOntoColor(img, "#000000")),
@@ -85,7 +85,7 @@ interface NoParams {}
const emptySchema = toolSchema<NoParams>({});
const pngToBase64: Tool<NoParams> = {
id: "png-to-base64",
id: "to-base64",
schema: emptySchema,
input: "image",
result: "text",
@@ -94,7 +94,7 @@ const pngToBase64: Tool<NoParams> = {
};
const pngToDataUri: Tool<NoParams> = {
id: "png-to-data-uri",
id: "to-data-uri",
schema: emptySchema,
input: "image",
result: "text",
@@ -103,7 +103,7 @@ const pngToDataUri: Tool<NoParams> = {
};
const pngToHex: Tool<NoParams> = {
id: "png-to-hex",
id: "to-hex",
schema: emptySchema,
input: "image",
result: "text",
@@ -111,7 +111,7 @@ const pngToHex: Tool<NoParams> = {
};
const pngToBytes: Tool<NoParams> = {
id: "png-to-bytes",
id: "to-bytes",
schema: emptySchema,
input: "image",
result: "text",
@@ -119,7 +119,7 @@ const pngToBytes: Tool<NoParams> = {
};
const pngToRgbValues: Tool<NoParams> = {
id: "png-to-rgb-values",
id: "to-rgb-values",
schema: emptySchema,
input: "image",
result: "text",
@@ -127,7 +127,7 @@ const pngToRgbValues: Tool<NoParams> = {
};
const base64ToPng: Tool<NoParams> = {
id: "base64-to-png",
id: "from-base64",
schema: emptySchema,
input: "text",
domOnly: true,
@@ -135,7 +135,7 @@ const base64ToPng: Tool<NoParams> = {
};
const dataUriToPng: Tool<NoParams> = {
id: "data-uri-to-png",
id: "from-data-uri",
schema: emptySchema,
input: "text",
domOnly: true,
@@ -151,7 +151,7 @@ export const hexToPngSchema = toolSchema<HexToPngParams>({
});
const hexToPng: Tool<HexToPngParams> = {
id: "hex-to-png",
id: "from-hex",
schema: hexToPngSchema,
input: "text",
run: textGen((text, p) => hexToPixels(text, Math.trunc(p.width))),
@@ -166,7 +166,7 @@ export const bytesToPngSchema = toolSchema<BytesToPngParams>({
});
const bytesToPng: Tool<BytesToPngParams> = {
id: "bytes-to-png",
id: "from-bytes",
schema: bytesToPngSchema,
input: "text",
run: textGen((text, p) => bytesToImage(text, Math.trunc(p.width))),
@@ -181,7 +181,7 @@ export const rgbValuesToPngSchema = toolSchema<RgbValuesToPngParams>({
});
const rgbValuesToPng: Tool<RgbValuesToPngParams> = {
id: "rgb-values-to-png",
id: "from-rgb-values",
schema: rgbValuesToPngSchema,
input: "text",
run: textGen((text, p) => rgbValuesToImage(text, Math.trunc(p.width))),
@@ -196,7 +196,7 @@ export const svgToPngSchema = toolSchema<SvgToPngParams>({
});
const svgToPng: Tool<SvgToPngParams> = {
id: "svg-to-png",
id: "from-svg",
schema: svgToPngSchema,
input: "text",
domOnly: true,
web/src/lib/registry/tools/filters.ts
+8 -8
View File
@@ -25,7 +25,7 @@ export const blurSchema = toolSchema<BlurParams>({
});
const blurTool: Tool<BlurParams> = {
id: "blur-png",
id: "blur",
schema: blurSchema,
input: "image",
run: imgTool((img, p) => gaussianBlur(img, p.radius)),
@@ -46,7 +46,7 @@ export const sharpenSchema = toolSchema<SharpenParams>({
});
const sharpenTool: Tool<SharpenParams> = {
id: "sharpen-png",
id: "sharpen",
schema: sharpenSchema,
input: "image",
run: imgTool((img, p) => sharpenImage(img, p.strength)),
@@ -69,7 +69,7 @@ export const silhouetteSchema = toolSchema<SilhouetteParams>({
});
const silhouetteTool: Tool<SilhouetteParams> = {
id: "silhouette-png",
id: "silhouette",
schema: silhouetteSchema,
input: "image",
run: imgTool((img, p) => silhouette(img, p.color, p.threshold * 2.55)),
@@ -90,7 +90,7 @@ export const vignetteSchema = toolSchema<VignetteParams>({
});
const vignetteTool: Tool<VignetteParams> = {
id: "vignette-png",
id: "vignette",
schema: vignetteSchema,
input: "image",
run: imgTool((img, p) => vignette(img, p.strength)),
@@ -111,7 +111,7 @@ export const pixelateSchema = toolSchema<PixelateParams>({
});
const pixelateTool: Tool<PixelateParams> = {
id: "pixelate-png",
id: "pixelate",
schema: pixelateSchema,
input: "image",
run: imgTool((img, p) => pixelate(img, p.blockSize)),
@@ -149,7 +149,7 @@ export const randomizePixelsSchema = toolSchema<RandomizePixelsParams>(
);
const randomizePixels: Tool<RandomizePixelsParams> = {
id: "randomize-pixels-png",
id: "randomize-pixels",
schema: randomizePixelsSchema,
input: "image",
run: imgTool((img, p) => shuffleBlocks(img, p.blockSize, p.seed)),
@@ -197,7 +197,7 @@ export const addNoiseSchema = toolSchema<AddNoiseParams>(
);
const addNoiseTool: Tool<AddNoiseParams> = {
id: "add-noise-png",
id: "add-noise",
schema: addNoiseSchema,
input: "image",
run: imgTool((img, p) => addNoise(img, p.amount, p.mode, p.seed)),
@@ -218,7 +218,7 @@ export const jpegArtifactsSchema = toolSchema<JpegArtifactsParams>({
});
const jpegArtifacts: Tool<JpegArtifactsParams> = {
id: "jpeg-artifacts-png",
id: "jpeg-artifacts",
schema: jpegArtifactsSchema,
input: "image",
domOnly: true,
web/src/lib/registry/tools/generate.ts
+21 -21
View File
@@ -105,7 +105,7 @@ export const createEmptySchema = toolSchema<CreateEmptyParams>(
);
const createEmpty: Tool<CreateEmptyParams> = {
id: "create-empty-png",
id: "create-empty",
schema: createEmptySchema,
input: "none",
run: genTool((p) => {
@@ -135,7 +135,7 @@ export const singleColorSchema = toolSchema<SingleColorParams>({
});
const singleColor: Tool<SingleColorParams> = {
id: "single-color-png",
id: "single-color",
schema: singleColorSchema,
input: "none",
run: genTool((p) => {
@@ -168,7 +168,7 @@ export const randomNoiseSchema = toolSchema<RandomNoiseParams>({
});
const randomNoise: Tool<RandomNoiseParams> = {
id: "random-noise-png",
id: "random-noise",
schema: randomNoiseSchema,
input: "none",
run: genTool((p) => {
@@ -210,7 +210,7 @@ export const linearGradientSchema = toolSchema<LinearGradientParams>(
);
const linearGradient: Tool<LinearGradientParams> = {
id: "linear-gradient-png",
id: "linear-gradient",
schema: linearGradientSchema,
input: "none",
run: genTool((p) => {
@@ -279,7 +279,7 @@ export const colorSpectrumSchema = toolSchema<ColorSpectrumParams>(
);
const colorSpectrumTool: Tool<ColorSpectrumParams> = {
id: "color-spectrum-png",
id: "color-spectrum",
schema: colorSpectrumSchema,
input: "none",
run: genTool((p) => {
@@ -330,7 +330,7 @@ export const randomColorsSchema = toolSchema<RandomColorsParams>(
);
const randomColors: Tool<RandomColorsParams> = {
id: "random-colors-png",
id: "random-colors",
schema: randomColorsSchema,
input: "none",
run: genTool((p) => {
@@ -400,7 +400,7 @@ export const drawGridSchema = toolSchema<DrawGridParams>(
);
const drawGridTool: Tool<DrawGridParams> = {
id: "draw-grid-png",
id: "draw-grid",
schema: drawGridSchema,
input: "none",
run: genTool((p) => {
@@ -457,7 +457,7 @@ export const placeholderSchema = toolSchema<PlaceholderParams>(
);
const placeholder: Tool<PlaceholderParams> = {
id: "placeholder-png",
id: "placeholder",
schema: placeholderSchema,
input: "none",
domOnly: true,
@@ -503,7 +503,7 @@ export const blendTwoSchema = toolSchema<BlendTwoParams>({
});
const blendTwo: Tool<BlendTwoParams> = {
id: "blend-two-png",
id: "blend-two",
schema: blendTwoSchema,
input: "none",
run: genTool((p) => renderBlend(p.pair.from, p.pair.to, p.width)),
@@ -561,7 +561,7 @@ export const stepColorsSchema = toolSchema<StepColorsParams>(
);
const stepColorsTool: Tool<StepColorsParams> = {
id: "step-colors-png",
id: "step-colors",
schema: stepColorsSchema,
input: "none",
run: genTool((p) =>
@@ -590,7 +590,7 @@ export const emojiToPngSchema = toolSchema<EmojiToPngParams>({
});
const emojiToPng: Tool<EmojiToPngParams> = {
id: "emoji-to-png",
id: "from-emoji",
domOnly: true,
schema: emojiToPngSchema,
input: "none",
@@ -620,7 +620,7 @@ export const colorWheelSchema = toolSchema<ColorWheelParams>({
});
const colorWheelTool: Tool<ColorWheelParams> = {
id: "color-wheel-png",
id: "color-wheel",
schema: colorWheelSchema,
input: "none",
run: genTool((p) => renderWheel(p.size, p.lightness)),
@@ -665,7 +665,7 @@ const paletteLayoutGroup = {
};
const complementaryTool: Tool<PaletteBaseParams> = {
id: "complementary-png",
id: "complementary",
schema: toolSchema<PaletteBaseParams>(
{ ...paletteBaseSchema },
{ ...paletteLayoutGroup },
@@ -677,7 +677,7 @@ const complementaryTool: Tool<PaletteBaseParams> = {
};
const triadicTool: Tool<PaletteBaseParams> = {
id: "triadic-png",
id: "triadic",
schema: toolSchema<PaletteBaseParams>(
{
...paletteBaseSchema,
@@ -692,7 +692,7 @@ const triadicTool: Tool<PaletteBaseParams> = {
};
const tetradicTool: Tool<PaletteBaseParams> = {
id: "tetradic-png",
id: "tetradic",
schema: toolSchema<PaletteBaseParams>(
{
...paletteBaseSchema,
@@ -712,7 +712,7 @@ interface AnalogousParams extends PaletteBaseParams {
}
const analogousTool: Tool<AnalogousParams> = {
id: "analogous-png",
id: "analogous",
schema: toolSchema<AnalogousParams>(
{
...paletteBaseSchema,
@@ -750,7 +750,7 @@ interface MonochromaticParams extends PaletteBaseParams {
}
const monochromaticTool: Tool<MonochromaticParams> = {
id: "monochromatic-png",
id: "monochromatic",
schema: toolSchema<MonochromaticParams>(
{
...paletteBaseSchema,
@@ -788,7 +788,7 @@ interface ShadesParams extends PaletteBaseParams {
}
const shadesTool: Tool<ShadesParams> = {
id: "shades-png",
id: "shades",
schema: toolSchema<ShadesParams>(
{
...paletteBaseSchema,
@@ -846,7 +846,7 @@ export const mixColorsSchema = toolSchema<MixColorsParams>(
);
const mixColorsTool: Tool<MixColorsParams> = {
id: "mix-colors-png",
id: "mix-colors",
schema: mixColorsSchema,
input: "none",
run: genTool((p) => renderSwatches([mixColors(p.colors)], p.width, "strip")),
@@ -912,7 +912,7 @@ export const sortColorsSchema = toolSchema<SortColorsParams>(
);
const sortColorsTool: Tool<SortColorsParams> = {
id: "sort-colors-png",
id: "sort-colors",
schema: sortColorsSchema,
input: "none",
run: genTool((p) =>
@@ -975,7 +975,7 @@ export const textToPngSchema = toolSchema<TextToPngParams>(
);
const textToPng: Tool<TextToPngParams> = {
id: "text-to-png",
id: "from-text",
domOnly: true,
schema: textToPngSchema,
input: "none",
web/src/lib/registry/tools/geometry.ts
+19 -19
View File
@@ -48,7 +48,7 @@ export const addBorderSchema = toolSchema<AddBorderParams>({
});
const addBorder: Tool<AddBorderParams> = {
id: "add-border-png",
id: "add-border",
schema: addBorderSchema,
input: "image",
run: imgTool((img, p) =>
@@ -95,7 +95,7 @@ export const fitOnBackgroundSchema = toolSchema<FitOnBackgroundParams>(
);
const fitOnBackground: Tool<FitOnBackgroundParams> = {
id: "fit-on-background-png",
id: "fit-on-background",
schema: fitOnBackgroundSchema,
input: "image",
run: imgTool((img, p) => {
@@ -158,7 +158,7 @@ export const changeCanvasSizeSchema = toolSchema<ChangeCanvasSizeParams>(
);
const changeCanvasSizeTool: Tool<ChangeCanvasSizeParams> = {
id: "change-canvas-size-png",
id: "change-canvas-size",
schema: changeCanvasSizeSchema,
input: "image",
run: imgTool((img, p) =>
@@ -199,7 +199,7 @@ export const resizeSchema = toolSchema<ResizeParams>(
);
const resizeTool: Tool<ResizeParams> = {
id: "resize-png",
id: "resize",
schema: resizeSchema,
input: "image",
run: imgTool((img, p) => {
@@ -266,7 +266,7 @@ export const cropSchema = toolSchema<CropParams>(
);
const cropTool: Tool<CropParams> = {
id: "crop-png",
id: "crop",
schema: cropSchema,
input: "image",
run: imgTool((img, p) => {
@@ -296,7 +296,7 @@ export const rotateSchema = toolSchema<RotateParams>({
});
const rotateTool: Tool<RotateParams> = {
id: "rotate-png",
id: "rotate",
schema: rotateSchema,
input: "image",
run: imgTool((img, p) => rotate90(img, Number(p.angle) / 90)),
@@ -318,7 +318,7 @@ export const flipSchema = toolSchema<FlipParams>({
});
const flipTool: Tool<FlipParams> = {
id: "flip-png",
id: "flip",
schema: flipSchema,
input: "image",
run: imgTool((img, p) => flip(img, p.axis)),
@@ -353,7 +353,7 @@ export const addPaddingSchema = toolSchema<AddPaddingParams>(
);
const addPaddingTool: Tool<AddPaddingParams> = {
id: "add-padding-png",
id: "add-padding",
schema: addPaddingSchema,
input: "image",
run: imgTool((img, p) =>
@@ -391,7 +391,7 @@ export const tileSchema = toolSchema<TileParams>({
});
const tileTool: Tool<TileParams> = {
id: "tile-png",
id: "tile",
schema: tileSchema,
input: "image",
run: imgTool((img, p) => tile(img, p.columns, p.rows)),
@@ -422,7 +422,7 @@ export const splitPartsSchema = toolSchema<SplitPartsParams>({
});
const splitPartsTool: Tool<SplitPartsParams> = {
id: "split-into-parts-png",
id: "split-into-parts",
schema: splitPartsSchema,
input: "image",
result: "files",
@@ -455,7 +455,7 @@ interface EmptyParams {}
export const centerByAlphaSchema = toolSchema<EmptyParams>({});
const centerByAlphaTool: Tool<EmptyParams> = {
id: "center-by-alpha-png",
id: "center-by-alpha",
schema: centerByAlphaSchema,
input: "image",
run: imgTool((img) => centerByAlpha(img)),
@@ -484,7 +484,7 @@ export const skewSchema = toolSchema<SkewParams>({
});
const skewTool: Tool<SkewParams> = {
id: "skew-png",
id: "skew",
schema: skewSchema,
input: "image",
run: imgTool((img, p) => skewImage(img, p.degX, p.degY)),
@@ -505,7 +505,7 @@ export const rotateFreeSchema = toolSchema<RotateFreeParams>({
});
const rotateFreeTool: Tool<RotateFreeParams> = {
id: "rotate-free-png",
id: "rotate-free",
schema: rotateFreeSchema,
input: "image",
run: imgTool((img, p) => rotateFreeImage(img, p.angle)),
@@ -526,7 +526,7 @@ export const zoomSchema = toolSchema<ZoomParams>({
});
const zoomTool: Tool<ZoomParams> = {
id: "zoom-png",
id: "zoom",
schema: zoomSchema,
input: "image",
run: imgTool((img, p) => zoomImage(img, p.scale)),
@@ -547,7 +547,7 @@ export const trimEmptySpaceSchema = toolSchema<TrimEmptySpaceParams>({
});
const trimEmptySpaceTool: Tool<TrimEmptySpaceParams> = {
id: "trim-empty-space-png",
id: "trim-empty-space",
schema: trimEmptySpaceSchema,
input: "image",
run: imgTool((img, p) => trimToContent(img, p.threshold)),
@@ -585,7 +585,7 @@ export const changeAspectRatioSchema = toolSchema<ChangeAspectRatioParams>({
});
const changeAspectRatioTool: Tool<ChangeAspectRatioParams> = {
id: "change-aspect-ratio-png",
id: "change-aspect-ratio",
schema: changeAspectRatioSchema,
input: "image",
run: imgTool((img, p) => {
@@ -611,7 +611,7 @@ export const swapOrientationSchema = toolSchema<SwapOrientationParams>({
});
const swapOrientationTool: Tool<SwapOrientationParams> = {
id: "swap-orientation-png",
id: "swap-orientation",
schema: swapOrientationSchema,
input: "image",
run: imgTool((img, p) => forceOrientation(img, p.target)),
@@ -647,7 +647,7 @@ export const symmetricCopySchema = toolSchema<SymmetricCopyParams>({
});
const symmetricCopyTool: Tool<SymmetricCopyParams> = {
id: "symmetric-copy-png",
id: "symmetric-copy",
schema: symmetricCopySchema,
input: "image",
run: imgTool((img, p) => symmetricCopy(img, p.axis, p.keepSide)),
@@ -678,7 +678,7 @@ export const shiftSchema = toolSchema<ShiftParams>({
});
const shiftTool: Tool<ShiftParams> = {
id: "shift-png",
id: "shift",
schema: shiftSchema,
input: "image",
run: imgTool((img, p) =>
web/src/lib/registry/tools/text.ts
+3 -3
View File
@@ -59,7 +59,7 @@ const addTextSchema = toolSchema<AddTextParams>(
);
const addText: Tool<AddTextParams> = {
id: "add-text-png",
id: "add-text",
domOnly: true,
schema: addTextSchema,
input: "image",
@@ -133,7 +133,7 @@ const dateStampSchema = toolSchema<DateStampParams>(
);
const dateStamp: Tool<DateStampParams> = {
id: "date-stamp-png",
id: "date-stamp",
domOnly: true,
schema: dateStampSchema,
input: "image",
@@ -222,7 +222,7 @@ const watermarkTileSchema = toolSchema<WatermarkTileParams>(
);
const watermarkTile: Tool<WatermarkTileParams> = {
id: "watermark-tile-png",
id: "watermark-tile",
domOnly: true,
schema: watermarkTileSchema,
input: "image",