reinitialize grid on window resize
This commit is contained in:
parent
239457b02c
commit
e6f1f6c4ef
|
@ -1,8 +1,6 @@
|
|||
var grid = document.getElementById("grid");
|
||||
|
||||
var cellsize = 60;
|
||||
var width = Math.ceil(window.innerWidth / cellsize) + 1;
|
||||
var height = Math.ceil(window.innerHeight / (cellsize*Math.sqrt(3)/2));
|
||||
|
||||
function xCoord(i, j) {
|
||||
var x = i + j/2;
|
||||
|
@ -16,28 +14,53 @@ function yCoord(i, j) {
|
|||
return Math.sqrt(3)*j/2;
|
||||
}
|
||||
|
||||
var cells = new Array(width);
|
||||
for (var i = 0; i < width; ++i) {
|
||||
cells[i] = new Array(height);
|
||||
for (var j = 0; j < height; ++j) {
|
||||
cells[i][j] = document.createElement("div");
|
||||
cells[i][j].classList.add("cell");
|
||||
cells[i][j].classList.add("alive");
|
||||
var width;
|
||||
var height;
|
||||
var cells;
|
||||
|
||||
spiral = document.createElement("img");
|
||||
spiral.classList.add("spiral");
|
||||
spiral.src = "spiral.svg";
|
||||
cells[i][j].appendChild(spiral);
|
||||
function initialize() {
|
||||
width = Math.ceil(window.innerWidth / cellsize) + 1;
|
||||
height = Math.ceil(window.innerHeight / (cellsize*Math.sqrt(3)/2)) + 1;
|
||||
|
||||
hex = document.createElement("img");
|
||||
hex.classList.add("hex");
|
||||
hex.src = "hex.svg";
|
||||
cells[i][j].appendChild(hex);
|
||||
cells = new Array(width);
|
||||
for (var i = 0; i < width; ++i) {
|
||||
cells[i] = new Array(height);
|
||||
for (var j = 0; j < height; ++j) {
|
||||
cells[i][j] = document.createElement("div");
|
||||
cells[i][j].classList.add("cell");
|
||||
cells[i][j].classList.add("alive");
|
||||
|
||||
cells[i][j].style.position = "absolute";
|
||||
cells[i][j].style.left = xCoord(i, j)*cellsize + "px";
|
||||
cells[i][j].style.bottom = yCoord(i, j)*cellsize + "px";
|
||||
grid.appendChild(cells[i][j]);
|
||||
spiral = document.createElement("img");
|
||||
spiral.classList.add("spiral");
|
||||
spiral.src = "spiral.svg";
|
||||
cells[i][j].appendChild(spiral);
|
||||
|
||||
hex = document.createElement("img");
|
||||
hex.classList.add("hex");
|
||||
hex.src = "hex.svg";
|
||||
cells[i][j].appendChild(hex);
|
||||
|
||||
cells[i][j].style.position = "absolute";
|
||||
cells[i][j].style.left = xCoord(i, j)*cellsize + "px";
|
||||
cells[i][j].style.bottom = yCoord(i, j)*cellsize + "px";
|
||||
grid.appendChild(cells[i][j]);
|
||||
}
|
||||
}
|
||||
|
||||
for (var i = 0; i < width; ++i) {
|
||||
for (var j = 0; j < height; ++j) {
|
||||
if (Math.floor(Math.random()*2) === 0) {
|
||||
kill(i, j);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function cleanup() {
|
||||
for (var i = width - 1; i >= 0; --i) {
|
||||
for (var j = height - 1; j >= 0; --j) {
|
||||
grid.removeChild(cells[i][j]);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -197,13 +220,7 @@ function prestonStep() {
|
|||
}
|
||||
}
|
||||
|
||||
for (var i = 0; i < width; ++i) {
|
||||
for (var j = 0; j < height; ++j) {
|
||||
if (Math.floor(Math.random()*2) === 0) {
|
||||
kill(i, j);
|
||||
}
|
||||
}
|
||||
}
|
||||
initialize();
|
||||
|
||||
setInterval(prestonStep, 1000);
|
||||
|
||||
|
@ -213,3 +230,8 @@ window.onclick = function () {
|
|||
document.getElementById("controls").style.display = showControls ? "none" : "block";
|
||||
showControls = !showControls;
|
||||
}
|
||||
|
||||
window.addEventListener('resize', function(event){
|
||||
cleanup();
|
||||
initialize();
|
||||
});
|
||||
|
|
Loading…
Reference in a new issue