refactor end screen

src/js/globals/globals_tokens.js

@@ -56,10 +56,20 @@ const gameList = [
           .image(self.points.x[5], self.points.y[5], 'farm', 0.9)
           .anchor(0.4, 0.7);
       },
+      endCharacterAnimation: () =>
+        animation === 'Plus'
+          ? ['move', [0, 1, 2, 3, 4], 4]
+          : ['move', [10, 11, 12, 13, 14], 4],
+      endCharacter: (operation) => {
+        const char = game.add.sprite(0, 490, 'tractor', 0, 0.7);
+        char.anchor(0.5, 0.5);
+        if (operation === 'Plus') char.curFrame = 10;
+        return char;
+      },
+      endBuilding: () => game.add.image(650, 260, 'farm', 1.1),
     },
   },
   {
-    // game data
     gameName: 'circleOne',
     gameMode: ['A', 'B'],
     gameOperation: ['Plus', 'Minus', 'Mixed'],
@@ -76,10 +86,10 @@ const gameList = [
         'operation_minus',
         'operation_mixed',
       ],
-      mapCharacterAnimation: (operation) => {
+      mapCharacterAnimation: () => {
         return ['kid', [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10], 3];
       },
-      mapCharacter: (operation) => {
+      mapCharacter: () => {
         return game.add.sprite(
           self.points.x[curMapPosition],
           self.points.y[curMapPosition],
@@ -98,6 +108,17 @@ const gameList = [
           .image(self.points.x[5], self.points.y[5], 'school', 0.525)
           .anchor(0.2, 0.7);
       },
+      endCharacterAnimation: [
+        'move',
+        [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11],
+        3,
+      ],
+      endCharacter: () => {
+        const char = game.add.sprite(0, -152, 'kid_run', 0, 0.7);
+        char.anchor(0.5, 0.5);
+        return char;
+      },
+      endBuilding: () => game.add.image(600, 222, 'school', 0.7),
     },
   },
   {
@@ -135,6 +156,17 @@ const gameList = [
           .image(self.points.x[5], self.points.y[5], 'school', 0.525)
           .anchor(0.2, 0.7);
       },
+      endCharacterAnimation: [
+        'move',
+        [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11],
+        3,
+      ],
+      endCharacter: () => {
+        const char = game.add.sprite(0, 460, 'kid_run', 6, 0.7);
+        char.anchor(0.5, 0.5);
+        return char;
+      },
+      endBuilding: () => game.add.image(600, 222, 'school', 0.7),
     },
   },
   {

src/js/screens/end.js

@@ -38,7 +38,8 @@ const endState = {
       0,
       colors.greenNeon,
       0.5
-    ); // Progress
+    );
+    // Progress
     game.add.geom.rect(661, 11, 149, 34, colors.blue, 3, undefined, 1); // Box
     game.add.text(820, 38, '100%', textStyles.h2_blueDark).align = 'left';
     game.add.text(
@@ -50,63 +51,21 @@ const endState = {
 
     game.add.image(360, 545, 'tree4', 0.7).anchor(0, 1);
 
-    // Level character
-    switch (gameName) {
-      case 'circleOne':
-        this.preAnimate = true;
-        this.animate = false;
-
-        // School
-        game.add.image(600, 222, 'school', 0.7);
-
-        // Kid
-        this.character = game.add.sprite(0, -152, 'kid_run', 0, 0.7);
-        this.character.anchor(0.5, 0.5);
-        this.character.animation = [
-          'move',
-          [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11],
-          3,
-        ];
-
-        // Balloon
-        this.balloon = game.add.image(0, -260, 'balloon');
-        this.balloon.anchor(0.5, 0.5);
-
-        this.basket = game.add.image(0, -150, 'balloon_basket');
-        this.basket.anchor(0.5, 0.5);
-
-        break;
-
-      case 'squareTwo':
-        // School
-        game.add.image(600, 222, 'school', 0.7);
-
-        // Kid
-        this.character = game.add.sprite(0, 460, 'kid_run', 6, 0.7);
-        this.character.anchor(0.5, 0.5);
-        this.character.animation = [
-          'move',
-          [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11],
-          3,
-        ];
-
-        break;
-
-      case 'squareOne':
-        // Farm
-        game.add.image(650, 260, 'farm', 1.1);
-
-        // Tractor
-        this.character = game.add.sprite(0, 490, 'tractor', 0, 0.7);
-        this.character.anchor(0.5, 0.5);
-        if (gameOperation == 'Plus') {
-          this.character.animation = ['move', [0, 1, 2, 3, 4], 4];
-        } else {
-          this.character.curFrame = 10;
-          this.character.animation = ['move', [10, 11, 12, 13, 14], 4];
-        }
+    gameList[gameId].assets.endBuilding();
+
+    this.character = gameList[gameId].assets.endCharacter();
+    this.character.animation = gameList[gameId].assets.endCharacterAnimation();
+
+    if (gameName === 'circleOne') {
+      this.preAnimate = true;
+      this.animate = false;
+
+      // Balloon
+      this.balloon = game.add.image(0, -260, 'balloon');
+      this.balloon.anchor(0.5, 0.5);
 
-        break;
+      this.basket = game.add.image(0, -150, 'balloon_basket');
+      this.basket.anchor(0.5, 0.5);
     }
 
     if (this.animate) game.animation.play(this.character.animation[0]);