Settings invented, restructuring of graphics folders and enhancements for target point.

js/Gisela.js

@@ -1,10 +1,11 @@
 import RetroAnimation from "./retro/RetroAnimation.js";
 import Movable from "./Movable.js";
+import Setting from "./Setting.js";
 
 export default class Gisela extends Movable
 {
     constructor() {
         const SCALE = 2;
-        super(new RetroAnimation('graphics/gisela-right.png', 1, SCALE, 1));
+        super(new RetroAnimation(Setting.GRAPHICS_LOCATION + 'gisela-right.png', 1, SCALE, 1));
     }
 }

js/MrCroc.js

@@ -1,14 +1,15 @@
 import Movable from "./Movable.js";
 import RetroAnimation from "./retro/RetroAnimation.js";
+import Setting from "./Setting.js";
 
 export default class MrCroc extends Movable
 {
     constructor() {
         const SCALE = 2;
-        super(new RetroAnimation('graphics/mr-croc-walk-right.png', 2, SCALE), 7);
+        super(new RetroAnimation(Setting.GRAPHICS_LOCATION + 'mr-croc-walk-right.png', 2, SCALE), 7);
         this.isJumping = false;
-        this.addAnimation('WALK_RIGHT', new RetroAnimation('graphics/mr-croc-walk-right.png', 2, SCALE, 10));
-        this.addAnimation('WALK_LEFT', new RetroAnimation('graphics/mr-croc-walk-left.png', 2, SCALE, 10));
+        this.addAnimation('WALK_RIGHT', new RetroAnimation(Setting.GRAPHICS_LOCATION + 'mr-croc-walk-right.png', 2, SCALE, 10));
+        this.addAnimation('WALK_LEFT', new RetroAnimation(Setting.GRAPHICS_LOCATION + 'mr-croc-walk-left.png', 2, SCALE, 10));
     }
 
     moveRight(timestamp, delta = 1)

js/module.js

@@ -6,6 +6,7 @@ import RetroArchitecture from "./retro/RetroArchitecture.js";
 import FileLoader from "./FileLoader.js";
 import Camera from "./Camera.js";
 import Gisela from "./Gisela.js";
+import Setting from "./Setting.js";
 
 class ImageLoader
 {
@@ -116,18 +117,6 @@ function MainLoop(timestamp)
         );
     }
 
-    if (!gameFinished && architecture.isMovableInsideTargetPosition(mrCroc)) {
-        gameFinished = true;
-
-        setTimeout(
-            function () {
-                alert('Gisela: "Thanks for showing up, Mr. Croc, but I\'m not in danger."');
-                lastTimestamp = timestamp;
-                lastRendered = timestamp;
-            }, 1000
-        )
-    }
-
     camera.focusPosition(
         mrCroc.position.x - mrCroc.getWidth() * 0.5,
         mrCroc.position.y - mrCroc.getHeight() * 0.5,
@@ -139,7 +128,6 @@ function MainLoop(timestamp)
     if (timestamp - lastRendered >= FRAME_DURATION) {
         context.clearRect(0, 0, window.innerWidth, window.innerHeight);
 
-        // camera.centerCamera(mrCroc.position.x - mrCroc.getWidth() * 0.5, mrCroc.position.y - mrCroc.getHeight() * 0.5);
         architecture.draw(context, camera);
         mrCroc.draw(context, camera);
         gisela.draw(context, camera);
@@ -149,10 +137,21 @@ function MainLoop(timestamp)
 
     lastTimestamp = timestamp;
 
+    if (!gameFinished && mrCroc.isJumping === false && architecture.isMovableInsideTargetPosition(mrCroc)) {
+        gameFinished = true;
+        KeyLeft.pressed = false;
+        KeyRight.pressed = false;
+        KeyJump.pressed = false;
+        lastTimestamp = undefined;
+        lastRendered = undefined;
+
+        alert('Gisela: "Thanks for showing up, Mr. Croc, but I\'m not in danger."');
+    }
+
     window.requestAnimationFrame(MainLoop);
 }
 
-const FPS = 60;
+const FPS = 120;
 const FRAME_DURATION = 1000 / FPS;
 const GAME_SPEED = 1;
 const GRAVITY = 2;
@@ -176,19 +175,19 @@ let KeyJump = new Key('Space');
 let loader = new ImageLoader();
 
 let imgAnimation = new Image();
-imgAnimation.src = 'graphics/mr-croc-walk-right.png';
+imgAnimation.src = Setting.GRAPHICS_LOCATION + 'mr-croc-walk-right.png';
 loader.addImage(imgAnimation);
 
 let imgAnimationB = new Image();
-imgAnimationB.src = 'graphics/mr-croc-walk-left.png';
+imgAnimationB.src = Setting.GRAPHICS_LOCATION + 'mr-croc-walk-left.png';
 loader.addImage(imgAnimationB);
 
 let imgArch = new Image();
-imgArch.src = 'graphics/tileset-landscape01.jpg';
+imgArch.src = Setting.TILESET_LOCATION + 'landscape01.jpg';
 loader.addImage(imgArch);
 
 let imgGisela = new Image();
-imgGisela.src = 'graphics/gisela-right.png';
+imgGisela.src = Setting.GRAPHICS_LOCATION + 'gisela-right.png';
 loader.addImage(imgGisela);
 
 window.addEventListener(

js/retro/RetroArchitecture.js

@@ -19,6 +19,7 @@ export default class RetroArchitecture
         this.startY = 0;
         this.targetX = 0;
         this.targetY = 0;
+        this.targetPosition = new GeometryPoint(this.targetX, this.targetY);
 
         this.init();
     }
@@ -88,7 +89,7 @@ export default class RetroArchitecture
             return null;
         }
 
-        return {x: x, y: y};
+        return new GeometryPoint(x, y);
     }
 
     getCeilingHeight(position)
@@ -118,7 +119,7 @@ export default class RetroArchitecture
             tilePosition.y++;
         }
 
-        return 9999999999;
+        return (this.rows + 10)  * this.tileHeight;
     }
 
     getWallRight(position)
@@ -230,6 +231,7 @@ export default class RetroArchitecture
         architecture.startY = data.startY;
         architecture.targetX = data.targetX;
         architecture.targetY = data.targetY;
+        architecture.targetPosition = new GeometryPoint(data.targetX, data.targetY);
 
         for (let y = 0; y < data.rows; y++) {
             for (let x = 0; x < data.columns; x++) {