AI game creator

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

No:17118

107

←

Prev Next

→

Space Invaders
Developer User7570｜Date and time 23/9/22 8:59:03
Build time 22.877 sec｜Game capacity 3.442KB｜

Script

Sure! Here's an example of a simple Space Invaders game implemented as a single HTML file using JavaScript and enclosed in script tags:

This code sets up a simple Space Invaders game where you control a player at the bottom of the screen using the left and right arrow keys. The objective is to avoid colliding with the enemy moving back and forth at the top of the screen. The game ends when a collision occurs, and an alert message is displayed. Please note that this is a basic implementation and doesn't include all features of a full-fledged game. Feel free to modify and enhance it according to your requirements or add more functionalities.

←

Prev　Next

→ 　

Back　

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

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

Sure! Here's an example of a simple Space Invaders game implemented as a single HTML file using JavaScript and enclosed in script tags:

```html
<!DOCTYPE html>
<html>
<head>
    <title>Space Invaders</title>
    <style>
        canvas {
            border: 1px solid black;
            display: block;
            margin: 0 auto;
        }
    </style>
</head>
<body>
<canvas id="gameCanvas" width="480" height="320"></canvas>

// Game variables
    let playerX = canvas.width / 2;
    const playerSize = 32;
    const enemySize = 24;
    let enemyX = (canvas.width - enemySize) / 2;
    let enemyY = 40;
    let enemySpeed = 2;

// Event listeners for player movement
    document.addEventListener("keydown", handleKeyDown);
    document.addEventListener("keyup", handleKeyUp);

let leftPressed = false;
    let rightPressed = false;

function handleKeyDown(event) {
        if (event.key === "ArrowLeft") {
            leftPressed = true;
        } else if (event.key === "ArrowRight") {
            rightPressed = true;
        }
    }

function handleKeyUp(event) {
        if (event.key === "ArrowLeft") {
            leftPressed = false;
        } else if (event.key === "ArrowRight") {
            rightPressed = false;
        }
    }

function drawPlayer() {
        ctx.beginPath();
        ctx.rect(playerX, canvas.height - playerSize - 10, playerSize, playerSize);
        ctx.fillStyle = "blue";
        ctx.fill();
        ctx.closePath();
    }

function drawEnemy() {
        ctx.beginPath();
        ctx.rect(enemyX, enemyY, enemySize, enemySize);
        ctx.fillStyle = "red";
        ctx.fill();
        ctx.closePath();
    }

function updatePlayerPosition() {
        if (leftPressed && playerX > 0) {
            playerX -= 7;
        } else if (rightPressed && playerX < canvas.width - playerSize) {
            playerX += 7;
        }
    }

function updateEnemyPosition() {
        enemyX += enemySpeed;

if (enemyX < 0 || enemyX > canvas.width - enemySize) {
            enemySpeed = -enemySpeed;
            enemyY += 20; // Move enemy down after reaching side edge
        }
    }

function checkCollision() {
        if (playerX < enemyX + enemySize &&
            playerX + playerSize > enemyX &&
            canvas.height - playerSize - 10 < enemyY + enemySize) {
            // Collision detected - end the game
            alert("Game Over!");
            clearInterval(gameLoop);
        }
    }

function draw() {
        ctx.clearRect(0, 0, canvas.width, canvas.height);
        drawPlayer();
        drawEnemy();
        updatePlayerPosition();
        updateEnemyPosition();
        checkCollision();
    }

const gameLoop = setInterval(draw, 10);
</script>
</body>
</html>
```

Please note that this is a basic implementation and doesn't include all features of a full-fledged game. Feel free to modify and enhance it according to your requirements or add more functionalities.