qr-mask/index.html

46 lines
1.8 KiB
HTML
Raw Permalink Normal View History

2024-07-06 11:36:07 +04:00
<!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>
2024-07-06 11:36:07 +04:00
<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>
2024-07-11 18:55:11 +04:00
<label for="gap">
<span>Grid gap:</span>
<input id="gap" type="number" min="0" value="0">
px around
2024-07-11 18:55:11 +04:00
</label>
2024-07-06 11:36:07 +04:00
<button id="gen-btn">Generate</button>
</div>
<div>
<canvas id="canvas" width="1" height="1"></canvas>
</div>
</body>
</html>