change format of game meta data (now in gameList)

src/js/globals/globals_control.js

@@ -45,6 +45,14 @@ const debugMode = false;
  */
 const moodle = false;
 
+/**
+ * index of the current game in gameList
+ * Can be: 'squareOne', 'squareTwo' or 'circleOne'.
+ *
+ * @type {string}
+ */
+let gameId;
+
 /**
  * Selected game name.<br>
  * Can be: 'squareOne', 'squareTwo' or 'circleOne'.

src/js/globals/globals_tokens.js

@@ -1,108 +1,197 @@
 const baseUrl = 'src/assets/img/'; // Base directory for media
 
 /**
- * Metadata for all games
- * @type {object}
+ * Information for all the games
+ * @type {Array}
  */
-const metadata = {
-  all: {
-    squareOne: {
-      // game data
-      gameName: 'squareOne',
-      gameMode: ['A', 'B'],
-      gameOperation: ['Plus', 'Minus'],
-      gameDifficulty: 3,
+const gameList = [
+  {
+    gameName: 'squareOne',
+    gameMode: ['A', 'B'],
+    gameOperation: ['Plus', 'Minus'],
+    gameDifficulty: 3,
 
-      // info
-      gameShape: 'square',
+    // info
+    gameShape: 'square',
 
-      // menu icons data
-      gameNameIconName: 'game0',
-      gameModeIconName: ['mode0', 'mode1'],
-      gameOperationIconName: ['operation_plus', 'operation_minus'],
+    assets: {
+      gameNameBtn: 'game0',
+      gameModeBtn: ['mode0', 'mode1'],
+      gameOperationBtn: ['operation_plus', 'operation_minus'],
+      mapCharacterAnimation: (operation) => {
+        return operation === 'plus'
+          ? ['green_tractor', [0, 1, 2, 3, 4], 3]
+          : ['red_tractor', [10, 11, 12, 13, 14], 3];
+      },
+      mapCharacter: (operation) => {
+        let char;
+        if (operation == 'Plus') {
+          char = game.add.sprite(
+            self.points.x[curMapPosition],
+            self.points.y[curMapPosition],
+            'tractor',
+            0,
+            0.75
+          );
+        }
+        if (operation === 'Minus') {
+          char = game.add.sprite(
+            self.points.x[curMapPosition],
+            self.points.y[curMapPosition],
+            'tractor',
+            10,
+            0.75
+          );
+        }
+        char.rotate = -30; // 25 anticlock
+        return char;
+      },
+      mapStart: () => {
+        return game.add
+          .image(self.points.x[0], self.points.y[0], 'garage', 0.6)
+          .anchor(0.5, 1);
+      },
+      mapEnd: () => {
+        return game.add
+          .image(self.points.x[5], self.points.y[5], 'farm', 0.9)
+          .anchor(0.4, 0.7);
+      },
     },
+  },
+  {
+    // game data
+    gameName: 'circleOne',
+    gameMode: ['A', 'B'],
+    gameOperation: ['Plus', 'Minus', 'Mixed'],
+    gameDifficulty: 5,
 
-    circleOne: {
-      // game data
-      gameName: 'circleOne',
-      gameMode: ['A', 'B'],
-      gameOperation: ['Plus', 'Minus', 'Mixed'],
-      gameDifficulty: 5,
-
-      // info
-      gameShape: 'circle',
+    // info
+    gameShape: 'circle',
 
-      // menu icons data
-      gameNameIconName: 'game1',
-      gameModeIconName: ['mode2', 'mode3'],
-      gameOperationIconName: [
+    assets: {
+      gameNameBtn: 'game1',
+      gameModeBtn: ['mode2', 'mode3'],
+      gameOperationBtn: [
         'operation_plus',
         'operation_minus',
         'operation_mixed',
       ],
+      mapCharacterAnimation: () => {
+        ['kid', [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10], 3];
+      },
+      mapCharacter: () => {
+        return game.add.sprite(
+          self.points.x[curMapPosition],
+          self.points.y[curMapPosition],
+          'kid_run',
+          0,
+          0.6
+        );
+      },
+      mapStart: () => {
+        return game.add
+          .image(self.points.x[0], self.points.y[0], 'house', 1.05)
+          .anchor(0.5, 0.8);
+      },
+      mapEnd: () => {
+        return game.add
+          .image(self.points.x[5], self.points.y[5], 'school', 0.525)
+          .anchor(0.2, 0.7);
+      },
     },
+  },
+  {
+    // game data
+    gameName: 'squareTwo',
+    gameMode: ['A', 'B'],
+    gameOperation: ['Equals'],
+    gameDifficulty: 5,
 
-    squareTwo: {
-      // game data
-      gameName: 'squareTwo',
-      gameMode: ['A', 'B'],
-      gameOperation: ['Equals'],
-      gameDifficulty: 5,
-
-      // info
-      gameShape: 'square',
-
-      // menu icon data
-      gameOperationIconName: ['operation_equals'],
-      gameNameIconName: 'game2',
-      gameModeIconName: ['mode4', 'mode5'],
+    // info
+    gameShape: 'square',
+    assets: {
+      gameNameBtn: 'game2',
+      gameModeBtn: ['mode4', 'mode5'],
+      gameOperationBtn: ['operation_equals'],
+      mapCharacterAnimation: () => {
+        ['kid', [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10], 3];
+      },
+      mapCharacter: () => {
+        return game.add.sprite(
+          self.points.x[curMapPosition],
+          self.points.y[curMapPosition],
+          'kid_run',
+          0,
+          0.6
+        );
+      },
+      mapStart: () => {
+        return game.add
+          .image(this.points.x[0], this.points.y[0], 'house', 1.05)
+          .anchor(0.5, 0.8);
+      },
+      mapEnd: () => {
+        return game.add
+          .image(this.points.x[5], this.points.y[5], 'school', 0.525)
+          .anchor(0.2, 0.7);
+      },
     },
+  },
+  {
+    // game data
+    gameName: 'scaleOne',
+    gameMode: ['A'],
+    gameOperation: ['Plus'],
+    gameDifficulty: 1,
 
-    scaleOne: {
-      // game data
-      gameName: 'scaleOne',
-      gameMode: ['A'],
-      gameOperation: ['Plus'],
-      gameDifficulty: 1,
-
-      // info
-      gameShape: 'noShape',
+    // info
+    gameShape: 'noShape',
 
-      // menu icon data
-      gameNameIconName: 'game3',
-      gameModeIconName: ['mode6'],
-      gameOperationIconName: ['operation_plus'],
+    assets: {
+      gameNameBtn: 'game3',
+      gameModeBtn: ['mode6'],
+      gameOperationBtn: ['operation_equals'],
+      mapCharacterAnimation: (operation) => {
+        return operation === 'plus'
+          ? ['green_tractor', [0, 1, 2, 3, 4], 3]
+          : ['red_tractor', [10, 11, 12, 13, 14], 3];
+      },
+      mapCharacter: (operation) => {
+        let char;
+        if (operation == 'Plus') {
+          char = game.add.sprite(
+            self.points.x[curMapPosition],
+            self.points.y[curMapPosition],
+            'tractor',
+            0,
+            0.75
+          );
+        }
+        if (operation === 'Minus') {
+          char = game.add.sprite(
+            self.points.x[curMapPosition],
+            self.points.y[curMapPosition],
+            'tractor',
+            10,
+            0.75
+          );
+        }
+        char.rotate = -30; // 25 anticlock
+        return char;
+      },
+      mapStart: () => {
+        return game.add
+          .image(self.points.x[0], self.points.y[0], 'garage', 0.6)
+          .anchor(0.5, 1);
+      },
+      mapEnd: () => {
+        return game.add
+          .image(self.points.x[5], self.points.y[5], 'farm', 0.9)
+          .anchor(0.4, 0.7);
+      },
     },
   },
-  gameNames: [],
-  // gameModes: [],
-  // gameOperations: [],
-  // gameDifficulties: [],
-
-  gameShapes: [],
-
-  gameNameIconNames: [],
-  // gameModeIconNames: [],
-  // gameOperationIconNames: [],
-};
-
-// Called once when the game starts
-(function () {
-  for (key in metadata.all) {
-    metadata.gameNames.push(metadata.all[key].gameName);
-    // metadata.gameModes.push(metadata.all[key].gameMode);
-    // metadata.gameOperations.push(metadata.all[key].gameOperation);
-    // metadata.gameDifficulties.push(metadata.all[key].gameDifficulty);
-
-    metadata.gameShapes.push(metadata.all[key].gameShape);
-
-    metadata.gameNameIconNames.push(metadata.all[key].gameNameIconName);
-    // metadata.gameModeIconNames.push(metadata.all[key].gameMode);
-    // metadata.gameOperationIconNames.push(
-    //   metadata.all[key].gameOperationIconName
-    // );
-  }
-})();
+];
 
 /**
  * Preset colors for graphic elements.

src/js/menus/menu_custom.js

@@ -45,7 +45,7 @@ const customMenuState = {
       // Loads navigation icons
       navigationIcons.add(true, false, false, true, true, 'menu', false);
 
-      const curGame = metadata.all[gameName];
+      const curGame = gameList.find((game) => game.gameName === gameName);
 
       this.menuIcons = [];
 
@@ -315,8 +315,15 @@ const customMenuState = {
     x = gameFrame().x + offsetW;
     y = gameFrame().y + offsetH / 2;
 
-    for (let i = 0; i < curGame.gameModeIconName.length; i++, y += offsetH) {
-      const icon = game.add.sprite(x, y, curGame.gameModeIconName[i], 0, 1, 1);
+    for (let i = 0; i < curGame.assets.gameModeBtn.length; i++, y += offsetH) {
+      const icon = game.add.sprite(
+        x,
+        y,
+        curGame.assets.gameModeBtn[i],
+        0,
+        1,
+        1
+      );
       icon.anchor(0.5, 0.5);
 
       icon.gameMode = curGame.gameMode[i];
@@ -343,7 +350,7 @@ const customMenuState = {
 
     // Placing math operation icons
     for (let i = 0; i < curGame.gameOperation.length; i++, y += offsetH) {
-      icon = game.add.sprite(x, y, curGame.gameOperationIconName[i], 0, 1, 1);
+      icon = game.add.sprite(x, y, curGame.assets.gameOperationBtn[i], 0, 1, 1);
       icon.anchor(0.5, 0.5);
 
       icon.gameOperation = curGame.gameOperation[i];

src/js/menus/menu_main.js

@@ -56,26 +56,25 @@ const menuState = {
 
       // --------------------------- GAME ICONS
 
+      const menuButtons = gameList.map((game) => game.assets.gameNameBtn);
+
       const offset = game.math.getOffset(
         context.canvas.width,
-        metadata.gameNames.length
+        menuButtons.length
       );
 
-      for (
-        let i = 0, x = offset;
-        i < metadata.gameNames.length;
-        i++, x += offset
-      ) {
+      for (let i = 0, x = offset; i < gameList.length; i++, x += offset) {
         const icon = game.add.image(
           x,
           context.canvas.height / 2 - 70,
-          metadata.gameNameIconNames[i],
+          menuButtons[i],
           1.5
         );
         icon.anchor(0.5, 0.5);
 
-        icon.gameShape = metadata.gameShapes[i];
-        icon.gameName = metadata.gameNames[i];
+        icon.gameId = i;
+        icon.gameShape = gameList[i].gameShape;
+        icon.gameName = gameList[i].gameName;
         icon.iconType = 'game';
 
         this.menuIcons.push(icon);
@@ -199,7 +198,8 @@ const menuState = {
       case 'game':
         gameShape = icon.gameShape;
         gameName = icon.gameName;
-        if (!metadata.gameNames.includes(gameName))
+        gameId = icon.gameId;
+        if (!gameList.find((game) => game.gameName === gameName))
           console.error('Game error: the name of the game is not valid.');
         self.menuIcons = self.lbl_game.name;
         game.state.start('customMenu');

src/js/moodle/studentReport.js

@@ -30,12 +30,7 @@ const studentReport = {
       game.lang.results,
       textStyles.h1_green
     );
-    game.add.image(
-      x - 40,
-      y - 70,
-      metadata.all[gameName].gameNameIconName,
-      0.8
-    );
+    game.add.image(x - 40, y - 70, gameList[gameId].assets.gameNameBtn, 0.8);
 
     // Game info
     text =

src/js/screens/map.js

@@ -186,25 +186,27 @@ const mapState = {
     ).align = 'right';
 
     // Map positions
-    if (gameName == 'squareOne' || gameName == 'scaleOne') {
-      // Garage
-      game.add
-        .image(this.points.x[0], this.points.y[0], 'garage', 0.6)
-        .anchor(0.5, 1);
-      // Farm
-      game.add
-        .image(this.points.x[5], this.points.y[5], 'farm', 0.9)
-        .anchor(0.4, 0.7);
-    } else {
-      // House
-      game.add
-        .image(this.points.x[0], this.points.y[0], 'house', 1.05)
-        .anchor(0.5, 0.8);
-      // School
-      game.add
-        .image(this.points.x[5], this.points.y[5], 'school', 0.525)
-        .anchor(0.2, 0.7);
-    }
+    gameList[gameId].assets.mapStart();
+    gameList[gameId].assets.mapEnd();
+    // if (gameName == 'squareOne' || gameName == 'scaleOne') {
+    //   // Garage
+    //   game.add
+    //     .image(this.points.x[0], this.points.y[0], 'garage', 0.6)
+    //     .anchor(0.5, 1);
+    //   // Farm
+    //   game.add
+    //     .image(this.points.x[5], this.points.y[5], 'farm', 0.9)
+    //     .anchor(0.4, 0.7);
+    // } else {
+    //   // House
+    //   game.add
+    //     .image(this.points.x[0], this.points.y[0], 'house', 1.05)
+    //     .anchor(0.5, 0.8);
+    //   // School
+    //   game.add
+    //     .image(this.points.x[5], this.points.y[5], 'school', 0.525)
+    //     .anchor(0.2, 0.7);
+    // }
 
     // Rocks and bushes
     for (let i in rocks.type) {
@@ -246,39 +248,9 @@ const mapState = {
       );
     }
 
-    // Game Character
-    if (gameName == 'squareOne' || gameName == 'scaleOne') {
-      if (gameOperation == 'Plus') {
-        this.character = game.add.sprite(
-          this.points.x[curMapPosition],
-          this.points.y[curMapPosition],
-          'tractor',
-          0,
-          0.75
-        );
-        this.character.animation = ['green_tractor', [0, 1, 2, 3, 4], 3];
-      } else {
-        this.character = game.add.sprite(
-          this.points.x[curMapPosition],
-          this.points.y[curMapPosition],
-          'tractor',
-          10,
-          0.75
-        );
-        this.character.animation = ['red_tractor', [10, 11, 12, 13, 14], 3];
-      }
-
-      this.character.rotate = -30; // 25 anticlock
-    } else {
-      this.character = game.add.sprite(
-        this.points.x[curMapPosition],
-        this.points.y[curMapPosition],
-        'kid_run',
-        0,
-        0.6
-      );
-      this.character.animation = ['kid', [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10], 3];
-    }
+    this.character = gameList[gameId].assets.mapCharacter(gameOperation);
+    this.character.animation =
+      gameList[gameId].assets.mapCharacterAnimation(gameOperation);
 
     this.character.anchor(0.5, 1);
     game.animation.play(this.character.animation[0]);