I'm coding a minesweeper and I got the UI and I can't modify it. I've made the grid for different sizes but now I need to push the mines into it, I created a function that gives me an array of mines in differents positions taking as parameter the boardsize, but I cant figure how push this array of mines into the grid replacing the cells if it match with mines position
Here is the code:
import { CellEnum } from "../types";
import { CellComponentType } from "../UI/components/CellComponentType";
import { getMinePositions, positionMatch } from "./mines";
export function def(boardSize: number, minesInGame: number) {
let board: CellEnum[][] = [];
const minePosition = getMinePositions(boardSize, minesInGame);
for (let xAxis = 0; xAxis < boardSize; xAxis++) {
const row = [];
for (let yAxis = 0; yAxis < boardSize; yAxis++) {
let tile: CellEnum = CellEnum.Hidden
row.push(tile);
}
board.push(row);
}
return board;
}
And this is the code of mines generator
import { CellComponentType } from "../UI/components/CellComponentType";
import { CellEnum } from "../types";
function randomNumber(size: number) {
return Math.floor(Math.random() * size);
}
function positionMatch(a: CellComponentType, b: CellComponentType) {
return a.position === b.position;
}
function getMinePositions(boardSize: number, minesInGame: number) {
const positions: CellComponentType[] = [];
while (positions.length < minesInGame) {
let position: CellComponentType = {
position: [randomNumber(boardSize), randomNumber(boardSize)],
cell: CellEnum.Mine
};
if (!positions.some(positionMatch.bind(null, position))) {
positions.push(position);
}
}
return positions;
}
export { getMinePositions, positionMatch };
CellComponentType has this attributes:
type CellComponentType = {
position: [number, number];
cell: CellEnum;
};
And finally these are the different status that could have a cell
enum CellEnum {
Hidden = -1,
Cero = 0,
One = 1,
Two = 2,
Three = 3,
Four = 4,
Five = 5,
Six = 6,
Seven = 7,
Eight = 8,
Flag = 9,
Mine = 10,
ClickedMine = 11
}
I really appreciate if someone could help, thanks
You have a problem in your positionMatch-method. You are comparing the array itself when you actually want to compare the content of the array. Change your method like this:
function positionMatch(a: CellComponentType, b: CellComponentType) {
return a.position[0] === b.position[0]
&& a.position[1] === b.position[1];
}
To add the mines to the field you can loop over your mine positions and overwrite the matching hidden fields before returning the board:
for(let mine of minePosition) {
board[mine.position[1], mine.position[0]] = mine.cell;
}
Loop over the mines and change the corresponding board tile:
const mines = getMinePositions();
mines.forEach((mine) => {
const [x, y] = mine.position;
board[y][x] = mine.cell;
});
I don't know how you've got your board setup but usually I have it as y as rows and x as columns, so I've used board[y][x] here.