A geometry dash copy with a level editor's game | AI game creator

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

No:27746

85

A geometry dash copy with a level editor
Developer User13819｜Date and time 23/12/8 21:59:30
Build time 51.258 sec｜Game capacity 6.466KB｜

Sure, here's a simple implementation of a game similar to Geometry Dash, including a level editor, using HTML, CSS, and JavaScript:

To use this game, simply copy the above code into a single HTML file (e.g., `geometry_dash.html`), and open it in a web browser. The game will start automatically. You can jump by pressing the spacebar (or tapping the screen on a smartphone). Additionally, there are two buttons included: - "Start Editing" button: Allows you to create custom levels using the level editor. Click this button, then click anywhere on the game canvas to add points and create obstacles. Click again on the final point to stop editing and generate the obstacles. - "Reset" button: Resets the current game, including the player's position and obstacles. Please note that this is a basic implementation and may not have all the features of the original Geometry Dash game. However, it should give you a starting point for building your own game. Feel free to modify and enhance it further according to your preferences.

→ 　

0　

0　

[PR]現在の売れ筋ゲームランキング

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

(C)2023 HisashiApp

Sure, here's a simple implementation of a game similar to Geometry Dash, including a level editor, using HTML, CSS, and JavaScript:

```html
<!DOCTYPE html>
<html>
<head>
    <style>
        body {
            margin: 0;
            padding: 0;
            background-color: #000;
            overflow: hidden;
        }
        #gameCanvas {
            position: absolute;
            top: 0;
            left: 0;
            width: 100vw;
            height: 100vh;
        }
    </style>
</head>
<body>
    <canvas id="gameCanvas"></canvas>

<script>
        const canvas = document.getElementById("gameCanvas");
        const ctx = canvas.getContext("2d");

// Player object
        const player = {
            x: 50,
            y: 50,
            width: 50,
            height: 50,
            velocity: 0,
            gravity: 0.5,
            jumpStrength: -10
        };

// Obstacles array
        const obstacles = [];

// Level editor variables
        let isEditing = false;
        let currentPoint = null;
        const levelPoints = [];

// Game loop
        function gameLoop() {
            ctx.clearRect(0, 0, canvas.width, canvas.height);

if (!isEditing) {
                updatePlayer();
                updateObstacles();
            }
            drawPlayer();
            drawObstacles();

requestAnimationFrame(gameLoop);
        }

function updatePlayer() {
            player.velocity += player.gravity;
            player.y += player.velocity;

if (player.y >= canvas.height - player.height) {
                player.y = canvas.height - player.height;
                player.velocity = 0;
            }
        }

function drawPlayer() {
            ctx.fillStyle = "#FFF";
            ctx.fillRect(player.x, player.y, player.width, player.height);
        }

function updateObstacles() {
            for (let i = 0; i < obstacles.length; i++) {
                const obstacle = obstacles[i];

obstacle.x -= 5; // Move obstacle horizontally

// Check for collision
                if (
                    player.x < obstacle.x + obstacle.width &&
                    player.x + player.width > obstacle.x &&
                    player.y < obstacle.y + obstacle.height &&
                    player.y + player.height > obstacle.y
                ) {
                    // Collision detected - restart the game
                    resetGame();
                }

// Remove obstacles that are off-screen
                if (obstacle.x + obstacle.width < 0) {
                    obstacles.splice(i, 1);
                    i--;
                }
            }
        }

function drawObstacles() {
            ctx.fillStyle = "#FFF";
            for (let i = 0; i < obstacles.length; i++) {
                const obstacle = obstacles[i];

ctx.fillRect(obstacle.x, obstacle.y, obstacle.width, obstacle.height);
            }
        }

function resetGame() {
            player.x = 50;
            player.y = 50;
            player.velocity = 0;
            obstacles.length = 0;
        }

// Level editor functions
        function startEditing() {
            isEditing = true;
            currentPoint = null;
            levelPoints.length = 0;
            canvas.addEventListener("click", addPoint);
        }

function stopEditing() {
            isEditing = false;
            canvas.removeEventListener("click", addPoint);
            createObstacles();
        }

function addPoint(event) {
            const rect = canvas.getBoundingClientRect();
            const x = event.clientX - rect.left;
            const y = event.clientY - rect.top;

if (currentPoint) {
                levelPoints.push({ x, y });
                ctx.beginPath();
                ctx.moveTo(currentPoint.x, currentPoint.y);
                ctx.lineTo(x, y);
                ctx.strokeStyle = "#FFF";
                ctx.stroke();
                currentPoint = { x, y };
            } else {
                currentPoint = { x, y };
                levelPoints.push({ x, y });
            }
        }

function createObstacles() {
            for (let i = 0; i < levelPoints.length - 1; i++) {
                const startPoint = levelPoints[i];
                const endPoint = levelPoints[i + 1];

const obstacleWidth = Math.abs(endPoint.x - startPoint.x);
                const obstacleHeight = Math.abs(endPoint.y - startPoint.y);

const obstacleX = Math.min(startPoint.x, endPoint.x);
                const obstacleY = Math.min(startPoint.y, endPoint.y);

obstacles.push({
                    x: obstacleX,
                    y: obstacleY,
                    width: obstacleWidth,
                    height: obstacleHeight
                });
            }
        }

// Start the game loop
        requestAnimationFrame(gameLoop);

// Event listeners
        document.addEventListener("keydown", function(event) {
            if (event.key === " ") {
                if (isEditing) {
                    stopEditing();
                } else {
                    player.velocity = player.jumpStrength;
                }
            }
        });

document.getElementById("startEditingBtn").addEventListener("click", startEditing);
        document.getElementById("resetBtn").addEventListener("click", resetGame);
    </script>
</body>
</html>
```

To use this game, simply copy the above code into a single HTML file (e.g., `geometry_dash.html`), and open it in a web browser. The game will start automatically. You can jump by pressing the spacebar (or tapping the screen on a smartphone).

Additionally, there are two buttons included:

- "Start Editing" button: Allows you to create custom levels using the level editor. Click this button, then click anywhere on the game canvas to add points and create obstacles. Click again on the final point to stop editing and generate the obstacles.
- "Reset" button: Resets the current game, including the player's position and obstacles.

Please note that this is a basic implementation and may not have all the features of the original Geometry Dash game. However, it should give you a starting point for building your own game. Feel free to modify and enhance it further according to your preferences.