Added several features and moved some strings

- Moved sign strings to default.js
- Textboxes are fixed to scene and center text
- Pause function added (press escape)
- Chests now be assigned textboxes individually
- Added source button to titlescreen

package-lock.json

@@ -290,9 +290,9 @@
       }
     },
     "asdf-games": {
-      "version": "1.0.14",
-      "resolved": "https://registry.npmjs.org/asdf-games/-/asdf-games-1.0.14.tgz",
-      "integrity": "sha512-0CCsgxfPjJL5BI7a8CYw49Y14rslG1BIsg20gnaf8Hi0SOaXJ61mZXf6Q96l9h5OhDaOLsv9e/yAMY9P0vq3IQ=="
+      "version": "1.0.15",
+      "resolved": "https://registry.npmjs.org/asdf-games/-/asdf-games-1.0.15.tgz",
+      "integrity": "sha512-wq3hDDkVGCbQ8CnQVh0IjzXNMG/mXwSQPJDx87pNg0Zw5k93sim6iD2NPpXfur/PZOR48spNXsQQOQeTvMYf1w=="
     },
     "astral-regex": {
       "version": "1.0.0",

package.json

@@ -37,7 +37,7 @@
   ],
   "license": "ISC",
   "dependencies": {
-    "asdf-games": "^1.0.14"
+    "asdf-games": "^1.0.15"
   },
   "devDependencies": {
     "cross-env": "^7.0.2",

res/lang/default.js

@@ -4,7 +4,7 @@ module.exports = {
       "Press Space to Start!",
       "Press T for the tutorial",
       "Press Q to quit",
-      //"Press G to see the game's code"
+      "Press S to go to the source code"
     ]
   },
   tutorial: [
@@ -19,14 +19,18 @@ module.exports = {
     dead: "You died!",
     instruction: "Press space to return to title"
   },
-  logoScreen: [
-    "Made by JoVo and McArn"
-  ],
   game: {
     lives: "Lives",
     stamina: "Stamina",
     keyFind: "You found a key!",
-    keyMissing: "You do not have the key for this door!"
+    keyMissing: "You do not have the key for this door!",
+    lifeBoost: "You found some health replenishing food!",
+    signs: {
+      "2-2": "Many secrets to the left",
+      "2-6": "Impressive, you're good.",
+      "3-1": "Climb the ladder and walk two tiles to the left",
+      "3-4": "Congrats."
+    }
   },
   credits: {
     credits: "Credits:",

src/entities/chest.js

@@ -8,9 +8,6 @@ const sounds = {
   obtain: new Sound(__dirname + "/../../res/sounds/obtain.wav", { volume: 0.1 })
 };
 
-const TextBox = require(__dirname + "/../helpers/textbox.js");
-const text = require(__dirname + "/../../res/lang/default.js");
-
 const Pointer = require("./pointer.js");
 
 const state = {
@@ -70,8 +67,7 @@ class Chest extends TileSprite {
         if (this.state == state.closed) {
           this.state = state.open;
           this.pressed = true;
-          this.action();          
-          this.level.entities.add(new TextBox({x: this.pos.x, y: this.pos.y - 10}, text.game.keyFind, 2.5));
+          this.action();
           sounds.obtain.play();
         } else {
           if (!sounds.forbidden.playing && !this.pressed) {

src/entities/portal.js

@@ -97,15 +97,13 @@ class Portal extends TileSprite {
           this.pointer.anims.play("white");
           if (this.keys.action) {
             this.action();
-            console.warn("action");
           }
         } else {
           // No key or not the correct key
           this.pointer.anims.play("red");
           if (this.keys.action) {
             if (!sounds.forbidden.playing && !this.pressed) {
-              console.log(this.player);
-              this.level.entities.add(new TextBox({x: this.player.pos.x - Math.pow(this.player.pos.x, 160 / 177) - 25, y: this.player.pos.y > 160 ? this.player.pos.y - 160 : 0}, text.game.keyMissing, 2.5));
+              this.level.textbox.add(new TextBox(text.game.keyMissing));
               sounds.forbidden.play();
               this.pressed = true;
             }

src/entities/sign.js

@@ -48,9 +48,8 @@ class Sign extends TileSprite {
       this.pointer.anims.play("white");
 
       if (this.keys.action) {
-        const box = new TextBox({x: this.player.pos.x - Math.pow(this.player.pos.x, 160 / 177) - 25, y: this.player.pos.y > 160 ? this.player.pos.y - 160 : 0}, this.string, 2.5);
-        console.log(box);
-        this.level.entities.add(box);
+        const box = new TextBox(this.string);
+        this.level.textbox.add(box);
       }
 
     } else {

src/helpers/level.js

@@ -16,7 +16,7 @@ const Sign = require("../entities/sign.js");
 // };
 
 class Level extends TileMap {
-  constructor (level, keys, player) {   
+  constructor (level, keys, player, game) {   
     // Convert id array to tile array
     var levelTiles = level.tiles.map(function(e) {
       return { x: (tiles[e].x / tileSize), y: (tiles[e].y / tileSize), walkable: tiles[e].walkable };
@@ -31,6 +31,7 @@ class Level extends TileMap {
     this.h = level.size.h;
     this.keys = keys;
     this.player = player;
+    this.game = game;
 
     this.gameComplete = false;
 
@@ -44,7 +45,7 @@ class Level extends TileMap {
         e.entity = new Mage({ x: e.pos.x / 1, y: e.pos.y / 1 }, this.player, this);
         break;
       case "Chest":
-        e.entity = new Chest({ x: e.pos.x / 1, y: e.pos.y / 1 }, this.player, this.keys, this, () => { return e.action(this.player); });
+        e.entity = new Chest({ x: e.pos.x / 1, y: e.pos.y / 1 }, this.player, this.keys, this, () => { return e.action(this.player, this); });
         break;
       case "Portal":
         e.entity = new Portal({ x: e.pos.x / 1, y: e.pos.y / 1 }, this.player, this.keys, this, e.texture, () => { return e.action(this.player, this); }, e.key);
@@ -59,6 +60,9 @@ class Level extends TileMap {
     this.entities = new Container();
     this.children.push(this.entities);
 
+    this.textbox = new Container();
+    this.game.add(this.textbox);
+
     // sounds.bg.play();
 
   }

src/helpers/textbox.js

@@ -5,9 +5,9 @@ const { Container, Text, Rect } = asdf;
 const fillStyle = {fill: "#ffffff", font: "16px Minecraft"};
 
 class TextBox extends Container {
-  constructor(pos, string, lifespan) {
+  constructor(string, lifespan = 2.5) {
     super();
-    this.pos = pos !== undefined ? pos : { x: 0, y: 0 };
+    this.pos = { x: 0, y: 0 };
     this.string = string;
     this.lifespan = lifespan;
     
@@ -16,10 +16,13 @@ class TextBox extends Container {
     this.add(background);
 
     const text = new Text(string, fillStyle);
-    text.pos = { x: this.pos.x + 8, y: this.pos.y + 18 };
+    var letters = string.split("");
+    // 10px is the average letter width
+    text.pos = {
+      x: (640 / 2) - ((letters.length * 10) / 2),
+      y: 16
+    };
     this.add(text);
-
-    console.log(this);
   }
 
   update(dt) {

src/index.js

@@ -14,7 +14,7 @@ const
 
 const window = { w: 640, h: 320 };
 
-const game = new Game(window.w, window.h, true);
+var game = new Game(window.w, window.h, true);
 ipcRenderer.send("resize", window);
 
 const keys = new KeyControls();
@@ -41,8 +41,12 @@ function credits() {
 
 game.scene = new Logo(game, titleScreen);
 
-game.run();
-
+game.run(() => {
+  if (keys.escape) {
+    toggleMenu();
+    keys.reset();
+  }
+});
 
 /* *********************************************************
   Settings behavior
@@ -52,6 +56,7 @@ game.run();
 function toggleMenu() {
   const menuRef = document.getElementById("menu");
   menuRef.style.display = menuRef.style.display === "block" ?  "none" : "block";
+  game.paused = game.paused ? false : true;
 }
 
 const elements = [...document.querySelectorAll("#settings, #resume")];

src/levels/0-2.js

@@ -1,5 +1,8 @@
 const tileSize = 32;
 
+const text = require(__dirname + "/../../res/lang/default.js");
+const TextBox = require(__dirname + "/../helpers/textbox.js");
+
 let level = {
   tiles: [
     1, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 6,
@@ -38,7 +41,8 @@ let level = {
     {
       type: "Chest",
       pos: { x: 7 * tileSize, y: 2 * tileSize },
-      action: (player) => { 
+      action: (player, level) => { 
+        level.textbox.add(new TextBox(text.game.keyFind));
         player.items.keys.push("3-4");
       }
     },

src/levels/1-1.js

@@ -1,5 +1,8 @@
 const tileSize = 32;
 
+const text = require(__dirname + "/../../res/lang/default.js");
+const TextBox = require(__dirname + "/../helpers/textbox.js");
+
 let level = {
   tiles: [
     1, 2, 2, 5, 6,
@@ -21,7 +24,8 @@ let level = {
     { 
       type: "Chest", 
       pos: { x: 2 * tileSize, y: 2 * tileSize }, 
-      action: (player) => { 
+      action: (player, level) => { 
+        level.textbox.add(new TextBox(text.game.keyFind));
         player.items.keys.push("1-1_1"); 
       } 
     },

src/levels/1-3.js

@@ -1,5 +1,8 @@
 const tileSize = 32;
 
+const text = require(__dirname + "/../../res/lang/default.js");
+const TextBox = require(__dirname + "/../helpers/textbox.js");
+
 let level = {
   tiles: [
     1, 2, 2, 2, 2, 2, 2, 2, 5, 6,
@@ -38,7 +41,8 @@ let level = {
     { 
       type: "Chest", 
       pos: { x: 4.5 * tileSize, y: 17 * tileSize }, 
-      action: (player) => { 
+      action: (player, level) => { 
+        level.textbox.add(new TextBox(text.game.keyFind));
         player.items.keys.push("1-4"); 
       } 
     },

src/levels/2-2.js

@@ -1,5 +1,8 @@
 const tileSize = 32;
 
+const text = require(__dirname + "/../../res/lang/default.js");
+const TextBox = require(__dirname + "/../helpers/textbox.js");
+
 let level = {
   tiles: [
     1, 52, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 5, 6,
@@ -27,6 +30,14 @@ let level = {
       }, 
       key: "1-4"
     },
+    {
+      type: "Chest",
+      pos: { x: 1 * tileSize, y: 2 * tileSize },
+      action: (player, level) => { 
+        level.textbox.add(new TextBox(text.game.lifeBoost));
+        player.lives = 5;
+      }
+    },
     { 
       type: "Portal", 
       pos: { x: 4 * tileSize, y: 1 * tileSize }, 
@@ -75,7 +86,7 @@ let level = {
     {
       type: "Sign",
       pos: { x: 14 * tileSize, y: tileSize },
-      text: "Many secret to the left"
+      text: text.game.signs["2-2"]
     }
   ]
 };

src/levels/2-3.js

@@ -1,5 +1,8 @@
 const tileSize = 32;
 
+const text = require(__dirname + "/../../res/lang/default.js");
+const TextBox = require(__dirname + "/../helpers/textbox.js");
+
 let level = {
   tiles: [
     1, 2, 5, 2, 5, 2, 5, 2, 5, 6,
@@ -34,7 +37,8 @@ let level = {
     {
       type: "Chest",
       pos: { x: 1 * tileSize, y: 2 * tileSize },
-      action: (player) => { 
+      action: (player, level) => { 
+        level.textbox.add(new TextBox(text.game.keyFind));
         player.items.keys.push("3-1");
       }
     },

src/levels/2-4.js

@@ -1,5 +1,8 @@
 const tileSize = 32;
 
+const text = require(__dirname + "/../../res/lang/default.js");
+const TextBox = require(__dirname + "/../helpers/textbox.js");
+
 let level = {
   tiles: [
     1, 2, 5, 2, 5, 2, 5, 2, 5, 6,
@@ -30,7 +33,8 @@ let level = {
     {
       type: "Chest",
       pos: { x: 1 * tileSize, y: 2 * tileSize },
-      action: (player) => { 
+      action: (player, level) => { 
+        level.textbox.add(new TextBox(text.game.keyFind));
         player.items.keys.push("2-3");
       }
     },

src/levels/2-6.js

@@ -1,5 +1,7 @@
 const tileSize = 32;
 
+const text = require(__dirname + "/../../res/lang/default.js");
+
 let level = {
   tiles: [
     1, 2, 2, 2, 2, 2, 2, 2, 6,
@@ -42,7 +44,7 @@ let level = {
     {
       type: "Sign",
       pos: { x: 3 * tileSize, y: tileSize },
-      text: "Impressive, you're good."
+      text: text.game.signs["2-6"]
     }
   ]
 };

src/levels/3-1.js

@@ -1,5 +1,7 @@
 const tileSize = 32;
 
+const text = require(__dirname + "/../../res/lang/default.js");
+
 let level = {
   tiles: [
     0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 52, 2, 2, 2, 2, 2, 2, 2, 2, 2, 5, 6,
@@ -43,7 +45,7 @@ let level = {
     {
       type: "Sign",
       pos: { x: 25 * tileSize, y: tileSize },
-      text: "Climb the ladder and walk two tiles to the left"
+      text: text.game.signs["3-1"]
     },
     {
       type: "Portal",

src/levels/3-3.js

@@ -1,5 +1,8 @@
 const tileSize = 32;
 
+const text = require(__dirname + "/../../res/lang/default.js");
+const TextBox = require(__dirname + "/../helpers/textbox.js");
+
 let level = {
   tiles: [
     1, 2, 5, 2, 5, 2, 5, 2, 5, 6,
@@ -34,7 +37,8 @@ let level = {
     {
       type: "Chest",
       pos: { x: 8 * tileSize, y: 2 * tileSize },
-      action: (player) => { 
+      action: (player, level) => { 
+        level.textbox.add(new TextBox(text.game.keyFind));
         player.items.keys.push("2-6");
       }
     },

src/levels/3-4.js

@@ -1,5 +1,7 @@
 const tileSize = 32;
 
+const text = require(__dirname + "/../../res/lang/default.js");
+
 let level = {
   tiles: [
     1, 2, 2, 2, 2, 2, 2, 2, 6,
@@ -42,7 +44,7 @@ let level = {
     {
       type: "Sign",
       pos: { x: 3 * tileSize, y: tileSize },
-      text: "Congrats."
+      text: text.game.signs["3-4"]
     }
   ]
 };

src/screens/game.js

@@ -13,6 +13,7 @@ class GameScreen extends Container {
     super();
 
     this.game = game;
+    this.scene = this;
     this.window = window;
     this.keys = keys;
     this.onGameOver = onGameOver;
@@ -23,7 +24,7 @@ class GameScreen extends Container {
     // Initialise first level 1-1.js at startPosition 0
     var player = new Player(keys, window);
 
-    var level = new Level(require(__dirname + "/../levels/2-2.js"), keys, player);
+    var level = new Level(require(__dirname + "/../levels/2-2.js"), keys, player, this);
     player.pos.x = level.startPos[0].x / 1;
     player.pos.y = level.startPos[0].y / 1;
     player.level = level;
@@ -43,7 +44,7 @@ class GameScreen extends Container {
   }
 
   switchLevel(module, pos = 0) {
-    var { camera, player, level, stats, keys } = this;
+    var { scene, camera, player, level, stats, keys } = this;
 
     camera.map(function(e) {
       camera.remove(e);
@@ -54,7 +55,7 @@ class GameScreen extends Container {
         var p = new Player(keys, window);
         player = p;
 
-        e = new Level(module, keys, player);
+        e = new Level(module, keys, player, scene);
         level = e;
 
         player.pos.x = level.startPos[pos].x / 1;

src/screens/title.js

@@ -11,6 +11,7 @@ const textures = {
   space: new Texture("../res/images/keys/space.png"),
   t: new Texture("../res/images/keys/t.png"),
   q: new Texture("../res/images/keys/q.png"),
+  s: new Texture("../res/images/keys/s.png"),
   logo: new Texture("../res/images/logo.png")
 };
 
@@ -35,7 +36,8 @@ class Title extends Container {
     this.keyCaps = [
       new TileSprite(textures.space, 64, 16),
       new TileSprite(textures.t, 16, 16),
-      new TileSprite(textures.q, 16, 16)
+      new TileSprite(textures.q, 16, 16),
+      new TileSprite(textures.s, 16, 16)
     ];
 
     this.keyCaps.forEach(element => {
@@ -43,10 +45,9 @@ class Title extends Container {
       element.anims = new AnimManager(element);
       element.anims.add("press", [0, 1].map(y => ({ x: 0, y })), 0.50);
       element.anims.play("press");
-      console.log(element);
     });
 
-    const textPos = { x: 220, y: 240 };
+    const textPos = { x: 160, y: 210 };
     for (let index = 0; index < text.titleScreen.instructions.length; index++) {
       const keyCap = this.keyCaps[index];
       if (index == 0) {
@@ -87,9 +88,10 @@ class Title extends Container {
       this.onQuit();
     }
 
-    // Open gitea on key g
-    if (this.keys.key(71)) {
+    // Open source code on key s
+    if (this.keys.key(83)) {
       shell.openExternal("https://gitea.arnweb.nl/Hecc-inc./caa-game");
+      this.keys.reset();
     }
 
   }