modules/levelSelection.mjs

@@ -9,8 +9,6 @@ export const selectLevel = (ctx, gameState, id) => {
   // TODO transfer expireFunction without a fail
   // const expireFunc = () => {gameState.timer.expireFunction();};
   gameState.timer.setTime(levelsBlueprint[id].time);
-  gameState.playable = true;
-  gameState.tutorial.hide();
   gameState.playground.draw(ctx, gameState.width, gameState.height);
 }
 

modules/levels.mjs

@@ -66,7 +66,7 @@ const level5Blueprint = {
     [Square.Wall, Square.Wall, Square.Wall, Square.Wall, Square.Wall, Square.Wall, Square.Wall, Square.Wall, Square.Wall, Square.Floor, Square.Box, Square.Floor, Square.Wall, Square.Floor, Square.Wall, Square.Wall, Square.Wall, ],
     [Square.Wall, Square.Destination, Square.Destination, Square.Destination, Square.Destination, Square.Floor, Square.Floor, Square.Wall, Square.Wall, Square.Floor, Square.Box, Square.Floor, Square.Floor, Square.Box, Square.Floor, Square.Floor, Square.Wall, ],
     [Square.Wall, Square.Wall, Square.Destination, Square.Destination, Square.Destination, Square.Floor, Square.Floor, Square.Floor, Square.Floor, Square.Box, Square.Floor, Square.Floor, Square.Box, Square.Floor, Square.Floor, Square.Floor, Square.Wall, ],
-    [Square.Wall, Square.Destination, Square.Destination, Square.Destination, Square.Destination, Square.Floor, Square.Floor, Square.Wall, Square.Wall, Square.Wall, Square.Wall, Square.Wall, Square.Wall, Square.Wall, Square.Wall, Square.Wall, Square.Wall, ],
+    [Square.Wall, Square.Destination, Square.Destination, Square.Destination, Square.Floor, Square.Floor, Square.Wall, Square.Wall, Square.Wall, Square.Wall, Square.Wall, Square.Wall, Square.Wall, Square.Wall, Square.Wall, Square.Wall, Square.Wall, ],
     [Square.Wall, Square.Wall, Square.Wall, Square.Wall, Square.Wall, Square.Wall, Square.Wall, Square.Wall, Square.Wall, Square.Wall, Square.Wall, Square.Wall, Square.Wall, Square.Wall, Square.Wall, Square.Wall, Square.Wall, ],
   ],
   time: 40000

modules/tutorialControler.mjs

@@ -11,21 +11,14 @@ export class TutorialControler {
     self.messageBox = document.getElementById('tutorial-box');
     self.messageId = 0;
     self.messageBox.innerHTML = TutorialControler.messages[self.messageId];
-    self.hide = () => {
-      document.getElementById('tutorial-speech-bubble').style.visibility = "hidden";
-      self.finished = true;
-    }
-  }
-
-  hide() {
-    self.hide();
   }
 
   next() {
     if (!self.finished) {
       self.messageId++;
       if (self.messageId == TutorialControler.messages.length) {
-        self.hide();
+        document.getElementById('tutorial-speech-bubble').style.visibility = "hidden";
+        self.finished = true;
       } else {
         self.messageBox.innerHTML = TutorialControler.messages[self.messageId];
       }
@@ -35,5 +28,4 @@ export class TutorialControler {
   isFinished() {
     return self.finished;
   }
-
 }

script.js

@@ -31,9 +31,10 @@ let gameState = {
     gameState.timer.stop();
   } ),
   levelId: 0,
-  tutorial: new TutorialControler(),
 };
 
+let tutorial = new TutorialControler();
+
 fillLevelsSelection(gameState, ctx);
 window.ctx = ctx
 window.addEventListener("keydown", (event) => {
@@ -65,11 +66,11 @@ window.addEventListener("keydown", (event) => {
         case "ArrowRight":
         case " ":
         case "Enter":
-          gameState.tutorial.next();
-          if (gameState.tutorial.isFinished()) {
-            gameState.playable = true;
-            gameState.timer.start();
-          }
+            tutorial.next();
+            if (tutorial.isFinished()) {
+              gameState.playable = true;
+              gameState.timer.start();
+            }
           break;
         default:
           break;