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