Compare commits
No commits in common. "239457b02ce8099e2804a794a59e82467ae775d5" and "a0589885e3f3b55d36c728cef4aecf79e5185602" have entirely different histories.
239457b02c
...
a0589885e3
|
@ -1,67 +0,0 @@
|
||||||
.cell .hex {
|
|
||||||
width: 55px;
|
|
||||||
position: absolute;
|
|
||||||
z-index: -1;
|
|
||||||
transform: translate(-50%, -50%);
|
|
||||||
}
|
|
||||||
|
|
||||||
.cell .spiral {
|
|
||||||
width: 45px;
|
|
||||||
position: absolute;
|
|
||||||
animation: spin 1s linear infinite;
|
|
||||||
}
|
|
||||||
|
|
||||||
.cell.alive {
|
|
||||||
animation: birth 1s linear forwards;
|
|
||||||
}
|
|
||||||
|
|
||||||
.cell.dead {
|
|
||||||
animation: death 1s linear forwards;
|
|
||||||
}
|
|
||||||
|
|
||||||
#grid {
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
position: absolute;
|
|
||||||
top: 0px;
|
|
||||||
left: 0px;
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
#controls {
|
|
||||||
display: none;
|
|
||||||
background-color: rgba(0, 0, 0, 0.7);
|
|
||||||
padding: 5px;
|
|
||||||
border-radius: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
#reload {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes death {
|
|
||||||
0% {
|
|
||||||
opacity: 1;
|
|
||||||
}
|
|
||||||
100% {
|
|
||||||
opacity: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes birth {
|
|
||||||
0% {
|
|
||||||
opacity: 0;
|
|
||||||
}
|
|
||||||
100% {
|
|
||||||
opacity: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes spin {
|
|
||||||
0% {
|
|
||||||
transform: translate(-50%, -50%) rotate(0deg);
|
|
||||||
}
|
|
||||||
100% {
|
|
||||||
transform: translate(-50%, -50%) rotate(360deg);
|
|
||||||
}
|
|
||||||
}
|
|
|
@ -1,215 +0,0 @@
|
||||||
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;
|
|
||||||
if (x > width - 1) {
|
|
||||||
x = x - width;
|
|
||||||
}
|
|
||||||
return x;
|
|
||||||
}
|
|
||||||
|
|
||||||
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");
|
|
||||||
|
|
||||||
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]);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function prebirth(i, j) {
|
|
||||||
cells[i][j].classList.add("birthing");
|
|
||||||
}
|
|
||||||
function prekill(i, j) {
|
|
||||||
cells[i][j].classList.add("dying");
|
|
||||||
}
|
|
||||||
function birth(i, j) {
|
|
||||||
cells[i][j].classList.remove("dead");
|
|
||||||
cells[i][j].classList.add("alive");
|
|
||||||
}
|
|
||||||
function kill(i, j) {
|
|
||||||
cells[i][j].classList.remove("alive");
|
|
||||||
cells[i][j].classList.add("dead");
|
|
||||||
}
|
|
||||||
function update(i, j) {
|
|
||||||
var cl = cells[i][j].classList;
|
|
||||||
if (cl.contains("birthing")) {
|
|
||||||
cl.remove("birthing");
|
|
||||||
birth(i, j);
|
|
||||||
}
|
|
||||||
if (cl.contains("dying")) {
|
|
||||||
cl.remove("dying");
|
|
||||||
kill(i, j);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
function isAlive(i, j) {
|
|
||||||
return !cells[i][j].classList.contains("dead");
|
|
||||||
}
|
|
||||||
|
|
||||||
function rotate(a) {
|
|
||||||
a.push(a.shift());
|
|
||||||
}
|
|
||||||
|
|
||||||
function arraysEq(a, b) {
|
|
||||||
if (a.length !== b.length) {
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
|
|
||||||
for (var i = 0; i < a.length; ++i) {
|
|
||||||
if (a[i] !== b[i]) {
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
|
|
||||||
function arraysRotatedEq(a, b) {
|
|
||||||
if (a.length !== b.length) {
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
|
|
||||||
for (var i = 0; i < a.length; ++i) {
|
|
||||||
if (arraysEq(a, b)) {
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
rotate(b);
|
|
||||||
}
|
|
||||||
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
|
|
||||||
function mod(m, n) {
|
|
||||||
return ((m % n) + n) % n;
|
|
||||||
}
|
|
||||||
|
|
||||||
function ip(i) {
|
|
||||||
return mod(i-1, width);
|
|
||||||
}
|
|
||||||
function is(i) {
|
|
||||||
return mod(i+1, width);
|
|
||||||
}
|
|
||||||
function jp(j) {
|
|
||||||
return mod(j-1, height);
|
|
||||||
}
|
|
||||||
function js(j) {
|
|
||||||
return mod(j+1, height);
|
|
||||||
}
|
|
||||||
|
|
||||||
function ll(i, j) {
|
|
||||||
return isAlive(ip(i), j);
|
|
||||||
}
|
|
||||||
function dl(i, j) {
|
|
||||||
return isAlive(i, jp(j));
|
|
||||||
}
|
|
||||||
function dr(i, j) {
|
|
||||||
return isAlive(is(i), jp(j));
|
|
||||||
}
|
|
||||||
function rr(i, j) {
|
|
||||||
return isAlive(is(i), j);
|
|
||||||
}
|
|
||||||
function ur(i, j) {
|
|
||||||
return isAlive(i, js(j));
|
|
||||||
}
|
|
||||||
function ul(i, j) {
|
|
||||||
return isAlive(ip(i), js(j));
|
|
||||||
}
|
|
||||||
|
|
||||||
function neighbors(i, j) {
|
|
||||||
return [ll(i, j), dl(i, j), dr(i, j), rr(i, j), ur(i, j), ul(i, j)];
|
|
||||||
}
|
|
||||||
|
|
||||||
function neighborsCount(i, j) {
|
|
||||||
return neighbors(i, j).filter(function (b) { return b; }).length;
|
|
||||||
}
|
|
||||||
|
|
||||||
function golay(i, j) {
|
|
||||||
var n = neighbors(i, j);
|
|
||||||
var g1 = [true, true, false, false, false, false];
|
|
||||||
var g2 = [true, false, true, false, false, false];
|
|
||||||
return (arraysRotatedEq(n, g1) || arraysRotatedEq(n, g2));
|
|
||||||
}
|
|
||||||
|
|
||||||
function preston(i, j) {
|
|
||||||
var n = neighbors(i, j);
|
|
||||||
var p1 = [true, true, false, false, false, false];
|
|
||||||
var p2 = [true, false, true, false, false, false];
|
|
||||||
return (isAlive(i, j) && (arraysRotatedEq(n, p1) || arraysRotatedEq(n, p2))) || (!isAlive(i, j) && neighborsCount(i, j) === 2);
|
|
||||||
}
|
|
||||||
|
|
||||||
function golayStep() {
|
|
||||||
for (var i = 0; i < width; ++i) {
|
|
||||||
for (var j = 0; j < height; ++j) {
|
|
||||||
if (golay(i, j)) {
|
|
||||||
prebirth(i, j);
|
|
||||||
} else {
|
|
||||||
prekill(i, j);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
for (var i = 0; i < width; ++i) {
|
|
||||||
for (var j = 0; j < height; ++j) {
|
|
||||||
update(i, j);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function prestonStep() {
|
|
||||||
for (var i = 0; i < width; ++i) {
|
|
||||||
for (var j = 0; j < height; ++j) {
|
|
||||||
if (preston(i, j)) {
|
|
||||||
prebirth(i, j);
|
|
||||||
} else {
|
|
||||||
prekill(i, j);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
for (var i = 0; i < width; ++i) {
|
|
||||||
for (var j = 0; j < height; ++j) {
|
|
||||||
update(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);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
setInterval(prestonStep, 1000);
|
|
||||||
|
|
||||||
var showControls = false;
|
|
||||||
|
|
||||||
window.onclick = function () {
|
|
||||||
document.getElementById("controls").style.display = showControls ? "none" : "block";
|
|
||||||
showControls = !showControls;
|
|
||||||
}
|
|
|
@ -1,8 +0,0 @@
|
||||||
<?xml version='1.0' encoding='UTF-8'?>
|
|
||||||
<!-- This file was generated by dvisvgm 2.3.5 -->
|
|
||||||
<svg height='203.9997pt' version='1.1' viewBox='56.4094 53.8583 177.2056 203.9997' width='177.2056pt' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'>
|
|
||||||
<g id='page1'>
|
|
||||||
<g transform='matrix(0.996264 0 0 0.996264 145.012 155.858)'>
|
|
||||||
<path d='M 6.1462e-15 -100.375L -86.9273 -50.1875L -86.9273 50.1875L -1.84386e-14 100.375L 86.9273 50.1875L 86.9273 -50.1875L 6.1462e-15 -100.375Z' fill='none' stroke='#ff0000' stroke-linecap='round' stroke-linejoin='round' stroke-miterlimit='10.0375' stroke-width='4.015'/>
|
|
||||||
</g></g>
|
|
||||||
</svg>
|
|
Before Width: | Height: | Size: 637 B |
|
@ -1,8 +0,0 @@
|
||||||
+++
|
|
||||||
title = "hex"
|
|
||||||
date = 2020-06-21T18:52:30-04:00
|
|
||||||
draft = false
|
|
||||||
unlisted = false
|
|
||||||
+++
|
|
||||||
|
|
||||||
<div id="grid"></div>
|
|
File diff suppressed because one or more lines are too long
Before Width: | Height: | Size: 14 KiB |
Loading…
Reference in a new issue