qr-mask/index.html
DarkCat09 a6f1c1f49a
fix: correct description for gap
`gap=1px` means 1px around each module,
i.e. 2px between modules, not 1px.
yep, i know, such a bad name for this parameter,
but who cares?
2024-07-11 19:44:30 +04:00

45 lines
1.8 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>QR code data XOR mask</title>
<link rel="stylesheet" href="style.css">
<script src="script.js"></script>
</head>
<body>
<div id="options">
<select id="mask-expr">
<option value="(row+col)%2" selected>Mask 0-000 | (i + j) mod 2 = 0</option>
<option value="row%2">Mask 1-001 | i mod 2</option>
<option value="col%3">Mask 2-010 | j mod 3</option>
<option value="(row+col)%3">Mask 3-011 | (i + j) mod 3</option>
<option value="(intDiv(row,2)+intDiv(col,3))%2">Mask 4-100 | (i : 2 + j : 3) mod 2</option>
<option value="(row*col)%2+(row*col)%3">Mask 5-101 | (i &times; j) mod 2 + (i &times; j) mod 3</option>
<option value="((row*col)%2+(row*col)%3)%2">Mask 6-110 | ((i &times; j) mod 2 + (i &times; j) mod 3) mod 2</option>
<option value="((row+col)%2+(row*col)%3)%2">Mask 7-111 | ((i + j) mod 2 + (i &times; j) mod 3) mod 2</option>
</select>
<label for="width" id="width-wrapper">
<span>Width:</span>
<input id="width" type="number" min="21" max="177" step="4" value="25">
<button id="width-incr">+</button>
<button id="width-decr">&ndash;</button>
<b>version <span id="version">2</span></b>
</label>
<label for="scale">
<span>Scale:</span>
<input id="scale" type="number" min="1" value="40">
px per module
</label>
<label for="gap">
<span>Grid gap:</span>
<input id="gap" type="number" min="0" value="0">
px around
</label>
<button id="gen-btn">Generate</button>
</div>
<div>
<canvas id="canvas" width="1" height="1"></canvas>
</div>
</body>
</html>