From 6bef2094cb780f34f8c808911ebb43550d98bbfe Mon Sep 17 00:00:00 2001 From: John Gatward Date: Mon, 16 Mar 2026 19:20:29 +0000 Subject: [PATCH] maze generator --- archive/v1/index.html | 2 +- archive/v2/index.html | 2 +- index.html | 26 +++--- projects/maze_generation/cells.js | 68 ++++++++++++++ projects/maze_generation/index.html | 52 +++++++++++ projects/maze_generation/sketch.js | 137 ++++++++++++++++++++++++++++ 6 files changed, 272 insertions(+), 15 deletions(-) create mode 100644 projects/maze_generation/cells.js create mode 100644 projects/maze_generation/index.html create mode 100644 projects/maze_generation/sketch.js diff --git a/archive/v1/index.html b/archive/v1/index.html index a9cae6d..e4db135 100644 --- a/archive/v1/index.html +++ b/archive/v1/index.html @@ -104,7 +104,7 @@

Game of Life

 - +

Maze Generator

 diff --git a/archive/v2/index.html b/archive/v2/index.html index 4c101d1..05f07c6 100644 --- a/archive/v2/index.html +++ b/archive/v2/index.html @@ -119,7 +119,7 @@ href="https://twitter.com/beesandbombs/status/940639806522085376">Bees and Bomb's gif.

-
+

13 Nov 2017

Maze Generator

A maze generator built in js.

diff --git a/index.html b/index.html index ac39aea..8377494 100644 --- a/index.html +++ b/index.html @@ -80,15 +80,15 @@
- linux -

Long-time Linux user and recovering distro-hopper. Currently: Hyprland on Void. Home server - running 24/7 for friends and family who didn't ask for it but appreciate it.

+ dev +

Fascinated with new languages, frameworks, and shiny tech I probably don’t need. Constantly + tinkering, breaking things, and learning just enough to build something cooler next time.

- teaching -

Tutored CS, maths and English through school and uni. Still think the best way to understand - something is to explain it — which is why this site has tutorials.

+ linux +

Long-time Linux user and recovering distro-hopper. Currently: Hyprland on Void. Home server + running 24/7 for friends and family who didn't ask for it but appreciate it.

@@ -108,7 +108,7 @@
Havox V4 current
-
2025 → present
+
2026 → present
Catppuccin Mocha. Single page. Trying to get a new job this time.
@@ -117,7 +117,7 @@
Havox V3 ↗
-
2023 → 2025
+
2022 → 2025
Borrowed a template. Wasn't very 'me'.
@@ -135,7 +135,7 @@
Havox.org ↗
-
2017 → 2019
+
2016 → 2019
Entire site in one PHP file 🤣. Had a daily trump quote-of-the-day achieved via webscraping a site daily.
@@ -261,7 +261,7 @@ → - 14 Mar 2018 + 18 Mar 2018 Calculating PI Monte Carlo method — ratio of randomly placed dots in a square vs circle. → @@ -272,7 +272,7 @@ JS implementation of a Bees and Bombs gif. → - + 13 Nov 2017 Maze generator A maze generator in p5.js. Using DFS & recursive backtracking. @@ -312,14 +312,14 @@ → - 22 Sept 2018 + 14 Feb 2018 Convex hull generator Wrapping algorithms — visualising how to find the convex hull of a point set. → - 14 Feb 2018 + 22 Sept 2018 Travelling Salesperson Problem Different implementations of the TSP problem — a classic. → diff --git a/projects/maze_generation/cells.js b/projects/maze_generation/cells.js new file mode 100644 index 0000000..5062dbf --- /dev/null +++ b/projects/maze_generation/cells.js @@ -0,0 +1,68 @@ +function Cell(i, j) { + this.i = i; + this.j = j; + this.walls = [true, true, true, true]; + this.visited = false; + + this.checkNeighbors = function() { + var neighbors = []; + + var top = grid[index(i, j -1)]; + var right = grid[index(i+1, j)]; + var bottom = grid[index(i, j+1)]; + var left = grid[index(i-1, j)]; + + if (top && !top.visited) { + neighbors.push(top); + } + if (right && !right.visited) { + neighbors.push(right); + } + if (bottom && !bottom.visited) { + neighbors.push(bottom); + } + if (left && !left.visited) { + neighbors.push(left); + } + + if (neighbors.length > 0) { + var r = floor(random(0, neighbors.length)); + return neighbors[r]; + } else { + return undefined; + } + + + } + this.highlight = function() { + var x = this.i*w; + var y = this.j*w; + noStroke(); + fill(252, 106, 2, 100); + rect(x, y, w, w); + } + + this.show = function() { + var x = this.i*w; + var y = this.j*w; + stroke(0); + if (this.walls[0]) { + line(x , y , x + w, y); + } + if (this.walls[1]) { + line(x + w, y , x + w, y + w); + } + if (this.walls[2]) { + line(x + w, y + w, x , y + w); + } + if (this.walls[3]) { + line(x , y + w, x , y); + } + + if (this.visited) { + noStroke(); + fill(242, 255, 28, 125); + rect(x, y, w, w); + } + } +} diff --git a/projects/maze_generation/index.html b/projects/maze_generation/index.html new file mode 100644 index 0000000..db64457 --- /dev/null +++ b/projects/maze_generation/index.html @@ -0,0 +1,52 @@ + + + + + + + + + Maze Generator + + + + + +
+

Maze Generator

+ +

+ Toy maze generator using DFS & recursice back tracking. +

+ +

+

+
+ + + + + diff --git a/projects/maze_generation/sketch.js b/projects/maze_generation/sketch.js new file mode 100644 index 0000000..4d40ac6 --- /dev/null +++ b/projects/maze_generation/sketch.js @@ -0,0 +1,137 @@ +var cols, rows; +var w = 40; +var grid = []; +var current; +var stack = []; + +function setup(){ + createCanvas(800, 800); + cols = floor(width/w) + rows = floor(height/w) + //frameRate(6); + + for (var j = 0; j < rows; j++){ + for (var i = 0; i < cols; i++){ + var cell = new Cell(i,j); + grid.push(cell); + } + } + current = grid[0]; +} + +function draw(){ + background(150); + for (var i = 0; i < grid.length; i++){ + grid[i].show(); + + } + current.visited = true; + current.highlight(); + var next = current.checkNeighbors(); + if (next) { + next.visited = true; + stack.push(current); + + removeWalls(current, next); + + current = next; + } else if (stack.length > 0){ + current = stack.pop(); + } + +} + + +function index(i, j){ + if(i < 0 || j < 0 || i > cols-1 || j > rows-1){ + return -1 + } + + return i + j * cols; +} + +function cell(i, j){ + this.i = i; + this.j = j; + this.walls = [true, true, true, true]; + this.visited = false; + + this.checkNeighbors = function(){ + var neighbors = []; + + var top = grid[index(i, j-1)]; + var right = grid[index(i+1, j)]; + var bottom = grid[index(i, j + 1)]; + var left = grid[index(i-1, j)]; + + if (top && !top.visited){ + neighbors.push(top); + } + if (right && !right.visited){ + neighbors.push(right); + } + if (bottom && !bottom.visited){ + neighbors.push(bottom); + } + if (left && !left.visited){ + neighbors.push(left); + } + if (neighbors.length > 0){ + var r = floor(random(0, neighbors.length)); + return neighbor[r]; + } else { + return undefined; + } + this.highlight = function(){ + var x = this.i*w; + var y = this.j*w; + noStroke(); + fill(0, 0, 255, 125); + rect(x,y,w,w); + } + + } + + this.show = function(){ + var x = this.i*w; + var y = this.j*w; + stroke(255); + if (this.walls[0]){ + line(x,y,x+w,y); + } + if (this.walls[1]){ + line(x+w,y,x+w,y+w); + } + if (this.walls[2]){ + line(x+w,y+w,x,y+w); + } + if (this.walls[3]){ + line(x,y+w,x,y); + } + if (this.visited){ + fill(255, 0, 255, 125); + rect(x,y,w,w); + } + } +} + +function removeWalls(a, b){ + var x = a.i - b.i; + if (x === 1){ + a.walls[3] = false; + b.walls[1] = false; + } else if (x === -1){ + a.walls[1] = false; + b.walls[3] = false; + } + + var y = a.j - b.j; + if (y === 1){ + a.walls[0] = false; + b.walls[2] = false; + } else if (y === -1){ + a.walls[2] = false; + b.walls[0] = false; + } + +}