Run endless girl

Breaking Changes
1

// Create canvas and engine
const canvas = document.createElement(“canvas”);
document.body.appendChild(canvas);
const engine = new BABYLON.Engine(canvas, true);

// Create scene
const scene = new BABYLON.Scene(engine);

// Add camera
const camera = new BABYLON.ArcRotateCamera(“camera”, Math.PI/2, Math.PI/4, 20, new BABYLON.Vector3(0, 0, 0), scene);
camera.attachControl(canvas, true);

// Add light
const light = new BABYLON.HemisphericLight(“light”, new BABYLON.Vector3(0, 1, 0), scene);

// Add ground
const ground = BABYLON.MeshBuilder.CreateGround(“ground”, {width: 20, height: 200}, scene);

// Add the girl (player)
const girl = BABYLON.MeshBuilder.CreateBox(“girl”, {height: 1, width: 0.5, depth: 0.5}, scene);
girl.position.y = 0.5;
girl.position.z = -5;

// Add the snake (enemy)
const snake = BABYLON.MeshBuilder.CreateBox(“snake”, {height: 0.5, width: 0.5, depth: 0.5}, scene);
snake.position.y = 0.25;
snake.position.z = -15;

// Obstacles
const obstacles = ;
for(let i = 0; i < 10; i++) {
const obs = BABYLON.MeshBuilder.CreateBox(“obs”+i, {height: 1, width: 0.5, depth: 0.5}, scene);
obs.position.y = 0.5;
obs.position.z = -20 - i*15;
obs.position.x = (Math.random() * 8) - 4; // Random left/right
obstacles.push(obs);
}

// Player movement speed
let speed = 0.2;
let jumpSpeed = 0;
let isJumping = false;

// Score
let score = 0;
const scoreDiv = document.createElement(“div”);
scoreDiv.style.position = “absolute”;
scoreDiv.style.top = “10px”;
scoreDiv.style.left = “10px”;
scoreDiv.style.color = “white”;
scoreDiv.style.fontSize = “20px”;
scoreDiv.innerHTML = “Score: 0”;
document.body.appendChild(scoreDiv);

// Endless ground and game loop
scene.registerBeforeRender(function() {
// Move girl forward
girl.position.z += speed;

// Jump logic
if(isJumping) {
    girl.position.y += jumpSpeed;
    jumpSpeed -= 0.02; // gravity
    if(girl.position.y <= 0.5) {
        girl.position.y = 0.5;
        isJumping = false;
    }
}

// Snake follows the girl
if (snake.position.z < girl.position.z - 2) {
    snake.position.z += 0.15;
}

// Check collision with snake
if (Math.abs(girl.position.z - snake.position.z) < 0.5 && Math.abs(girl.position.x - snake.position.x) < 0.5) {
    alert("Snake caught you! Game Over!");
    resetGame();
}

// Check collision with obstacles
for(let obs of obstacles) {
    if(Math.abs(girl.position.z - obs.position.z) < 0.5 && Math.abs(girl.position.x - obs.position.x) < 0.5 && girl.position.y < 1.5) {
        alert("You hit an obstacle! Game Over!");
        resetGame();
    }
    // Reset obstacle for endless effect
    if(obs.position.z > girl.position.z + 10) {
        obs.position.z = girl.position.z - 50;
        obs.position.x = (Math.random() * 8) - 4;
    }
}

// Update score
score += 1;
scoreDiv.innerHTML = "Score: " + score;

// Endless ground effect
if(girl.position.z > 50) {
    girl.position.z = -5;
    snake.position.z = -15;
    for(let i = 0; i < obstacles.length; i++){
        obstacles[i].position.z = -20 - i*15;
        obstacles[i].position.x = (Math.random() * 8) - 4;
    }
}

});

// Controls
window.addEventListener(“keydown”, function(event) {
if(event.key === “ArrowLeft”) girl.position.x -= 0.5;
else if(event.key === “ArrowRight”) girl.position.x += 0.5;
else if(event.key === " ") {
if(!isJumping){
jumpSpeed = 0.4;
isJumping = true;
}
}
});

// Reset game
function resetGame() {
girl.position.z = -5;
girl.position.x = 0;
girl.position.y = 0.5;
snake.position.z = -15;
snake.position.x = 0;
score = 0;
}

// Run render loop
engine.runRenderLoop(function () {
scene.render();
});

2

Welcome aboard!

Can you create a repro in the Playground and quickly explains what’s not working?

It will help people help you!

1 Like