Spaces:
Running
Running
File size: 3,383 Bytes
acc6852 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 |
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Hexagon Evolution Game</title>
<style>
body { text-align: center; background-color: #282c34; color: white; }
canvas { background-color: #1e1e1e; }
#timer { font-size: 20px; margin-top: 10px; }
</style>
</head>
<body>
<h1>🌱 Hexagon Evolution Game 🌿</h1>
<div id="timer">Time Left: 5:00</div>
<canvas id="gameCanvas" width="800" height="600"></canvas>
<script>
const canvas = document.getElementById("gameCanvas");
const ctx = canvas.getContext("2d");
const hexSize = 40;
const hexWidth = Math.sqrt(3) * hexSize;
const hexHeight = 2 * hexSize;
const offsetX = hexWidth * 0.75;
const offsetY = hexHeight * 0.5;
const rows = 10;
const cols = 10;
let hexGrid = [];
let timer = 300; // 5 minutes
let phase = 0;
function generateHexGrid() {
for (let row = 0; row < rows; row++) {
for (let col = 0; col < cols; col++) {
let x = col * offsetX;
let y = row * hexHeight + (col % 2 ? offsetY : 0);
hexGrid.push({ x, y, type: "empty", lifeStage: 0 });
}
}
}
function drawHex(x, y, type) {
ctx.beginPath();
for (let i = 0; i < 6; i++) {
let angle = (Math.PI / 3) * i;
let px = x + hexSize * Math.cos(angle);
let py = y + hexSize * Math.sin(angle);
ctx.lineTo(px, py);
}
ctx.closePath();
ctx.fillStyle = getTerrainColor(type);
ctx.fill();
ctx.stroke();
}
function getTerrainColor(type) {
switch (type) {
case "empty": return "#C2B280";
case "seed": return "#FFD700";
case "stem": return "#8B4513";
case "leaf": return "#228B22";
case "bud": return "#FF69B4";
case "flower": return "#FFA500";
default: return "#FFFFFF";
}
}
function evolveGrid() {
hexGrid.forEach(hex => {
if (Math.random() < 0.1 && hex.lifeStage < 5) {
hex.lifeStage++;
hex.type = ["empty", "seed", "stem", "leaf", "bud", "flower"][hex.lifeStage];
}
});
}
function renderMap() {
ctx.clearRect(0, 0, canvas.width, canvas.height);
hexGrid.forEach(hex => drawHex(hex.x, hex.y, hex.type));
}
function updateTimer() {
timer--;
document.getElementById("timer").innerText = `Time Left: ${Math.floor(timer / 60)}:${(timer % 60).toString().padStart(2, '0')}`;
if (timer % 15 === 0) {
evolveGrid();
}
renderMap();
if (timer <= 0) {
clearInterval(gameLoop);
alert("Game Over! Score: " + hexGrid.filter(h => h.type === "flower").length);
}
}
generateHexGrid();
renderMap();
let gameLoop = setInterval(updateTimer, 1000);
</script>
</body>
</html>
|