Space Invaders with the Mario invincibility star for all devices's game

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

No:17127

103

←

Prev Next

→

Space Invaders with the Mario invincibility star f..ALL
Developer User7570｜Date and time 23/9/22 9:06:29
Build time 45.093 sec｜Game capacity 7.765KB｜

Script

Sure, here's a simple implementation of Space Invaders with the Mario invincibility star using JavaScript in a single HTML file:

Save the code above to a file with the extension `.html` and open it in any web browser. You can control the player using the left and right arrow keys to move and the spacebar to shoot. The objective is to shoot down all the enemies without getting hit. If you collect any stars, you will become invincible for a few seconds. Good luck and have fun playing Space Invaders: Mario Edition!

←

Prev　Next

→ 　

Back　

[PR]現在の人気ゲームランキング

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

Sure, here's a simple implementation of Space Invaders with the Mario invincibility star using JavaScript in a single HTML file:

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

// Player variables
        var playerWidth = 64;
        var playerHeight = 64;
        var playerSpeed = 5;

// Enemy variables
        var enemyWidth = 32;
        var enemyHeight = 32;
        var enemySpeed = 2;

// Bullet variables
        var bulletWidth = 8;
        var bulletHeight = 16;
        var bulletSpeed = 8;
        var allowFire = true;

// Star variables
        var starWidth = 32;
        var starHeight = 32;
        var starSpeed = 2;

// Key variables
        var rightPressed = false;
        var leftPressed = false;
        var spacePressed = false;

// Initialize game
        function init() {
            canvas = document.getElementById('gameCanvas');
            ctx = canvas.getContext('2d');

player = {
                x: canvas.width / 2 - playerWidth / 2,
                y: canvas.height - playerHeight - 10,
                invincible: false
            };

// Create 5 enemies
            for (var i = 0; i < 5; i++) {
                enemies.push({
                    x: i * 100 + 30,
                    y: 30
                });
            }

// Create stars
             for (var i = 0; i < 3; i++) {
                stars.push({
                    x: Math.random() * (canvas.width - starWidth),
                    y: Math.random() * (canvas.height - 150),
                    visible: Math.random() > 0.5 ? true : false
                });
            }

document.addEventListener('keydown', keyDownHandler, false);
            document.addEventListener('keyup', keyUpHandler, false);

setInterval(draw, 10);
        }

// Handle key down event
        function keyDownHandler(e) {
            if (e.keyCode === 39) {
                rightPressed = true;
            } else if (e.keyCode === 37) {
                leftPressed = true;
            } else if (e.keyCode === 32) {
                if (allowFire) {
                    bullet = {
                        x: player.x + playerWidth / 2 - bulletWidth / 2,
                        y: player.y,
                        visible: true
                    };
                    allowFire = false;
                    setTimeout(function() {
                        allowFire = true;
                    }, 500);
                }
                spacePressed = true;
            }
        }

// Handle key up event
        function keyUpHandler(e) {
            if (e.keyCode === 39) {
                rightPressed = false;
            } else if (e.keyCode === 37) {
                leftPressed = false;
            } else if (e.keyCode === 32) {
                spacePressed = false;
            }
        }

// Detect collision between two rectangles
        function detectCollision(rect1, rect2) {
            return (
                rect1.x < rect2.x + rect2.width &&
                rect1.x + rect1.width > rect2.x &&
                rect1.y < rect2.y + rect2.height &&
                rect1.y + rect1.height > rect2.y
            );
        }

// Update game state
        function update() {
            // Move player
            if (rightPressed && player.x < canvas.width - playerWidth) {
                player.x += playerSpeed;
            }
            if (leftPressed && player.x > 0) {
                player.x -= playerSpeed;
            }

// Move bullet
            if (bullet) {
                bullet.y -= bulletSpeed;
                if (bullet.y < -bulletHeight) {
                    bullet = null;
                }
            }

// Move enemies
            enemies.forEach(function(enemy) {
                enemy.y += enemySpeed;

// Check if enemy hits the player
                if (!player.invincible && detectCollision(enemy, player)) {
                    alert('Game Over!');
                    document.location.reload();
                }

// Check if bullet hit the enemy
                if (bullet && detectCollision(enemy, bullet)) {
                    enemy.visible = false;
                    bullet = null;
                }

// Check if enemy goes out of bounds
                if (enemy.y > canvas.height) {
                    enemy.y = -enemyHeight;
                    enemy.x = Math.random() * (canvas.width - enemyWidth);
                }
            });

// Move stars
            stars.forEach(function(star) {
                star.y += starSpeed;

// Check if star hits the player
                if (detectCollision(star, player)) {
                    player.invincible = true;
                    setTimeout(function() {
                        player.invincible = false;
                    }, 5000);
                    star.visible = false;
                }

// Check if star goes out of bounds
                if (star.y > canvas.height) {
                    star.y = -starHeight;
                    star.x = Math.random() * (canvas.width - starWidth);
                    star.visible = Math.random() > 0.5 ? true : false;
                }
            });
        }

// Render game objects
        function render() {
            ctx.clearRect(0, 0, canvas.width, canvas.height);

// Draw player
            ctx.beginPath();
            ctx.rect(player.x, player.y, playerWidth, playerHeight);
            ctx.fillStyle = player.invincible ? 'yellow' : 'blue';
            ctx.fill();
            ctx.closePath();

// Draw enemies
            enemies.forEach(function(enemy) {
                if (enemy.visible) {
                    ctx.beginPath();
                    ctx.rect(enemy.x, enemy.y, enemyWidth, enemyHeight);
                    ctx.fillStyle = 'red';
                    ctx.fill();
                    ctx.closePath();
                }
            });

// Draw bullet
            if (bullet && bullet.visible) {
                ctx.beginPath();
                ctx.rect(bullet.x, bullet.y, bulletWidth, bulletHeight);
                ctx.fillStyle = 'black';
                ctx.fill();
                ctx.closePath();
            }

// Draw stars
            stars.forEach(function(star) {
                if (star.visible) {
                    ctx.beginPath();
                    ctx.rect(star.x, star.y, starWidth, starHeight);
                    ctx.fillStyle = 'yellow';
                    ctx.fill();
                    ctx.closePath();
                }
            });
        }

// Main game loop
        function draw() {
            update();
            render();
        }

// Start the game
        init();
    </script>
</body>
</html>
```