mirror of
https://github.com/danbulant/bobek
synced 2026-07-07 12:01:13 +00:00
Get Ready done (menu)
This commit is contained in:
parent
484ddb305c
commit
858339515a
3 changed files with 95 additions and 1 deletions
83
game.js
83
game.js
|
|
@ -0,0 +1,83 @@
|
||||||
|
const scrn = document.getElementById('canvas');
|
||||||
|
const sctx = scrn.getContext("2d");
|
||||||
|
sctx.fillStyle = "#30c0df";
|
||||||
|
let frames = 0;
|
||||||
|
const gnd = {
|
||||||
|
sprite : new Image(),
|
||||||
|
x : 0,
|
||||||
|
y :0,
|
||||||
|
draw : function() {
|
||||||
|
y = parseFloat(scrn.height-this.sprite.height);
|
||||||
|
sctx.drawImage(this.sprite,this.x,y);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
const bg = {
|
||||||
|
sprite : new Image(),
|
||||||
|
x : 0,
|
||||||
|
y :0,
|
||||||
|
draw : function() {
|
||||||
|
y = parseFloat(scrn.height-this.sprite.height);
|
||||||
|
sctx.drawImage(this.sprite,this.x,y);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
const gr = {
|
||||||
|
sprite : new Image(),
|
||||||
|
x : 0,
|
||||||
|
y :0,
|
||||||
|
draw : function() {
|
||||||
|
y = parseFloat(scrn.height-this.sprite.height)/2;
|
||||||
|
x = parseFloat(scrn.width-this.sprite.width)/2;
|
||||||
|
sctx.drawImage(this.sprite,x,y);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
const bird = {
|
||||||
|
animations :
|
||||||
|
[
|
||||||
|
{sprite : new Image()},
|
||||||
|
{sprite : new Image()},
|
||||||
|
{sprite : new Image()},
|
||||||
|
{sprite : new Image()},
|
||||||
|
],
|
||||||
|
x : 13,
|
||||||
|
y :100,
|
||||||
|
frame:0,
|
||||||
|
draw : function() {
|
||||||
|
sctx.drawImage(this.animations[this.frame].sprite,this.x,this.y);
|
||||||
|
}
|
||||||
|
|
||||||
|
};
|
||||||
|
|
||||||
|
gnd.sprite.src="img/ground.png";
|
||||||
|
bg.sprite.src="img/BG.png";
|
||||||
|
gr.sprite.src="img/getready.png";
|
||||||
|
bird.animations[0].sprite.src="img/bird/b0.png";
|
||||||
|
bird.animations[1].sprite.src="img/bird/b1.png";
|
||||||
|
bird.animations[2].sprite.src="img/bird/b2.png";
|
||||||
|
bird.animations[3].sprite.src="img/bird/b0.png";
|
||||||
|
console.log(gnd.sprite);
|
||||||
|
|
||||||
|
gameLoop();
|
||||||
|
|
||||||
|
function gameLoop()
|
||||||
|
{
|
||||||
|
update();
|
||||||
|
draw();
|
||||||
|
frames++;
|
||||||
|
requestAnimationFrame(gameLoop);
|
||||||
|
}
|
||||||
|
|
||||||
|
function update()
|
||||||
|
{
|
||||||
|
bird.frame += (frames%5==0) ? 1 : 0;
|
||||||
|
bird.frame = bird.frame%4;
|
||||||
|
bird.y += (frames%5==0) ? (Math.random()-0.5)*2 : 0;
|
||||||
|
}
|
||||||
|
function draw()
|
||||||
|
{
|
||||||
|
sctx.fillRect(0,0,scrn.width,scrn.height)
|
||||||
|
bg.draw();
|
||||||
|
gnd.draw();
|
||||||
|
bird.draw();
|
||||||
|
gr.draw();
|
||||||
|
}
|
||||||
|
|
||||||
|
|
@ -4,8 +4,10 @@
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
||||||
<title>FlappyBird</title>
|
<title>FlappyBird</title>
|
||||||
|
<link rel="stylesheet" href="style.css" >
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
<canvas id="canvas" width="276" height="414"></canvas>
|
||||||
|
<script src="game.js"></script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
9
style.css
Normal file
9
style.css
Normal file
|
|
@ -0,0 +1,9 @@
|
||||||
|
#canvas
|
||||||
|
{
|
||||||
|
background-color:#30c0df;
|
||||||
|
border: 2px solid black;
|
||||||
|
display: block;
|
||||||
|
margin: auto;
|
||||||
|
padding: auto;
|
||||||
|
|
||||||
|
}
|
||||||
Loading…
Reference in a new issue