Futureworld: 2025

<!DOCTYPE html>

<head>

<title>Flappy Bird Game</title>

<style>

* { margin: 0; padding: 0; box-sizing: border-box; }

body { background: #70c5ce; overflow: hidden; font-family: sans-serif; }

canvas { display: block; margin: 0 auto; background: #70c5ce; }

#score {

position: absolute;

top: 20px;

left: 20px;

color: white;

font-size: 24px;

font-weight: bold;

}

</style>

</head>

<body>

<div id="score">Score: 0</div>

const canvas = document.getElementById('gameCanvas');

const ctx = canvas.getContext('2d');

let frames = 0;

let score = 0;

const gravity = 0.25;

const gap = 85;

const bird = {

x: 50,

y: 150,

width: 30,

height: 30,

velocity: 0,

draw() {

ctx.fillStyle = 'yellow';

ctx.fillRect(this.x, this.y, this.width, this.height);

update() {

this.velocity += gravity;

this.y += this.velocity;

if (this.y + this.height > canvas.height) {

this.y = canvas.height - this.height;

this.velocity = 0;

}

flap() {

this.velocity = -5;

}

};

const pipes = [];

pipes[0] = {

x: canvas.width,

y: Math.floor(Math.random() * -100)

};

function drawPipes() {

for (let i = 0; i < pipes.length; i++) {

ctx.fillStyle = 'green';

ctx.fillRect(pipes[i].x, pipes[i].y, 50, 200);

ctx.fillRect(pipes[i].x, pipes[i].y + 200 + gap, 50, canvas.height);

}

function updatePipes() {

for (let i = 0; i < pipes.length; i++) {

pipes[i].x--;

// Add new pipe

if (pipes[i].x === 150) {

pipes.push({

x: canvas.width,

y: Math.floor(Math.random() * -100)

});

}

// Increase score

if (pipes[i].x === bird.x) {

score++;

document.getElementById('score').innerText = 'Score: ' + score;

}

// Collision detection

if (

bird.x + bird.width > pipes[i].x &&

bird.x < pipes[i].x + 50 &&

(bird.y < pipes[i].y + 200 || bird.y + bird.height > pipes[i].y + 200 + gap)

) {

alert('Game Over! Your Score: ' + score);

document.location.reload();

}

function draw() {

ctx.clearRect(0, 0, canvas.width, canvas.height);

bird.draw();

drawPipes();

}

function update() {

bird.update();

updatePipes();

}

function loop() {

update();

draw();

frames++;

requestAnimationFrame(loop);

}

document.addEventList

ener('keydown', function(e) {

if (e.code === 'Space') bird.flap();

});

loop();

</script>

</body>

</html>

Home

Bird Game of Garhwa

Game of Our Jharkhand

Www.futureworld333.blogspot.com

Bird Game of Garhwa

Popular posts