/
script.js
59 lines (47 loc) · 1.46 KB
/
script.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
/**
* Return an object containing the parameters of an url query
* @param {string} qs URL to get the parameters from
* @returns {Object} Each pair key-value is a parameter
*/
function getQueryParams(qs) {
qs = qs.split("+").join(" ");
var params = {},
tokens,
re = /[?&]?([^=]+)=([^&]*)/g;
while ((tokens = re.exec(qs))) {
params[decodeURIComponent(tokens[1])] = decodeURIComponent(tokens[2]);
}
return params;
}
function getCanvasBuilder(info) {
let canvasSize = info.size ? info.size : 300;
let canvasBuilder = {
cols: Math.floor(window.innerWidth / canvasSize),
rows: Math.floor(window.innerHeight / canvasSize)
};
canvasBuilder.colsMargin = Math.round(
(window.innerWidth % canvasSize) / (canvasBuilder.cols + 1)
);
canvasBuilder.rowsMargin = Math.round(
(window.innerHeight % canvasSize) / (canvasBuilder.rows + 1)
);
return canvasBuilder;
}
let query = getQueryParams(document.location.search);
let canvasBuilder = getCanvasBuilder(query);
let canvasSize = query.size;
let canvases = [];
for (let i = 0; i < canvasBuilder.rows; i++) {
canvases.push([]);
let div = document.createElement("div");
div.className = "canvas-row";
document.body.appendChild(div);
for (let j = 0; j < canvasBuilder.cols; j++) {
let canv = document.createElement("canvas");
canv.id = `canvas-${i}-${j}`;
canv.width = canvasSize;
canv.height = canvasSize;
div.appendChild(canv);
canvases[i].push(canv);
}
}