diff --git a/html/index.html b/html/index.html
index 41c23f8..420774f 100644
--- a/html/index.html
+++ b/html/index.html
@@ -4,6 +4,12 @@
+
+
+
Minesweeper 99
diff --git a/res/svg/bomb-solid.svg b/res/svg/bomb-solid.svg
new file mode 100644
index 0000000..ddc2a3e
--- /dev/null
+++ b/res/svg/bomb-solid.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/res/svg/flag-solid.svg b/res/svg/flag-solid.svg
new file mode 100644
index 0000000..80ad2dc
--- /dev/null
+++ b/res/svg/flag-solid.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/scss/index.scss b/scss/index.scss
index f42c469..158b500 100644
--- a/scss/index.scss
+++ b/scss/index.scss
@@ -22,6 +22,14 @@ body {
h1 {
text-align: center;
+
+ img {
+ fill: white;
+ filter: invert(1);
+ height: 1em;
+ padding-right: 0.3em;
+ margin-bottom: -0.15em;
+ }
}
h4.subheader {
@@ -66,6 +74,12 @@ body {
background-color: #303030;
font-size: large;
+ img {
+ fill: white;
+ filter: invert(1);
+ height: 1em;
+ }
+
&.discovered {
background-color: #424242;
}
diff --git a/src/helpers/multiplayer.js b/src/helpers/multiplayer.js
index 875065b..821d49d 100644
--- a/src/helpers/multiplayer.js
+++ b/src/helpers/multiplayer.js
@@ -77,7 +77,7 @@ class Multiplayer {
if (data[id] == undefined) {
log(`${this.players[id].username} has left.`, "alert");
delete this.players[id];
- if (Object.keys(this.players).length == 0) {
+ if (Object.keys(this.players).length == 0 && this.game.active) {
log("No other players left", "alert");
this.game.gameOver();
}
@@ -100,7 +100,7 @@ class Multiplayer {
if (!data.player.active) {
log(`${this.players[data.uuid].username} had died`);
delete this.players[data.uuid];
- if (Object.keys(this.players).length == 0) {
+ if (Object.keys(this.players).length == 0 && this.game.active) {
log("No other players left", "alert");
this.game.gameOver();
}
diff --git a/src/index.js b/src/index.js
index 0ed031c..7328e6d 100644
--- a/src/index.js
+++ b/src/index.js
@@ -1,11 +1,10 @@
/* eslint-disable no-unused-vars */
import "../scss/index.scss";
-// import "../node_modules/@fortawesome/fontawesome-free/scss/fontawesome.scss";
+import bomb from "../res/svg/bomb-solid.svg";
import Game from "./screens/game.js";
import Multiplayer from "./helpers/multiplayer.js";
-
["DOMContentLoaded", "resize"].forEach(evt =>
window.addEventListener(evt, (e) => {
var main = document.getElementById("main");
@@ -21,6 +20,10 @@ import Multiplayer from "./helpers/multiplayer.js";
})
);
+var img = document.createElement("img");
+img.src = bomb;
+document.querySelector("body > h1").prepend(img);
+
var board = document.getElementById("board");
var game = new Game(board);
var mp = new Multiplayer(game);
diff --git a/src/screens/game.js b/src/screens/game.js
index 57c1cba..6426139 100644
--- a/src/screens/game.js
+++ b/src/screens/game.js
@@ -4,6 +4,9 @@ import {
EventEmitter
} from "events";
+import bomb from "../../res/svg/bomb-solid.svg";
+import flag from "../../res/svg/flag-solid.svg";
+
class Game extends EventEmitter {
constructor(element) {
super();
@@ -169,14 +172,14 @@ class Game extends EventEmitter {
}
if (this.active && !this.discovered[cell]) {
- this.discovered[cell] = 1;
- this.children[cell].classList.add("discovered");
-
if (this.bombs[cell]) {
this.gameOver();
return;
}
+ this.discovered[cell] = 1;
+ this.children[cell].classList.add("discovered");
+
var surrounds = this.surrounds(cell);
var value = 0;
@@ -206,8 +209,12 @@ class Game extends EventEmitter {
if (this.bombs[cell]) {
if (!this.discovered[cell]) {
this.discovered[cell] = 1;
- this.children[cell].innerHTML = "#";
+
+ var img = document.createElement("img");
+ img.src = flag;
+ this.children[cell].appendChild(img);
this.children[cell].classList.add("flag");
+
this.bombAmount--;
this.emit("sendBomb");
@@ -253,8 +260,12 @@ class Game extends EventEmitter {
for (let index = 0; index < this.size; index++) {
if (this.bombs[index]) {
- this.children[index].innerHTML = "[]";
- this.children[index].classList.add("bomb");
+ if (!this.discovered[index]) {
+ var img = document.createElement("img");
+ img.src = bomb;
+ this.children[index].appendChild(img);
+ this.children[index].classList.add("bomb");
+ }
}
}
}
diff --git a/webpack.config.js b/webpack.config.js
index 8c1681c..4aa8d9b 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -18,7 +18,7 @@ module.exports = {
],
},
{
- test: /\.(woff(2)?|ttf|eot|svg)(\?v=\d+\.\d+\.\d+)?$/,
+ test: /\.(woff(2)?|ttf|eot)(\?v=\d+\.\d+\.\d+)?$/,
use: [{
loader: "file-loader",
options: {
@@ -26,6 +26,16 @@ module.exports = {
outputPath: "res/fonts/"
}
}]
+ },
+ {
+ test: /\.(svg)$/,
+ use: [{
+ loader: "file-loader",
+ options: {
+ name: "[name].[ext]",
+ outputPath: "res/svg/"
+ }
+ }]
}
]
}