Portal Monster THE ARMAGEDDON's game

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

No:25034

←

Prev Next

→

Portal Monster THE ARMAGEDDON
Developer Dooz studio｜Date and time 23/11/16 10:53:51
Build time 60.041 sec｜Game capacity 3.801KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在のゲームギフトランキング

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

<!DOCTYPE html>
<html>
<head>
    <title>Portal Monster: The Armageddon</title>
</head>
<body>
    <canvas id="portalMonsterCanvas" width="480" height="320"></canvas>

const player = {
                x: canvas.width / 2,
                y: canvas.height - 50,
                width: 50,
                height: 50,
                speed: 6
            };

const monsters = [
                { x: 50, y: 10, width: 30, height: 30, speed: 3 },
                { x: 200, y: 10, width: 30, height: 30, speed: 4 },
                { x: 350, y: 10, width: 30, height: 30, speed: 5 }
            ];

let score = 0;
            let gameover = false;

function drawPlayer() {
                context.fillStyle = "blue";
                context.fillRect(player.x, player.y, player.width, player.height);
            }

function drawMonsters() {
                context.fillStyle = "red";
                monsters.forEach(function (monster) {
                    context.fillRect(monster.x, monster.y, monster.width, monster.height);
                });
            }

function updatePlayerPosition() {
                if (keys.ArrowLeft && player.x > 0) {
                    player.x -= player.speed;
                } else if (keys.ArrowRight && player.x < canvas.width - player.width) {
                    player.x += player.speed;
                }
            }

function updateMonsterPositions() {
                monsters.forEach(function (monster) {
                    monster.y += monster.speed;

if (monster.y > canvas.height) {
                        monster.y = Math.random() * -100;
                        monster.x = Math.random() * (canvas.width - monster.width);
                    }

if (collisionDetection(player, monster)) {
                        gameover = true;
                    }
                });
            }

function drawScore() {
                context.font = "16px Arial";
                context.fillStyle = "black";
                context.fillText("Score: " + score, 10, 20);
            }

function collisionDetection(obj1, obj2) {
                if (
                    obj1.x < obj2.x + obj2.width &&
                    obj1.x + obj1.width > obj2.x &&
                    obj1.y < obj2.y + obj2.height &&
                    obj1.y + obj1.height > obj2.y
                ) {
                    return true;
                } else {
                    return false;
                }
            }

function gameLoop() {
                context.clearRect(0, 0, canvas.width, canvas.height);

drawPlayer();
                drawMonsters();
                drawScore();

updatePlayerPosition();
                updateMonsterPositions();

if (!gameover) {
                    requestAnimationFrame(gameLoop);
                } else {
                    context.font = "30px Arial";
                    context.fillStyle = "red";
                    context.fillText("GAME OVER", canvas.width / 2 - 100, canvas.height / 2);
                }
            }

const keys = {};

window.addEventListener("keydown", function (event) {
                event.preventDefault();
                keys[event.key] = true;
            });
            window.addEventListener("keyup", function (event) {
                event.preventDefault();
                delete keys[event.key];
            });

gameLoop();
        };
    </script>
</body>
</html>