A sandbox game with portal gun features were you can place 2 portals to travel between them wasd to move and space to place a portal's game

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

No:13182

←

Prev Next

→

A sandbox game with portal gun features were you c..ALL
Developer unknown｜Date and time 23/8/27 7:28:56
Build time 16.974 sec｜Game capacity 4.18KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在の人気グッズランキング

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

<html>
<head>
    <style>
        body {
            margin: 0;
            overflow: hidden;
        }
        
        #game {
            width: 100vw;
            height: 100vh;
        }
        
        #player {
            position: absolute;
            width: 50px;
            height: 50px;
            background-color: red;
        }
    </style>
</head>
<body>
    <canvas id="game"></canvas>
    <script>
        var canvas = document.getElementById("game");
        var ctx = canvas.getContext("2d");
        
        var portalGun = {
            portals: [],
            portalColors: ["#FF0000", "#0000FF"],
            currentPortal: 0
        };
        
        var player = {
            x: 50,
            y: 50,
            dx: 0,
            dy: 0,
            speed: 5
        };
        
        function drawPlayer() {
            ctx.fillStyle = "red";
            ctx.fillRect(player.x, player.y, player.width, player.height);
        }
        
        function drawPortals() {
            portalGun.portals.forEach(function(portal) {
                ctx.fillStyle = portalGun.portalColors[portal.color];
                ctx.fillRect(portal.x, portal.y, portal.width, portal.height);
            });
        }
        
        function updatePlayer() {
            player.x += player.dx;
            player.y += player.dy;
        }
        
        function handleKeyboardInput(e) {
            var keyCode = e.keyCode;
            
            if (keyCode === 87) {
                // W key
                player.dy = -player.speed;
            } else if (keyCode === 83) {
                // S key
                player.dy = player.speed;
            } else if (keyCode === 65) {
                // A key
                player.dx = -player.speed;
            } else if (keyCode === 68) {
                // D key
                player.dx = player.speed;
            } else if (keyCode === 32) {
                // SPACE key
                placePortal();
            }
        }
        
        function handleKeyUp(e) {
            var keyCode = e.keyCode;
            
            if (keyCode === 87 || keyCode === 83) {
                // W or S key
                player.dy = 0;
            } else if (keyCode === 65 || keyCode === 68) {
                // A or D key
                player.dx = 0;
            }
        }
        
        function placePortal() {
            var portalSize = 20;
            if (portalGun.portals.length === 2) {
                portalGun.portals.shift();
            }
            
            var portal = {
                x: player.x + 15,
                y: player.y + 15,
                width: portalSize,
                height: portalSize,
                color: portalGun.currentPortal
            };
            
            portalGun.portals.push(portal);
            portalGun.currentPortal = (portalGun.currentPortal + 1) % 2;
        }
        
        function updatePortals() {
            portalGun.portals.forEach(function(portal) {
                if (player.x + player.width > portal.x && player.x < portal.x + portal.width &&
                    player.y + player.height > portal.y && player.y < portal.y + portal.height) {
                    // Player has entered the portal, teleport player
                    player.x = Math.random() * (canvas.width - player.width);
                    player.y = Math.random() * (canvas.height - player.height);
                }
            });
        }
        
        function gameLoop() {
            ctx.clearRect(0, 0, canvas.width, canvas.height);
            
            updatePlayer();
            updatePortals();
            
            drawPlayer();
            drawPortals();
            
            requestAnimationFrame(gameLoop);
        }
        
        // Set canvas dimensions
        canvas.width = window.innerWidth;
        canvas.height = window.innerHeight;
        
        // Event listeners
        document.addEventListener("keydown", handleKeyboardInput);
        document.addEventListener("keyup", handleKeyUp);
        
        // Start the game loop
        gameLoop();
    </script>
</body>
</html>