First version of the high score line

src/scene.js

@@ -4,6 +4,11 @@ class Scene extends Screen {
         super(canvas);
         this.player = player;
         this.currentHeight = 0;
+
+        if (this.maxHeight === undefined) {
+            this.maxHeight = 0;
+        }
+
         this.initialize();
 
         this.addEventListener('touchstart', (event) => {
@@ -28,9 +33,8 @@ class Scene extends Screen {
         this.currentHeight = 0;
         this.started = false;
 
-        if (this.maxHeight === undefined) {
-            this.maxHeigth = 0;
-        }
+        // The the line for the high score
+        this.currentMaxHeight = this.maxHeight;
 
         // Generate random initial platforms
         for (let i = 0.25; i <= 2; i += 0.33) {
@@ -147,6 +151,8 @@ class Scene extends Screen {
 
         this.drawBackground();
 
+        this.drawHighScoreLine();
+
         for (let platform of this.platforms) {
             this.drawPlatform(platform);
         }
@@ -158,6 +164,20 @@ class Scene extends Screen {
         this.drawHud();
     }
 
+    drawHighScoreLine() {
+        if (this.currentMaxHeight <= 0) {
+            return;
+        }
+
+        let height = this.height() * (1 - this.currentMaxHeight - this.player.size / 2);
+
+        this.context.strokeStyle = 'rgb(255, 255, 255)';
+        this.context.beginPath();
+        this.context.moveTo(0, height);
+        this.context.lineTo(this.width(), height);
+        this.context.stroke();
+    }
+
     drawObject(object) {
         let size = object.size * this.width();