2e:null 2f:["$","title",null,{"children":"p5 Game of Life | Andrew Wooldridge | Observable"}] 34:Ta3a,p5(sketch => { let system; let w; let columns; let rows; let board; let next; sketch.setup = function() { sketch.createCanvas(width, 400); w = 20; // Calculate columns and rows columns = sketch.floor(sketch.width / w); rows = sketch.floor(sketch.height / w); // Wacky way to make a 2D array is JS board = new Array(columns); for (let i = 0; i < columns; i++) { board[i] = new Array(rows); } // Going to use multiple 2D arrays and swap them next = new Array(columns); for (let j = 0; j < columns; j++) { next[j] = new Array(rows); } init(); }; sketch.draw = function() { //sketch.translate(sketch.width / 2, sketch.height / 2); //sketch.background(200); //sketch.rect(-50, -50, 100, 100); sketch.background(255); generate(); for ( let i = 0; i < columns;i++) { for ( let j = 0; j < rows;j++) { if ((board[i][j] == 1)) sketch.fill(sketch.random(255), sketch.random(255), sketch.random(255)); else sketch.fill(255); sketch.stroke(0); sketch.rect(i * w, j * w, w-1, w-1); } } } // reset board when mouse is pressed sketch.mousePressed = function() { init(); } // Fill board randomly function init() { for (let i = 0; i < columns; i++) { for (let j = 0; j < rows; j++) { // Lining the edges with 0s if (i == 0 || j == 0 || i == columns-1 || j == rows-1) board[i][j] = 0; // Filling the rest randomly else board[i][j] = sketch.floor(sketch.random(2)); next[i][j] = 0; } } } function generate() { // Loop through every spot in our 2D array and check spots neighbors for (let x = 1; x < columns - 1; x++) { for (let y = 1; y < rows - 1; y++) { // Add up all the states in a 3x3 surrounding grid let neighbors = 0; for (let i = -1; i <= 1; i++) { for (let j = -1; j <= 1; j++) { neighbors += board[x+i][y+j]; } } // A little trick to subtract the current cell's state since // we added it in the above loop neighbors -= board[x][y]; // Rules of Life if ((board[x][y] == 1) && (neighbors < 2)) next[x][y] = 0; // Loneliness else if ((board[x][y] == 1) && (neighbors > 3)) next[x][y] = 0; // Overpopulation else if ((board[x][y] == 0) && (neighbors == 3)) next[x][y] = 1; // Reproduction else next[x][y] = board[x][y]; // Stasis } } // Swap! let temp = board; board = next; next = temp; } });35:[] 32:{"id":"d183462ad021fbe2","slug":"p5-game-of-life","title":"p5 Game of Life","thumbnail":"56688190fe888d1a931a216c538aa31dc6b20c1cba47754288f6f971f5aa6c7e","access_level":"public","create_time":"$D2021-04-24T23:54:19.989Z","update_time":"$D2021-04-25T02:44:51.958Z","view_time":null,"first_public_time":"$D2021-04-25T00:22:40.648Z","has_unpublished_edits":null,"fork":{"id":"90e5921bd1432573","slug":"p5-basic-example","title":"p5 basic example","owner":{"id":"b47c3705cfcd7c1b","login":"tmcw","name":"Tom MacWright"}},"stars":3,"starred":false,"owner":{"type":"team","id":"2d6b5d0f9034e560","login":"triptych","name":"Andrew Wooldridge","avatar_url":"https://avatars-next.observableusercontent.com/84b4215a79a8f07f1610f6650183c4793985ecf13ed3af2944962bee15c46c2e","tier":"starter_2024"},"version":46,"publish_version":46,"role":null,"authored":false,"authors":[{"type":"individual","id":"b8d79ca293134247","login":"triptych","name":"Andrew Wooldridge","avatar_url":"https://avatars-next.observableusercontent.com/84b4215a79a8f07f1610f6650183c4793985ecf13ed3af2944962bee15c46c2e","tier":null}],"members":[{"type":"individual","id":"b8d79ca293134247","login":"triptych","name":"Andrew Wooldridge","avatar_url":"https://avatars-next.observableusercontent.com/84b4215a79a8f07f1610f6650183c4793985ecf13ed3af2944962bee15c46c2e","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":1,"collection":{"id":"fc5302cee4325a10","slug":"p5","title":"p5","owner":{"id":"2d6b5d0f9034e560","login":"triptych","name":"Andrew Wooldridge"}},"type":"notebook","body":{"title":"p5 Game of Life","cells":[{"id":0,"value":"md`# p5 Game of Life`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":20,"value":"md`From this example: https://p5js.org/examples/simulate-game-of-life.html`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":40,"value":"md`Jazzed up with some \"random colors\"`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2,"value":"$34","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":4,"value":"import {p5} from \"@tmcw/p5\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W35","stdlib":"1","titling":"auto"}} 33:"$32:body"