mirror of
https://github.com/Ku6epXBOCTuK/easy-png-tools.git
synced 2026-09-14 21:46:35 +00:00
fix: update i18n - update schema fields descriptions
This commit is contained in:
@@ -26,6 +26,8 @@
|
|||||||
label: string;
|
label: string;
|
||||||
value: unknown;
|
value: unknown;
|
||||||
spec: FieldSpec;
|
spec: FieldSpec;
|
||||||
|
toolId: string;
|
||||||
|
fieldId: string;
|
||||||
onchange?: (value: unknown) => void;
|
onchange?: (value: unknown) => void;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -49,10 +51,11 @@
|
|||||||
interface Props {
|
interface Props {
|
||||||
schema: ToolSchema<Record<string, unknown>>;
|
schema: ToolSchema<Record<string, unknown>>;
|
||||||
values: Record<string, unknown>;
|
values: Record<string, unknown>;
|
||||||
|
toolId: string;
|
||||||
onchange: (id: string, value: unknown) => void;
|
onchange: (id: string, value: unknown) => void;
|
||||||
onreset: () => void;
|
onreset: () => void;
|
||||||
}
|
}
|
||||||
let { schema, values, onchange, onreset }: Props = $props();
|
let { schema, values, toolId, onchange, onreset }: Props = $props();
|
||||||
|
|
||||||
interface LayoutGroup {
|
interface LayoutGroup {
|
||||||
key: string;
|
key: string;
|
||||||
@@ -104,6 +107,8 @@
|
|||||||
label={fieldLabel(schema.fields[id], id)}
|
label={fieldLabel(schema.fields[id], id)}
|
||||||
value={values[id]}
|
value={values[id]}
|
||||||
spec={schema.fields[id].spec}
|
spec={schema.fields[id].spec}
|
||||||
|
{toolId}
|
||||||
|
fieldId={id}
|
||||||
onchange={(v) => onchange(id, v)}
|
onchange={(v) => onchange(id, v)}
|
||||||
/>
|
/>
|
||||||
{/each}
|
{/each}
|
||||||
|
|||||||
@@ -179,7 +179,13 @@
|
|||||||
<span class="label">{t("paramsCard.toolSettings")}</span>
|
<span class="label">{t("paramsCard.toolSettings")}</span>
|
||||||
<strong>{t("paramsCard.configureOutput")}</strong>
|
<strong>{t("paramsCard.configureOutput")}</strong>
|
||||||
</div>
|
</div>
|
||||||
<SchemaFields {schema} {values} onchange={setValue} onreset={reset} />
|
<SchemaFields
|
||||||
|
{schema}
|
||||||
|
{values}
|
||||||
|
toolId={tool.id}
|
||||||
|
onchange={setValue}
|
||||||
|
onreset={reset}
|
||||||
|
/>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<section class="panel">
|
<section class="panel">
|
||||||
|
|||||||
@@ -1,13 +1,16 @@
|
|||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
|
import { optionLabel } from "$lib/i18n/schema-tool-strings";
|
||||||
import type { FieldSpec, SelectSpec } from "$lib/registry-schema";
|
import type { FieldSpec, SelectSpec } from "$lib/registry-schema";
|
||||||
|
|
||||||
interface Props {
|
interface Props {
|
||||||
label: string;
|
label: string;
|
||||||
value: unknown;
|
value: unknown;
|
||||||
spec: FieldSpec;
|
spec: FieldSpec;
|
||||||
|
toolId: string;
|
||||||
|
fieldId: string;
|
||||||
onchange?: (value: string) => void;
|
onchange?: (value: string) => void;
|
||||||
}
|
}
|
||||||
let { label, value, spec, onchange }: Props = $props();
|
let { label, value, spec, toolId, fieldId, onchange }: Props = $props();
|
||||||
|
|
||||||
const sp = $derived(spec as SelectSpec);
|
const sp = $derived(spec as SelectSpec);
|
||||||
const current = $derived(
|
const current = $derived(
|
||||||
@@ -25,7 +28,9 @@
|
|||||||
oninput={(e) => onchange?.((e.target as HTMLSelectElement).value)}
|
oninput={(e) => onchange?.((e.target as HTMLSelectElement).value)}
|
||||||
>
|
>
|
||||||
{#each sp.options as option (option.value)}
|
{#each sp.options as option (option.value)}
|
||||||
<option value={option.value}>{option.label}</option>
|
<option value={option.value}>
|
||||||
|
{optionLabel(toolId, fieldId, option.value, option.label)}
|
||||||
|
</option>
|
||||||
{/each}
|
{/each}
|
||||||
</select>
|
</select>
|
||||||
</label>
|
</label>
|
||||||
|
|||||||
+55
-1
@@ -203,7 +203,26 @@ export const en: Dict = {
|
|||||||
tooManyParts: "Too many parts ({count}). Maximum is 1000.",
|
tooManyParts: "Too many parts ({count}). Maximum is 1000.",
|
||||||
toolUnknown: 'No tool is registered under "{id}".',
|
toolUnknown: 'No tool is registered under "{id}".',
|
||||||
},
|
},
|
||||||
fields: {},
|
fields: {
|
||||||
|
amount: "Amount",
|
||||||
|
background: "Background",
|
||||||
|
blockSize: "Block size",
|
||||||
|
channelTolerance: "Channel tolerance",
|
||||||
|
color: "Color",
|
||||||
|
colorTolerance: "Color tolerance",
|
||||||
|
fillColor: "Fill color",
|
||||||
|
highlightColor: "Highlight color",
|
||||||
|
lumaThreshold: "Luminance threshold",
|
||||||
|
mode: "Mode",
|
||||||
|
opacity: "Opacity",
|
||||||
|
quality: "Quality",
|
||||||
|
radius: "Radius",
|
||||||
|
rarity: "Rarity",
|
||||||
|
seed: "Seed",
|
||||||
|
strength: "Strength",
|
||||||
|
threshold: "Threshold",
|
||||||
|
width: "Width",
|
||||||
|
},
|
||||||
groups: {
|
groups: {
|
||||||
adjust: "Adjust",
|
adjust: "Adjust",
|
||||||
anchor: "Anchor",
|
anchor: "Anchor",
|
||||||
@@ -264,5 +283,40 @@ export const en: Dict = {
|
|||||||
orientationSquare: "Square — the sides are equal.",
|
orientationSquare: "Square — the sides are equal.",
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
"show-transparent-png": {
|
||||||
|
options: {
|
||||||
|
mode: { binary: "Black & white mask", highlight: "Color highlight" },
|
||||||
|
},
|
||||||
|
},
|
||||||
|
"show-grayscale-pixels-png": {
|
||||||
|
options: {
|
||||||
|
mode: { binary: "Black & white mask", highlight: "Color highlight" },
|
||||||
|
},
|
||||||
|
},
|
||||||
|
"show-color-pixels-png": {
|
||||||
|
options: {
|
||||||
|
mode: { binary: "Black & white mask", highlight: "Color highlight" },
|
||||||
|
},
|
||||||
|
},
|
||||||
|
"light-pixel-mask-png": {
|
||||||
|
options: {
|
||||||
|
mode: { binary: "Black & white mask", highlight: "Color highlight" },
|
||||||
|
},
|
||||||
|
},
|
||||||
|
"dark-pixel-mask-png": {
|
||||||
|
options: {
|
||||||
|
mode: { binary: "Black & white mask", highlight: "Color highlight" },
|
||||||
|
},
|
||||||
|
},
|
||||||
|
"unique-color-mask-png": {
|
||||||
|
options: {
|
||||||
|
mode: { binary: "Black & white mask", highlight: "Color highlight" },
|
||||||
|
},
|
||||||
|
},
|
||||||
|
"add-noise-png": {
|
||||||
|
options: {
|
||||||
|
mode: { mono: "Monochrome grain", color: "Color noise" },
|
||||||
|
},
|
||||||
|
},
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
|
|||||||
+20
-1
@@ -204,7 +204,26 @@ export const ru: Dict = {
|
|||||||
tooManyParts: "Слишком много частей ({count}). Ограничение — 1000.",
|
tooManyParts: "Слишком много частей ({count}). Ограничение — 1000.",
|
||||||
toolUnknown: "Инструмента с id «{id}» нет в реестре.",
|
toolUnknown: "Инструмента с id «{id}» нет в реестре.",
|
||||||
},
|
},
|
||||||
fields: {},
|
fields: {
|
||||||
|
amount: "Количество",
|
||||||
|
background: "Фон",
|
||||||
|
blockSize: "Размер блока",
|
||||||
|
channelTolerance: "Допуск по каналам",
|
||||||
|
color: "Цвет",
|
||||||
|
colorTolerance: "Допуск похожести",
|
||||||
|
fillColor: "Цвет заливки",
|
||||||
|
highlightColor: "Цвет подсветки",
|
||||||
|
lumaThreshold: "Порог яркости",
|
||||||
|
mode: "Режим",
|
||||||
|
opacity: "Непрозрачность",
|
||||||
|
quality: "Качество",
|
||||||
|
radius: "Радиус",
|
||||||
|
rarity: "Максимум повторов",
|
||||||
|
seed: "Сид",
|
||||||
|
strength: "Сила",
|
||||||
|
threshold: "Порог",
|
||||||
|
width: "Ширина",
|
||||||
|
},
|
||||||
groups: {
|
groups: {
|
||||||
adjust: "Коррекция",
|
adjust: "Коррекция",
|
||||||
anchor: "Привязка",
|
anchor: "Привязка",
|
||||||
|
|||||||
@@ -33,6 +33,16 @@ export function groupLabel(title: string): string {
|
|||||||
return t(title);
|
return t(title);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/** Подпись опции select: словарь `tools[id].options[fieldId][value]`, фолбэк — label из схемы. */
|
||||||
|
export function optionLabel(
|
||||||
|
toolId: string,
|
||||||
|
fieldId: string,
|
||||||
|
value: string,
|
||||||
|
fallback: string,
|
||||||
|
): string {
|
||||||
|
return getMergedDict().tools[toolId]?.options?.[fieldId]?.[value] ?? fallback;
|
||||||
|
}
|
||||||
|
|
||||||
export function verdictText(toolId: string, key: string): string {
|
export function verdictText(toolId: string, key: string): string {
|
||||||
return getMergedDict().tools[toolId]?.results?.[key] ?? key;
|
return getMergedDict().tools[toolId]?.results?.[key] ?? key;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -14,7 +14,15 @@
|
|||||||
import type { Position9 } from "./core/textdraw";
|
import type { Position9 } from "./core/textdraw";
|
||||||
import type { TextFont } from "./core/domText";
|
import type { TextFont } from "./core/domText";
|
||||||
|
|
||||||
export interface NumberSpec {
|
/**
|
||||||
|
* Общее необязательное поле всех спеков: ключ подписи поля в словаре.
|
||||||
|
* Рендерится через `fieldLabel` (решение C) — без ключа используется `labelOf(id)`.
|
||||||
|
*/
|
||||||
|
export interface FieldSpecBase {
|
||||||
|
label?: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface NumberSpec extends FieldSpecBase {
|
||||||
kind: "number";
|
kind: "number";
|
||||||
default: number;
|
default: number;
|
||||||
min?: number;
|
min?: number;
|
||||||
@@ -22,7 +30,7 @@ export interface NumberSpec {
|
|||||||
step?: number;
|
step?: number;
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface SliderSpec {
|
export interface SliderSpec extends FieldSpecBase {
|
||||||
kind: "slider";
|
kind: "slider";
|
||||||
default: number;
|
default: number;
|
||||||
min: number;
|
min: number;
|
||||||
@@ -30,24 +38,24 @@ export interface SliderSpec {
|
|||||||
step?: number;
|
step?: number;
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface ColorSpec {
|
export interface ColorSpec extends FieldSpecBase {
|
||||||
kind: "color";
|
kind: "color";
|
||||||
default: string;
|
default: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface SelectSpec<V extends string = string> {
|
export interface SelectSpec<V extends string = string> extends FieldSpecBase {
|
||||||
kind: "select";
|
kind: "select";
|
||||||
default: V;
|
default: V;
|
||||||
options: { value: V; label: string }[];
|
options: { value: V; label: string }[];
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface TextSpec {
|
export interface TextSpec extends FieldSpecBase {
|
||||||
kind: "text";
|
kind: "text";
|
||||||
default: string;
|
default: string;
|
||||||
placeholder?: string;
|
placeholder?: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface CheckboxSpec {
|
export interface CheckboxSpec extends FieldSpecBase {
|
||||||
kind: "checkbox";
|
kind: "checkbox";
|
||||||
default: boolean;
|
default: boolean;
|
||||||
}
|
}
|
||||||
@@ -58,7 +66,7 @@ export interface Dimension {
|
|||||||
height: number;
|
height: number;
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface DimensionSpec {
|
export interface DimensionSpec extends FieldSpecBase {
|
||||||
kind: "dimension";
|
kind: "dimension";
|
||||||
/** Общий диапазон для обоих измерений. */
|
/** Общий диапазон для обоих измерений. */
|
||||||
min: number;
|
min: number;
|
||||||
@@ -73,7 +81,7 @@ export interface ColorPair {
|
|||||||
to: string;
|
to: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface ColorPairSpec {
|
export interface ColorPairSpec extends FieldSpecBase {
|
||||||
kind: "color-pair";
|
kind: "color-pair";
|
||||||
from: string;
|
from: string;
|
||||||
to: string;
|
to: string;
|
||||||
@@ -82,7 +90,7 @@ export interface ColorPairSpec {
|
|||||||
/** Список цветов (палитра): массив hex-строк. */
|
/** Список цветов (палитра): массив hex-строк. */
|
||||||
export type ColorList = string[];
|
export type ColorList = string[];
|
||||||
|
|
||||||
export interface ColorListSpec {
|
export interface ColorListSpec extends FieldSpecBase {
|
||||||
kind: "colors";
|
kind: "colors";
|
||||||
default: string[];
|
default: string[];
|
||||||
}
|
}
|
||||||
@@ -93,7 +101,7 @@ export interface Offset {
|
|||||||
y: number;
|
y: number;
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface OffsetSpec {
|
export interface OffsetSpec extends FieldSpecBase {
|
||||||
kind: "offset";
|
kind: "offset";
|
||||||
/** Общий диапазон для обеих осей (в процентах). */
|
/** Общий диапазон для обеих осей (в процентах). */
|
||||||
min: number;
|
min: number;
|
||||||
@@ -118,7 +126,7 @@ export const POSITION9_VALUES = [
|
|||||||
"bottom-right",
|
"bottom-right",
|
||||||
] as const;
|
] as const;
|
||||||
|
|
||||||
export interface Position9Spec {
|
export interface Position9Spec extends FieldSpecBase {
|
||||||
kind: "position9";
|
kind: "position9";
|
||||||
default: Position9;
|
default: Position9;
|
||||||
}
|
}
|
||||||
@@ -134,7 +142,7 @@ export interface FontStyle {
|
|||||||
color: string;
|
color: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface FontStyleSpec {
|
export interface FontStyleSpec extends FieldSpecBase {
|
||||||
kind: "font-style";
|
kind: "font-style";
|
||||||
/** Диапазон размера шрифта. */
|
/** Диапазон размера шрифта. */
|
||||||
min: number;
|
min: number;
|
||||||
@@ -155,7 +163,7 @@ export interface Plate {
|
|||||||
opacity: number;
|
opacity: number;
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface PlateSpec {
|
export interface PlateSpec extends FieldSpecBase {
|
||||||
kind: "plate";
|
kind: "plate";
|
||||||
enabled: boolean;
|
enabled: boolean;
|
||||||
color: string;
|
color: string;
|
||||||
@@ -172,7 +180,7 @@ export interface Gradient {
|
|||||||
angle: number;
|
angle: number;
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface GradientSpec {
|
export interface GradientSpec extends FieldSpecBase {
|
||||||
kind: "gradient";
|
kind: "gradient";
|
||||||
from: string;
|
from: string;
|
||||||
to: string;
|
to: string;
|
||||||
|
|||||||
@@ -1,5 +1,5 @@
|
|||||||
import { imgTool, textGen, type ToolEntry } from "./types";
|
import { hasTransparency, isGrayscale, orientationOf } from "../core/analyze";
|
||||||
import { field, toolSchema } from "../registry-schema";
|
import { encode } from "../core/io";
|
||||||
import {
|
import {
|
||||||
extractByColor,
|
extractByColor,
|
||||||
isGrayscaleish,
|
isGrayscaleish,
|
||||||
@@ -7,10 +7,10 @@ import {
|
|||||||
rarityPredicate,
|
rarityPredicate,
|
||||||
renderPredicateMask,
|
renderPredicateMask,
|
||||||
} from "../core/masks";
|
} from "../core/masks";
|
||||||
import { hasTransparency, isGrayscale, orientationOf } from "../core/analyze";
|
|
||||||
import { encode } from "../core/io";
|
|
||||||
import { base64ToBytes, looksLikePng, stripDataUri } from "../core/textio";
|
import { base64ToBytes, looksLikePng, stripDataUri } from "../core/textio";
|
||||||
import { t } from "../i18n/t";
|
import { t } from "../i18n/t";
|
||||||
|
import { field, toolSchema } from "../registry-schema";
|
||||||
|
import { imgTool, textGen, type ToolEntry } from "./types";
|
||||||
|
|
||||||
interface ExtractColorParams {
|
interface ExtractColorParams {
|
||||||
color: string;
|
color: string;
|
||||||
@@ -18,8 +18,14 @@ interface ExtractColorParams {
|
|||||||
}
|
}
|
||||||
|
|
||||||
export const extractColorSchema = toolSchema<ExtractColorParams>({
|
export const extractColorSchema = toolSchema<ExtractColorParams>({
|
||||||
color: field.color({ default: "#00ff88" }),
|
color: field.color({ label: "fields.color", default: "#00ff88" }),
|
||||||
tolerance: field.slider({ min: 0, max: 50, step: 1, default: 10 }),
|
tolerance: field.slider({
|
||||||
|
label: "fields.colorTolerance",
|
||||||
|
min: 0,
|
||||||
|
max: 50,
|
||||||
|
step: 1,
|
||||||
|
default: 10,
|
||||||
|
}),
|
||||||
});
|
});
|
||||||
|
|
||||||
const extractColor: ToolEntry<ExtractColorParams> = {
|
const extractColor: ToolEntry<ExtractColorParams> = {
|
||||||
@@ -41,14 +47,21 @@ interface MaskParams {
|
|||||||
|
|
||||||
const maskBaseFields = {
|
const maskBaseFields = {
|
||||||
mode: field.select({
|
mode: field.select({
|
||||||
|
label: "fields.mode",
|
||||||
default: "binary",
|
default: "binary",
|
||||||
options: [
|
options: [
|
||||||
{ value: "binary", label: "Black & white mask" },
|
{ value: "binary", label: "Black & white mask" },
|
||||||
{ value: "highlight", label: "Color highlight" },
|
{ value: "highlight", label: "Color highlight" },
|
||||||
],
|
],
|
||||||
}),
|
}),
|
||||||
color: field.color({ default: "#ff00aa" }),
|
color: field.color({ label: "fields.highlightColor", default: "#ff00aa" }),
|
||||||
opacity: field.slider({ min: 0, max: 100, step: 5, default: 70 }),
|
opacity: field.slider({
|
||||||
|
label: "fields.opacity",
|
||||||
|
min: 0,
|
||||||
|
max: 100,
|
||||||
|
step: 5,
|
||||||
|
default: 70,
|
||||||
|
}),
|
||||||
};
|
};
|
||||||
|
|
||||||
function renderMask(
|
function renderMask(
|
||||||
@@ -66,6 +79,7 @@ function renderMask(
|
|||||||
export const showTransparentSchema = toolSchema<MaskParams>({
|
export const showTransparentSchema = toolSchema<MaskParams>({
|
||||||
...maskBaseFields,
|
...maskBaseFields,
|
||||||
mode: field.select({
|
mode: field.select({
|
||||||
|
label: "fields.mode",
|
||||||
default: "highlight",
|
default: "highlight",
|
||||||
options: [
|
options: [
|
||||||
{ value: "binary", label: "Black & white mask" },
|
{ value: "binary", label: "Black & white mask" },
|
||||||
@@ -91,7 +105,13 @@ interface GrayscalePixelsParams extends MaskParams {
|
|||||||
|
|
||||||
export const showGrayscalePixelsSchema = toolSchema<GrayscalePixelsParams>({
|
export const showGrayscalePixelsSchema = toolSchema<GrayscalePixelsParams>({
|
||||||
...maskBaseFields,
|
...maskBaseFields,
|
||||||
tolerance: field.slider({ min: 0, max: 64, step: 1, default: 0 }),
|
tolerance: field.slider({
|
||||||
|
label: "fields.channelTolerance",
|
||||||
|
min: 0,
|
||||||
|
max: 64,
|
||||||
|
step: 1,
|
||||||
|
default: 0,
|
||||||
|
}),
|
||||||
});
|
});
|
||||||
|
|
||||||
const showGrayscalePixels: ToolEntry<GrayscalePixelsParams> = {
|
const showGrayscalePixels: ToolEntry<GrayscalePixelsParams> = {
|
||||||
@@ -113,7 +133,13 @@ interface ColorPixelsParams extends MaskParams {
|
|||||||
|
|
||||||
export const showColorPixelsSchema = toolSchema<ColorPixelsParams>({
|
export const showColorPixelsSchema = toolSchema<ColorPixelsParams>({
|
||||||
...maskBaseFields,
|
...maskBaseFields,
|
||||||
tolerance: field.slider({ min: 0, max: 64, step: 1, default: 8 }),
|
tolerance: field.slider({
|
||||||
|
label: "fields.channelTolerance",
|
||||||
|
min: 0,
|
||||||
|
max: 64,
|
||||||
|
step: 1,
|
||||||
|
default: 8,
|
||||||
|
}),
|
||||||
});
|
});
|
||||||
|
|
||||||
const showColorPixels: ToolEntry<ColorPixelsParams> = {
|
const showColorPixels: ToolEntry<ColorPixelsParams> = {
|
||||||
@@ -135,7 +161,13 @@ interface LightPixelParams extends MaskParams {
|
|||||||
|
|
||||||
export const lightPixelMaskSchema = toolSchema<LightPixelParams>({
|
export const lightPixelMaskSchema = toolSchema<LightPixelParams>({
|
||||||
...maskBaseFields,
|
...maskBaseFields,
|
||||||
threshold: field.slider({ min: 0, max: 100, step: 1, default: 70 }),
|
threshold: field.slider({
|
||||||
|
label: "fields.lumaThreshold",
|
||||||
|
min: 0,
|
||||||
|
max: 100,
|
||||||
|
step: 1,
|
||||||
|
default: 70,
|
||||||
|
}),
|
||||||
});
|
});
|
||||||
|
|
||||||
const lightPixelMask: ToolEntry<LightPixelParams> = {
|
const lightPixelMask: ToolEntry<LightPixelParams> = {
|
||||||
@@ -156,7 +188,13 @@ interface DarkPixelParams extends MaskParams {
|
|||||||
|
|
||||||
export const darkPixelMaskSchema = toolSchema<DarkPixelParams>({
|
export const darkPixelMaskSchema = toolSchema<DarkPixelParams>({
|
||||||
...maskBaseFields,
|
...maskBaseFields,
|
||||||
threshold: field.slider({ min: 0, max: 100, step: 1, default: 30 }),
|
threshold: field.slider({
|
||||||
|
label: "fields.lumaThreshold",
|
||||||
|
min: 0,
|
||||||
|
max: 100,
|
||||||
|
step: 1,
|
||||||
|
default: 30,
|
||||||
|
}),
|
||||||
});
|
});
|
||||||
|
|
||||||
const darkPixelMask: ToolEntry<DarkPixelParams> = {
|
const darkPixelMask: ToolEntry<DarkPixelParams> = {
|
||||||
@@ -177,7 +215,13 @@ interface UniqueColorParams extends MaskParams {
|
|||||||
|
|
||||||
export const uniqueColorMaskSchema = toolSchema<UniqueColorParams>({
|
export const uniqueColorMaskSchema = toolSchema<UniqueColorParams>({
|
||||||
...maskBaseFields,
|
...maskBaseFields,
|
||||||
rarity: field.slider({ min: 1, max: 50, step: 1, default: 1 }),
|
rarity: field.slider({
|
||||||
|
label: "fields.rarity",
|
||||||
|
min: 1,
|
||||||
|
max: 50,
|
||||||
|
step: 1,
|
||||||
|
default: 1,
|
||||||
|
}),
|
||||||
});
|
});
|
||||||
|
|
||||||
const uniqueColorMask: ToolEntry<UniqueColorParams> = {
|
const uniqueColorMask: ToolEntry<UniqueColorParams> = {
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
import { imgTool, textGen, type ToolEntry } from "./types";
|
|
||||||
import { field, toolSchema } from "../registry-schema";
|
|
||||||
import { flattenOntoColor } from "../core/alpha";
|
import { flattenOntoColor } from "../core/alpha";
|
||||||
|
import { decodeBytes, decodeSvgText, toBase64, toDataUrl } from "../core/io";
|
||||||
|
import { hexToPixels, pixelsToHex } from "../core/text";
|
||||||
import {
|
import {
|
||||||
base64ToBytes,
|
base64ToBytes,
|
||||||
bytesToImage,
|
bytesToImage,
|
||||||
@@ -9,12 +9,18 @@ import {
|
|||||||
rgbValuesToImage,
|
rgbValuesToImage,
|
||||||
stripDataUri,
|
stripDataUri,
|
||||||
} from "../core/textio";
|
} from "../core/textio";
|
||||||
import { hexToPixels, pixelsToHex } from "../core/text";
|
|
||||||
import { clonePixelImage } from "../core/types";
|
import { clonePixelImage } from "../core/types";
|
||||||
import { decodeBytes, decodeSvgText, toBase64, toDataUrl } from "../core/io";
|
import { field, toolSchema } from "../registry-schema";
|
||||||
|
import { imgTool, textGen, type ToolEntry } from "./types";
|
||||||
|
|
||||||
const widthProps = (defaultValue: number) =>
|
const widthProps = (defaultValue: number) =>
|
||||||
field.number({ min: 1, max: 10000, step: 1, default: defaultValue });
|
field.number({
|
||||||
|
label: "fields.width",
|
||||||
|
min: 1,
|
||||||
|
max: 10000,
|
||||||
|
step: 1,
|
||||||
|
default: defaultValue,
|
||||||
|
});
|
||||||
|
|
||||||
interface ConvertToJpgParams {
|
interface ConvertToJpgParams {
|
||||||
background: string;
|
background: string;
|
||||||
@@ -22,8 +28,14 @@ interface ConvertToJpgParams {
|
|||||||
}
|
}
|
||||||
|
|
||||||
export const convertToJpgSchema = toolSchema<ConvertToJpgParams>({
|
export const convertToJpgSchema = toolSchema<ConvertToJpgParams>({
|
||||||
background: field.color({ default: "#ffffff" }),
|
background: field.color({ label: "fields.background", default: "#ffffff" }),
|
||||||
quality: field.slider({ min: 1, max: 100, step: 1, default: 90 }),
|
quality: field.slider({
|
||||||
|
label: "fields.quality",
|
||||||
|
min: 1,
|
||||||
|
max: 100,
|
||||||
|
step: 1,
|
||||||
|
default: 90,
|
||||||
|
}),
|
||||||
});
|
});
|
||||||
|
|
||||||
const convertToJpg: ToolEntry<ConvertToJpgParams> = {
|
const convertToJpg: ToolEntry<ConvertToJpgParams> = {
|
||||||
@@ -43,7 +55,13 @@ interface ConvertToWebpParams {
|
|||||||
}
|
}
|
||||||
|
|
||||||
export const convertToWebpSchema = toolSchema<ConvertToWebpParams>({
|
export const convertToWebpSchema = toolSchema<ConvertToWebpParams>({
|
||||||
quality: field.slider({ min: 1, max: 100, step: 1, default: 90 }),
|
quality: field.slider({
|
||||||
|
label: "fields.quality",
|
||||||
|
min: 1,
|
||||||
|
max: 100,
|
||||||
|
step: 1,
|
||||||
|
default: 90,
|
||||||
|
}),
|
||||||
});
|
});
|
||||||
|
|
||||||
const convertToWebp: ToolEntry<ConvertToWebpParams> = {
|
const convertToWebp: ToolEntry<ConvertToWebpParams> = {
|
||||||
|
|||||||
@@ -1,21 +1,27 @@
|
|||||||
import { imgTool, type ToolEntry } from "./types";
|
import { gaussianBlur, sharpen as sharpenImage } from "../core/convolution";
|
||||||
import { field, toolSchema } from "../registry-schema";
|
import { vignette } from "../core/effects";
|
||||||
|
import { jpegRoundtrip } from "../core/io";
|
||||||
import {
|
import {
|
||||||
addNoise,
|
addNoise,
|
||||||
pixelate,
|
pixelate,
|
||||||
shuffleBlocks,
|
shuffleBlocks,
|
||||||
silhouette,
|
silhouette,
|
||||||
} from "../core/pixel-fx";
|
} from "../core/pixel-fx";
|
||||||
import { gaussianBlur, sharpen as sharpenImage } from "../core/convolution";
|
import { field, toolSchema } from "../registry-schema";
|
||||||
import { vignette } from "../core/effects";
|
import { imgTool, type ToolEntry } from "./types";
|
||||||
import { jpegRoundtrip } from "../core/io";
|
|
||||||
|
|
||||||
interface BlurParams {
|
interface BlurParams {
|
||||||
radius: number;
|
radius: number;
|
||||||
}
|
}
|
||||||
|
|
||||||
export const blurSchema = toolSchema<BlurParams>({
|
export const blurSchema = toolSchema<BlurParams>({
|
||||||
radius: field.slider({ min: 1, max: 32, step: 1, default: 4 }),
|
radius: field.slider({
|
||||||
|
label: "fields.radius",
|
||||||
|
min: 1,
|
||||||
|
max: 32,
|
||||||
|
step: 1,
|
||||||
|
default: 4,
|
||||||
|
}),
|
||||||
});
|
});
|
||||||
|
|
||||||
const blurTool: ToolEntry<BlurParams> = {
|
const blurTool: ToolEntry<BlurParams> = {
|
||||||
@@ -34,7 +40,13 @@ interface SharpenParams {
|
|||||||
}
|
}
|
||||||
|
|
||||||
export const sharpenSchema = toolSchema<SharpenParams>({
|
export const sharpenSchema = toolSchema<SharpenParams>({
|
||||||
strength: field.slider({ min: 0, max: 100, step: 1, default: 50 }),
|
strength: field.slider({
|
||||||
|
label: "fields.strength",
|
||||||
|
min: 0,
|
||||||
|
max: 100,
|
||||||
|
step: 1,
|
||||||
|
default: 50,
|
||||||
|
}),
|
||||||
});
|
});
|
||||||
|
|
||||||
const sharpenTool: ToolEntry<SharpenParams> = {
|
const sharpenTool: ToolEntry<SharpenParams> = {
|
||||||
@@ -54,8 +66,14 @@ interface SilhouetteParams {
|
|||||||
}
|
}
|
||||||
|
|
||||||
export const silhouetteSchema = toolSchema<SilhouetteParams>({
|
export const silhouetteSchema = toolSchema<SilhouetteParams>({
|
||||||
color: field.color({ default: "#111318" }),
|
color: field.color({ label: "fields.fillColor", default: "#111318" }),
|
||||||
threshold: field.slider({ min: 0, max: 100, step: 1, default: 10 }),
|
threshold: field.slider({
|
||||||
|
label: "fields.threshold",
|
||||||
|
min: 0,
|
||||||
|
max: 100,
|
||||||
|
step: 1,
|
||||||
|
default: 10,
|
||||||
|
}),
|
||||||
});
|
});
|
||||||
|
|
||||||
const silhouetteTool: ToolEntry<SilhouetteParams> = {
|
const silhouetteTool: ToolEntry<SilhouetteParams> = {
|
||||||
@@ -74,7 +92,13 @@ interface VignetteParams {
|
|||||||
}
|
}
|
||||||
|
|
||||||
export const vignetteSchema = toolSchema<VignetteParams>({
|
export const vignetteSchema = toolSchema<VignetteParams>({
|
||||||
strength: field.slider({ min: 0, max: 100, step: 5, default: 50 }),
|
strength: field.slider({
|
||||||
|
label: "fields.strength",
|
||||||
|
min: 0,
|
||||||
|
max: 100,
|
||||||
|
step: 5,
|
||||||
|
default: 50,
|
||||||
|
}),
|
||||||
});
|
});
|
||||||
|
|
||||||
const vignetteTool: ToolEntry<VignetteParams> = {
|
const vignetteTool: ToolEntry<VignetteParams> = {
|
||||||
@@ -93,7 +117,13 @@ interface PixelateParams {
|
|||||||
}
|
}
|
||||||
|
|
||||||
export const pixelateSchema = toolSchema<PixelateParams>({
|
export const pixelateSchema = toolSchema<PixelateParams>({
|
||||||
blockSize: field.slider({ min: 2, max: 64, step: 1, default: 8 }),
|
blockSize: field.slider({
|
||||||
|
label: "fields.blockSize",
|
||||||
|
min: 2,
|
||||||
|
max: 64,
|
||||||
|
step: 1,
|
||||||
|
default: 8,
|
||||||
|
}),
|
||||||
});
|
});
|
||||||
|
|
||||||
const pixelateTool: ToolEntry<PixelateParams> = {
|
const pixelateTool: ToolEntry<PixelateParams> = {
|
||||||
@@ -114,8 +144,20 @@ interface RandomizePixelsParams {
|
|||||||
|
|
||||||
export const randomizePixelsSchema = toolSchema<RandomizePixelsParams>(
|
export const randomizePixelsSchema = toolSchema<RandomizePixelsParams>(
|
||||||
{
|
{
|
||||||
blockSize: field.slider({ min: 1, max: 64, step: 1, default: 8 }),
|
blockSize: field.slider({
|
||||||
seed: field.number({ min: 0, max: 999999, step: 1, default: 42 }),
|
label: "fields.blockSize",
|
||||||
|
min: 1,
|
||||||
|
max: 64,
|
||||||
|
step: 1,
|
||||||
|
default: 8,
|
||||||
|
}),
|
||||||
|
seed: field.number({
|
||||||
|
label: "fields.seed",
|
||||||
|
min: 0,
|
||||||
|
max: 999999,
|
||||||
|
step: 1,
|
||||||
|
default: 42,
|
||||||
|
}),
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
layout: {
|
layout: {
|
||||||
@@ -145,15 +187,28 @@ interface AddNoiseParams {
|
|||||||
|
|
||||||
export const addNoiseSchema = toolSchema<AddNoiseParams>(
|
export const addNoiseSchema = toolSchema<AddNoiseParams>(
|
||||||
{
|
{
|
||||||
amount: field.slider({ min: 0, max: 100, step: 1, default: 25 }),
|
amount: field.slider({
|
||||||
|
label: "fields.amount",
|
||||||
|
min: 0,
|
||||||
|
max: 100,
|
||||||
|
step: 1,
|
||||||
|
default: 25,
|
||||||
|
}),
|
||||||
mode: field.select({
|
mode: field.select({
|
||||||
|
label: "fields.mode",
|
||||||
default: "mono",
|
default: "mono",
|
||||||
options: [
|
options: [
|
||||||
{ value: "mono", label: "Monochrome grain" },
|
{ value: "mono", label: "Monochrome grain" },
|
||||||
{ value: "color", label: "Color noise" },
|
{ value: "color", label: "Color noise" },
|
||||||
],
|
],
|
||||||
}),
|
}),
|
||||||
seed: field.number({ min: 0, max: 999999, step: 1, default: 1234 }),
|
seed: field.number({
|
||||||
|
label: "fields.seed",
|
||||||
|
min: 0,
|
||||||
|
max: 999999,
|
||||||
|
step: 1,
|
||||||
|
default: 1234,
|
||||||
|
}),
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
layout: {
|
layout: {
|
||||||
@@ -181,7 +236,13 @@ interface JpegArtifactsParams {
|
|||||||
}
|
}
|
||||||
|
|
||||||
export const jpegArtifactsSchema = toolSchema<JpegArtifactsParams>({
|
export const jpegArtifactsSchema = toolSchema<JpegArtifactsParams>({
|
||||||
quality: field.slider({ min: 1, max: 50, step: 1, default: 10 }),
|
quality: field.slider({
|
||||||
|
label: "fields.quality",
|
||||||
|
min: 1,
|
||||||
|
max: 50,
|
||||||
|
step: 1,
|
||||||
|
default: 10,
|
||||||
|
}),
|
||||||
});
|
});
|
||||||
|
|
||||||
const jpegArtifacts: ToolEntry<JpegArtifactsParams> = {
|
const jpegArtifacts: ToolEntry<JpegArtifactsParams> = {
|
||||||
|
|||||||
Reference in New Issue
Block a user