Mystery Game #17
← Back to Games List
// Two Player Grid Movement Game
const canvas = document.getElementById('gameCanvas');
const ctx = canvas.getContext('2d');
const gridSize = 5;
const cols = canvas.width / gridSize;
const rows = canvas.height / gridSize;
const grid = new Array(cols).fill(null)
.map(() => new Array(rows).fill(0));
const player1 = {
x: Math.floor(cols * 0.25),
y: Math.floor(rows / 2),
dx: 1,
dy: 0,
color: '#3498db'
};
const player2 = {
x: Math.floor(cols * 0.75),
y: Math.floor(rows / 2),
dx: -1,
dy: 0,
color: '#e74c3c'
};
let isRunning = true;
let winner = null;
function updatePosition(player) {
player.x += player.dx;
player.y += player.dy;
// Check wall collision
if (player.x < 0 || player.x >= cols ||
player.y < 0 || player.y >= rows) {
return false;
}
// Check trail collision
if (grid[player.x][player.y] !== 0) {
return false;
}
// Mark trail
grid[player.x][player.y] = player.color;
return true;
}
function render() {
ctx.fillStyle = 'black';
ctx.fillRect(0, 0, canvas.width, canvas.height);
// Draw trails
for (let x = 0; x < cols; x++) {
for (let y = 0; y < rows; y++) {
if (grid[x][y] !== 0) {
ctx.fillStyle = grid[x][y];
ctx.fillRect(x * gridSize, y * gridSize,
gridSize - 1, gridSize - 1);
}
}
}
// Draw players
ctx.fillStyle = player1.color;
ctx.fillRect(player1.x * gridSize, player1.y * gridSize,
gridSize - 1, gridSize - 1);
ctx.fillStyle = player2.color;
ctx.fillRect(player2.x * gridSize, player2.y * gridSize,
gridSize - 1, gridSize - 1);
if (!isRunning) {
ctx.fillStyle = 'white';
ctx.font = '40px Arial';
ctx.fillText(winner + ' Wins!',
canvas.width/2 - 80, canvas.height/2);
}
}
document.addEventListener('keydown', (e) => {
switch(e.key) {
// Player 1 controls (WASD)
case 'w':
if (player1.dy === 0) {
player1.dx = 0;
player1.dy = -1;
}
break;
case 's':
if (player1.dy === 0) {
player1.dx = 0;
player1.dy = 1;
}
break;
case 'a':
if (player1.dx === 0) {
player1.dx = -1;
player1.dy = 0;
}
break;
case 'd':
if (player1.dx === 0) {
player1.dx = 1;
player1.dy = 0;
}
break;
// Player 2 controls (Arrow Keys)
case 'ArrowUp':
if (player2.dy === 0) {
player2.dx = 0;
player2.dy = -1;
}
break;
case 'ArrowDown':
if (player2.dy === 0) {
player2.dx = 0;
player2.dy = 1;
}
break;
case 'ArrowLeft':
if (player2.dx === 0) {
player2.dx = -1;
player2.dy = 0;
}
break;
case 'ArrowRight':
if (player2.dx === 0) {
player2.dx = 1;
player2.dy = 0;
}
break;
}
});
# Two Player Grid Movement Game Implementation
import pygame
import numpy as np
from dataclasses import dataclass
from typing import Tuple
@dataclass
class Player:
x: int
y: int
dx: int
dy: int
color: Tuple[int, int, int]
class GridGame:
def __init__(self):
pygame.init()
# Game settings
self.grid_size = 5
self.width = 800
self.height = 600
self.cols = self.width // self.grid_size
self.rows = self.height // self.grid_size
# Initialize display
self.screen = pygame.display.set_mode((self.width, self.height))
pygame.display.set_caption('Grid Game')
self.clock = pygame.time.Clock()
# Game state
self.grid = np.zeros((self.cols, self.rows), dtype=object)
self.is_running = True
self.winner = None
# Create players
self.player1 = Player(
x=int(self.cols * 0.25),
y=self.rows // 2,
dx=1,
dy=0,
color=(52, 152, 219) # #3498db
)
self.player2 = Player(
x=int(self.cols * 0.75),
y=self.rows // 2,
dx=-1,
dy=0,
color=(231, 76, 60) # #e74c3c
)
def update_position(self, player: Player) -> bool:
"""Update player position and check for collisions"""
player.x += player.dx
player.y += player.dy
# Check wall collision
if (player.x < 0 or player.x >= self.cols or
player.y < 0 or player.y >= self.rows):
return False
# Check trail collision
if self.grid[player.x][player.y] is not None:
return False
# Mark trail
self.grid[player.x][player.y] = player.color
return True
def handle_input(self) -> bool:
"""Handle keyboard input"""
for event in pygame.event.get():
if event.type == pygame.QUIT:
return False
if event.type == pygame.KEYDOWN:
# Player 1 controls (WASD)
if event.key == pygame.K_w and self.player1.dy == 0:
self.player1.dx = 0
self.player1.dy = -1
elif event.key == pygame.K_s and self.player1.dy == 0:
self.player1.dx = 0
self.player1.dy = 1
elif event.key == pygame.K_a and self.player1.dx == 0:
self.player1.dx = -1
self.player1.dy = 0
elif event.key == pygame.K_d and self.player1.dx == 0:
self.player1.dx = 1
self.player1.dy = 0
# Player 2 controls (Arrow Keys)
elif event.key == pygame.K_UP and self.player2.dy == 0:
self.player2.dx = 0
self.player2.dy = -1
elif event.key == pygame.K_DOWN and self.player2.dy == 0:
self.player2.dx = 0
self.player2.dy = 1
elif event.key == pygame.K_LEFT and self.player2.dx == 0:
self.player2.dx = -1
self.player2.dy = 0
elif event.key == pygame.K_RIGHT and self.player2.dx == 0:
self.player2.dx = 1
self.player2.dy = 0
return True
def update_game(self):
"""Update game state"""
if not self.is_running:
return
# Update player positions
p1_alive = self.update_position(self.player1)
p2_alive = self.update_position(self.player2)
# Check for winner
if not p1_alive and not p2_alive:
self.winner = "Draw"
self.is_running = False
elif not p1_alive:
self.winner = "Player 2"
self.is_running = False
elif not p2_alive:
self.winner = "Player 1"
self.is_running = False
def draw(self):
"""Draw the game state"""
# Clear screen
self.screen.fill((0, 0, 0)) # Black background
# Draw trails
for x in range(self.cols):
for y in range(self.rows):
if self.grid[x][y] is not None:
pygame.draw.rect(self.screen,
self.grid[x][y],
(x * self.grid_size,
y * self.grid_size,
self.grid_size - 1,
self.grid_size - 1))
# Draw players
pygame.draw.rect(self.screen,
self.player1.color,
(self.player1.x * self.grid_size,
self.player1.y * self.grid_size,
self.grid_size - 1,
self.grid_size - 1))
pygame.draw.rect(self.screen,
self.player2.color,
(self.player2.x * self.grid_size,
self.player2.y * self.grid_size,
self.grid_size - 1,
self.grid_size - 1))
# Draw winner message
if not self.is_running:
font = pygame.font.Font(None, 64)
text = font.render(f'{self.winner} Wins!',
True, (255, 255, 255))
text_rect = text.get_rect(
center=(self.width//2, self.height//2))
self.screen.blit(text, text_rect)
pygame.display.flip()
def run(self):
"""Main game loop"""
running = True
while running:
running = self.handle_input()
self.update_game()
self.draw()
self.clock.tick(10) # Lower FPS for grid movement
pygame.quit()
if __name__ == '__main__':
game = GridGame()
game.run()
Play Game