Add party menu options and WiP summary UI

src/battle-scene.ts

@@ -127,8 +127,14 @@ export default class BattleScene extends Phaser.Scene {
 		this.loadAtlas('party_pb', 'ui');
 		this.loadImage('party_message', 'ui');
 		this.loadImage('party_message_large', 'ui');
+		this.loadImage('party_message_options', 'ui');
+		this.loadImage('party_options_top', 'ui');
+		this.loadImage('party_options_center', 'ui');
+		this.loadImage('party_options_bottom', 'ui');
 		this.loadAtlas('party_cancel', 'ui');
 
+		this.loadImage('summary_bg', 'ui');
+
 		// Load arena images
 		Utils.getEnumValues(Biome).map(at => {
 			const atKey = Biome[at].toLowerCase();

src/ui/party-ui-handler.ts

@@ -15,6 +15,11 @@ export default class PartyUiHandler extends MessageUiHandler {
   private partyCancelButton: PartyCancelButton;
   private partyMessageBox: Phaser.GameObjects.Image;
 
+  private optionsMode: boolean;
+  private optionsCursor: integer;
+  private optionsContainer: Phaser.GameObjects.Container;
+  private optionsCursorObj: Phaser.GameObjects.Image;
+  
   private lastCursor: integer = 0;
   private isModal: boolean;
   private selectCallback: Function;
@@ -74,6 +79,9 @@ export default class PartyUiHandler extends MessageUiHandler {
 
     this.partyCancelButton = partyCancelButton;
 
+    this.optionsContainer = this.scene.add.container((this.scene.game.canvas.width / 6) - 1, -1);
+    partyContainer.add(this.optionsContainer);
+
     this.partySlots = [];
   }
 
@@ -112,28 +120,56 @@ export default class PartyUiHandler extends MessageUiHandler {
       return;
     }
 
+    let success = false;
+
+    if (this.optionsMode) {
       if (keyCode === keyCodes.Z) {
-      if (this.cursor < 6) {
+        if (!this.optionsCursor) {
           let filterResult: string = this.selectFilter(this.scene.getParty()[this.cursor]);
           if (filterResult === null) {
+            this.clearOptions();
             if (this.selectCallback) {
               const selectCallback = this.selectCallback;
               this.selectCallback = null;
               selectCallback(this.cursor);
-            return;
             } else if (this.cursor)
               (this.scene.getCurrentPhase() as CommandPhase).handleCommand(Command.POKEMON, this.cursor);
-          else
-            this.processInput(keyCodes.X);
+            return;
           } else {
+            this.clearOptions();
             this.partyMessageBox.setTexture('party_message_large');
             this.message.y -= 15;
             this.showText(filterResult as string, null, () => {
               this.partyMessageBox.setTexture('party_message');
-            this.message.text = defaultMessage;
+              this.message.setText(defaultMessage);
               this.message.y += 15;
             }, null, true);
           }
+        } else if (this.optionsCursor === 1) {
+          this.clearOptions();
+          ui.playSelect();
+          ui.setMode(Mode.SUMMARY);
+        } else
+          this.processInput(keyCodes.X);
+      } else if (keyCode === keyCodes.X) {
+        this.clearOptions();
+        ui.playSelect();
+      }
+      else {
+        switch (keyCode) {
+          case keyCodes.UP:
+            success = this.setCursor(this.optionsCursor ? this.optionsCursor - 1 : 2);
+            break;
+          case keyCodes.DOWN:
+            success = this.setCursor(this.optionsCursor < 2 ? this.optionsCursor + 1 : 0);
+            break;
+        }
+      }
+    } else {
+      if (keyCode === keyCodes.Z) {
+        if (this.cursor < 6) {
+          this.showOptions();
+          ui.playSelect();
         } else if (this.isModal)
           ui.playError();
         else
@@ -155,7 +191,6 @@ export default class PartyUiHandler extends MessageUiHandler {
       }
 
       const slotCount = this.partySlots.length;
-    let success = false;
 
       switch (keyCode) {
         case keyCodes.UP:
@@ -173,29 +208,12 @@ export default class PartyUiHandler extends MessageUiHandler {
             success = this.setCursor(this.lastCursor < 6 ? this.lastCursor || 1 : 1);
           break;
       }
+    }
 
     if (success)
       ui.playSelect();
   }
 
-  setCursor(cursor: integer): boolean {
-    const changed = this.cursor !== cursor;
-    if (changed) {
-      this.lastCursor = this.cursor;
-      this.cursor = cursor;
-      if (this.lastCursor < 6)
-        this.partySlots[this.lastCursor].deselect();
-      else if (this.lastCursor === 6)
-        this.partyCancelButton.deselect();
-      if (cursor < 6)
-        this.partySlots[cursor].select();
-      else if (cursor === 6)
-        this.partyCancelButton.select();
-    }
-
-    return changed;
-  }
-
   populatePartySlots() {
     const party = (this.scene as BattleScene).getParty();
 
@@ -215,6 +233,91 @@ export default class PartyUiHandler extends MessageUiHandler {
     }
   }
   
+  setCursor(cursor: integer): boolean {
+    let changed: boolean;
+    
+    if (this.optionsMode) {
+      changed = this.optionsCursor !== cursor;
+      this.optionsCursor = cursor;
+      if (!this.optionsCursorObj) {
+        this.optionsCursorObj = this.scene.add.image(0, 0, 'cursor');
+        this.optionsCursorObj.setOrigin(0, 0);
+        this.optionsContainer.add(this.optionsCursorObj);
+      }
+      console.log(this.optionsCursor)
+      this.optionsCursorObj.setPosition(-86, -19 - (16 * (2 - this.optionsCursor)));
+    } else {
+      changed = this.cursor !== cursor;
+      if (changed) {
+        this.lastCursor = this.cursor;
+        this.cursor = cursor;
+        if (this.lastCursor < 6)
+          this.partySlots[this.lastCursor].deselect();
+        else if (this.lastCursor === 6)
+          this.partyCancelButton.deselect();
+        if (cursor < 6)
+          this.partySlots[cursor].select();
+        else if (cursor === 6)
+          this.partyCancelButton.select();
+      }
+    }
+
+    return changed;
+  }
+
+  showOptions() {
+    if (this.cursor === 6)
+      return;
+    
+    this.optionsMode = true;
+
+    this.partyMessageBox.setTexture('party_message_options');
+    this.message.setText('Do what with this Pokémon?');
+
+    const optionsBottom = this.scene.add.image(0, 0, 'party_options_bottom');
+    optionsBottom.setOrigin(1, 1);
+    this.optionsContainer.add(optionsBottom);
+
+    const options = [
+      this.isModal ? 'SEND OUT' : 'SHIFT',
+      'SUMMARY',
+      'CANCEL'
+    ];
+
+    for (let o = 0; o < options.length; o++) {
+      const yCoord = -6 - 16 * o;
+      const optionBg = this.scene.add.image(0, yCoord, 'party_options_center');
+      const optionText = addTextObject(this.scene, -79, yCoord - 16, options[options.length - (o + 1)], TextStyle.WINDOW);
+
+      optionBg.setOrigin(1, 1);
+      optionText.setOrigin(0, 0);
+
+      this.optionsContainer.add(optionBg);
+      this.optionsContainer.add(optionText);
+    }
+
+    const optionsTop = this.scene.add.image(0, -6 - 16 * options.length, 'party_options_top');
+    optionsTop.setOrigin(1, 1);
+    this.optionsContainer.add(optionsTop);
+
+    this.setCursor(0);
+  }
+
+  clearOptions() {
+    this.optionsMode = false;
+    this.optionsContainer.removeAll(true);
+    this.eraseOptionsCursor();
+
+    this.partyMessageBox.setTexture('party_message');
+    this.message.setText(defaultMessage);
+  }
+
+  eraseOptionsCursor() {
+    if (this.optionsCursorObj)
+      this.optionsCursorObj.destroy();
+    this.optionsCursorObj = null;
+  }
+
   clear() {
     super.clear();
     this.partyContainer.setVisible(false);

src/ui/summary-ui-handler.ts

@@ -0,0 +1,48 @@
+import BattleScene from "../battle-scene";
+import { Mode } from "./ui";
+import UiHandler from "./uiHandler";
+
+export default class SummaryUiHandler extends UiHandler {
+  private summaryContainer: Phaser.GameObjects.Container;
+
+  constructor(scene: BattleScene) {
+    super(scene, Mode.SUMMARY);
+  }
+
+  setup() {
+    const ui = this.getUi();
+
+    this.summaryContainer = this.scene.add.container(0, 0);
+    this.summaryContainer.setVisible(false);
+    ui.add(this.summaryContainer);
+
+    const summaryBg = this.scene.add.image(0, 0, 'summary_bg');
+    this.summaryContainer.add(summaryBg);
+
+    summaryBg.setOrigin(0, 1);
+  }
+
+  show(args: any[]) {
+    super.show(args);
+
+    this.summaryContainer.setVisible(true);
+  }
+
+  processInput(keyCode: integer) {
+    const ui = this.getUi();
+    const keyCodes = Phaser.Input.Keyboard.KeyCodes;
+  }
+
+  setCursor(cursor: integer): boolean {
+    const changed = this.cursor !== cursor;
+    if (changed) {
+    }
+
+    return changed;
+  }
+
+  clear() {
+    super.clear();
+    this.summaryContainer.setVisible(false);
+  }
+}

src/ui/ui.ts

@@ -8,6 +8,7 @@ import MessageUiHandler from './message-ui-handler';
 import SwitchCheckUiHandler from './switch-check-ui-handler';
 import ModifierSelectUiHandler from './modifier-select-ui-handler';
 import BallUiHandler from './ball-ui-handler';
+import SummaryUiHandler from './summary-ui-handler';
 
 export enum Mode {
   MESSAGE = 0,
@@ -16,7 +17,8 @@ export enum Mode {
   BALL,
   SWITCH_CHECK,
   MODIFIER_SELECT,
-  PARTY
+  PARTY,
+  SUMMARY
 };
 
 export default class UI extends Phaser.GameObjects.Container {
@@ -34,7 +36,8 @@ export default class UI extends Phaser.GameObjects.Container {
       new BallUiHandler(scene),
       new SwitchCheckUiHandler(scene),
       new ModifierSelectUiHandler(scene),
-      new PartyUiHandler(scene)
+      new PartyUiHandler(scene),
+      new SummaryUiHandler(scene)
     ];
   }