Merge pull request #2072 from Aditi22Bansal/master

Solved #2022- hexsweep game
Sulagna-Dutta-Roy · Jul 2, 2024 · 21f5e78 · 21f5e78
2 parents 6e65745 + 8f906b3
commit 21f5e78
Show file tree

Hide file tree

Showing 4 changed files with 147 additions and 0 deletions.
diff --git a/Hexsweep Game/index.html b/Hexsweep Game/index.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Hexsweep Game</title>
+  <link rel="stylesheet" href="styles.css">
+</head>
+<body>
+  <div id="game-container">
+    <h1>Hexsweep</h1>
+    <div id="game-board"></div>
+    <button id="reset-button">Reset Game</button>
+  </div>
+  <script src="script.js"></script>
+</body>
+</html>
diff --git a/Hexsweep Game/manifest.json b/Hexsweep Game/manifest.json
@@ -0,0 +1,20 @@
+{
+  "name": "Hexsweep Game",
+  "version": "1.0",
+  "description": "A hexagonal version of Minesweeper.",
+  "manifest_version": 2,
+  "icons": {
+    "48": "icon48.png",
+    "128": "icon128.png"
+  },
+  "browser_action": {
+    "default_popup": "index.html",
+    "default_icon": {
+      "48": "icon48.png",
+      "128": "icon128.png"
+    }
+  },
+  "permissions": [
+    "storage"
+  ]
+}
diff --git a/Hexsweep Game/script.js b/Hexsweep Game/script.js
@@ -0,0 +1,64 @@
+document.addEventListener('DOMContentLoaded', () => {
+  const boardSize = 10;
+  const mineCount = 15;
+  let gameBoard = [];
+  let mines = [];
+  const gameBoardElement = document.getElementById('game-board');
+  const resetButton = document.getElementById('reset-button');
+
+  function initGame() {
+    gameBoard = [];
+    mines = [];
+    gameBoardElement.innerHTML = '';
+    createBoard();
+    placeMines();
+    addEventListeners();
+  }
+
+  function createBoard() {
+    for (let i = 0; i < boardSize * boardSize; i++) {
+      const hex = document.createElement('div');
+      hex.classList.add('hex');
+      gameBoardElement.appendChild(hex);
+      gameBoard.push(hex);
+    }
+  }
+
+  function placeMines() {
+    while (mines.length < mineCount) {
+      const randomIndex = Math.floor(Math.random() * gameBoard.length);
+      if (!mines.includes(randomIndex)) {
+        mines.push(randomIndex);
+        gameBoard[randomIndex].classList.add('mine');
+      }
+    }
+  }
+
+  function addEventListeners() {
+    gameBoard.forEach((hex, index) => {
+      hex.addEventListener('click', () => {
+        if (hex.classList.contains('mine')) {
+          alert('Game Over!');
+          revealMines();
+        } else {
+          hex.classList.add('safe');
+        }
+      });
+
+      hex.addEventListener('contextmenu', (e) => {
+        e.preventDefault();
+        hex.classList.toggle('flagged');
+      });
+    });
+
+    resetButton.addEventListener('click', initGame);
+  }
+
+  function revealMines() {
+    mines.forEach(index => {
+      gameBoard[index].classList.add('revealed');
+    });
+  }
+
+  initGame();
+});
diff --git a/Hexsweep Game/styles.css b/Hexsweep Game/styles.css
@@ -0,0 +1,46 @@
+body {
+  font-family: Arial, sans-serif;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  height: 100vh;
+  margin: 0;
+  background-color: #f0f0f0;
+}
+
+#game-container {
+  text-align: center;
+}
+
+#game-board {
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: center;
+  margin-top: 20px;
+}
+
+.hex {
+  width: 40px;
+  height: 40px;
+  background-color: #ddd;
+  margin: 2px;
+  clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  cursor: pointer;
+}
+
+.hex.mine {
+  background-color: red;
+}
+
+.hex.flagged {
+  background-color: yellow;
+}
+
+#reset-button {
+  margin-top: 20px;
+  padding: 10px 20px;
+  font-size: 16px;
+}