var cvs = document.getElementById("cvs");
var ctx = cvs.getContext("2d");
var img_Bird = document.getElementById("bird");
var img_Back1 = document.getElementById("back1");
var img_Back2 = document.getElementById("back2");
var g = 0.002;
var fly_Power = -0.6;
var background_speed = 3;
var between = 200;
var game_over = false;
var score = 0;
var Bird = function (img, x, y, speed, ctx) {
this.img = img;
this.x = x;
this.y = y;
this.speed = speed;
this.ctx = ctx;
}
Bird.prototype.draw = function () {
this.ctx.drawImage(this.img, this.x, this.y, 48, 42);
}
Bird.prototype.update = function (t) {
this.speed = g * t + this.speed;
this.y += Math.floor(0.5 * g * t * t + this.speed * t);
}
var backGround = function (img1, img2, x, y, speed, ctx) {
this.img1 = img1;
this.img2 = img2;
this.x = x;
this.y = y;
this.speed = speed;
this.ctx = ctx;
}
backGround.prototype.draw = function () {
this.ctx.drawImage(this.img1, this.x, this.y, 1200, 600);
this.ctx.drawImage(this.img2, this.x + 1200, this.y, 1200, 600);
}
backGround.prototype.update = function () {
if (this.x == -1200) {
this.x = 0;
}
this.x = this.x - background_speed;
}
var bucket = function (x, long, ctx) {
this.x = x;
this.long = long;
this.ctx = ctx;
}
bucket.prototype.draw = function () {
ctx.beginPath();
ctx.fillStyle = "#F75000";
ctx.fillRect(this.x, 0, 50, this.long);
ctx.fillRect(this.x - 5, this.long, 60, 10);
ctx.fillRect(this.x - 5, this.long + 10 + between, 60, 10);
ctx.fillRect(this.x, this.long + 10 + between + 10, 50, 600 - (this.long + 10 + between + 10));
ctx.closePath();
ctx.stroke();
}
bucket.prototype.update = function () {
if (this.x == -300) {
this.x = 1200;
this.long = Math.floor(Math.random() * 300 + 50);
}
this.x = this.x - background_speed - 2;
}
bucket.prototype.hit = function (bx, by) {
if ((bx + 48 > this.x - 5 && bx + 48 < this.x + 55 && by < this.long + 10) || (bx + 48 > this.x - 5 && bx + 48 < this.x + 55 && by > this.long + 10 + between)) {
game_over = true;
}
if ((bx > this.x - 5 && bx < this.x + 55 && by < this.long + 10) || (bx > this.x - 5 && bx < this.x + 55 && by > this.long + 10 + between)) {
game_over = true;
}
if ((bx + 48 > this.x - 5 && bx + 48 < this.x + 55 && by + 42 < this.long + 10) || (bx + 48 > this.x - 5 && bx + 48 < this.x + 55 && by + 42 > this.long + 10 + between)) {
game_over = true;
}
if ((bx > this.x - 5 && bx < this.x + 55 && by + 42 < this.long + 10) || (bx > this.x - 5 && bx < this.x + 55 && by + 42 > this.long + 10 + between)) {
game_over = true;
}
}
var defen = function (score) {
ctx.font = '60pxMicrosoftYaHei';
ctx.fillStyle = '#DCDCDC';
ctx.fillText(score, 30, 70);
}
var preTime = Date.now();
var b = new Bird(img_Bird, cvs.width / 5, cvs.height / 8, 0.0003, ctx);
var back = new backGround(img_Back1, img_Back2, 0, 0, background_speed, ctx);
var bucket_one = new bucket(1200, Math.floor(Math.random() * 300 + 50), ctx);
var bucket_two = new bucket(1500, Math.floor(Math.random() * 300 + 50), ctx);
var bucket_three = new bucket(1800, Math.floor(Math.random() * 300 + 50), ctx);
var bucket_four = new bucket(2100, Math.floor(Math.random() * 300 + 50), ctx);
var bucket_five = new bucket(2400, Math.floor(Math.random() * 300 + 50), ctx);
function run() {
var now = Date.now();
dt = now - preTime;
preTime = now;
ctx.clearRect(0, 0, 800, 600);
back.update();
back.draw();
bucket_one.hit(b.x, b.y);
bucket_one.update();
bucket_one.draw();
bucket_two.hit(b.x, b.y);
bucket_two.update();
bucket_two.draw();
bucket_three.hit(b.x, b.y);
bucket_three.update();
bucket_three.draw();
bucket_four.hit(b.x, b.y);
bucket_four.update();
bucket_four.draw();
bucket_five.hit(b.x, b.y);
bucket_five.update();
bucket_five.draw();
b.update(dt);
b.draw();
var flag = false;
if (b.x == bucket_one.x || b.x == bucket_two.x || b.x == bucket_three.x || b.x == bucket_four.x || b.x == bucket_five.x) {
flag = true;
}
if (flag == true) {
score++;
}
flag = false;
defen(score);
if (b.y > 600 || b.y < 0) {
game_over = true;
}
if (game_over == false) {
requestAnimationFrame(run);
} else {
if (score > 100) {
var result = window.confirm("\u4f60\u8d62\u4e86\uff0c\u53bb\u5e7a\u5e7a\u96f6\u70b9\u76ae\u7231\u5403\u76ae\u770b\u770b");
}
else {
var result = window.confirm("GAMEOVER\n是否从新开始");
if (result) {
location.reload();
}
}
}
}
requestAnimationFrame(run);
cvs.addEventListener("click", function () {
b.speed = fly_Power;
});
|
wechat
alipay
