Added little +1

This commit is contained in:
Thomas Forgione 2018-08-27 10:47:48 +02:00
parent e77fb5eae6
commit 7b1b629151
No known key found for this signature in database
GPG Key ID: 203DAEA747F48F41
4 changed files with 85 additions and 21 deletions

View File

@ -7,6 +7,7 @@ www/js/escalator.js: $(shell find src -name "*.js")
src/utils.js \ src/utils.js \
src/screen.js \ src/screen.js \
src/gui.js \ src/gui.js \
src/sprite.js \
src/collectable.js \ src/collectable.js \
src/scene.js \ src/scene.js \
src/box.js \ src/box.js \

View File

@ -1,21 +1,53 @@
class Collectable { class Collectable extends AnimatedSprite {
constructor(x, y) { constructor(x, y) {
super(Collectable.texture, 14);
this.size = 0.1; this.size = 0.1;
this.width = this.height = this.size;
this.x = x; this.x = x;
this.y = y; this.y = y;
this.collected = false; this.collected = false;
this.maxTimer = 30;
this.frameNumber = 0;
this.maxFrame = 14;
} }
update(time = 0.02) { update(time = 0.02) {
this.frameNumber++; if (!this.collected) {
super.update(time);
if (this.frameNumber >= this.maxFrame) { } else {
this.frameNumber = 0; this.textTimer += time * 50;
} }
} }
collect() {
this.collected = true;
this.textTimer = 0;
}
drawOn(canvas, context) {
if (!this.collected) {
super.drawOn(canvas, context);
} else if (this.textTimer < this.maxTimer) {
this.drawTextOn(canvas, context);
}
}
alphaFromTimer() {
return 1 - this.textTimer / this.maxTimer;
}
drawTextOn(canvas, context) {
context.font = "15px Dimbo";
context.fillStyle = 'rgba(0, 200, 0, ' + this.alphaFromTimer() + ')';
let width = context.measureText("+1").width;
context.fillText("+1",
this.x * canvas.width - width / 2,
(1 - this.y) * canvas.height - this.textTimer
);
}
} }
Collectable.texture = new Image(); Collectable.texture = new Image();

View File

@ -179,7 +179,7 @@ class Scene extends Screen {
|| (collectable.y + collectable.size / 2 <= next.y - next.size / 4)) { || (collectable.y + collectable.size / 2 <= next.y - next.size / 4)) {
} else { } else {
collectable.collected = true; collectable.collect();
this.getCollectable(1); this.getCollectable(1);
} }
} }
@ -230,18 +230,7 @@ class Scene extends Screen {
} }
drawCollectable(object) { drawCollectable(object) {
object.drawOn(this.canvas, this.context);
if (!object.collected) {
let size = object.size * this.width();
this.context.drawImage(
Collectable.texture,
0, 64 * object.frameNumber, 64, 64,
(object.x - object.size / 2) * this.width(),
(1 - object.y) * this.height() - size / 2,
size, size
);
}
} }
drawHighScoreLine() { drawHighScoreLine() {

42
src/sprite.js Normal file
View File

@ -0,0 +1,42 @@
class Sprite {
constructor(spriteSheet) {
this.spriteSheet = spriteSheet;
}
drawOn(canvas, context) {
context.drawImage(
this.spriteSheet,
0, 0, 64, 64,
(this.x - this.width / 2) * canvas.width,
(1 - this.y) * canvas.height - this.height * canvas.width / 2,
this.width,
this.height,
);
}
}
class AnimatedSprite extends Sprite {
constructor(spriteSheet, numberOfFrames) {
super(spriteSheet);
this.numberOfFrames = numberOfFrames;
this.currentFrame = 0;
}
update(time = 0.02) {
this.currentFrame++;
if (this.currentFrame >= this.numberOfFrames) {
this.currentFrame = 0;
}
}
drawOn(canvas, context) {
context.drawImage(
this.spriteSheet,
0, 64 * this.currentFrame, 64, 64,
(this.x - this.width / 2) * canvas.width,
(1 - this.y) * canvas.height - this.height * canvas.width / 2,
this.width * canvas.width,
this.height * canvas.width,
);
}
}