Guess My Number - Game
+ +
+
+
+
+
+
+
+
+ Description
+Guess a number between 1 and 20
+A = check
+B = Reload
+▲ = increases guess by one
+▼ = decreases guess by one
+
Guess My Number
diff --git a/secret/mineSweeper/index.html b/secret/mineSweeper/index.html
new file mode 100644
index 0000000..c393c43
--- /dev/null
+++ b/secret/mineSweeper/index.html
@@ -0,0 +1,23 @@
+
+
+
+
+
+
+ Minesweeper
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/secret/mineSweeper/script.js b/secret/mineSweeper/script.js
new file mode 100644
index 0000000..d1cb835
--- /dev/null
+++ b/secret/mineSweeper/script.js
@@ -0,0 +1,173 @@
+// document.getElementById('startGame').addEventListener('click', function () {
+// // Get values from the inputs
+// const gridSize = parseInt(document.getElementById('gridSize').value);
+// const bombs = parseInt(document.getElementById('bombs').value);
+
+// // Hide settings and show canvas
+// document.getElementById('settings').style.display = 'none';
+// document.getElementById('game').style.display = 'block';
+
+// // Assuming renderGame is a function to draw the canvas or initiate the game
+// renderGame(gridSize, bombs);
+// });
+
+// function renderGame(gridSize, bombs) {
+// // Placeholder for actual game rendering logic
+// const canvas = document.getElementById('game');
+// const ctx = canvas.getContext('2d');
+// canvas.width = gridSize * 20; // Assuming gridSize affects canvas size
+// canvas.height = gridSize * 20;
+
+// // Draw grid or bombs based on input values
+// ctx.fillStyle = '#007bff';
+// ctx.fillRect(0, 0, canvas.width, canvas.height);
+// }
+
+const canvas = document.getElementById('game');
+const ctx = canvas.getContext('2d');
+
+class Minesweeper {
+ constructor(w, h, bombs) {
+ this.size = 25;
+ this.field = new Array(w);
+ this.bombs = new Array(w);
+ for (let x = 0; x < this.field.length; x++) {
+ this.field[x] = new Array(h);
+ this.bombs[x] = new Array(h);
+ for (let y = 0; y < this.field.length; y++) {
+ this.field[x][y] = 1;
+ this.bombs[x][y] = false;
+ }
+ }
+
+ for (let i = 0; i < bombs; i++) {
+ let x = Math.floor(Math.random() * w);
+ let y = Math.floor(Math.random() * h);
+ this.bombs[x][y] ? i-- : this.bombs[x][y] = true;
+ }
+
+ this.drawField();
+ }
+
+ getNearbyBombs(x, y) {
+ let counter = 0;
+ for (let newX = x - 1; newX <= x + 1; newX++) {
+ for (let newY = y - 1; newY <= y + 1; newY++) {
+ if (newX < this.field.length && newX >= 0 && newY < this.field[0].length && newY >= 0) {
+ this.bombs[newX][newY] ? counter++ : {};
+ }
+ }
+ }
+ return counter;
+ }
+
+ checkWin() {
+ for (let x = 0; x < this.field.length; x++) {
+ for (let y = 0; y < this.field[x].length; y++) {
+ if (this.field[x][y] != 0 && !this.bombs[x][y]) {
+ return;
+ }
+ }
+ }
+ this.drawField();
+ alert("You won!");
+ window.location.reload();
+ }
+
+ markSquare(x, y) {
+ if (x < this.field.length && y < this.field[0].length) {
+ switch (this.field[x][y]) {
+ case 1:
+ this.field[x][y]++;
+ break;
+ case 2:
+ this.field[x][y]++;
+ break;
+ case 3:
+ this.field[x][y] = 1;
+ break;
+ default:
+ break;
+ }
+ this.drawField();
+ }
+ }
+
+ uncoverSquare(x, y) {
+ if (x < this.field.length && x >= 0 && y < this.field[0].length && y >= 0) {
+ if (this.bombs[x][y] && this.field[x][y] == 1) {
+ alert("You lost!");
+ window.location.reload();
+ } else if (this.field[x][y] == 1) {
+ this.field[x][y] = 0;
+ if (this.getNearbyBombs(x, y) == 0) {
+ for (let newX = x - 1; newX <= x + 1; newX++) {
+ for (let newY = y - 1; newY <= y + 1; newY++) {
+ if (newX < this.field.length && newX >= 0 && newY < this.field[0].length && newY >= 0) {
+ this.field[newX][newY] == 1 ? this.uncoverSquare(newX, newY) : {};
+ }
+ }
+ }
+ }
+ };
+ this.checkWin();
+ this.drawField();
+ }
+ }
+
+ drawSquare(x, y, type) {
+ ctx.lineWidth = 3;
+ x += 2, y += 2;
+ let color1 = (x + y) % 2 === 0 ? '#D3D3D3' : '#A9A9A9';
+ let activeColor = (x + y) % 2 === 0 ? '#4CAF50' : '#81C784';
+ ctx.fillStyle = type !== 0 ? activeColor : color1;
+ ctx.fillRect(x * this.size, y * this.size, this.size, this.size);
+ ctx.strokeStyle = '#000';
+ ctx.strokeRect(x * this.size, y * this.size, this.size, this.size);
+
+ if (type != 1) {
+ const fontSize = this.size / 2;
+ const number = this.getNearbyBombs(x - 2, y - 2);
+ let finalPrint;
+ ctx.font = `${fontSize}px sans-serif`;
+ ctx.fillStyle = '#000';
+ type == 0 ? finalPrint = number ? number : ' ' : {};
+ type == 2 ? finalPrint = '🚩' : {};
+ type == 3 ? finalPrint = '❓' : {};
+ ctx.fillText(finalPrint, x * this.size + fontSize / (type == 0 ? 1.5 : 1.8), y * this.size + fontSize * 1.3);
+ }
+ }
+
+ drawField() {
+ canvas.width = window.innerWidth;
+ canvas.height = window.innerHeight;
+ const squareWidth = canvas.width / (this.field.length + 4);
+ const squareHeight = canvas.height / (this.field[0].length + 4);
+ squareHeight > squareWidth ? this.size = squareWidth : this.size = squareHeight;
+
+ const offsetX = (canvas.width - (this.field.length * this.size)) / 2;
+ const offsetY = (canvas.height - (this.field[0].length * this.size)) / 2;
+
+ for (let x = 0; x < this.field.length; x++) {
+ for (let y = 0; y < this.field[x].length; y++) {
+ this.drawSquare(x, y, this.field[x][y], offsetX, offsetY);
+ }
+ }
+ }
+}
+
+let field = new Minesweeper(18, 18, 54);
+window.addEventListener('resize', () => field.drawField());
+canvas.addEventListener('click', (event) => {
+ const rect = canvas.getBoundingClientRect();
+ const x = Math.floor((event.clientX - rect.left - field.size * 2) / field.size);
+ const y = Math.floor((event.clientY - rect.top - field.size * 2) / field.size);
+ field.uncoverSquare(x, y);
+});
+canvas.addEventListener('contextmenu', (event) => {
+ event.preventDefault();
+ const rect = canvas.getBoundingClientRect();
+ const x = Math.floor((event.clientX - rect.left - field.size * 2) / field.size);
+ const y = Math.floor((event.clientY - rect.top - field.size * 2) / field.size);
+ field.markSquare(x, y);
+});
diff --git a/secret/mineSweeper/styles.css b/secret/mineSweeper/styles.css
new file mode 100644
index 0000000..a2cbba2
--- /dev/null
+++ b/secret/mineSweeper/styles.css
@@ -0,0 +1,49 @@
+* {
+ margin: 0;
+ padding: 0;
+ box-sizing: border-box;
+}
+
+body {
+ font-family: 'Arial', sans-serif;
+ background-color: #f0f0f0;
+ color: #333;
+ margin: 0;
+ padding: 0;
+}
+
+#settings {
+ margin: 20px;
+ text-align: center;
+}
+
+label {
+ margin-right: 10px;
+}
+
+input {
+ padding: 5px;
+ margin-right: 10px;
+ width: 60px;
+ text-align: center;
+}
+
+button {
+ padding: 8px 16px;
+ background-color: #007bff;
+ color: white;
+ border: none;
+ border-radius: 4px;
+ cursor: pointer;
+ transition: background-color 0.3s ease;
+}
+
+button:hover {
+ background-color: #0056b3;
+}
+
+canvas {
+ display: none;
+ margin: 20px auto;
+ border: 1px solid #ccc;
+}
diff --git a/secret/styles.css b/secret/styles.css
index c0a914f..69f112b 100644
--- a/secret/styles.css
+++ b/secret/styles.css
@@ -10,14 +10,8 @@ body {
color: #b0b0b0;
margin: 0;
line-height: 1.6;
- background-image: repeating-linear-gradient(
- 45deg,
- #ffcc00 0%,
- #ffcc00 10%,
- #0d0d0d 10%,
- #0d0d0d 20%
- );
- background-size: 20px 20px; /* Adjust size for tape appearance */
+ background-image: url('images/background.jpg');
+ background-size: cover /* Adjust size for tape appearance */
}
header {
diff --git a/webGames/index.html b/webGames/index.html
index 35c69b5..267e198 100644
--- a/webGames/index.html
+++ b/webGames/index.html
@@ -34,7 +34,7 @@
Uncover squares on a grid while avoiding hidden mines, using numbers to deduce safe spots.
