class Example extends Phaser.Scene { constructor() { super(); this.lives = 3; this.dogs = 0; // Will be set when mines are placed this.drones = 3; // Number of drone uses available this.himarsUses = 0; // Will be set when mines are placed based on mine count this.himarsMode = false; // Whether HIMARS mode is active this.tileSize = 40; this.gridWidth = 12; this.gridHeight = 10; this.totalMines = Phaser.Math.Between(10, 24); this.remainingMines = this.totalMines; this.grid = []; this.tiles = []; this.gameStarted = false; } create() { // Create keyboard inputs this.keyF = this.input.keyboard.addKey('F'); this.keyR = this.input.keyboard.addKey('R'); this.keyD = this.input.keyboard.addKey('D'); this.keyT = this.input.keyboard.addKey('T'); // Track the tile the pointer is hovering over this.hoveredTile = null; // Set the background color to dark blue (Ukraine theme) this.cameras.main.setBackgroundColor('#002850'); // Add mine counter // Add lives counter this.livesText = this.add.text(16, 16, `Lives: ${this.lives}`, { fontSize: '24px', fill: '#FFD700', fontFamily: 'Arial' }); // Add mine counter this.mineText = this.add.text(16, 46, `Mines: ${this.remainingMines}`, { fontSize: '24px', fill: '#FFD700', fontFamily: 'Arial' }); // Add auto-flag button const autoFlagButton = this.add.rectangle(16, 86, 120, 30, 0x444444); autoFlagButton.setOrigin(0, 0); autoFlagButton.on('pointerdown', () => this.autoFlagMine()); autoFlagButton.on('pointerover', () => { if (this.dogs > 0 && this.gameStarted) { autoFlagButton.setFillStyle(0x003780); } }); autoFlagButton.on('pointerout', () => { if (this.dogs > 0 && this.gameStarted) { autoFlagButton.setFillStyle(0x0057B7); } else { autoFlagButton.setFillStyle(0x444444); } }); const buttonText = this.add.text(76, 101, 'Dog Sniff: 0', { fontSize: '18px', fill: '#888888', fontFamily: 'Arial' }).setOrigin(0.5); // Store button references for later use this.autoFlagButton = autoFlagButton; this.autoFlagButtonText = buttonText; // Add Fly Drone button const flyDroneButton = this.add.rectangle(16, 126, 120, 30, 0x0057B7); flyDroneButton.setOrigin(0, 0); flyDroneButton.setInteractive(); const droneButtonText = this.add.text(76, 141, 'Fly Drone: 3', { fontSize: '18px', fill: '#FFD700', fontFamily: 'Arial' }).setOrigin(0.5); flyDroneButton.on('pointerdown', () => this.useDrone()); flyDroneButton.on('pointerover', () => { if (this.drones > 0 && this.gameStarted) { flyDroneButton.setFillStyle(0x003780); } }); flyDroneButton.on('pointerout', () => { if (this.drones > 0 && this.gameStarted) { flyDroneButton.setFillStyle(0x0057B7); } else { flyDroneButton.setFillStyle(0x444444); } }); // Store button references for later use this.flyDroneButton = flyDroneButton; this.flyDroneButtonText = droneButtonText; // Add HIMARS button const himarsButton = this.add.rectangle(16, 166, 120, 30, 0x0057B7); himarsButton.setOrigin(0, 0); himarsButton.setInteractive(); const himarsButtonText = this.add.text(76, 181, 'HIMARS: 1', { fontSize: '18px', fill: '#FFD700', fontFamily: 'Arial' }).setOrigin(0.5); himarsButton.on('pointerdown', () => this.toggleHimarsMode()); himarsButton.on('pointerover', () => { if (this.himarsUses > 0 && this.gameStarted) { if (this.himarsMode) { himarsButton.setFillStyle(0xFFA500); // Keep orange when active } else { himarsButton.setFillStyle(0x003780); } } }); himarsButton.on('pointerout', () => { if (this.himarsUses > 0 && this.gameStarted) { himarsButton.setFillStyle(this.himarsMode ? 0xFFA500 : 0x0057B7); } else { himarsButton.setFillStyle(0x444444); } }); // Store button references for later use this.himarsButton = himarsButton; this.himarsButtonText = himarsButtonText; // Calculate grid position to center it const startX = (800 - (this.gridWidth * this.tileSize)) / 2; const startY = (600 - (this.gridHeight * this.tileSize)) / 2; // Initialize grid arrays for (let y = 0; y < this.gridHeight; y++) { this.grid[y] = []; this.tiles[y] = []; for (let x = 0; x < this.gridWidth; x++) { this.grid[y][x] = { mine: false, revealed: false, flagged: false, neighborMines: 0, exploded: false }; // Create tile graphics const tile = this.add.rectangle( startX + x * this.tileSize, startY + y * this.tileSize, this.tileSize - 2, this.tileSize - 2, 0x0057B7 ); tile.setOrigin(0, 0); tile.setInteractive(); tile.gridX = x; tile.gridY = y; this.tiles[y][x] = tile; } } // Setup input handlers // Track pointer over tiles this.input.on('gameobjectover', (pointer, gameObject) => { if (typeof gameObject.gridX !== 'undefined' && typeof gameObject.gridY !== 'undefined') { this.hoveredTile = gameObject; // Change color for HIMARS mode hover const cell = this.grid[gameObject.gridY][gameObject.gridX]; if (this.himarsMode && !cell.revealed && !cell.flagged) { gameObject.setFillStyle(0xFFA500); // Orange color for HIMARS hover } } }); this.input.on('gameobjectout', (pointer, gameObject) => { if (this.hoveredTile === gameObject) { this.hoveredTile = null; // Revert color if in HIMARS mode const cell = this.grid[gameObject.gridY][gameObject.gridX]; if (!cell.revealed && !cell.flagged) { gameObject.setFillStyle(0x0057B7); // Revert to default blue } } }); // Handle left click for revealing tiles this.input.on('gameobjectdown', (pointer, gameObject) => { if (typeof gameObject.gridX !== 'undefined' && typeof gameObject.gridY !== 'undefined') { if (this.himarsMode) { this.useHimars(gameObject.gridX, gameObject.gridY); } else { this.revealTile(gameObject.gridX, gameObject.gridY); } } }); // Handle F key release for flagging this.keyF.on('up', () => { if (this.hoveredTile && typeof this.hoveredTile.gridX !== 'undefined' && typeof this.hoveredTile.gridY !== 'undefined') { const cell = this.grid[this.hoveredTile.gridY][this.hoveredTile.gridX]; if (!cell.revealed) { this.toggleFlag(this.hoveredTile.gridX, this.hoveredTile.gridY); } } }); // Handle R key release for Auto-Flag/Dog Sniff this.keyR.on('up', () => { if (this.gameStarted && this.dogs > 0) { this.autoFlagMine(); } }); // Handle D key release for Fly Drone this.keyD.on('up', () => { if (this.gameStarted && this.drones > 0) { this.useDrone(); } }); // Handle T key release for HIMARS toggle this.keyT.on('up', () => { if (this.gameStarted && this.himarsUses > 0) { this.toggleHimarsMode(); } }); } revealTile(x, y) { const cell = this.grid[y][x]; if (cell.flagged || cell.revealed) return; // Place mines on first click if (!this.gameStarted) { this.placeMines(x, y); this.gameStarted = true; // Enable the Dog Sniff button after first click this.autoFlagButton.setFillStyle(0x0057B7); this.autoFlagButton.setInteractive(); this.autoFlagButtonText.setStyle({ fill: '#FFD700' }); this.autoFlagButton.on('pointerover', () => { if (this.dogs > 0) { this.autoFlagButton.setFillStyle(0x003780); } }); this.autoFlagButton.on('pointerout', () => { if (this.dogs > 0) { this.autoFlagButton.setFillStyle(0x0057B7); } else { this.autoFlagButton.setFillStyle(0x444444); } }); } cell.revealed = true; if (cell.mine) { this.tiles[y][x].setFillStyle(0xFF0000); cell.exploded = true; this.lives--; this.livesText.setText(`Lives: ${this.lives}`); // Mark the mine as both revealed and flagged to trigger number updates cell.flagged = true; // Update remaining mines counter this.remainingMines--; this.mineText.setText(`Mines: ${this.remainingMines}`); this.updateSurroundingNumbers(x, y); if (this.lives <= 0) { this.gameOver(false); return; } return; } // Reveal tile and show neighbor count if any this.tiles[y][x].setFillStyle(0x001f3f); if (cell.neighborMines > 0) { const text = this.add.text( this.tiles[y][x].x + this.tileSize / 2, this.tiles[y][x].y + this.tileSize / 2, cell.neighborMines.toString(), { fontSize: '20px', fill: '#FFD700', fontFamily: 'Arial' } ).setOrigin(0.5); this.updateSurroundingNumbers(x, y); } // Auto-reveal neighbors if no adjacent mines if (cell.neighborMines === 0) { this.revealNeighbors(x, y); } // Check for win condition after tile is fully revealed if (this.checkWinCondition()) { this.gameOver(true); } } toggleFlag(x, y) { const cell = this.grid[y][x]; if (cell.revealed) return; cell.flagged = !cell.flagged; this.remainingMines += cell.flagged ? -1 : 1; this.mineText.setText(`Mines: ${this.remainingMines}`); this.tiles[y][x].setFillStyle(cell.flagged ? 0xFFD700 : 0x0057B7); this.updateSurroundingNumbers(x, y); } updateSurroundingNumbers(x, y) { for (let dy = -1; dy <= 1; dy++) { for (let dx = -1; dx <= 1; dx++) { const nx = x + dx; const ny = y + dy; if (nx >= 0 && nx < this.gridWidth && ny >= 0 && ny < this.gridHeight) { const cell = this.grid[ny][nx]; if (cell.revealed && cell.neighborMines > 0) { let surroundingFlags = 0; // Count surrounding flags for (let fy = -1; fy <= 1; fy++) { for (let fx = -1; fx <= 1; fx++) { const checkX = nx + fx; const checkY = ny + fy; if (checkX >= 0 && checkX < this.gridWidth && checkY >= 0 && checkY < this.gridHeight) { if (this.grid[checkY][checkX].flagged) { surroundingFlags++; } } } } // Update number appearance const numberText = this.children.list.find(child => child.type === 'Text' && child.x === this.tiles[ny][nx].x + this.tileSize / 2 && child.y === this.tiles[ny][nx].y + this.tileSize / 2 ); if (numberText) { if (surroundingFlags === cell.neighborMines) { numberText.setStyle({ fill: '#a65314' }); } else { numberText.setStyle({ fill: '#FFD700' }); } } } } } } } placeMines(firstX, firstY) { let minesToPlace = this.totalMines; while (minesToPlace > 0) { const x = Phaser.Math.Between(0, this.gridWidth - 1); const y = Phaser.Math.Between(0, this.gridHeight - 1); // Check if the position is not in the safe zone around first click const isSafeZone = Math.abs(x - firstX) <= 1 && Math.abs(y - firstY) <= 1; // Don't place mine in safe zone or where there's already a mine if (!isSafeZone && !this.grid[y][x].mine) { this.grid[y][x].mine = true; minesToPlace--; // Calculate dogs when mines are first placed if (minesToPlace === 0) { // Calculate dogs when mines are placed this.dogs = Math.floor(this.totalMines / 6) + 1; this.autoFlagButtonText.setText(`Dog Sniff: ${this.dogs}`); this.updateAutoFlagButton(); // Calculate HIMARS uses when mines are placed this.himarsUses = Math.max(1, Math.floor(this.totalMines / 15)); this.himarsButtonText.setText(`HIMARS: ${this.himarsUses}`); this.updateHimarsButton(); } this.incrementNeighbors(x, y); } } } incrementNeighbors(x, y) { for (let dy = -1; dy <= 1; dy++) { for (let dx = -1; dx <= 1; dx++) { const nx = x + dx; const ny = y + dy; if (nx >= 0 && nx < this.gridWidth && ny >= 0 && ny < this.gridHeight) { this.grid[ny][nx].neighborMines++; } } } } revealNeighbors(x, y) { for (let dy = -1; dy <= 1; dy++) { for (let dx = -1; dx <= 1; dx++) { const nx = x + dx; const ny = y + dy; if (nx >= 0 && nx < this.gridWidth && ny >= 0 && ny < this.gridHeight) { if (!this.grid[ny][nx].revealed && !this.grid[ny][nx].flagged) { this.revealTile(nx, ny); } } } } } gameOver(won) { // Reveal all mines with appropriate color for (let y = 0; y < this.gridHeight; y++) { for (let x = 0; x < this.gridWidth; x++) { const cell = this.grid[y][x]; if (cell.mine) { const tileColor = cell.exploded ? 0xFF0000 : (won ? 0xFFD700 : 0xFF0000); this.tiles[y][x].setFillStyle(tileColor); cell.revealed = true; if (won && !cell.exploded) { cell.flagged = true; this.updateSurroundingNumbers(x, y); } } } } // Disable input this.input.off('gameobjectdown'); // Show game over text if (won) { // Display "Victory" at the top center this.add.text(400, 50, 'Victory!', { fontSize: '48px', fill: '#FFD700', fontFamily: 'Arial' }).setOrigin(0.5); } else { // Display "Game Over" at the top center this.add.text(400, 50, 'Game Over!', { fontSize: '48px', fill: '#FF0000', fontFamily: 'Arial' }).setOrigin(0.5); } } autoFlagMine() { if (this.dogs <= 0) return; // Exit if no dogs available // Get all unflagged mines const unflaggedMines = []; for (let y = 0; y < this.gridHeight; y++) { for (let x = 0; x < this.gridWidth; x++) { const cell = this.grid[y][x]; if (cell.mine && !cell.flagged && !cell.revealed) { unflaggedMines.push({ x, y }); } } } // If there are unflagged mines, randomly flag one if (unflaggedMines.length > 0) { const randomMine = Phaser.Math.RND.pick(unflaggedMines); this.toggleFlag(randomMine.x, randomMine.y); // Decrease dogs counter and update UI this.dogs--; this.autoFlagButtonText.setText(`Dog Sniff: ${this.dogs}`); this.updateAutoFlagButton(); } } updateAutoFlagButton() { if (this.dogs <= 0) { this.autoFlagButton.setFillStyle(0x444444); this.autoFlagButtonText.setStyle({ fill: '#888888' }); this.autoFlagButton.disableInteractive(); } else { this.autoFlagButton.setFillStyle(0x0057B7); this.autoFlagButtonText.setStyle({ fill: '#FFD700' }); this.autoFlagButton.setInteractive(); } } checkWinCondition() { for (let y = 0; y < this.gridHeight; y++) { for (let x = 0; x < this.gridWidth; x++) { const cell = this.grid[y][x]; // If there's an unrevealed safe tile, game isn't won yet if (!cell.mine && !cell.revealed) { return false; } } } return true; } useDrone() { if (!this.gameStarted || this.drones <= 0) return; // Find all unopened safe tiles with no adjacent mines const safeTiles = []; for (let y = 0; y < this.gridHeight; y++) { for (let x = 0; x < this.gridWidth; x++) { const cell = this.grid[y][x]; if (!cell.revealed && !cell.flagged && !cell.mine && cell.neighborMines === 0) { safeTiles.push({ x, y }); } } } // Decrease drone counter and update UI this.drones--; this.flyDroneButtonText.setText(`Fly Drone: ${this.drones}`); this.updateDroneButton(); // If there are safe tiles, reveal one randomly if (safeTiles.length > 0) { const randomTile = Phaser.Math.RND.pick(safeTiles); this.revealTile(randomTile.x, randomTile.y); } } updateDroneButton() { if (this.drones <= 0) { this.flyDroneButton.setFillStyle(0x444444); this.flyDroneButtonText.setStyle({ fill: '#888888' }); this.flyDroneButton.disableInteractive(); } else { this.flyDroneButton.setFillStyle(0x0057B7); this.flyDroneButtonText.setStyle({ fill: '#FFD700' }); this.flyDroneButton.setInteractive(); } } toggleHimarsMode() { if (!this.gameStarted || this.himarsUses <= 0) return; this.himarsMode = !this.himarsMode; // Update button color based on mode if (this.himarsMode) { this.himarsButton.setFillStyle(0xFFA500); // Orange when active } else { this.himarsButton.setFillStyle(0x0057B7); // Blue when inactive // Reset currently hovered tile color if exists if (this.hoveredTile) { const cell = this.grid[this.hoveredTile.gridY][this.hoveredTile.gridX]; if (!cell.revealed && !cell.flagged) { this.hoveredTile.setFillStyle(0x0057B7); } } } } useHimars(centerX, centerY) { if (!this.gameStarted || this.himarsUses <= 0) return; // Process 3x3 area for (let dy = -1; dy <= 1; dy++) { for (let dx = -1; dx <= 1; dx++) { const x = centerX + dx; const y = centerY + dy; if (x >= 0 && x < this.gridWidth && y >= 0 && y < this.gridHeight) { const cell = this.grid[y][x]; if (!cell.revealed && !cell.flagged) { if (cell.mine) { this.toggleFlag(x, y); } else { this.revealTile(x, y); } } } } } // Consume HIMARS use and update UI this.himarsUses--; this.himarsButtonText.setText(`HIMARS: ${this.himarsUses}`); this.updateHimarsButton(); // Turn off HIMARS mode this.himarsMode = false; this.himarsButton.setFillStyle(0x444444); } updateHimarsButton() { if (this.himarsUses <= 0) { this.himarsButton.setFillStyle(0x444444); this.himarsButtonText.setStyle({ fill: '#888888' }); this.himarsButton.disableInteractive(); } else if (!this.himarsMode) { this.himarsButton.setFillStyle(0x0057B7); this.himarsButtonText.setStyle({ fill: '#FFD700' }); this.himarsButton.setInteractive(); } } } const config = { type: Phaser.AUTO, parent: 'renderDiv', scale: { mode: Phaser.Scale.FIT, autoCenter: Phaser.Scale.CENTER_BOTH, }, width: 800, height: 600, scene: Example }; window.phaserGame = new Phaser.Game(config);