DRY input settings

This commit is contained in:
arne 2024-07-20 18:40:05 +02:00
commit 0e42f55324

View file

@ -96,6 +96,9 @@ const scene = sync({
return scene return scene
}) })
const input = (label: string, attrs: any) =>
["div", {}, ["label", {}, label, ["input", attrs]]]
$compile( $compile(
["div.container", {}, ["div.container", {},
["main", {}, ["main", {},
@ -103,25 +106,22 @@ $compile(
$canvas(scene, size)], $canvas(scene, size)],
["aside", {}, ["aside", {},
["h2", {}, "Settings"], ["h2", {}, "Settings"],
["div", {}, ["label", {}, "Grid size: ", input("Grid size: ", {
["input", { type: "number",
type: "number", min: "5",
min: "5", value: cellSize.deref()!,
value: cellSize.deref()!, oninput: $input(cellSize)
oninput: $input(cellSize) }),
}]]], input("X Pattern: ", {
["div", {}, ["label", {}, "X Pattern: ", type: "text",
["input", { value: xs_,
type: "text", oninput: $input(xSeeds)
value: xs_, }),
oninput: $input(xSeeds) input("Y Pattern: ", {
}]]], type: "text",
["div", {}, ["label", {}, "Y Pattern: ", value: ys_,
["input", { oninput: $input(ySeeds)
type: "text", }),
value: ys_,
oninput: $input(ySeeds)
}]]],
["h2", {}, "SVG Export"], ["h2", {}, "SVG Export"],
["div", {}, ["textarea", { ["div", {}, ["textarea", {
value: scene.map((scene) => asSvg(svgDoc({ viewBox: `0 0 ${size[0]} ${size[1]}` }, scene))), value: scene.map((scene) => asSvg(svgDoc({ viewBox: `0 0 ${size[0]} ${size[1]}` }, scene))),