From 4c7e676ff7d1f283e5614bac850e5a66a0d07b3b Mon Sep 17 00:00:00 2001 From: Zayd Date: Mon, 7 Dec 2020 17:19:19 +0100 Subject: [PATCH] Refactor --- README.md | 2 +- index.html | 41 +++++++++++----- sketch.js | 136 ++++++++++++++++++++++++++++++----------------------- 3 files changed, 109 insertions(+), 70 deletions(-) diff --git a/README.md b/README.md index f6e98b4..777d845 100644 --- a/README.md +++ b/README.md @@ -1,4 +1,4 @@ # Conway-s-Game-of-Life-p5.js Conway's Game of Life using p5.js -[Live preview](https://2ef9ac0c-58d5-4504-93ff-be202e07e031.htmlpasta.com/) (htmlpasta link) +[Live preview](https://zaydme.github.io/Conway-s-Game-of-Life-p5.js/) ![preview](preview.png) diff --git a/index.html b/index.html index f4df6af..16b4dad 100644 --- a/index.html +++ b/index.html @@ -5,17 +5,36 @@
- - - - + + + + +
- - \ No newline at end of file + + + diff --git a/sketch.js b/sketch.js index 9701c6e..13e40d7 100644 --- a/sketch.js +++ b/sketch.js @@ -1,75 +1,95 @@ -document.body.style.margin = 0 - -const width = document.body.clientWidth -const height = document.body.clientHeight -let w = 15; -let columns = Math.floor(width / w); -let rows = Math.floor(height / w); -let cells = [] -let isLoop = true - -let initialPopulation = 0.07 +const WIDTH = document.body.clientWidth; +const HEIGHT = document.body.clientHeight; +const COLUMN_WIDTH = 15; +const COLUMNS = Math.floor(WIDTH / COLUMN_WIDTH); +const ROWS = Math.floor(HEIGHT / COLUMN_WIDTH); +let cells = []; +let isLoop = true; +const INITIAL_POPULATION = 0.1; function setup() { - createCanvas(width, height); - frameRate(8); - stroke(255); - strokeWeight(1); - initialGen() + createCanvas(WIDTH, HEIGHT); + frameRate(8); + stroke(255); + strokeWeight(1); + initialGen(); } function draw() { - background(0); - for (let i = 0; i < columns; i++) { - for (let j = 0; j < rows; j++) { - if (cells[i][j][0] == 1 ) fill(0); - else fill(255); - stroke(0); - rect(i * w, j * w, w - 1, w - 1); - } + background(0); + for (let i = 0; i < COLUMNS; i++) { + for (let j = 0; j < ROWS; j++) { + if (cells[i][j][0]) fill(0); + else fill(255); + stroke(0); + rect( + i * COLUMN_WIDTH, + j * COLUMN_WIDTH, + COLUMN_WIDTH - 1, + COLUMN_WIDTH - 1, + ); } + } - if (isLoop) lifeisgoingon(); + if (isLoop) lifeIsGoingOn(); } function initialGen() { - - for (let i=0;i 3) cells[i][j][0] = 0 - if (cells[i][j][0] == 1 && (cells[i][j][1] == 3 || cells[i][j][1] == 2)) cells[i][j][0] = 1 - if (cells[i][j][0] == 0 && cells[i][j][1] == 3 ) cells[i][j][0] = 1 - } +function lifeIsGoingOn() { + for (let i = 0; i < COLUMNS; i++) { + for (let j = 0; j < ROWS; j++) { + if (i !== 0 && j !== 0 && i !== COLUMNS - 1 && j !== ROWS - 1) { + /* + cells[i][j][0] is the living status (Boolean) + cells[i][j][1] is the neighbors count + */ + cells[i][j][1] = (cells[i - 1][j][0]) + + (cells[i + 1][j][0]) + + (cells[i][j - 1][0]) + + (cells[i][j + 1][0]) + + (cells[i + 1][j + 1][0]) + + (cells[i - 1][j - 1][0]) + + (cells[i + 1][j - 1][0]) + + (cells[i - 1][j + 1][0]); + } + } + } + for (let i = 0; i < COLUMNS; i++) { + for (let j = 0; j < ROWS; j++) { + if (cells[i][j][1] < 2 || cells[i][j][1] > 3) cells[i][j][0] = false; + if (cells[i][j][0] && (cells[i][j][1] === 3 || cells[i][j][1] === 2)) cells[i][j][0] = true; + if (!cells[i][j][0] && cells[i][j][1] === 3) cells[i][j][0] = true; } + } +} +function mouseClicked() { + ellipse(mouseX, mouseY, 5, 5); + const Mcolumns = Math.floor(mouseX / COLUMN_WIDTH); + const Mrows = Math.floor(mouseY / COLUMN_WIDTH); + cells[Mcolumns][Mrows][0] = !cells[Mcolumns][Mrows][0]; + if (cells[Mcolumns][Mrows][0]) fill(0); + else fill(255); + stroke(0); + rect( + Mcolumns * COLUMN_WIDTH, + Mrows * COLUMN_WIDTH, + COLUMN_WIDTH - 1, + COLUMN_WIDTH - 1, + ); + if (!isLoop) redraw(); } -function mouseDragged() { - ellipse(mouseX, mouseY, 5, 5); - let Mcolumns = Math.floor(mouseX / w); - let Mrows = Math.floor(mouseY / w); - cells[Mcolumns][Mrows][0] = !cells[Mcolumns][Mrows][0] - if (cells[Mcolumns][Mrows][0] == 1 ) fill(0); - else fill(255); - stroke(0); - rect(Mcolumns * w, Mrows * w, w - 1, w - 1); - if(!isLoop) redraw() - } \ No newline at end of file