-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathcanvasLife-1.min.html
1 lines (1 loc) · 2.03 KB
/
canvasLife-1.min.html
1
<!doctype html><html lang="de" id="*"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>canvasLife</title></head><body> <canvas id="myCanvas" width="400" height="400" style="border : 2px solid #81d742; background-color : white;">Ihr Browser ist veraltet. Bitte installieren Sie eine aktuelle Version des Browsers.</canvas> <script>var gridHeight=document.getElementById("myCanvas").height;var gridWidth=document.getElementById("myCanvas").width;var theGrid=createArray(gridWidth);var mirrorGrid=createArray(gridWidth);var drawColor="#81d742";fillRandom();tick();function tick() {drawGrid();updateGrid();requestAnimationFrame(tick);} function createArray(rows) {var arr=[];for(var i=0;i<rows;i++) {arr[i]=[];} return arr;} function fillRandom() {for(var j=0;j<gridHeight;j++) {for(var k=0;k<gridWidth;k++) {var rawRandom=Math.random();var improvedNum=(rawRandom*2);var randomBinary=Math.floor(improvedNum);if(randomBinary===1) {theGrid[j][k]=1;}else{theGrid[j][k]=0;}}}} function drawGrid() {var c=document.getElementById("myCanvas");if(c.getContext) {var ctx=c.getContext("2d");ctx.clearRect(0,0,c.width,c.height);for(var j=1;j<gridHeight;j++) {for(var k=1;k<gridWidth;k++) {if(theGrid[j][k]===1) {ctx.fillStyle=drawColor;ctx.fillRect(j,k,1,1);}}}}} function updateGrid() {for(var j=1;j<gridHeight-1;j++) {for(var k=1;k<gridWidth-1;k++) {var totalCells=0;totalCells+=theGrid[j-1][k-1];totalCells+=theGrid[j-1][k];totalCells+=theGrid[j-1][k+1];totalCells+=theGrid[j][k-1];totalCells+=theGrid[j][k+1];totalCells+=theGrid[j+1][k-1];totalCells+=theGrid[j+1][k];totalCells+=theGrid[j+1][k+1];if(theGrid[j][k]===0) {switch(totalCells) {case 3:mirrorGrid[j][k]=1;break;default:mirrorGrid[j][k]=0;}}else if(theGrid[j][k]===1){switch(totalCells) {case 0:case 1:mirrorGrid[j][k]=0;break;case 2:case 3:mirrorGrid[j][k]=1;break;case 4:case 5:case 6:case 7:case 8:mirrorGrid[j][k]=0;break;default:mirrorGrid[j][k]=0;}}}} for(var j=0;j<gridHeight;j++) {for(var k=0;k<gridWidth;k++) {theGrid[j][k]=mirrorGrid[j][k];}}}</script> </body></html>