I have this code that I have been modifying from some videos of "The Coding Train", and I want to detect the moment in which a variable called current
is equal to grid.length
(or to cols*rows
, since it would be the same). I leave the code below since I have tried in a thousand different ways to detect it but I succeed.
PS: I need that one if
in the draw()
. I'm not putting the if
one I've tried since I've tried many, like 20 different ways...
//Variables//
var w = 50;
if (window.innerWidth < window.innerHeight) {var max = w * Math.floor(window.innerWidth/w)} else {var max = w * Math.floor(window.innerHeight/w)}
var cols;
var rows;
var grid = [];
var stack = [];
var current = 0;
//Funciones//
function setup() {
if (window.innerWidth < window.innerHeight) {max = w * Math.floor(window.innerWidth/w)} else {max = w * Math.floor(window.innerHeight/w)}
createCanvas(max, max);
cols = Math.floor(width/w);
rows = Math.floor(height/w);
//frameRate(7:-);
for (var j = 0; j < rows; j++) {
for (var i = 0; i < cols; i++) {
var cell = new Cell(i, j);
grid.push(cell);
}
}
}
function draw() {
background(51);
for (var i = 0; i < grid.length; i++) {
grid[i].show();
}
grid[current].visited = true;
if (current == grid.length || current == cols * rows) {console.log("asd")};
var next = grid[current].checkNeighbors();
if (next) {
stack.push(current);
removeWalls(grid[current], grid[next]);
next.visited = true;
current = next;
} else if (stack.length > 0){
while (grid[current].checkNeighbors() == undefined) {
if (stack.length === 0) {break};
current = stack.pop();
}
}
push();
noFill();
stroke(0, 255, 0);
strokeWeight(20);
rect(0, 0, width, height);
pop();
}
function index(i, j) {
if (i < 0 || j < 0 || i > cols - 1 || j > rows - 1) {
return false;
}
return i + j * cols;
}
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;
}
}
//Cell
class Cell {
constructor(i, j) {
this.i = i;
this.j = j;
this.walls = [true, true, true, true];
this.visited = false;
}
show() {
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, 100);
noStroke();
rect(x, y, w, w);
}
}
checkNeighbors() {
var neighbors = [];
var top = index(this.i , this.j - 1);
var right = index(this.i + 1, this.j );
var bottom = index(this.i , this.j + 1);
var left = index(this.i - 1, this.j );
if (top && !grid[top].visited) {
neighbors.push(top);
}
if (right && !grid[right].visited) {
neighbors.push(right);
}
if (bottom && !grid[bottom].visited) {
neighbors.push(bottom);
}
if (left && !grid[left].visited) {
neighbors.push(left);
}
if (neighbors.length > 0) {
var r = Math.floor(random(0, neighbors.length));
return neighbors[r];
} else {
return undefined;
}
}
}
* {
margin: 0px;
border: 0px;
padding:0px;
};
<html>
<head>
<meta charset="utf-8">
<title></title>
<script src="https://code.jquery.com/jquery-3.3.1.slim.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.7.1/p5.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.7.1/addons/p5.dom.min.js"></script></script>
</head>
<body style="text-align:center">
</body>
</html>
SOLVED
If instead of checking something relative as if it
current
is equal to something, it is easier, in this case, to check if you arevisited
adding a variable (contador
in this case) so that the code would look like this: