mirror
/
qrframe
kopia lustrzana https://github.com/zhengkyl/qrframe
1
0
Forkuj 0
Kod Zgłoszenia Packages Projekty Wydania Wiki Aktywność

real preset type stripper

main
Kyle Zheng 2024-08-13 02:44:46 -04:00
rodzic 1d235f017b
commit 9228459cbb
17 zmienionych plików z 1049 dodań i 456 usunięć
Pokaż statystyki Ściągnij plik aktualizacji Ściągnij plik porównania Expand all files Collapse all files

3
package.json
Wyświetl plik

@ -28,7 +28,10 @@
"vinxi": "^0.3.11" "vinxi": "^0.3.11"
}, },
"devDependencies": { "devDependencies": {
"@swc/cli": "^0.4.0",
"@swc/core": "^1.7.10",
"@unocss/transformer-variant-group": "^0.59.4", "@unocss/transformer-variant-group": "^0.59.4",
"prettier": "^3.3.3",
"vite-plugin-wasm-pack": "^0.1.12" "vite-plugin-wasm-pack": "^0.1.12"
}, },
"pnpm": { "pnpm": {

727
pnpm-lock.yaml
Wyświetl plik

Plik diff jest za duży Load Diff

21
presets/Alien.ts
Wyświetl plik

@ -115,12 +115,8 @@ export function renderSVG(qr: OutputQr, params: Params<typeof paramsSchema>) {
dotsLayer += `<circle cx="${x + 3.5}" cy="${y + 6.5}" r="0.5"/>`; dotsLayer += `<circle cx="${x + 3.5}" cy="${y + 6.5}" r="0.5"/>`;
dotsLayer += `<circle cx="${x + 6.5}" cy="${y + 6.5}" r="0.5"/>`; dotsLayer += `<circle cx="${x + 6.5}" cy="${y + 6.5}" r="0.5"/>`;
linesLayer += `<line x1="${x + 0.5}" y1="${y + 0.5}" x2="${x + 6.5}" y2="${ linesLayer += `<line x1="${x + 0.5}" y1="${y + 0.5}" x2="${x + 6.5}" y2="${y + 6.5}" stroke-width="${range(0.3, 0.6)}"/>`;
y + 6.5 linesLayer += `<line x1="${x + 6.5}" y1="${y + 0.5}" x2="${x + 0.5}" y2="${y + 6.5}" stroke-width="${range(0.3, 0.6)}"/>`;
}" stroke-width="${range(0.3, 0.6)}"/>`;
linesLayer += `<line x1="${x + 6.5}" y1="${y + 0.5}" x2="${x + 0.5}" y2="${
y + 6.5
}" stroke-width="${range(0.3, 0.6)}"/>`;
} }
for (let y = 0; y < matrixWidth; y++) { for (let y = 0; y < matrixWidth; y++) {
@ -129,10 +125,7 @@ export function renderSVG(qr: OutputQr, params: Params<typeof paramsSchema>) {
if ((module | 1) === Module.FinderON) continue; if ((module | 1) === Module.FinderON) continue;
if (!(module & 1)) continue; if (!(module & 1)) continue;
dotsLayer += `<circle cx="${x + 0.5}" cy="${y + 0.5}" r="${range( dotsLayer += `<circle cx="${x + 0.5}" cy="${y + 0.5}" r="${range(0.2, 0.4)}"/>`;
0.2,
0.4
)}"/>`;
if (!visited1(x, y)) { if (!visited1(x, y)) {
let nx = x + 1; let nx = x + 1;
@ -148,9 +141,7 @@ export function renderSVG(qr: OutputQr, params: Params<typeof paramsSchema>) {
ny++; ny++;
} }
if (ny - y > 1) { if (ny - y > 1) {
linesLayer += `<line x1="${x + 0.5}" y1="${y + 0.5}" x2="${ linesLayer += `<line x1="${x + 0.5}" y1="${y + 0.5}" x2="${nx - 0.5}" y2="${ny - 0.5}" stroke-width="${range(0.1, 0.3)}"/>`;
nx - 0.5
}" y2="${ny - 0.5}" stroke-width="${range(0.1, 0.3)}"/>`;
} }
} }
@ -168,9 +159,7 @@ export function renderSVG(qr: OutputQr, params: Params<typeof paramsSchema>) {
ny++; ny++;
} }
if (ny - y > 1) { if (ny - y > 1) {
linesLayer += `<line x1="${x + 0.5}" y1="${y + 0.5}" x2="${ linesLayer += `<line x1="${x + 0.5}" y1="${y + 0.5}" x2="${nx + 1.5}" y2="${ny - 0.5}" stroke-width="${range(0.1, 0.3)}"/>`;
nx + 1.5
}" y2="${ny - 0.5}" stroke-width="${range(0.1, 0.3)}"/>`;
} }
} }
} }

40
presets/Blocks.ts
Wyświetl plik

@ -112,16 +112,10 @@ export function renderSVG(qr: OutputQr, params: Params<typeof paramsSchema>) {
[0, matrixWidth - 7], [0, matrixWidth - 7],
]) { ]) {
svg += `<rect x="${x + 2}" y="${y}" width="3" height="1" fill="${fc}"/>`; svg += `<rect x="${x + 2}" y="${y}" width="3" height="1" fill="${fc}"/>`;
svg += `<rect x="${x + 2}" y="${ svg += `<rect x="${x + 2}" y="${y + 2}" width="3" height="3" fill="${fc}"/>`;
y + 2
}" width="3" height="3" fill="${fc}"/>`;
svg += `<rect x="${x}" y="${y + 2}" width="1" height="3" fill="${fc}"/>`; svg += `<rect x="${x}" y="${y + 2}" width="1" height="3" fill="${fc}"/>`;
svg += `<rect x="${x + 6}" y="${ svg += `<rect x="${x + 6}" y="${y + 2}" width="1" height="3" fill="${fc}"/>`;
y + 2 svg += `<rect x="${x + 2}" y="${y + 6}" width="3" height="1" fill="${fc}"/>`;
}" width="1" height="3" fill="${fc}"/>`;
svg += `<rect x="${x + 2}" y="${
y + 6
}" width="3" height="1" fill="${fc}"/>`;
} }
for (let y = 0; y < matrixWidth; y++) { for (let y = 0; y < matrixWidth; y++) {
@ -148,12 +142,8 @@ export function renderSVG(qr: OutputQr, params: Params<typeof paramsSchema>) {
!visited(x + 2, y + 1) !visited(x + 2, y + 1)
) { ) {
topLayer += `<g stroke-width="${ct}" stroke="${cc}">`; topLayer += `<g stroke-width="${ct}" stroke="${cc}">`;
topLayer += `<line x1="${x + co}" y1="${y + co}" x2="${ topLayer += `<line x1="${x + co}" y1="${y + co}" x2="${x + 3 - co}" y2="${y + 3 - co}"/>`;
x + 3 - co topLayer += `<line x1="${x + 3 - co}" y1="${y + co}" x2="${x + co}" y2="${y + 3 - co}"/>`;
}" y2="${y + 3 - co}"/>`;
topLayer += `<line x1="${x + 3 - co}" y1="${y + co}" x2="${
x + co
}" y2="${y + 3 - co}"/>`;
topLayer += `</g>`; topLayer += `</g>`;
setVisited(x + 2, y); setVisited(x + 2, y);
@ -170,12 +160,8 @@ export function renderSVG(qr: OutputQr, params: Params<typeof paramsSchema>) {
) { ) {
if (!visited(x + 1, y) && !visited(x + 1, y + 1)) { if (!visited(x + 1, y) && !visited(x + 1, y + 1)) {
topLayer += `<g stroke-width="${ct}" stroke="${cc}">`; topLayer += `<g stroke-width="${ct}" stroke="${cc}">`;
topLayer += `<line x1="${x + co}" y1="${y + co}" x2="${ topLayer += `<line x1="${x + co}" y1="${y + co}" x2="${x + 2 - co}" y2="${y + 2 - co}"/>`;
x + 2 - co topLayer += `<line x1="${x + 2 - co}" y1="${y + co}" x2="${x + co}" y2="${y + 2 - co}"/>`;
}" y2="${y + 2 - co}"/>`;
topLayer += `<line x1="${x + 2 - co}" y1="${y + co}" x2="${
x + co
}" y2="${y + 2 - co}"/>`;
topLayer += `</g>`; topLayer += `</g>`;
setVisited(x + 1, y); setVisited(x + 1, y);
@ -190,12 +176,8 @@ export function renderSVG(qr: OutputQr, params: Params<typeof paramsSchema>) {
ny++; ny++;
} }
if (ny - y > 2) { if (ny - y > 2) {
svg += `<rect x="${x + vo}" y="${y + vo}" width="${vt}" height="${ svg += `<rect x="${x + vo}" y="${y + vo}" width="${vt}" height="${ny - y - 1 - 2 * vo}" fill="${vc}"/>`;
ny - y - 1 - 2 * vo svg += `<rect x="${x + vo}" y="${ny - 1 + vo}" width="${vt}" height="${1 - 2 * vo}" fill="${vc}"/>`;
}" fill="${vc}"/>`;
svg += `<rect x="${x + vo}" y="${ny - 1 + vo}" width="${vt}" height="${
1 - 2 * vo
}" fill="${vc}"/>`;
for (let i = y + 1; i < ny; i++) { for (let i = y + 1; i < ny; i++) {
setVisited(x, i); setVisited(x, i);
} }
@ -207,9 +189,7 @@ export function renderSVG(qr: OutputQr, params: Params<typeof paramsSchema>) {
setVisited(nx, y); setVisited(nx, y);
nx++; nx++;
} }
svg += `<rect x="${x + ho}" y="${y + ho}" width="${ svg += `<rect x="${x + ho}" y="${y + ho}" width="${nx - x - 2 * ho}" height="${ht}" fill="${hc}"/>`;
nx - x - 2 * ho
}" height="${ht}" fill="${hc}"/>`;
} }
} }

28
presets/Bubbles.ts
Wyświetl plik

@ -88,9 +88,7 @@ export function renderSVG(qr: OutputQr, params: Params<typeof paramsSchema>) {
const bg = params["Background"]; const bg = params["Background"];
const size = matrixWidth + 2 * margin; const size = matrixWidth + 2 * margin;
let svg = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="${-margin} ${-margin} ${size} ${size}" fill="${ let svg = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="${-margin} ${-margin} ${size} ${size}" fill="${params["Tiny circle"]}">`;
params["Tiny circle"]
}">`;
svg += `<rect x="${-margin}" y="${-margin}" width="${size}" height="${size}" fill="${bg}"/>`; svg += `<rect x="${-margin}" y="${-margin}" width="${size}" height="${size}" fill="${bg}"/>`;
let botLayer = `<g fill="none" stroke="${params["Large circle"]}" stroke-width="0.6">`; let botLayer = `<g fill="none" stroke="${params["Large circle"]}" stroke-width="0.6">`;
@ -115,9 +113,7 @@ export function renderSVG(qr: OutputQr, params: Params<typeof paramsSchema>) {
[matrixWidth - 7, 0], [matrixWidth - 7, 0],
[0, matrixWidth - 7], [0, matrixWidth - 7],
]) { ]) {
svg += `<circle cx="${x + 3.5}" cy="${ svg += `<circle cx="${x + 3.5}" cy="${y + 3.5}" r="3" fill="none" stroke="${fc}" stroke-width="1"/>`;
y + 3.5
}" r="3" fill="none" stroke="${fc}" stroke-width="1"/>`;
svg += `<circle cx="${x + 3.5}" cy="${y + 3.5}" r="1.5" fill="${fc}"/>`; svg += `<circle cx="${x + 3.5}" cy="${y + 3.5}" r="1.5" fill="${fc}"/>`;
} }
@ -140,10 +136,7 @@ export function renderSVG(qr: OutputQr, params: Params<typeof paramsSchema>) {
!visited(x + 1, y + 1) && !visited(x + 1, y + 1) &&
!visited(x + 2, y + 1) !visited(x + 2, y + 1)
) { ) {
botLayer += `<circle cx="${x + 1.5}" cy="${y + 1.5}" r="${range( botLayer += `<circle cx="${x + 1.5}" cy="${y + 1.5}" r="${range(0.8, 1.2)}"/>`;
0.8,
1.2
)}"/>`;
setVisited(x + 1, y); setVisited(x + 1, y);
setVisited(x, y + 1); setVisited(x, y + 1);
@ -161,28 +154,19 @@ export function renderSVG(qr: OutputQr, params: Params<typeof paramsSchema>) {
!visited(x + 1, y) && !visited(x + 1, y) &&
!visited(x + 1, y + 1) !visited(x + 1, y + 1)
) { ) {
midLayer += `<circle cx="${x + 1}" cy="${y + 1}" r="${range( midLayer += `<circle cx="${x + 1}" cy="${y + 1}" r="${range(0.4, 0.6)}"/>`;
0.4,
0.6
)}"/>`;
setVisited(x + 1, y); setVisited(x + 1, y);
setVisited(x, y + 1); setVisited(x, y + 1);
setVisited(x + 1, y + 1); setVisited(x + 1, y + 1);
continue; continue;
} }
if (x < matrixWidth - 1 && matrix(x + 1, y) & 1 && !visited(x + 1, y)) { if (x < matrixWidth - 1 && matrix(x + 1, y) & 1 && !visited(x + 1, y)) {
topLayer += `<circle cx="${x + 1}" cy="${y + 0.5}" r="${range( topLayer += `<circle cx="${x + 1}" cy="${y + 0.5}" r="${range(0.4, 0.6)}"/>`;
0.4,
0.6
)}"/>`;
setVisited(x + 1, y); setVisited(x + 1, y);
continue; continue;
} }
if (y < matrixWidth - 1 && matrix(x, y + 1) & 1 && !visited(x, y + 1)) { if (y < matrixWidth - 1 && matrix(x, y + 1) & 1 && !visited(x, y + 1)) {
topLayer += `<circle cx="${x + 0.5}" cy="${y + 1}" r="${range( topLayer += `<circle cx="${x + 0.5}" cy="${y + 1}" r="${range(0.3, 0.5)}"/>`;
0.3,
0.5
)}"/>`;
setVisited(x, y + 1); setVisited(x, y + 1);
continue; continue;
} }

107
presets/Camo.ts
Wyświetl plik

@ -65,9 +65,6 @@ export function renderSVG(qr: OutputQr, params: Params<typeof paramsSchema>) {
const fg = params["Foreground"]; const fg = params["Foreground"];
const bg = params["Background"]; const bg = params["Background"];
const moduleSize = 3;
const lineSize = 1;
const qrWidth = qr.version * 4 + 17; const qrWidth = qr.version * 4 + 17;
const matrixWidth = qrWidth + 2 * margin; const matrixWidth = qrWidth + 2 * margin;
@ -101,11 +98,6 @@ export function renderSVG(qr: OutputQr, params: Params<typeof paramsSchema>) {
} }
let svg = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 ${matrixWidth} ${matrixWidth}">`; let svg = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 ${matrixWidth} ${matrixWidth}">`;
svg += `<filter id="shadow">
<feDropShadow dx="0" dy="0" stdDeviation="0.5" flood-color="cyan" />
</filter>`
svg += `<rect width="${matrixWidth}" height="${matrixWidth}" fill="${bg}"/>`; svg += `<rect width="${matrixWidth}" height="${matrixWidth}" fill="${bg}"/>`;
const xMax = matrixWidth - 1; const xMax = matrixWidth - 1;
@ -124,7 +116,7 @@ export function renderSVG(qr: OutputQr, params: Params<typeof paramsSchema>) {
visited[y * matrixWidth + x] = shape; visited[y * matrixWidth + x] = shape;
while (x < xMax) { while (x < xMax) {
const right = on(x + 1, y); const right = on(x + 1, y);
const vertRight = y > 0 && on(x + 1, y - 1) const vertRight = y > 0 && on(x + 1, y - 1);
if (!right || vertRight) { if (!right || vertRight) {
vert = right && vertRight; vert = right && vertRight;
break; break;
@ -134,11 +126,11 @@ export function renderSVG(qr: OutputQr, params: Params<typeof paramsSchema>) {
} }
paths[shape] += `h${x - sx}`; paths[shape] += `h${x - sx}`;
if (vert) { if (vert) {
paths[shape] += `a.5.5 0,0,0 .5-.5` paths[shape] += `a.5.5 0,0,0 .5-.5`;
goUp(x + 1, y - 1, shape) goUp(x + 1, y - 1, shape);
} else { } else {
paths[shape] += `a.5.5 0,0,1 .5.5` paths[shape] += `a.5.5 0,0,1 .5.5`;
goDown(x, y, shape) goDown(x, y, shape);
} }
} }
@ -147,8 +139,8 @@ export function renderSVG(qr: OutputQr, params: Params<typeof paramsSchema>) {
let vert = false; let vert = false;
visited[y * matrixWidth + x] = shape; visited[y * matrixWidth + x] = shape;
while (x > 0) { while (x > 0) {
const left = on(x - 1, y) const left = on(x - 1, y);
const vertLeft = y < yMax && on(x - 1, y + 1) const vertLeft = y < yMax && on(x - 1, y + 1);
if (!left || vertLeft) { if (!left || vertLeft) {
vert = left && vertLeft; vert = left && vertLeft;
break; break;
@ -157,17 +149,17 @@ export function renderSVG(qr: OutputQr, params: Params<typeof paramsSchema>) {
visited[y * matrixWidth + x] = shape; visited[y * matrixWidth + x] = shape;
} }
if (shape !== paths.length - 1 && x === baseX && y === baseY) { if (shape !== paths.length - 1 && x === baseX && y === baseY) {
paths[shape] += "z" paths[shape] += "z";
return; return;
} }
paths[shape] += `h${x - sx}`; paths[shape] += `h${x - sx}`;
if (vert) { if (vert) {
paths[shape] += `a.5.5 0,0,0 -.5.5` paths[shape] += `a.5.5 0,0,0 -.5.5`;
goDown(x - 1, y + 1, shape) goDown(x - 1, y + 1, shape);
} else { } else {
paths[shape] += `a.5.5 0,0,1 -.5-.5` paths[shape] += `a.5.5 0,0,1 -.5-.5`;
goUp(x, y, shape) goUp(x, y, shape);
} }
} }
@ -177,7 +169,7 @@ export function renderSVG(qr: OutputQr, params: Params<typeof paramsSchema>) {
visited[y * matrixWidth + x] = shape; visited[y * matrixWidth + x] = shape;
while (y > 0) { while (y > 0) {
const up = on(x, y - 1); const up = on(x, y - 1);
const horzUp = x > 0 && on(x - 1, y - 1) const horzUp = x > 0 && on(x - 1, y - 1);
if (!up || horzUp) { if (!up || horzUp) {
horz = up && horzUp; horz = up && horzUp;
break; break;
@ -187,16 +179,16 @@ export function renderSVG(qr: OutputQr, params: Params<typeof paramsSchema>) {
} }
if (shape === paths.length - 1 && x === baseX && y === baseY) { if (shape === paths.length - 1 && x === baseX && y === baseY) {
paths[shape] += "z" paths[shape] += "z";
return; return;
} }
paths[shape] += `v${y - sy}` paths[shape] += `v${y - sy}`;
if (horz) { if (horz) {
paths[shape] += `a.5.5 0,0,0 -.5-.5` paths[shape] += `a.5.5 0,0,0 -.5-.5`;
goLeft(x - 1, y - 1, shape) goLeft(x - 1, y - 1, shape);
} else { } else {
paths[shape] += `a.5.5 0,0,1 .5-.5` paths[shape] += `a.5.5 0,0,1 .5-.5`;
goRight(x, y, shape) goRight(x, y, shape);
} }
} }
@ -206,7 +198,7 @@ export function renderSVG(qr: OutputQr, params: Params<typeof paramsSchema>) {
visited[y * matrixWidth + x] = shape; visited[y * matrixWidth + x] = shape;
while (y < yMax) { while (y < yMax) {
const down = on(x, y + 1); const down = on(x, y + 1);
const horzDown = x < xMax && on(x + 1, y + 1) const horzDown = x < xMax && on(x + 1, y + 1);
if (!down || horzDown) { if (!down || horzDown) {
horz = down && horzDown; horz = down && horzDown;
break; break;
@ -214,26 +206,26 @@ export function renderSVG(qr: OutputQr, params: Params<typeof paramsSchema>) {
y++; y++;
visited[y * matrixWidth + x] = shape; visited[y * matrixWidth + x] = shape;
} }
paths[shape] += `v${y - sy}` paths[shape] += `v${y - sy}`;
if (horz) { if (horz) {
paths[shape] += `a.5.5 0,0,0 .5.5` paths[shape] += `a.5.5 0,0,0 .5.5`;
goRight(x + 1, y + 1, shape) goRight(x + 1, y + 1, shape);
} else { } else {
paths[shape] += `a.5.5 0,0,1 -.5.5` paths[shape] += `a.5.5 0,0,1 -.5.5`;
goLeft(x, y, shape) goLeft(x, y, shape);
} }
} }
const stack: [number, number][] = [] const stack: [number, number][] = [];
for (let x = 0; x < matrixWidth; x++) { for (let x = 0; x < matrixWidth; x++) {
if (!on(x, 0)) stack.push([x, 0]) if (!on(x, 0)) stack.push([x, 0]);
} }
for (let y = 1; y < yMax; y++) { for (let y = 1; y < yMax; y++) {
if (!on(0, y)) stack.push([0, y]) if (!on(0, y)) stack.push([0, y]);
if (!on(xMax, y)) stack.push([xMax, y]) if (!on(xMax, y)) stack.push([xMax, y]);
} }
for (let x = 0; x < matrixWidth; x++) { for (let x = 0; x < matrixWidth; x++) {
if (!on(x, yMax)) stack.push([x, yMax]) if (!on(x, yMax)) stack.push([x, yMax]);
} }
// recursion dfs limited to ~4000 // recursion dfs limited to ~4000
@ -243,7 +235,7 @@ export function renderSVG(qr: OutputQr, params: Params<typeof paramsSchema>) {
const [x, y] = stack.pop()!; const [x, y] = stack.pop()!;
if (visited[y * matrixWidth + x]) continue; if (visited[y * matrixWidth + x]) continue;
visited[y * matrixWidth + x] = 1; visited[y * matrixWidth + x] = 1;
for (let dy =-1; dy <= 1; dy++) { for (let dy = -1; dy <= 1; dy++) {
for (let dx = -1; dx <= 1; dx++) { for (let dx = -1; dx <= 1; dx++) {
if (dy === 0 && dx === 0) continue; if (dy === 0 && dx === 0) continue;
let nx = x + dx; let nx = x + dx;
@ -255,52 +247,51 @@ export function renderSVG(qr: OutputQr, params: Params<typeof paramsSchema>) {
} }
} }
} }
dfsOff() dfsOff();
const paths = [""] const paths = [""];
for (let y = 0; y < matrixWidth; y++) { for (let y = 0; y < matrixWidth; y++) {
for (let x = 0; x < matrixWidth; x++) { for (let x = 0; x < matrixWidth; x++) {
if (visited[y * matrixWidth + x]) continue; if (visited[y * matrixWidth + x]) continue;
if (!on(x, y)) { if (!on(x, y)) {
const shape = visited[y * matrixWidth + x - 1] const shape = visited[y * matrixWidth + x - 1];
paths[shape] += `M${x + 0.5},${y}a.5.5 0,0,0 -.5.5` paths[shape] += `M${x + 0.5},${y}a.5.5 0,0,0 -.5.5`;
// these indexes are correct, think about it // these indexes are correct, think about it
baseY = y -1; baseY = y - 1;
baseX = x ; baseX = x;
goDown(x - 1, y, shape) goDown(x - 1, y, shape);
stack.push([x, y]) stack.push([x, y]);
dfsOff() dfsOff();
continue; continue;
}; }
if (y > 0 && on(x, y-1) && visited[(y - 1) * matrixWidth + x]) { if (y > 0 && on(x, y - 1) && visited[(y - 1) * matrixWidth + x]) {
visited[y * matrixWidth + x] = visited[(y - 1) * matrixWidth + x]; visited[y * matrixWidth + x] = visited[(y - 1) * matrixWidth + x];
continue; continue;
}; }
if (x > 0 && on(x - 1, y) && visited[y * matrixWidth + x - 1]) { if (x > 0 && on(x - 1, y) && visited[y * matrixWidth + x - 1]) {
visited[y * matrixWidth + x] = visited[y * matrixWidth + x - 1]; visited[y * matrixWidth + x] = visited[y * matrixWidth + x - 1];
continue; continue;
}; }
paths.push(`<path fill="${fg}" d="M${x},${y+0.5}a.5.5 0,0,1 .5-.5`) paths.push(`<path fill="${fg}" d="M${x},${y + 0.5}a.5.5 0,0,1 .5-.5`);
baseY = y; baseY = y;
baseX = x baseX = x;
goRight(x, y, paths.length - 1); goRight(x, y, paths.length - 1);
} }
} }
paths.forEach((path, i) => { paths.forEach((path, i) => {
if (i === 0) return if (i === 0) return;
svg += path; svg += path;
svg += `"/>` svg += `"/>`;
}) });
svg += `</svg>`; svg += `</svg>`;
return svg; return svg;
} }

8
presets/Circle.ts
Wyświetl plik

@ -92,9 +92,7 @@ export function renderSVG(qr: OutputQr, params: Params<typeof paramsSchema>) {
[matrixWidth - 7, 0], [matrixWidth - 7, 0],
[0, matrixWidth - 7], [0, matrixWidth - 7],
]) { ]) {
svg += `<circle cx="${x + 3.5}" cy="${ svg += `<circle cx="${x + 3.5}" cy="${y + 3.5}" r="3" fill="none" stroke="${fg}" stroke-width="1"/>`;
y + 3.5
}" r="3" fill="none" stroke="${fg}" stroke-width="1"/>`;
svg += `<circle cx="${x + 3.5}" cy="${y + 3.5}" r="1.5" fill="${fg}"/>`; svg += `<circle cx="${x + 3.5}" cy="${y + 3.5}" r="1.5" fill="${fg}"/>`;
} }
} }
@ -168,9 +166,7 @@ export function renderSVG(qr: OutputQr, params: Params<typeof paramsSchema>) {
const radius = Math.trunc(100 * 0.5 * ratio) / 100; const radius = Math.trunc(100 * 0.5 * ratio) / 100;
svg += `M${x + 0.5},${y + 0.5 - radius}a${radius},${radius} 0,0,0 0,${ svg += `M${x + 0.5},${y + 0.5 - radius}a${radius},${radius} 0,0,0 0,${2 * radius}a${radius},${radius} 0,0,0 0,${-2 * radius}`;
2 * radius
}a${radius},${radius} 0,0,0 0,${-2 * radius}`;
} }
} }
svg += `"/></svg>`; svg += `"/></svg>`;

28
presets/Halftone.ts
Wyświetl plik

@ -66,8 +66,8 @@ export async function renderCanvas(
params: Params<typeof paramsSchema>, params: Params<typeof paramsSchema>,
ctx: CanvasRenderingContext2D ctx: CanvasRenderingContext2D
) { ) {
const moduleSize = 3; const unit = 3;
const pixelSize = 1; const pixel = 1;
const matrixWidth = qr.version * 4 + 17; const matrixWidth = qr.version * 4 + 17;
const margin = params["Margin"]; const margin = params["Margin"];
@ -78,7 +78,7 @@ export async function renderCanvas(
const file = params["Image"]; const file = params["Image"];
const pixelWidth = matrixWidth + 2 * margin; const pixelWidth = matrixWidth + 2 * margin;
const canvasSize = pixelWidth * moduleSize; const canvasSize = pixelWidth * unit;
ctx.canvas.width = canvasSize; ctx.canvas.width = canvasSize;
ctx.canvas.height = canvasSize; ctx.canvas.height = canvasSize;
@ -93,10 +93,10 @@ export async function renderCanvas(
const px = x + margin; const px = x + margin;
const py = y + margin; const py = y + margin;
ctx.fillRect( ctx.fillRect(
px * moduleSize, px * unit,
py * moduleSize, py * unit,
moduleSize, unit,
moduleSize unit
); );
} }
} }
@ -144,7 +144,7 @@ export async function renderCanvas(
newPixel = 255; newPixel = 255;
ctx.fillStyle = bg; ctx.fillStyle = bg;
} }
ctx.fillRect(x * pixelSize, y * pixelSize, pixelSize, pixelSize); ctx.fillRect(x * pixel, y * pixel, pixel, pixel);
data[i] = data[i + 1] = data[i + 2] = newPixel; data[i] = data[i + 1] = data[i + 2] = newPixel;
const error = oldPixel - newPixel; const error = oldPixel - newPixel;
@ -165,7 +165,7 @@ export async function renderCanvas(
} }
} }
const dataOffset = (moduleSize - pixelSize) / 2; const dataOffset = (unit - pixel) / 2;
for (let y = 0; y < matrixWidth; y++) { for (let y = 0; y < matrixWidth; y++) {
for (let x = 0; x < matrixWidth; x++) { for (let x = 0; x < matrixWidth; x++) {
@ -185,13 +185,13 @@ export async function renderCanvas(
(alignment && type === Module.AlignmentON) || (alignment && type === Module.AlignmentON) ||
(timing && type === Module.TimingON) (timing && type === Module.TimingON)
) { ) {
ctx.fillRect(px * moduleSize, py * moduleSize, moduleSize, moduleSize); ctx.fillRect(px * unit, py * unit, unit, unit);
} else { } else {
ctx.fillRect( ctx.fillRect(
px * moduleSize + dataOffset, px * unit + dataOffset,
py * moduleSize + dataOffset, py * unit + dataOffset,
pixelSize, pixel,
pixelSize pixel
); );
} }
} }

32
presets/Minimal.ts
Wyświetl plik

@ -37,14 +37,14 @@ const Module = {
export function renderSVG(qr: OutputQr, params: Params<typeof paramsSchema>) { export function renderSVG(qr: OutputQr, params: Params<typeof paramsSchema>) {
const matrixWidth = qr.version * 4 + 17; const matrixWidth = qr.version * 4 + 17;
const moduleSize = 10; const unit = 10;
const dataSize = params["Data pixel size"]; const dataSize = params["Data pixel size"];
const margin = params["Margin"] * moduleSize; const margin = params["Margin"] * unit;
const fg = "#000"; const fg = "#000";
const bg = "#fff"; const bg = "#fff";
const size = matrixWidth * moduleSize + 2 * margin; const size = matrixWidth * unit + 2 * margin;
let svg = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="${-margin} ${-margin} ${size} ${size}">`; let svg = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="${-margin} ${-margin} ${size} ${size}">`;
if (params["Background"]) { if (params["Background"]) {
svg += `<rect x="${-margin}" y="${-margin}" width="${size}" height="${size}" fill="${bg}"/>`; svg += `<rect x="${-margin}" y="${-margin}" width="${size}" height="${size}" fill="${bg}"/>`;
@ -56,25 +56,15 @@ export function renderSVG(qr: OutputQr, params: Params<typeof paramsSchema>) {
[matrixWidth - 7, 0], [matrixWidth - 7, 0],
[0, matrixWidth - 7], [0, matrixWidth - 7],
]) { ]) {
svg += `M${(x + 3) * moduleSize},${ svg += `M${(x + 3) * unit},${y * unit}h${unit}v${unit}h-${unit}z`;
y * moduleSize svg += `M${x * unit},${(y + 3) * unit}h${unit}v${unit}h-${unit}z`;
}h${moduleSize}v${moduleSize}h-${moduleSize}z`; svg += `M${(x + 6) * unit},${(y + 3) * unit}h${unit}v${unit}h-${unit}z`;
svg += `M${x * moduleSize},${ svg += `M${(x + 3) * unit},${(y + 6) * unit}h${unit}v${unit}h-${unit}z`;
(y + 3) * moduleSize
}h${moduleSize}v${moduleSize}h-${moduleSize}z`;
svg += `M${(x + 6) * moduleSize},${
(y + 3) * moduleSize
}h${moduleSize}v${moduleSize}h-${moduleSize}z`;
svg += `M${(x + 3) * moduleSize},${
(y + 6) * moduleSize
}h${moduleSize}v${moduleSize}h-${moduleSize}z`;
svg += `M${(x + 2) * moduleSize},${(y + 2) * moduleSize}h${ svg += `M${(x + 2) * unit},${(y + 2) * unit}h${unit * 3}v${unit * 3}h-${unit * 3}z`;
moduleSize * 3
}v${moduleSize * 3}h-${moduleSize * 3}z`;
} }
const offset = (moduleSize - dataSize) / 2; const offset = (unit - dataSize) / 2;
for (let y = 0; y < matrixWidth; y++) { for (let y = 0; y < matrixWidth; y++) {
for (let x = 0; x < matrixWidth; x++) { for (let x = 0; x < matrixWidth; x++) {
const module = qr.matrix[y * matrixWidth + x]; const module = qr.matrix[y * matrixWidth + x];
@ -84,8 +74,8 @@ export function renderSVG(qr: OutputQr, params: Params<typeof paramsSchema>) {
} }
if (module & 1) { if (module & 1) {
const sx = x * moduleSize + offset; const sx = x * unit + offset;
const sy = y * moduleSize + offset; const sy = y * unit + offset;
svg += `M${sx},${sy}h${dataSize}v${dataSize}h-${dataSize}z`; svg += `M${sx},${sy}h${dataSize}v${dataSize}h-${dataSize}z`;
} }
} }

21
src/lib/presets/Alien.ts
Wyświetl plik

@ -112,12 +112,8 @@ export function renderSVG(qr, params) {
dotsLayer += \`<circle cx="\${x + 3.5}" cy="\${y + 6.5}" r="0.5"/>\`; dotsLayer += \`<circle cx="\${x + 3.5}" cy="\${y + 6.5}" r="0.5"/>\`;
dotsLayer += \`<circle cx="\${x + 6.5}" cy="\${y + 6.5}" r="0.5"/>\`; dotsLayer += \`<circle cx="\${x + 6.5}" cy="\${y + 6.5}" r="0.5"/>\`;
linesLayer += \`<line x1="\${x + 0.5}" y1="\${y + 0.5}" x2="\${x + 6.5}" y2="\${ linesLayer += \`<line x1="\${x + 0.5}" y1="\${y + 0.5}" x2="\${x + 6.5}" y2="\${y + 6.5}" stroke-width="\${range(0.3, 0.6)}"/>\`;
y + 6.5 linesLayer += \`<line x1="\${x + 6.5}" y1="\${y + 0.5}" x2="\${x + 0.5}" y2="\${y + 6.5}" stroke-width="\${range(0.3, 0.6)}"/>\`;
}" stroke-width="\${range(0.3, 0.6)}"/>\`;
linesLayer += \`<line x1="\${x + 6.5}" y1="\${y + 0.5}" x2="\${x + 0.5}" y2="\${
y + 6.5
}" stroke-width="\${range(0.3, 0.6)}"/>\`;
} }
for (let y = 0; y < matrixWidth; y++) { for (let y = 0; y < matrixWidth; y++) {
@ -126,10 +122,7 @@ export function renderSVG(qr, params) {
if ((module | 1) === Module.FinderON) continue; if ((module | 1) === Module.FinderON) continue;
if (!(module & 1)) continue; if (!(module & 1)) continue;
dotsLayer += \`<circle cx="\${x + 0.5}" cy="\${y + 0.5}" r="\${range( dotsLayer += \`<circle cx="\${x + 0.5}" cy="\${y + 0.5}" r="\${range(0.2, 0.4)}"/>\`;
0.2,
0.4
)}"/>\`;
if (!visited1(x, y)) { if (!visited1(x, y)) {
let nx = x + 1; let nx = x + 1;
@ -145,9 +138,7 @@ export function renderSVG(qr, params) {
ny++; ny++;
} }
if (ny - y > 1) { if (ny - y > 1) {
linesLayer += \`<line x1="\${x + 0.5}" y1="\${y + 0.5}" x2="\${ linesLayer += \`<line x1="\${x + 0.5}" y1="\${y + 0.5}" x2="\${nx - 0.5}" y2="\${ny - 0.5}" stroke-width="\${range(0.1, 0.3)}"/>\`;
nx - 0.5
}" y2="\${ny - 0.5}" stroke-width="\${range(0.1, 0.3)}"/>\`;
} }
} }
@ -165,9 +156,7 @@ export function renderSVG(qr, params) {
ny++; ny++;
} }
if (ny - y > 1) { if (ny - y > 1) {
linesLayer += \`<line x1="\${x + 0.5}" y1="\${y + 0.5}" x2="\${ linesLayer += \`<line x1="\${x + 0.5}" y1="\${y + 0.5}" x2="\${nx + 1.5}" y2="\${ny - 0.5}" stroke-width="\${range(0.1, 0.3)}"/>\`;
nx + 1.5
}" y2="\${ny - 0.5}" stroke-width="\${range(0.1, 0.3)}"/>\`;
} }
} }
} }

40
src/lib/presets/Blocks.ts
Wyświetl plik

@ -109,16 +109,10 @@ export function renderSVG(qr, params) {
[0, matrixWidth - 7], [0, matrixWidth - 7],
]) { ]) {
svg += \`<rect x="\${x + 2}" y="\${y}" width="3" height="1" fill="\${fc}"/>\`; svg += \`<rect x="\${x + 2}" y="\${y}" width="3" height="1" fill="\${fc}"/>\`;
svg += \`<rect x="\${x + 2}" y="\${ svg += \`<rect x="\${x + 2}" y="\${y + 2}" width="3" height="3" fill="\${fc}"/>\`;
y + 2
}" width="3" height="3" fill="\${fc}"/>\`;
svg += \`<rect x="\${x}" y="\${y + 2}" width="1" height="3" fill="\${fc}"/>\`; svg += \`<rect x="\${x}" y="\${y + 2}" width="1" height="3" fill="\${fc}"/>\`;
svg += \`<rect x="\${x + 6}" y="\${ svg += \`<rect x="\${x + 6}" y="\${y + 2}" width="1" height="3" fill="\${fc}"/>\`;
y + 2 svg += \`<rect x="\${x + 2}" y="\${y + 6}" width="3" height="1" fill="\${fc}"/>\`;
}" width="1" height="3" fill="\${fc}"/>\`;
svg += \`<rect x="\${x + 2}" y="\${
y + 6
}" width="3" height="1" fill="\${fc}"/>\`;
} }
for (let y = 0; y < matrixWidth; y++) { for (let y = 0; y < matrixWidth; y++) {
@ -145,12 +139,8 @@ export function renderSVG(qr, params) {
!visited(x + 2, y + 1) !visited(x + 2, y + 1)
) { ) {
topLayer += \`<g stroke-width="\${ct}" stroke="\${cc}">\`; topLayer += \`<g stroke-width="\${ct}" stroke="\${cc}">\`;
topLayer += \`<line x1="\${x + co}" y1="\${y + co}" x2="\${ topLayer += \`<line x1="\${x + co}" y1="\${y + co}" x2="\${x + 3 - co}" y2="\${y + 3 - co}"/>\`;
x + 3 - co topLayer += \`<line x1="\${x + 3 - co}" y1="\${y + co}" x2="\${x + co}" y2="\${y + 3 - co}"/>\`;
}" y2="\${y + 3 - co}"/>\`;
topLayer += \`<line x1="\${x + 3 - co}" y1="\${y + co}" x2="\${
x + co
}" y2="\${y + 3 - co}"/>\`;
topLayer += \`</g>\`; topLayer += \`</g>\`;
setVisited(x + 2, y); setVisited(x + 2, y);
@ -167,12 +157,8 @@ export function renderSVG(qr, params) {
) { ) {
if (!visited(x + 1, y) && !visited(x + 1, y + 1)) { if (!visited(x + 1, y) && !visited(x + 1, y + 1)) {
topLayer += \`<g stroke-width="\${ct}" stroke="\${cc}">\`; topLayer += \`<g stroke-width="\${ct}" stroke="\${cc}">\`;
topLayer += \`<line x1="\${x + co}" y1="\${y + co}" x2="\${ topLayer += \`<line x1="\${x + co}" y1="\${y + co}" x2="\${x + 2 - co}" y2="\${y + 2 - co}"/>\`;
x + 2 - co topLayer += \`<line x1="\${x + 2 - co}" y1="\${y + co}" x2="\${x + co}" y2="\${y + 2 - co}"/>\`;
}" y2="\${y + 2 - co}"/>\`;
topLayer += \`<line x1="\${x + 2 - co}" y1="\${y + co}" x2="\${
x + co
}" y2="\${y + 2 - co}"/>\`;
topLayer += \`</g>\`; topLayer += \`</g>\`;
setVisited(x + 1, y); setVisited(x + 1, y);
@ -187,12 +173,8 @@ export function renderSVG(qr, params) {
ny++; ny++;
} }
if (ny - y > 2) { if (ny - y > 2) {
svg += \`<rect x="\${x + vo}" y="\${y + vo}" width="\${vt}" height="\${ svg += \`<rect x="\${x + vo}" y="\${y + vo}" width="\${vt}" height="\${ny - y - 1 - 2 * vo}" fill="\${vc}"/>\`;
ny - y - 1 - 2 * vo svg += \`<rect x="\${x + vo}" y="\${ny - 1 + vo}" width="\${vt}" height="\${1 - 2 * vo}" fill="\${vc}"/>\`;
}" fill="\${vc}"/>\`;
svg += \`<rect x="\${x + vo}" y="\${ny - 1 + vo}" width="\${vt}" height="\${
1 - 2 * vo
}" fill="\${vc}"/>\`;
for (let i = y + 1; i < ny; i++) { for (let i = y + 1; i < ny; i++) {
setVisited(x, i); setVisited(x, i);
} }
@ -204,9 +186,7 @@ export function renderSVG(qr, params) {
setVisited(nx, y); setVisited(nx, y);
nx++; nx++;
} }
svg += \`<rect x="\${x + ho}" y="\${y + ho}" width="\${ svg += \`<rect x="\${x + ho}" y="\${y + ho}" width="\${nx - x - 2 * ho}" height="\${ht}" fill="\${hc}"/>\`;
nx - x - 2 * ho
}" height="\${ht}" fill="\${hc}"/>\`;
} }
} }

61
src/lib/presets/Bubbles.ts
Wyświetl plik

@ -75,57 +75,51 @@ export function renderSVG(qr, params) {
const rand = splitmix32(params["Seed"]); const rand = splitmix32(params["Seed"]);
const range = params["Randomize circle size"] const range = params["Randomize circle size"]
? (min, max) => ? (min, max) => Math.trunc(100 * (rand() * (max - min) + min)) / 100
Math.trunc(100 * (rand() * (max - min) + min)) / 100 : (min, max) => Math.trunc(100 * ((max - min) / 2 + min)) / 100;
: (min, max) =>
Math.trunc(100 * ((max - min) / 2 + min)) / 100;
const matrixWidth = qr.version * 4 + 17; const matrixWidth = qr.version * 4 + 17;
const margin = params["Margin"]; const margin = params["Margin"];
const bg = params["Background"]; const bg = params["Background"];
const size = matrixWidth + 2 * margin; const size = matrixWidth + 2 * margin;
let svg = \`<svg xmlns="http://www.w3.org/2000/svg" viewBox="\${-margin} \${-margin} \${size} \${size}" fill="\${ let svg = \`<svg xmlns="http://www.w3.org/2000/svg" viewBox="\${-margin} \${-margin} \${size} \${size}" fill="\${params["Tiny circle"]}">\`;
params["Tiny circle"]
}">\`;
svg += \`<rect x="\${-margin}" y="\${-margin}" width="\${size}" height="\${size}" fill="\${bg}"/>\`;
svg += \`<rect x="\${-margin}" y="\${-margin}" width="\${size}" height="\${size}" fill="\${bg}"/>\`;
let botLayer = \`<g fill="none" stroke="\${params["Large circle"]}" stroke-width="0.6">\`; let botLayer = \`<g fill="none" stroke="\${params["Large circle"]}" stroke-width="0.6">\`;
let midLayer = \`<g fill="none" stroke="\${params["Medium circle"]}" stroke-width="0.5">\`; let midLayer = \`<g fill="none" stroke="\${params["Medium circle"]}" stroke-width="0.5">\`;
let topLayer = \`<g fill="none" stroke="\${params["Small circle"]}" stroke-width="0.4">\`;
let topLayer = \`<g fill="none" stroke="\${params["Small circle"]}" stroke-width="0.4">\`;
function matrix(x, y) { function matrix(x, y) {
return qr.matrix[y * matrixWidth + x]; return qr.matrix[y * matrixWidth + x];
}
}
const visitedMatrix = Array(matrixWidth * matrixWidth).fill(false); const visitedMatrix = Array(matrixWidth * matrixWidth).fill(false);
function visited(x, y) { function visited(x, y) {
return visitedMatrix[y * matrixWidth + x]; return visitedMatrix[y * matrixWidth + x];
} }
function setVisited(x, y) { function setVisited(x, y) {
visitedMatrix[y * matrixWidth + x] = true; visitedMatrix[y * matrixWidth + x] = true;
} }
const fc = params["Finder"]; const fc = params["Finder"];
for (const [x, y] of [ for (const [x, y] of [
[0, 0], [0, 0],
[matrixWidth - 7, 0], [matrixWidth - 7, 0],
[0, matrixWidth - 7], [0, matrixWidth - 7],
]) { ]) {
svg += \`<circle cx="\${x + 3.5}" cy="\${ svg += \`<circle cx="\${x + 3.5}" cy="\${y + 3.5}" r="3" fill="none" stroke="\${fc}" stroke-width="1"/>\`;
y + 3.5
}" r="3" fill="none" stroke="\${fc}" stroke-width="1"/>\`;
svg += \`<circle cx="\${x + 3.5}" cy="\${y + 3.5}" r="1.5" fill="\${fc}"/>\`; svg += \`<circle cx="\${x + 3.5}" cy="\${y + 3.5}" r="1.5" fill="\${fc}"/>\`;
} }
for (let y = 0; y < matrixWidth; y++) { for (let y = 0; y < matrixWidth; y++) {
for (let x = 0; x < matrixWidth; x++) { for (let x = 0; x < matrixWidth; x++) {
const module = matrix(x, y); const module = matrix(x, y);
if ((module | 1) === Module.FinderON) continue; if ((module | 1) === Module.FinderON) continue;
if (visited(x, y)) continue; if (visited(x, y)) continue;
if ( if (
y < matrixWidth - 2 && y < matrixWidth - 2 &&
x < matrixWidth - 2 && x < matrixWidth - 2 &&
matrix(x + 1, y) & matrix(x + 1, y) &
matrix(x, y + 1) & matrix(x, y + 1) &
@ -137,65 +131,54 @@ export function renderSVG(qr, params) {
!visited(x + 1, y + 1) && !visited(x + 1, y + 1) &&
!visited(x + 2, y + 1) !visited(x + 2, y + 1)
) { ) {
botLayer += \`<circle cx="\${x + 1.5}" cy="\${y + 1.5}" r="\${range( botLayer += \`<circle cx="\${x + 1.5}" cy="\${y + 1.5}" r="\${range(0.8, 1.2)}"/>\`;
0.8,
1.2
)}"/>\`;
setVisited(x + 1, y); setVisited(x + 1, y);
setVisited(x, y + 1); setVisited(x, y + 1);
setVisited(x + 2, y + 1); setVisited(x + 2, y + 1);
setVisited(x + 1, y + 2); setVisited(x + 1, y + 2);
continue; continue;
} }
if (!(module & 1)) continue; if (!(module & 1)) continue;
setVisited(x, y); setVisited(x, y);
if ( if (
y < matrixWidth - 1 && y < matrixWidth - 1 &&
x < matrixWidth - 1 && x < matrixWidth - 1 &&
matrix(x + 1, y) & matrix(x, y + 1) & matrix(x + 1, y + 1) & 1 && matrix(x + 1, y) & matrix(x, y + 1) & matrix(x + 1, y + 1) & 1 &&
!visited(x + 1, y) && !visited(x + 1, y) &&
!visited(x + 1, y + 1) !visited(x + 1, y + 1)
) { ) {
midLayer += \`<circle cx="\${x + 1}" cy="\${y + 1}" r="\${range( midLayer += \`<circle cx="\${x + 1}" cy="\${y + 1}" r="\${range(0.4, 0.6)}"/>\`;
0.4,
0.6
)}"/>\`;
setVisited(x + 1, y); setVisited(x + 1, y);
setVisited(x, y + 1); setVisited(x, y + 1);
setVisited(x + 1, y + 1); setVisited(x + 1, y + 1);
continue; continue;
} }
if (x < matrixWidth - 1 && matrix(x + 1, y) & 1 && !visited(x + 1, y)) { if (x < matrixWidth - 1 && matrix(x + 1, y) & 1 && !visited(x + 1, y)) {
topLayer += \`<circle cx="\${x + 1}" cy="\${y + 0.5}" r="\${range( topLayer += \`<circle cx="\${x + 1}" cy="\${y + 0.5}" r="\${range(0.4, 0.6)}"/>\`;
0.4,
0.6
)}"/>\`;
setVisited(x + 1, y); setVisited(x + 1, y);
continue; continue;
} }
if (y < matrixWidth - 1 && matrix(x, y + 1) & 1 && !visited(x, y + 1)) { if (y < matrixWidth - 1 && matrix(x, y + 1) & 1 && !visited(x, y + 1)) {
topLayer += \`<circle cx="\${x + 0.5}" cy="\${y + 1}" r="\${range( topLayer += \`<circle cx="\${x + 0.5}" cy="\${y + 1}" r="\${range(0.3, 0.5)}"/>\`;
0.3,
0.5
)}"/>\`;
setVisited(x, y + 1); setVisited(x, y + 1);
continue; continue;
} }
svg += \`<circle cx="\${x + 0.5}" cy="\${y + 0.5}" r="\${range(0.2, 0.4)}"/>\`; svg += \`<circle cx="\${x + 0.5}" cy="\${y + 0.5}" r="\${range(0.2, 0.4)}"/>\`;
} }
}
}
botLayer += \`</g>\`; botLayer += \`</g>\`;
svg += botLayer; svg += botLayer;
midLayer += \`</g>\`; midLayer += \`</g>\`;
svg += midLayer; svg += midLayer;
topLayer += \`</g>\`; topLayer += \`</g>\`;
svg += topLayer; svg += topLayer;
svg += \`</svg>\`; svg += \`</svg>\`;
return svg; return svg;
} }
` `

107
src/lib/presets/Camo.ts
Wyświetl plik

@ -62,9 +62,6 @@ export function renderSVG(qr, params) {
const fg = params["Foreground"]; const fg = params["Foreground"];
const bg = params["Background"]; const bg = params["Background"];
const moduleSize = 3;
const lineSize = 1;
const qrWidth = qr.version * 4 + 17; const qrWidth = qr.version * 4 + 17;
const matrixWidth = qrWidth + 2 * margin; const matrixWidth = qrWidth + 2 * margin;
@ -98,11 +95,6 @@ export function renderSVG(qr, params) {
} }
let svg = \`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 \${matrixWidth} \${matrixWidth}">\`; let svg = \`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 \${matrixWidth} \${matrixWidth}">\`;
svg += \`<filter id="shadow">
<feDropShadow dx="0" dy="0" stdDeviation="0.5" flood-color="cyan" />
</filter>\`
svg += \`<rect width="\${matrixWidth}" height="\${matrixWidth}" fill="\${bg}"/>\`; svg += \`<rect width="\${matrixWidth}" height="\${matrixWidth}" fill="\${bg}"/>\`;
const xMax = matrixWidth - 1; const xMax = matrixWidth - 1;
@ -121,7 +113,7 @@ export function renderSVG(qr, params) {
visited[y * matrixWidth + x] = shape; visited[y * matrixWidth + x] = shape;
while (x < xMax) { while (x < xMax) {
const right = on(x + 1, y); const right = on(x + 1, y);
const vertRight = y > 0 && on(x + 1, y - 1) const vertRight = y > 0 && on(x + 1, y - 1);
if (!right || vertRight) { if (!right || vertRight) {
vert = right && vertRight; vert = right && vertRight;
break; break;
@ -131,11 +123,11 @@ export function renderSVG(qr, params) {
} }
paths[shape] += \`h\${x - sx}\`; paths[shape] += \`h\${x - sx}\`;
if (vert) { if (vert) {
paths[shape] += \`a.5.5 0,0,0 .5-.5\` paths[shape] += \`a.5.5 0,0,0 .5-.5\`;
goUp(x + 1, y - 1, shape) goUp(x + 1, y - 1, shape);
} else { } else {
paths[shape] += \`a.5.5 0,0,1 .5.5\` paths[shape] += \`a.5.5 0,0,1 .5.5\`;
goDown(x, y, shape) goDown(x, y, shape);
} }
} }
@ -144,8 +136,8 @@ export function renderSVG(qr, params) {
let vert = false; let vert = false;
visited[y * matrixWidth + x] = shape; visited[y * matrixWidth + x] = shape;
while (x > 0) { while (x > 0) {
const left = on(x - 1, y) const left = on(x - 1, y);
const vertLeft = y < yMax && on(x - 1, y + 1) const vertLeft = y < yMax && on(x - 1, y + 1);
if (!left || vertLeft) { if (!left || vertLeft) {
vert = left && vertLeft; vert = left && vertLeft;
break; break;
@ -154,17 +146,17 @@ export function renderSVG(qr, params) {
visited[y * matrixWidth + x] = shape; visited[y * matrixWidth + x] = shape;
} }
if (shape !== paths.length - 1 && x === baseX && y === baseY) { if (shape !== paths.length - 1 && x === baseX && y === baseY) {
paths[shape] += "z" paths[shape] += "z";
return; return;
} }
paths[shape] += \`h\${x - sx}\`; paths[shape] += \`h\${x - sx}\`;
if (vert) { if (vert) {
paths[shape] += \`a.5.5 0,0,0 -.5.5\` paths[shape] += \`a.5.5 0,0,0 -.5.5\`;
goDown(x - 1, y + 1, shape) goDown(x - 1, y + 1, shape);
} else { } else {
paths[shape] += \`a.5.5 0,0,1 -.5-.5\` paths[shape] += \`a.5.5 0,0,1 -.5-.5\`;
goUp(x, y, shape) goUp(x, y, shape);
} }
} }
@ -174,7 +166,7 @@ export function renderSVG(qr, params) {
visited[y * matrixWidth + x] = shape; visited[y * matrixWidth + x] = shape;
while (y > 0) { while (y > 0) {
const up = on(x, y - 1); const up = on(x, y - 1);
const horzUp = x > 0 && on(x - 1, y - 1) const horzUp = x > 0 && on(x - 1, y - 1);
if (!up || horzUp) { if (!up || horzUp) {
horz = up && horzUp; horz = up && horzUp;
break; break;
@ -184,16 +176,16 @@ export function renderSVG(qr, params) {
} }
if (shape === paths.length - 1 && x === baseX && y === baseY) { if (shape === paths.length - 1 && x === baseX && y === baseY) {
paths[shape] += "z" paths[shape] += "z";
return; return;
} }
paths[shape] += \`v\${y - sy}\` paths[shape] += \`v\${y - sy}\`;
if (horz) { if (horz) {
paths[shape] += \`a.5.5 0,0,0 -.5-.5\` paths[shape] += \`a.5.5 0,0,0 -.5-.5\`;
goLeft(x - 1, y - 1, shape) goLeft(x - 1, y - 1, shape);
} else { } else {
paths[shape] += \`a.5.5 0,0,1 .5-.5\` paths[shape] += \`a.5.5 0,0,1 .5-.5\`;
goRight(x, y, shape) goRight(x, y, shape);
} }
} }
@ -203,7 +195,7 @@ export function renderSVG(qr, params) {
visited[y * matrixWidth + x] = shape; visited[y * matrixWidth + x] = shape;
while (y < yMax) { while (y < yMax) {
const down = on(x, y + 1); const down = on(x, y + 1);
const horzDown = x < xMax && on(x + 1, y + 1) const horzDown = x < xMax && on(x + 1, y + 1);
if (!down || horzDown) { if (!down || horzDown) {
horz = down && horzDown; horz = down && horzDown;
break; break;
@ -211,26 +203,26 @@ export function renderSVG(qr, params) {
y++; y++;
visited[y * matrixWidth + x] = shape; visited[y * matrixWidth + x] = shape;
} }
paths[shape] += \`v\${y - sy}\` paths[shape] += \`v\${y - sy}\`;
if (horz) { if (horz) {
paths[shape] += \`a.5.5 0,0,0 .5.5\` paths[shape] += \`a.5.5 0,0,0 .5.5\`;
goRight(x + 1, y + 1, shape) goRight(x + 1, y + 1, shape);
} else { } else {
paths[shape] += \`a.5.5 0,0,1 -.5.5\` paths[shape] += \`a.5.5 0,0,1 -.5.5\`;
goLeft(x, y, shape) goLeft(x, y, shape);
} }
} }
const stack = [] const stack = [];
for (let x = 0; x < matrixWidth; x++) { for (let x = 0; x < matrixWidth; x++) {
if (!on(x, 0)) stack.push([x, 0]) if (!on(x, 0)) stack.push([x, 0]);
} }
for (let y = 1; y < yMax; y++) { for (let y = 1; y < yMax; y++) {
if (!on(0, y)) stack.push([0, y]) if (!on(0, y)) stack.push([0, y]);
if (!on(xMax, y)) stack.push([xMax, y]) if (!on(xMax, y)) stack.push([xMax, y]);
} }
for (let x = 0; x < matrixWidth; x++) { for (let x = 0; x < matrixWidth; x++) {
if (!on(x, yMax)) stack.push([x, yMax]) if (!on(x, yMax)) stack.push([x, yMax]);
} }
// recursion dfs limited to ~4000 // recursion dfs limited to ~4000
@ -240,7 +232,7 @@ export function renderSVG(qr, params) {
const [x, y] = stack.pop(); const [x, y] = stack.pop();
if (visited[y * matrixWidth + x]) continue; if (visited[y * matrixWidth + x]) continue;
visited[y * matrixWidth + x] = 1; visited[y * matrixWidth + x] = 1;
for (let dy =-1; dy <= 1; dy++) { for (let dy = -1; dy <= 1; dy++) {
for (let dx = -1; dx <= 1; dx++) { for (let dx = -1; dx <= 1; dx++) {
if (dy === 0 && dx === 0) continue; if (dy === 0 && dx === 0) continue;
let nx = x + dx; let nx = x + dx;
@ -252,53 +244,52 @@ export function renderSVG(qr, params) {
} }
} }
} }
dfsOff() dfsOff();
const paths = [""] const paths = [""];
for (let y = 0; y < matrixWidth; y++) { for (let y = 0; y < matrixWidth; y++) {
for (let x = 0; x < matrixWidth; x++) { for (let x = 0; x < matrixWidth; x++) {
if (visited[y * matrixWidth + x]) continue; if (visited[y * matrixWidth + x]) continue;
if (!on(x, y)) { if (!on(x, y)) {
const shape = visited[y * matrixWidth + x - 1] const shape = visited[y * matrixWidth + x - 1];
paths[shape] += \`M\${x + 0.5},\${y}a.5.5 0,0,0 -.5.5\` paths[shape] += \`M\${x + 0.5},\${y}a.5.5 0,0,0 -.5.5\`;
// these indexes are correct, think about it // these indexes are correct, think about it
baseY = y -1; baseY = y - 1;
baseX = x ; baseX = x;
goDown(x - 1, y, shape) goDown(x - 1, y, shape);
stack.push([x, y]) stack.push([x, y]);
dfsOff() dfsOff();
continue; continue;
}; }
if (y > 0 && on(x, y-1) && visited[(y - 1) * matrixWidth + x]) { if (y > 0 && on(x, y - 1) && visited[(y - 1) * matrixWidth + x]) {
visited[y * matrixWidth + x] = visited[(y - 1) * matrixWidth + x]; visited[y * matrixWidth + x] = visited[(y - 1) * matrixWidth + x];
continue; continue;
}; }
if (x > 0 && on(x - 1, y) && visited[y * matrixWidth + x - 1]) { if (x > 0 && on(x - 1, y) && visited[y * matrixWidth + x - 1]) {
visited[y * matrixWidth + x] = visited[y * matrixWidth + x - 1]; visited[y * matrixWidth + x] = visited[y * matrixWidth + x - 1];
continue; continue;
}; }
paths.push(\`<path fill="\${fg}" d="M\${x},\${y+0.5}a.5.5 0,0,1 .5-.5\`) paths.push(\`<path fill="\${fg}" d="M\${x},\${y + 0.5}a.5.5 0,0,1 .5-.5\`);
baseY = y; baseY = y;
baseX = x baseX = x;
goRight(x, y, paths.length - 1); goRight(x, y, paths.length - 1);
} }
} }
paths.forEach((path, i) => { paths.forEach((path, i) => {
if (i === 0) return if (i === 0) return;
svg += path; svg += path;
svg += \`"/>\` svg += \`"/>\`;
}) });
svg += \`</svg>\`; svg += \`</svg>\`;
return svg; return svg;
} }
` `

8
src/lib/presets/Circle.ts
Wyświetl plik

@ -89,9 +89,7 @@ export function renderSVG(qr, params) {
[matrixWidth - 7, 0], [matrixWidth - 7, 0],
[0, matrixWidth - 7], [0, matrixWidth - 7],
]) { ]) {
svg += \`<circle cx="\${x + 3.5}" cy="\${ svg += \`<circle cx="\${x + 3.5}" cy="\${y + 3.5}" r="3" fill="none" stroke="\${fg}" stroke-width="1"/>\`;
y + 3.5
}" r="3" fill="none" stroke="\${fg}" stroke-width="1"/>\`;
svg += \`<circle cx="\${x + 3.5}" cy="\${y + 3.5}" r="1.5" fill="\${fg}"/>\`; svg += \`<circle cx="\${x + 3.5}" cy="\${y + 3.5}" r="1.5" fill="\${fg}"/>\`;
} }
} }
@ -165,9 +163,7 @@ export function renderSVG(qr, params) {
const radius = Math.trunc(100 * 0.5 * ratio) / 100; const radius = Math.trunc(100 * 0.5 * ratio) / 100;
svg += \`M\${x + 0.5},\${y + 0.5 - radius}a\${radius},\${radius} 0,0,0 0,\${ svg += \`M\${x + 0.5},\${y + 0.5 - radius}a\${radius},\${radius} 0,0,0 0,\${2 * radius}a\${radius},\${radius} 0,0,0 0,\${-2 * radius}\`;
2 * radius
}a\${radius},\${radius} 0,0,0 0,\${-2 * radius}\`;
} }
} }
svg += \`"/></svg>\`; svg += \`"/></svg>\`;

56
src/lib/presets/Halftone.ts
Wyświetl plik

@ -59,19 +59,18 @@ const Module = {
}; };
export async function renderCanvas(qr, params, ctx) { export async function renderCanvas(qr, params, ctx) {
const moduleSize = 3; const unit = 3;
const pixelSize = 1; const pixel = 1;
const matrixWidth = qr.version * 4 + 17; const matrixWidth = qr.version * 4 + 17;
const margin = params["Margin"]; const margin = params["Margin"];
const fg = params["Foreground"]; const fg = params["Foreground"];
const bg = params["Background"]; const bg = params["Background"];
const alignment = params["Alignment pattern"]; const alignment = params["Alignment pattern"];
const timing = params["Timing pattern"]; const timing = params["Timing pattern"];
const file = params["Image"]; const file = params["Image"];
const pixelWidth = matrixWidth + 2 * margin; const pixelWidth = matrixWidth + 2 * margin;
const canvasSize = pixelWidth * moduleSize; const canvasSize = pixelWidth * unit;
ctx.canvas.width = canvasSize; ctx.canvas.width = canvasSize;
ctx.canvas.height = canvasSize; ctx.canvas.height = canvasSize;
@ -79,25 +78,19 @@ export async function renderCanvas(qr, params, ctx) {
ctx.fillStyle = bg; ctx.fillStyle = bg;
ctx.fillRect(0, 0, canvasSize, canvasSize); ctx.fillRect(0, 0, canvasSize, canvasSize);
ctx.fillStyle = fg; ctx.fillStyle = fg;
for (let y = 0; y < matrixWidth; y++) { for (let y = 0; y < matrixWidth; y++) {
for (let x = 0; x < matrixWidth; x++) { for (let x = 0; x < matrixWidth; x++) {
const module = qr.matrix[y * matrixWidth + x]; const module = qr.matrix[y * matrixWidth + x];
if (module & 1) { if (module & 1) {
const px = x + margin; const px = x + margin;
const py = y + margin; const py = y + margin;
ctx.fillRect( ctx.fillRect(px * unit, py * unit, unit, unit);
px * moduleSize,
py * moduleSize,
moduleSize,
moduleSize
);
} }
} }
} }
} }
const image = new Image(); const image = new Image();
if (file != null) { if (file != null) {
image.src = URL.createObjectURL(file); image.src = URL.createObjectURL(file);
} else { } else {
@ -106,42 +99,42 @@ export async function renderCanvas(qr, params, ctx) {
image.crossOrigin = "anonymous"; image.crossOrigin = "anonymous";
image.src = image.src =
"https://upload.wikimedia.org/wikipedia/commons/1/14/The_Widow_%28Boston_Public_Library%29_%28cropped%29.jpg"; "https://upload.wikimedia.org/wikipedia/commons/1/14/The_Widow_%28Boston_Public_Library%29_%28cropped%29.jpg";
}
await image.decode();
}
await image.decode();
ctx.filter = \`brightness(\${params["Brightness"]}) contrast(\${params["Contrast"]})\`; ctx.filter = \`brightness(\${params["Brightness"]}) contrast(\${params["Contrast"]})\`;
ctx.drawImage(image, 0, 0, canvasSize, canvasSize); ctx.drawImage(image, 0, 0, canvasSize, canvasSize);
ctx.filter = "none"; ctx.filter = "none";
if (file != null) { if (file != null) {
URL.revokeObjectURL(image.src); URL.revokeObjectURL(image.src);
} }
const imageData = ctx.getImageData(0, 0, canvasSize, canvasSize); const imageData = ctx.getImageData(0, 0, canvasSize, canvasSize);
const data = imageData.data; const data = imageData.data;
for (let y = 0; y < canvasSize; y++) { for (let y = 0; y < canvasSize; y++) {
for (let x = 0; x < canvasSize; x++) { for (let x = 0; x < canvasSize; x++) {
const i = (y * canvasSize + x) * 4; const i = (y * canvasSize + x) * 4;
if (data[i + 3] === 0) continue; if (data[i + 3] === 0) continue;
// Convert to grayscale and normalize to 0-255 // Convert to grayscale and normalize to 0-255
const oldPixel = const oldPixel =
(data[i] * 0.299 + data[i + 1] * 0.587 + data[i + 2] * 0.114) | 0; (data[i] * 0.299 + data[i + 1] * 0.587 + data[i + 2] * 0.114) | 0;
let newPixel; let newPixel;
if (oldPixel < 128) { if (oldPixel < 128) {
newPixel = 0; newPixel = 0;
ctx.fillStyle = fg; ctx.fillStyle = fg;
} else { } else {
newPixel = 255; newPixel = 255;
ctx.fillStyle = bg; ctx.fillStyle = bg;
} }
ctx.fillRect(x * pixelSize, y * pixelSize, pixelSize, pixelSize); ctx.fillRect(x * pixel, y * pixel, pixel, pixel);
data[i] = data[i + 1] = data[i + 2] = newPixel; data[i] = data[i + 1] = data[i + 2] = newPixel;
const error = oldPixel - newPixel; const error = oldPixel - newPixel;
// Distribute error to neighboring pixels // Distribute error to neighboring pixels
if (x < canvasSize - 1) { if (x < canvasSize - 1) {
data[i + 4] += (error * 7) / 16; data[i + 4] += (error * 7) / 16;
@ -149,17 +142,17 @@ export async function renderCanvas(qr, params, ctx) {
if (y < canvasSize - 1) { if (y < canvasSize - 1) {
if (x > 0) { if (x > 0) {
data[i + canvasSize * 4 - 4] += (error * 3) / 16; data[i + canvasSize * 4 - 4] += (error * 3) / 16;
} }
data[i + canvasSize * 4] += (error * 5) / 16; data[i + canvasSize * 4] += (error * 5) / 16;
if (x < canvasSize - 1) { if (x < canvasSize - 1) {
data[i + canvasSize * 4 + 4] += (error * 1) / 16; data[i + canvasSize * 4 + 4] += (error * 1) / 16;
} }
} }
} }
} }
const dataOffset = (unit - pixel) / 2;
const dataOffset = (moduleSize - pixelSize) / 2;
for (let y = 0; y < matrixWidth; y++) { for (let y = 0; y < matrixWidth; y++) {
for (let x = 0; x < matrixWidth; x++) { for (let x = 0; x < matrixWidth; x++) {
const module = qr.matrix[y * matrixWidth + x]; const module = qr.matrix[y * matrixWidth + x];
@ -170,24 +163,27 @@ export async function renderCanvas(qr, params, ctx) {
} }
const px = x + margin; const px = x + margin;
const py = y + margin;
const py = y + margin;
const type = module | 1; const type = module | 1;
if ( if (
type === Module.FinderON || type === Module.FinderON ||
(alignment && type === Module.AlignmentON) || (alignment && type === Module.AlignmentON) ||
(timing && type === Module.TimingON) (timing && type === Module.TimingON)
) { ) {
ctx.fillRect(px * moduleSize, py * moduleSize, moduleSize, moduleSize); ctx.fillRect(px * unit, py * unit, unit, unit);
} else { } else {
ctx.fillRect( ctx.fillRect(
px * moduleSize + dataOffset,
py * moduleSize + dataOffset, px * unit + dataOffset,
pixelSize, py * unit + dataOffset,
pixelSize pixel,
pixel,
); );
} }
} }
} }
} }
` `

32
src/lib/presets/Minimal.ts
Wyświetl plik

@ -34,14 +34,14 @@ const Module = {
export function renderSVG(qr, params) { export function renderSVG(qr, params) {
const matrixWidth = qr.version * 4 + 17; const matrixWidth = qr.version * 4 + 17;
const moduleSize = 10; const unit = 10;
const dataSize = params["Data pixel size"]; const dataSize = params["Data pixel size"];
const margin = params["Margin"] * moduleSize; const margin = params["Margin"] * unit;
const fg = "#000"; const fg = "#000";
const bg = "#fff"; const bg = "#fff";
const size = matrixWidth * moduleSize + 2 * margin; const size = matrixWidth * unit + 2 * margin;
let svg = \`<svg xmlns="http://www.w3.org/2000/svg" viewBox="\${-margin} \${-margin} \${size} \${size}">\`; let svg = \`<svg xmlns="http://www.w3.org/2000/svg" viewBox="\${-margin} \${-margin} \${size} \${size}">\`;
if (params["Background"]) { if (params["Background"]) {
svg += \`<rect x="\${-margin}" y="\${-margin}" width="\${size}" height="\${size}" fill="\${bg}"/>\`; svg += \`<rect x="\${-margin}" y="\${-margin}" width="\${size}" height="\${size}" fill="\${bg}"/>\`;
@ -53,25 +53,15 @@ export function renderSVG(qr, params) {
[matrixWidth - 7, 0], [matrixWidth - 7, 0],
[0, matrixWidth - 7], [0, matrixWidth - 7],
]) { ]) {
svg += \`M\${(x + 3) * moduleSize},\${ svg += \`M\${(x + 3) * unit},\${y * unit}h\${unit}v\${unit}h-\${unit}z\`;
y * moduleSize svg += \`M\${x * unit},\${(y + 3) * unit}h\${unit}v\${unit}h-\${unit}z\`;
}h\${moduleSize}v\${moduleSize}h-\${moduleSize}z\`; svg += \`M\${(x + 6) * unit},\${(y + 3) * unit}h\${unit}v\${unit}h-\${unit}z\`;
svg += \`M\${x * moduleSize},\${ svg += \`M\${(x + 3) * unit},\${(y + 6) * unit}h\${unit}v\${unit}h-\${unit}z\`;
(y + 3) * moduleSize
}h\${moduleSize}v\${moduleSize}h-\${moduleSize}z\`;
svg += \`M\${(x + 6) * moduleSize},\${
(y + 3) * moduleSize
}h\${moduleSize}v\${moduleSize}h-\${moduleSize}z\`;
svg += \`M\${(x + 3) * moduleSize},\${
(y + 6) * moduleSize
}h\${moduleSize}v\${moduleSize}h-\${moduleSize}z\`;
svg += \`M\${(x + 2) * moduleSize},\${(y + 2) * moduleSize}h\${ svg += \`M\${(x + 2) * unit},\${(y + 2) * unit}h\${unit * 3}v\${unit * 3}h-\${unit * 3}z\`;
moduleSize * 3
}v\${moduleSize * 3}h-\${moduleSize * 3}z\`;
} }
const offset = (moduleSize - dataSize) / 2; const offset = (unit - dataSize) / 2;
for (let y = 0; y < matrixWidth; y++) { for (let y = 0; y < matrixWidth; y++) {
for (let x = 0; x < matrixWidth; x++) { for (let x = 0; x < matrixWidth; x++) {
const module = qr.matrix[y * matrixWidth + x]; const module = qr.matrix[y * matrixWidth + x];
@ -81,8 +71,8 @@ export function renderSVG(qr, params) {
} }
if (module & 1) { if (module & 1) {
const sx = x * moduleSize + offset; const sx = x * unit + offset;
const sy = y * moduleSize + offset; const sy = y * unit + offset;
svg += \`M\${sx},\${sy}h\${dataSize}v\${dataSize}h-\${dataSize}z\`; svg += \`M\${sx},\${sy}h\${dataSize}v\${dataSize}h-\${dataSize}z\`;
} }
} }

108
updatePresets.js
Wyświetl plik

@ -1,63 +1,71 @@
import fs from "node:fs/promises"; import { promises as fs } from "fs";
import path from "node:path"; import path from "path";
import swc from "@swc/core";
import prettier from "prettier";
async function stringifyPresets(src, dst) { async function convertTsToJs(inputDir, outputDir) {
try { try {
const dir = await fs.opendir(src); // Ensure output directory exists
for await (const dirent of dir) { await fs.mkdir(outputDir, { recursive: true });
const srcPath = path.join(src, dirent.name);
const dstPath = path.join(dst, dirent.name);
if (dirent.isDirectory()) { const files = await fs.readdir(inputDir);
try { const tsFiles = files.filter((file) => file.endsWith(".ts"));
await fs.access(dstPath, fs.constants.F_OK);
} catch (e) { for (const file of tsFiles) {
await fs.mkdir(dstPath); const inputPath = path.join(inputDir, file);
const outputPath = path.join(outputDir, file);
const tsCode = await fs.readFile(inputPath, "utf-8");
const { code } = await swc.transform(tsCode, {
filename: inputPath,
sourceMaps: false,
jsc: {
parser: {
syntax: "typescript",
},
target: "ES2020",
},
});
const formattedCode = await prettier.format(code, {
parser: "babel",
});
const originalLines = tsCode.split("\n").slice(3);
const strippedLines = formattedCode.split("\n");
let preservedCode = "";
let strippedIndex = 0;
for (const originalLine of originalLines) {
if (originalLine.trim() === "") {
// Preserve empty lines
preservedCode += "\n";
} else {
if (strippedIndex < strippedLines.length) {
preservedCode += strippedLines[strippedIndex] + "\n";
strippedIndex++;
}
} }
stringifyPresets(srcPath, dstPath);
continue;
} }
let fileString = await fs.readFile(srcPath, "utf-8"); preservedCode = preservedCode.replaceAll("`", "\\`");
preservedCode = preservedCode.replaceAll("${", "\\${");
// Quick & dirty "type stripping" only works b/c files are formatted
// This preserves spacing + comments which other methods don't
// Remove imports (identical for all files)
fileString = fileString.slice(111);
// Strip types from simple function args
fileString = fileString.replace(
/\((?:\s*.+: .+,\s)*\s*.+: [^)]+\s*\)/g,
(match) =>
"(" +
match
.slice(1, match.length - 1)
.split(",")
.map((typedArg) =>
typedArg.slice(0, typedArg.indexOf(":")).trimStart()
)
.join(", ") +
")"
);
fileString = fileString.replace("} satisfies RawParamsSchema;", "};");
fileString = fileString.replaceAll("`", "\\`");
fileString = fileString.replaceAll("${", "\\${");
const name = dirent.name.slice(0, dirent.name.length - 3);
await fs.writeFile( await fs.writeFile(
dstPath, outputPath,
`export const ${name} = \`${fileString}\`\n`, `export const ${file.slice(0, -3)} = \`${preservedCode.slice(0, -1)}\`\n`,
{ "utf-8"
flag: "w+",
}
); );
console.log(`Converted and formatted: ${inputPath} -> ${outputPath}`);
} }
} catch (err) {
console.error(err); console.log("Conversion and formatting completed successfully.");
} catch (error) {
console.error("An error occurred:", error);
} }
} }
stringifyPresets("./presets", "./src/lib/presets"); const inputDir = "./presets";
const outputDir = "./src/lib/presets";
convertTsToJs(inputDir, outputDir);