[Misc] Admin panel unlink accounts

src/loading-scene.ts

@@ -165,6 +165,8 @@ export class LoadingScene extends SceneBase {
     this.loadImage("discord", "ui");
     this.loadImage("google", "ui");
     this.loadImage("settings_icon", "ui");
+    this.loadImage("link_icon", "ui");
+    this.loadImage("unlink_icon", "ui");
 
     this.loadImage("default_bg", "arenas");
     // Load arena images

src/ui/form-modal-ui-handler.ts

@@ -5,7 +5,6 @@ import { TextStyle, addTextInputObject, addTextObject } from "./text";
 import { WindowVariant, addWindow } from "./ui-theme";
 import InputText from "phaser3-rex-plugins/plugins/inputtext";
 import * as Utils from "../utils";
-import i18next from "i18next";
 import { Button } from "#enums/buttons";
 
 export interface FormModalConfig extends ModalConfig {
@@ -19,19 +18,26 @@ export abstract class FormModalUiHandler extends ModalUiHandler {
   protected errorMessage: Phaser.GameObjects.Text;
   protected submitAction: Function | null;
   protected tween: Phaser.Tweens.Tween;
+  protected formLabels: Phaser.GameObjects.Text[];
 
   constructor(scene: BattleScene, mode: Mode | null = null) {
     super(scene, mode);
 
     this.editing = false;
     this.inputContainers = [];
     this.inputs = [];
+    this.formLabels = [];
   }
 
-  abstract getFields(): string[];
+  /**
+   * Get configuration for all fields that should be part of the modal
+   * Gets used by {@linkcode updateFields} to add the proper text inputs and labels to the view
+   * @returns array of {@linkcode InputFieldConfig}
+   */
+  abstract getInputFieldConfigs(): InputFieldConfig[];
 
   getHeight(config?: ModalConfig): number {
-    return 20 * this.getFields().length + (this.getModalTitle() ? 26 : 0) + ((config as FormModalConfig)?.errorMessage ? 12 : 0) + this.getButtonTopMargin() + 28;
+    return 20 * this.getInputFieldConfigs().length + (this.getModalTitle() ? 26 : 0) + ((config as FormModalConfig)?.errorMessage ? 12 : 0) + this.getButtonTopMargin() + 28;
   }
 
   getReadableErrorMessage(error: string): string {
@@ -45,37 +51,50 @@ export abstract class FormModalUiHandler extends ModalUiHandler {
   setup(): void {
     super.setup();
 
-    const fields = this.getFields();
+    const config = this.getInputFieldConfigs();
 
     const hasTitle = !!this.getModalTitle();
 
-    fields.forEach((field, f) => {
-      const label = addTextObject(this.scene, 10, (hasTitle ? 31 : 5) + 20 * f, field, TextStyle.TOOLTIP_CONTENT);
+    if (config.length >= 1) {
+      this.updateFields(config, hasTitle);
+    }
+
+    this.errorMessage = addTextObject(this.scene, 10, (hasTitle ? 31 : 5) + 20 * (config.length - 1) + 16 + this.getButtonTopMargin(), "", TextStyle.TOOLTIP_CONTENT);
+    this.errorMessage.setColor(this.getTextColor(TextStyle.SUMMARY_PINK));
+    this.errorMessage.setShadowColor(this.getTextColor(TextStyle.SUMMARY_PINK, true));
+    this.errorMessage.setVisible(false);
+    this.modalContainer.add(this.errorMessage);
+  }
+
+  protected updateFields(fieldsConfig: InputFieldConfig[], hasTitle: boolean) {
+    this.inputContainers = [];
+    this.inputs = [];
+    this.formLabels = [];
+    fieldsConfig.forEach((config, f) => {
+      const label = addTextObject(this.scene, 10, (hasTitle ? 31 : 5) + 20 * f, config.label, TextStyle.TOOLTIP_CONTENT);
+      label.name = "formLabel" + f;
 
-      this.modalContainer.add(label);
+      this.formLabels.push(label);
+      this.modalContainer.add(this.formLabels[this.formLabels.length - 1]);
 
       const inputContainer = this.scene.add.container(70, (hasTitle ? 28 : 2) + 20 * f);
       inputContainer.setVisible(false);
 
       const inputBg = addWindow(this.scene, 0, 0, 80, 16, false, false, 0, 0, WindowVariant.XTHIN);
 
-      const isPassword = field.includes(i18next.t("menu:password")) || field.includes(i18next.t("menu:confirmPassword"));
-      const input = addTextInputObject(this.scene, 4, -2, 440, 116, TextStyle.TOOLTIP_CONTENT, { type: isPassword ? "password" : "text", maxLength: isPassword ? 64 : 20 });
+      const isPassword = config?.isPassword;
+      const isReadOnly = config?.isReadOnly;
+      const input = addTextInputObject(this.scene, 4, -2, 440, 116, TextStyle.TOOLTIP_CONTENT, { type: isPassword ? "password" : "text", maxLength: isPassword ? 64 : 20, readOnly: isReadOnly });
       input.setOrigin(0, 0);
 
       inputContainer.add(inputBg);
       inputContainer.add(input);
-      this.modalContainer.add(inputContainer);
 
       this.inputContainers.push(inputContainer);
+      this.modalContainer.add(inputContainer);
+
       this.inputs.push(input);
     });
-
-    this.errorMessage = addTextObject(this.scene, 10, (hasTitle ? 31 : 5) + 20 * (fields.length - 1) + 16 + this.getButtonTopMargin(), "", TextStyle.TOOLTIP_CONTENT);
-    this.errorMessage.setColor(this.getTextColor(TextStyle.SUMMARY_PINK));
-    this.errorMessage.setShadowColor(this.getTextColor(TextStyle.SUMMARY_PINK, true));
-    this.errorMessage.setVisible(false);
-    this.modalContainer.add(this.errorMessage);
   }
 
   show(args: any[]): boolean {
@@ -149,3 +168,9 @@ export abstract class FormModalUiHandler extends ModalUiHandler {
     }
   }
 }
+
+export interface InputFieldConfig {
+  label: string,
+  isPassword?: boolean,
+  isReadOnly?: boolean
+}

src/ui/login-form-ui-handler.ts

@@ -1,4 +1,4 @@
-import { FormModalUiHandler } from "./form-modal-ui-handler";
+import { FormModalUiHandler, InputFieldConfig } from "./form-modal-ui-handler";
 import { ModalConfig } from "./modal-ui-handler";
 import * as Utils from "../utils";
 import { Mode } from "./ui";
@@ -17,9 +17,9 @@ interface BuildInteractableImageOpts {
 
 export default class LoginFormUiHandler extends FormModalUiHandler {
   private readonly ERR_USERNAME: string = "invalid username";
-  private readonly ERR_PASSWORD: string =  "invalid password";
-  private readonly ERR_ACCOUNT_EXIST: string =  "account doesn't exist";
-  private readonly ERR_PASSWORD_MATCH: string =  "password doesn't match";
+  private readonly ERR_PASSWORD: string = "invalid password";
+  private readonly ERR_ACCOUNT_EXIST: string = "account doesn't exist";
+  private readonly ERR_PASSWORD_MATCH: string = "password doesn't match";
   private readonly ERR_NO_SAVES: string = "No save files found";
   private readonly ERR_TOO_MANY_SAVES: string = "Too many save files found";
 
@@ -75,10 +75,6 @@ export default class LoginFormUiHandler extends FormModalUiHandler {
     return i18next.t("menu:login");
   }
 
-  override getFields(_config?: ModalConfig): string[] {
-    return [ i18next.t("menu:username"), i18next.t("menu:password") ];
-  }
-
   override getWidth(_config?: ModalConfig): number {
     return 160;
   }
@@ -106,14 +102,21 @@ export default class LoginFormUiHandler extends FormModalUiHandler {
       case this.ERR_PASSWORD_MATCH:
         return i18next.t("menu:unmatchingPassword");
       case this.ERR_NO_SAVES:
-        return i18next.t("menu:noSaves");
+        return "P01: " + i18next.t("menu:noSaves");
       case this.ERR_TOO_MANY_SAVES:
-        return i18next.t("menu:tooManySaves");
+        return "P02: " + i18next.t("menu:tooManySaves");
     }
 
     return super.getReadableErrorMessage(error);
   }
 
+  override getInputFieldConfigs(): InputFieldConfig[] {
+    const inputFieldConfigs: InputFieldConfig[] = [];
+    inputFieldConfigs.push({ label: i18next.t("menu:username") });
+    inputFieldConfigs.push({ label: i18next.t("menu:password"), isPassword: true });
+    return inputFieldConfigs;
+  }
+
   override show(args: any[]): boolean {
     if (super.show(args)) {
 
@@ -164,7 +167,7 @@ export default class LoginFormUiHandler extends FormModalUiHandler {
     [ this.discordImage, this.googleImage, this.usernameInfoImage ].forEach((img) => img.off("pointerdown"));
   }
 
-  private processExternalProvider(config: ModalConfig) : void {
+  private processExternalProvider(config: ModalConfig): void {
     this.externalPartyTitle.setText(i18next.t("menu:orUse") ?? "");
     this.externalPartyTitle.setX(20 + this.externalPartyTitle.text.length);
     this.externalPartyTitle.setVisible(true);

src/ui/menu-ui-handler.ts

@@ -13,6 +13,7 @@ import { GameDataType } from "#enums/game-data-type";
 import BgmBar from "#app/ui/bgm-bar";
 import AwaitableUiHandler from "./awaitable-ui-handler";
 import { SelectModifierPhase } from "#app/phases/select-modifier-phase";
+import { AdminMode, getAdminModeName } from "./admin-ui-handler";
 
 enum MenuOptions {
   GAME_SETTINGS,
@@ -387,16 +388,41 @@ export default class MenuUiHandler extends MessageUiHandler {
       communityOptions.push({
         label: "Admin",
         handler: () => {
-          ui.playSelect();
-          ui.setOverlayMode(Mode.ADMIN, {
-            buttonActions: [
-              () => {
-                ui.revertMode();
-              },
-              () => {
-                ui.revertMode();
+
+          const skippedAdminModes: AdminMode[] = [ AdminMode.ADMIN ]; // this is here so that we can skip the menu populating enums that aren't meant for the menu, such as the AdminMode.ADMIN
+          const options: OptionSelectItem[] = [];
+          Object.values(AdminMode).filter((v) => !isNaN(Number(v)) && !skippedAdminModes.includes(v as AdminMode)).forEach((mode) => { // this gets all the enums in a way we can use
+            options.push({
+              label: getAdminModeName(mode as AdminMode),
+              handler: () => {
+                ui.playSelect();
+                ui.setOverlayMode(Mode.ADMIN, {
+                  buttonActions: [
+                  // we double revert here and below to go back 2 layers of menus
+                    () => {
+                      ui.revertMode();
+                      ui.revertMode();
+                    },
+                    () => {
+                      ui.revertMode();
+                      ui.revertMode();
+                    }
+                  ]
+                }, mode); // mode is our AdminMode enum
+                return true;
               }
-            ]
+            });
+          });
+          options.push({
+            label: "Cancel",
+            handler: () => {
+              ui.revertMode();
+              return true;
+            }
+          });
+          this.scene.ui.setOverlayMode(Mode.OPTION_SELECT, {
+            options: options,
+            delay: 0
           });
           return true;
         },

src/ui/modal-ui-handler.ts

@@ -15,12 +15,14 @@ export abstract class ModalUiHandler extends UiHandler {
   protected titleText: Phaser.GameObjects.Text;
   protected buttonContainers: Phaser.GameObjects.Container[];
   protected buttonBgs: Phaser.GameObjects.NineSlice[];
+  protected buttonLabels: Phaser.GameObjects.Text[];
 
   constructor(scene: BattleScene, mode: Mode | null = null) {
     super(scene, mode);
 
     this.buttonContainers = [];
     this.buttonBgs = [];
+    this.buttonLabels = [];
   }
 
   abstract getModalTitle(config?: ModalConfig): string;
@@ -75,6 +77,7 @@ export abstract class ModalUiHandler extends UiHandler {
 
     const buttonContainer = this.scene.add.container(0, buttonTopMargin);
 
+    this.buttonLabels.push(buttonLabel);
     this.buttonBgs.push(buttonBg);
     this.buttonContainers.push(buttonContainer);
 

src/ui/registration-form-ui-handler.ts

@@ -1,4 +1,4 @@
-import { FormModalUiHandler } from "./form-modal-ui-handler";
+import { FormModalUiHandler, InputFieldConfig } from "./form-modal-ui-handler";
 import { ModalConfig } from "./modal-ui-handler";
 import * as Utils from "../utils";
 import { Mode } from "./ui";
@@ -24,10 +24,6 @@ export default class RegistrationFormUiHandler extends FormModalUiHandler {
     return i18next.t("menu:register");
   }
 
-  getFields(config?: ModalConfig): string[] {
-    return [ i18next.t("menu:username"), i18next.t("menu:password"), i18next.t("menu:confirmPassword") ];
-  }
-
   getWidth(config?: ModalConfig): number {
     return 160;
   }
@@ -61,6 +57,14 @@ export default class RegistrationFormUiHandler extends FormModalUiHandler {
     return super.getReadableErrorMessage(error);
   }
 
+  override getInputFieldConfigs(): InputFieldConfig[] {
+    const inputFieldConfigs: InputFieldConfig[] = [];
+    inputFieldConfigs.push({ label: i18next.t("menu:username") });
+    inputFieldConfigs.push({ label: i18next.t("menu:password"), isPassword: true });
+    inputFieldConfigs.push({ label: i18next.t("menu:confirmPassword"), isPassword: true });
+    return inputFieldConfigs;
+  }
+
   setup(): void {
     super.setup();
 

src/ui/rename-form-ui-handler.ts

@@ -1,4 +1,4 @@
-import { FormModalUiHandler } from "./form-modal-ui-handler";
+import { FormModalUiHandler, InputFieldConfig } from "./form-modal-ui-handler";
 import { ModalConfig } from "./modal-ui-handler";
 import i18next from "i18next";
 import { PlayerPokemon } from "#app/field/pokemon";
@@ -8,10 +8,6 @@ export default class RenameFormUiHandler extends FormModalUiHandler {
     return i18next.t("menu:renamePokemon");
   }
 
-  getFields(config?: ModalConfig): string[] {
-    return [ i18next.t("menu:nickname") ];
-  }
-
   getWidth(config?: ModalConfig): number {
     return 160;
   }
@@ -33,6 +29,10 @@ export default class RenameFormUiHandler extends FormModalUiHandler {
     return super.getReadableErrorMessage(error);
   }
 
+  override getInputFieldConfigs(): InputFieldConfig[] {
+    return [{ label: i18next.t("menu:nickname") }];
+  }
+
   show(args: any[]): boolean {
     if (super.show(args)) {
       const config = args[0] as ModalConfig;

src/ui/test-dialogue-ui-handler.ts

@@ -1,4 +1,4 @@
-import { FormModalUiHandler } from "./form-modal-ui-handler";
+import { FormModalUiHandler, InputFieldConfig } from "./form-modal-ui-handler";
 import { ModalConfig } from "./modal-ui-handler";
 import i18next from "i18next";
 import { PlayerPokemon } from "#app/field/pokemon";
@@ -43,10 +43,6 @@ export default class TestDialogueUiHandler extends FormModalUiHandler {
     return "Test Dialogue";
   }
 
-  getFields(config?: ModalConfig): string[] {
-    return [ "Dialogue" ];
-  }
-
   getWidth(config?: ModalConfig): number {
     return 300;
   }
@@ -68,8 +64,15 @@ export default class TestDialogueUiHandler extends FormModalUiHandler {
     return super.getReadableErrorMessage(error);
   }
 
+  override getInputFieldConfigs(): InputFieldConfig[] {
+    return [{ label: "Dialogue" }];
+  }
+
   show(args: any[]): boolean {
     const ui = this.getUi();
+    const hasTitle = !!this.getModalTitle();
+    this.updateFields(this.getInputFieldConfigs(), hasTitle);
+    this.updateContainer(args[0] as ModalConfig);
     const input = this.inputs[0];
     input.setMaxLength(255);