Easiest tower defence's game

Click here for free DL of the app version that can save data.

No:42074

←

Prev Next

→

Easiest tower defence
Developer User18785｜Date and time 24/2/10 12:38:44
Build time 12.684 sec｜Game capacity 4.711KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在の新着人気ランキング

Click here for free DL of the app version that can save data.

<!DOCTYPE html>
<html>
<head>
    <title>Easiest Tower Defense Game</title>
    <style>
        canvas {
            border: 1px solid #000;
        }
    </style>
</head>
<body>
    <canvas id="gameCanvas" width="400" height="400"></canvas>

// Game variables
        let gameRunning = false;
        let gameOver = false;
        let score = 0;

// Tower variables
        const towerWidth = 50;
        const towerHeight = 50;
        let selectedTower = null;

// Enemy variables
        const enemyWidth = 20;
        const enemyHeight = 20;
        const enemySpeed = 1.5;
        let enemies = [];

// Bullet variables
        const bulletRadius = 5;
        const bulletSpeed = 3;
        let bullets = [];

// Player variables
        const playerWidth = 30;
        const playerHeight = 30;

// Mouse coordinates
        let mouseX = 0;
        let mouseY = 0;

// Event listeners
        canvas.addEventListener("mousemove", function(event) {
            mouseX = event.clientX - canvas.offsetLeft;
            mouseY = event.clientY - canvas.offsetTop;
        });

canvas.addEventListener("mousedown", function(event) {
            if (!gameRunning) {
                gameRunning = true;
                startGame();
            } else {
                if (selectedTower !== null) {
                    const x = Math.floor(mouseX / towerWidth) * towerWidth;
                    const y = Math.floor(mouseY / towerHeight) * towerHeight;
                    addTower(x, y);
                    selectedTower = null;
                } else {
                    selectTower();
                }
            }
        });

// Helper functions
        function addEnemy() {
            const enemy = {
                x: 0,
                y: Math.floor(Math.random() * (canvas.height - enemyHeight)),
                width: enemyWidth,
                height: enemyHeight,
                speed: enemySpeed
            };
            enemies.push(enemy);
        }

function addTower(x, y) {
            const tower = {
                x: x,
                y: y,
                width: towerWidth,
                height: towerHeight
            };
            towers.push(tower);
        }

function shootBullet(tower) {
            const bullet = {
                x: tower.x + tower.width / 2,
                y: tower.y + tower.height / 2,
                radius: bulletRadius,
                speed: bulletSpeed
            };
            bullets.push(bullet);
        }

function startGame() {
            setInterval(function() {
                if (!gameOver) {
                    ctx.clearRect(0, 0, canvas.width, canvas.height);

// Update and draw enemies
                    for (let i = 0; i < enemies.length; i++) {
                        const enemy = enemies[i];
                        if (enemy.x > canvas.width) {
                            gameOver = true;
                            break;
                        }

enemy.x += enemy.speed;
                        ctx.fillRect(enemy.x, enemy.y, enemy.width, enemy.height);
                    }

// Update and draw towers
                    for (let i = 0; i < towers.length; i++) {
                        const tower = towers[i];
                        ctx.fillStyle = "green";
                        ctx.fillRect(tower.x, tower.y, tower.width, tower.height);
                    }

// Update and draw bullets
                    for (let i = 0; i < bullets.length; i++) {
                        const bullet = bullets[i];
                        bullet.x += bullet.speed;
                        ctx.beginPath();
                        ctx.arc(bullet.x, bullet.y, bullet.radius, 0, Math.PI * 2);
                        ctx.fillStyle = "red";
                        ctx.fill();
                    }
                }
            }, 10);

setInterval(addEnemy, 2000);
        }
    </script>
</body>
</html>