added quickstart and footer

This commit is contained in:
MasterGordon 2024-09-14 21:07:35 +02:00
parent 65b747689e
commit ad534e63dc
4 changed files with 40 additions and 2 deletions

View File

@ -1,5 +1,5 @@
import { Button } from "./Button"; import { Button } from "./Button";
import { useGame } from "./GameContext"; import { updateGame, useGame } from "./GameContext";
import Timer from "./Timer"; import Timer from "./Timer";
import Options from "./Options"; import Options from "./Options";
@ -10,6 +10,9 @@ function App() {
<div className="App"> <div className="App">
<h1>Minesweeper</h1> <h1>Minesweeper</h1>
<Options /> <Options />
<button onClick={() => updateGame((game) => game?.quickStart())}>
Quick Start
</button>
<div className="game-wrapper"> <div className="game-wrapper">
<div> <div>
<Timer /> <Timer />
@ -28,6 +31,15 @@ function App() {
</div> </div>
</div> </div>
</div> </div>
<div className="footer">
<pre>Version: 1.0.1</pre>
<pre>
Made by MasterGordon -{" "}
<a target="_blank" href="https://github.com/MasterGordon/minesweeper">
Source Code
</a>
</pre>
</div>
</div> </div>
); );
} }

View File

@ -53,7 +53,7 @@ export const Button = ({ x, y }: ButtonProps) => {
} }
if (e.button === 0) { if (e.button === 0) {
// Left click // Left click
if (!game?.isRevealed[x][y]) { if (!game?.isRevealed[x][y] && !game?.isFlagged[x][y]) {
updateGame((game) => game?.reveal(x, y)); updateGame((game) => game?.reveal(x, y));
} else { } else {
const neighborFlagCount = game const neighborFlagCount = game

View File

@ -128,4 +128,17 @@ export class Game {
const mines = neighbors.filter((n) => n).length; const mines = neighbors.filter((n) => n).length;
return mines; return mines;
} }
quickStart() {
for (let i = 0; i < this.getWidth(); i++) {
for (let j = 0; j < this.getHeight(); j++) {
const value = this.getValue(i, j);
const isMine = this.isMine(i, j);
if (value === 0 && !isMine) {
this.reveal(i, j);
return;
}
}
}
}
} }

View File

@ -44,3 +44,16 @@ body {
font-size: 2rem; font-size: 2rem;
font-family: monospace; font-family: monospace;
} }
.footer {
display: flex;
flex-direction: column;
/* justify-content: space-between; */
align-items: center;
font-size: 1rem;
font-family: monospace;
}
pre {
margin: 0;
}