diff --git a/Makefile b/Makefile index 5e89098..5f6e195 100644 --- a/Makefile +++ b/Makefile @@ -7,6 +7,7 @@ www/js/escalator.js: $(shell find src -name "*.js") src/utils.js \ src/screen.js \ src/gui.js \ + src/collectable.js \ src/scene.js \ src/box.js \ src/platform.js \ diff --git a/src/collectable.js b/src/collectable.js new file mode 100644 index 0000000..508d6f9 --- /dev/null +++ b/src/collectable.js @@ -0,0 +1,11 @@ +class Collectable { + constructor(x, y) { + this.size = 0.1; + this.x = x; + this.y = y; + this.collected = false; + } +} + +Collectable.texture = new Image(); +Collectable.texture.src = "img/collectable.png"; diff --git a/src/scene.js b/src/scene.js index aa8a123..4485028 100644 --- a/src/scene.js +++ b/src/scene.js @@ -9,6 +9,10 @@ class Scene extends Screen { this.maxHeight = 0; } + if (this.collectableNumber === undefined) { + this.collectableNumber = 0; + } + this.initialize(); this.addEventListener('touchstart', (event) => { @@ -24,11 +28,24 @@ class Scene extends Screen { window.localStorage.setItem("maxHeight", value); } + get collectableNumber() { + return window.localStorage.getItem("collectableNumber"); + } + + set collectableNumber(value) { + window.localStorage.setItem("collectableNumber", value); + } + + getCollectable(i) { + this.collectableNumber = parseInt(this.collectableNumber, 10) + i; + } + initialize() { super.initialize(); this.player.reset(); this.platforms = []; + this.collectables = []; this.cameraHeight = 0; this.cameraSpeed = 0; this.currentHeight = 0; @@ -39,10 +56,10 @@ class Scene extends Screen { this.currentMaxHeight = this.maxHeight; // Generate random initial platforms - for (let i = 0.25; i <= 2; i += 0.33) { - let platform = new Platform(Math.random(), i, 0.2); - this.addPlatform(platform); - } + // for (let i = 0.25; i <= 2; i += 0.33) { + // let platform = new Platform(Math.random(), i, 0.2); + // this.addPlatform(platform); + // } } @@ -81,14 +98,32 @@ class Scene extends Screen { this.status = Status.GameOver; } - // The last platform is the highest. - let last = this.platforms[this.platforms.length - 1]; + while(true) { - // If the last platform is on screen, we need to create the next platform. - if (last.y <= this.cameraHeight + 1) { - let diff = 0.1 + Math.random() * 0.4; - let platform = new Platform(Math.random(), last.y + diff, 0.2); - this.platforms.push(platform); + // The last platform is the highest. + let last = this.platforms[this.platforms.length - 1]; + + // If the last platform is on screen, we need to create the next platform. + if (last === undefined || last.y <= this.cameraHeight + 1) { + + let lastY = last === undefined ? 0 : last.y; + + let diff = 0.1 + Math.random() * 0.4; + let platform = new Platform(Math.random(), lastY + diff, 0.2); + this.platforms.push(platform); + + if (last !== undefined && Math.random() < 0.2) { + + // Create a random coin + let x = Math.random(); + let y = lastY + Math.random(); + + this.collectables.push(new Collectable(x, y)); + } + + } else { + break; + } } // Increase position of the camera @@ -135,6 +170,26 @@ class Scene extends Screen { } } + // Detect collision with collectable + for (let collectable of this.collectables) { + + if (collectable.collected) { + continue; + } + + // Ugly but don't care + // Copied and adapted from sdz + if( (collectable.x >= next.x + next.size / 2) + || (collectable.x + collectable.size <= next.x) + || (collectable.y >= next.y + next.size) + || (collectable.y + collectable.size <= next.y)) { + + } else { + collectable.collected = true; + this.getCollectable(1); + } + } + // Collision with the ground if (this.player.y <= 0) { this.player.collide(0); @@ -162,6 +217,10 @@ class Scene extends Screen { this.drawPlatform(platform); } + for (let collectable of this.collectables) { + this.drawCollectable(collectable); + } + this.drawObject(this.player); this.context.resetTransform(); @@ -173,6 +232,21 @@ class Scene extends Screen { } } + drawCollectable(object) { + + if (!object.collected) { + let size = object.size * this.width(); + + this.context.drawImage( + Collectable.texture, + 0, 0, 64, 64, + (object.x - object.size / 2) * this.width(), + (1 - object.y - object.size / 2) * this.height(), + size, size + ); + } + } + drawHighScoreLine() { if (this.currentMaxHeight <= 0) { return; @@ -232,6 +306,14 @@ class Scene extends Screen { } this.context.fillText(text, 0, 20); + + // Draw coin number + this.context.drawImage(Collectable.texture, + 0, 0, 64, 64, + 0, fontSize + 5, 0.05 * this.width(), 0.05 * this.width()); + + this.context.fillText(this.collectableNumber, 0.05 * this.width() + 5, 2 * fontSize) + if (this.status === Status.Running) { // Draw pause button let box = this.makePauseBox(); diff --git a/www/img/collectable.png b/www/img/collectable.png new file mode 100644 index 0000000..ae34e36 Binary files /dev/null and b/www/img/collectable.png differ