Add some minor details to summary screen

src/ui/summary-ui-handler.ts

@@ -4,7 +4,7 @@ import UiHandler from "./uiHandler";
 import * as Utils from "../utils";
 import { PlayerPokemon } from "../pokemon";
 import { Type } from "../data/type";
-import { TextStyle, addTextObject } from "./text";
+import { TextStyle, addTextObject, getTextColor } from "./text";
 import Move, { MoveCategory } from "../data/move";
 import { getPokeballAtlasKey } from "../data/pokeball";
 import { getGenderColor, getGenderSymbol } from "../data/gender";
@@ -30,6 +30,7 @@ export default class SummaryUiHandler extends UiHandler {
 
   private summaryContainer: Phaser.GameObjects.Container;
   private tabSprite: Phaser.GameObjects.Sprite;
+  private shinyOverlay: Phaser.GameObjects.Image;
   private numberText: Phaser.GameObjects.Text;
   private pokemonSprite: Phaser.GameObjects.Sprite;
   private nameText: Phaser.GameObjects.Text;
@@ -81,6 +82,10 @@ export default class SummaryUiHandler extends UiHandler {
     this.tabSprite.setOrigin(1, 1);
     this.summaryContainer.add(this.tabSprite);
 
+    this.shinyOverlay = this.scene.add.image(6, -54, 'summary_overlay_shiny');
+    this.shinyOverlay.setOrigin(0, 1);
+    this.summaryContainer.add(this.shinyOverlay);
+
     this.numberText = addTextObject(this.scene, 17, -150, '000', TextStyle.SUMMARY);
     this.numberText.setOrigin(0, 1);
     this.summaryContainer.add(this.numberText);
@@ -152,7 +157,11 @@ export default class SummaryUiHandler extends UiHandler {
     this.summaryContainer.setVisible(true);
     this.cursor = -1;
 
+    this.shinyOverlay.setVisible(this.pokemon.shiny);
+
     this.numberText.setText(Utils.padInt(this.pokemon.species.speciesId, 3));
+    this.numberText.setColor(getTextColor(!this.pokemon.shiny ? TextStyle.SUMMARY : TextStyle.SUMMARY_GOLD));
+    this.numberText.setShadowColor(getTextColor(!this.pokemon.shiny ? TextStyle.SUMMARY : TextStyle.SUMMARY_GOLD, true));
 
     this.pokemonSprite.play(this.pokemon.getSpriteKey());
     this.pokemon.cry();

src/ui/text.ts

@@ -4,75 +4,45 @@ export enum TextStyle {
   BATTLE_INFO,
   PARTY,
   SUMMARY,
-  SUMMARY_RED
+  SUMMARY_RED,
+  SUMMARY_GOLD
 };
 
 export function addTextObject(scene: Phaser.Scene, x: number, y: number, content: string, style: TextStyle, extraStyleOptions?: Phaser.Types.GameObjects.Text.TextStyle) {
-  let styleOptions: Phaser.Types.GameObjects.Text.TextStyle;
   let shadowColor: string;
   let shadowSize = 6;
 
+  let styleOptions: Phaser.Types.GameObjects.Text.TextStyle = {
+    fontFamily: 'emerald',
+    fontSize: '96px',
+    color: getTextColor(style, false),
+    padding: {
+      bottom: 6
+    }
+  };
+
   switch (style) {
+    case TextStyle.SUMMARY:
+    case TextStyle.SUMMARY_RED:
+    case TextStyle.SUMMARY_GOLD:
+      styleOptions.padding = undefined;
     case TextStyle.WINDOW:
-      styleOptions = {
-        fontFamily: 'emerald',
-        fontSize: '96px',
-        color: '#484848',
-        padding: {
-          bottom: 6
-        }
-      };
-      shadowColor = '#d0d0c8';
-      break;
     case TextStyle.MESSAGE:
-      styleOptions = {
-        fontFamily: 'emerald',
-        fontSize: '96px',
-        color: '#f8f8f8',
-        padding: {
-          bottom: 6
-        }
-      };
-      shadowColor = '#6b5a73';
+      styleOptions.fontSize = '96px';
       break;
     case TextStyle.BATTLE_INFO:
-      styleOptions = {
-        fontFamily: 'emerald',
-        fontSize: '72px',
-        color: '#404040'
-      };
-      shadowColor = '#ded6b5';
+      styleOptions.fontSize = '72px';
+      styleOptions.padding = undefined;
       shadowSize = 4;
       break;
     case TextStyle.PARTY:
-      styleOptions = {
-        fontFamily: 'pkmnems',
-        fontSize: '66px',
-        color: '#f8f8f8',
-        padding: {
-          bottom: 6
-        }
-      };
-      shadowColor = '#707070';
-      break;
-    case TextStyle.SUMMARY:
-      styleOptions = {
-        fontFamily: 'emerald',
-        fontSize: '96px',
-        color: '#ffffff'
-      };
-      shadowColor = '#636363';
-      break;
-    case TextStyle.SUMMARY_RED:
-      styleOptions = {
-        fontFamily: 'emerald',
-        fontSize: '96px',
-        color: '#f89890'
-      };
-      shadowColor = '#984038';
+      styleOptions.fontFamily = 'pkmnems';
+      styleOptions.fontSize = '66px';
       break;
   }
 
+  shadowColor = getTextColor(style, true);
+
   if (extraStyleOptions)
     styleOptions = Object.assign(styleOptions, extraStyleOptions);
 
@@ -82,4 +52,23 @@ export function addTextObject(scene: Phaser.Scene, x: number, y: number, content
   ret.setLineSpacing(5);
 
   return ret;
+}
+
+export function getTextColor(textStyle: TextStyle, shadow?: boolean) {
+  switch (textStyle) {
+    case TextStyle.MESSAGE:
+      return !shadow ? '#f8f8f8' : '#6b5a73';
+    case TextStyle.WINDOW:
+      return !shadow ? '#484848' : '#d0d0c8';
+    case TextStyle.BATTLE_INFO:
+      return !shadow ? '#404040' : '#ded6b5';
+    case TextStyle.PARTY:
+      return !shadow ? '#f8f8f8' : '#707070';
+    case TextStyle.SUMMARY:
+      return !shadow ? '#ffffff' : '#636363';
+    case TextStyle.SUMMARY_RED:
+      return !shadow ? '#f89890' : '#984038';
+    case TextStyle.SUMMARY_GOLD:
+      return !shadow ? '#e8e8a8' : '#a0a060'
+  }
 }