From b4ef14a7e010c1b468928d29a981fdf6ba700563 Mon Sep 17 00:00:00 2001 From: Charles Cabergs Date: Sat, 31 Oct 2020 17:25:22 +0100 Subject: Added minesweeper logic, style, settings --- utils/minesweeper/script.js | 130 +++++++++++++++++++++++++++++++++++++------- 1 file changed, 109 insertions(+), 21 deletions(-) (limited to 'utils/minesweeper/script.js') diff --git a/utils/minesweeper/script.js b/utils/minesweeper/script.js index 5679d75..059efdf 100644 --- a/utils/minesweeper/script.js +++ b/utils/minesweeper/script.js @@ -1,31 +1,119 @@ -const height = 10 -const width = 10 -const mine_rate = 0.30 +let height = 10 +let width = 10 +let mine_rate = 0.10 +let timer = undefined let mines = [] let visited = [] -for (i = 0; i < height; i++) { - mines.push(new Array(width)) - visited.push(new Array(width)) - for (j = 0; j < width; j++) { - mines[i][j] = Math.random() < mine_rate ? -1 : 0; - visited[i][j] = false; - } +let running = false + +function isValidPos(y, x) { + return y >= 0 && y < height && x >= 0 && x < width +} + +function* neighboursGenerator(y, x) { + for (let i = -1; i <= 1; i++) { + for (let j = -1; j <= 1; j++) { + if (i === 0 && j === 0) + continue + let ret = [y + i, x + j] + if (!isValidPos(...ret)) + continue + yield ret + } + } } -canvas = document.getElementById("minesweeper-canvas") -context = canvas.getContext("2d") -console.log(context) +let cells = [] + +function floodFill(y, x) { + visited[y][x] = true + let cell = cells[y][x] + cell.classList.add("visited") + if (mines[y][x] !== 0) + cell.textContent = mines[y][x] + switch (mines[y][x]) { + case 1: cell.style.color = "blue"; break + case 2: cell.style.color = "green"; break + case 3: cell.style.color = "red"; break + case 4: cell.style.color = "darkblue"; break + case 5: cell.style.color = "brown"; break + case 6: cell.style.color = "cyan"; break + case 7: cell.style.color = "black"; break + case 8: cell.style.color = "grey"; break + } + if (mines[y][x] !== 0) + return + for (let [ny, nx] of neighboursGenerator(y, x)) + if (!visited[ny][nx]) + floodFill(ny, nx) +} + +function initGrid() { + let table = document.getElementById("minesweeper-table") + table.innerHTML = "" + + width = document.getElementById("minesweeper-width").value + height = document.getElementById("minesweeper-height").value + mine_rate = document.getElementById("minesweeper-mine-rate").value / 100 -const cell_width = canvas.width / width -const cell_height = canvas.height / height -const cell_size = Math.min(cell_width, cell_height) + mines = [] + visited = [] + cells = [] -for (i = 0; i < height; i++) { - for (j = 0; j < width; j++) { - context.strokeRect(cell_size * j, cell_size * i, cell_size, cell_size); - } + for (let i = 0; i < height; i++) { + mines.push(new Array(width)) + visited.push(new Array(width)) + for (let j = 0; j < width; j++) { + mines[i][j] = Math.random() < mine_rate ? -1 : 0; + visited[i][j] = false; + } + } + + // count neighbour mines + for (let i = 0; i < height; i++) { + for (let j = 0; j < width; j++) { + if (mines[i][j] === -1) + continue + mines[i][j] = + [...neighboursGenerator(i, j)] + .filter(([y, x]) => mines[y][x] === -1) + .length + } + } + + for (let i = 0; i < height; i++) { + cells.push([]) + let table_row = document.createElement("tr") + for (let j = 0; j < width; j++) { + let table_cell = document.createElement("td") + let cell = document.createElement("button") + cell.textContent = "" + cell.addEventListener("click", () => floodFill(i, j)) + cells[i].push(cell) + table_cell.appendChild(cell) + table_row.appendChild(table_cell) + } + table.appendChild(table_row) + } +} + +for (input of document.querySelectorAll("#minesweeper-settings input")) { + input.addEventListener("input", () => initGrid()) } -// canvas.addEventListener("click", () => {}) +function toggleRunning() { + running = !running + settings = document.getElementById("minesweeper-settings") + info = document.getElementById("minesweeper-game-info") + settings.hidden = !settings.hidden + info.hidden = !info.hidden + // if (timer === undefined) { + // } +} + +document.getElementById("minesweeper-start").addEventListener("click", toggleRunning) +document.getElementById("minesweeper-stop") .addEventListener("click", toggleRunning) + +initGrid() -- cgit