Compare commits

...

4 Commits

Author SHA1 Message Date
Bertie690
1122354d28
Merge 2d6267b668 into 1633df75c4 2025-08-05 19:25:12 -04:00
Sirz Benjie
1633df75c4
[UI/UX] Add change password ui (#5938)
* Add change password ui

* Ensure input fields are cleared after submit or cancel

* Play select sound on successful submission or cancel

---------

Co-authored-by: NightKev <34855794+DayKev@users.noreply.github.com>
Co-authored-by: Wlowscha <54003515+Wlowscha@users.noreply.github.com>
2025-08-05 16:35:58 -06:00
Bertie690
2d6267b668 Fixed comment 2025-08-04 17:08:28 -04:00
Bertie690
8b65f9afab Added TODO test case + documentation for failing intim test 2025-08-04 16:27:47 -04:00
10 changed files with 232 additions and 8 deletions

View File

@ -15,3 +15,10 @@ export interface AccountRegisterRequest {
username: string;
password: string;
}
export interface AccountChangePwRequest {
password: string;
}
export interface AccountChangePwResponse {
success: boolean;
}

View File

@ -43,5 +43,6 @@ export enum UiMode {
TEST_DIALOGUE,
AUTO_COMPLETE,
ADMIN,
MYSTERY_ENCOUNTER
MYSTERY_ENCOUNTER,
CHANGE_PASSWORD_FORM,
}

View File

@ -1,6 +1,7 @@
import { ApiBase } from "#api/api-base";
import { SESSION_ID_COOKIE_NAME } from "#app/constants";
import type {
AccountChangePwRequest,
AccountInfoResponse,
AccountLoginRequest,
AccountLoginResponse,
@ -95,4 +96,19 @@ export class PokerogueAccountApi extends ApiBase {
removeCookie(SESSION_ID_COOKIE_NAME); // we are always clearing the cookie.
}
public async changePassword(changePwData: AccountChangePwRequest) {
try {
const response = await this.doPost("/account/changepw", changePwData, "form-urlencoded");
if (response.ok) {
return null;
}
console.warn("Change password failed!", response.status, response.statusText);
return response.text();
} catch (err) {
console.warn("Change password failed!", err);
}
return "Unknown error!";
}
}

View File

@ -0,0 +1,124 @@
import { globalScene } from "#app/global-scene";
import { pokerogueApi } from "#app/plugins/api/pokerogue-api";
import { UiMode } from "#enums/ui-mode";
import type { InputFieldConfig } from "#ui/form-modal-ui-handler";
import { FormModalUiHandler } from "#ui/form-modal-ui-handler";
import type { ModalConfig } from "#ui/modal-ui-handler";
import i18next from "i18next";
export class ChangePasswordFormUiHandler extends FormModalUiHandler {
private readonly ERR_PASSWORD: string = "invalid password";
private readonly ERR_ACCOUNT_EXIST: string = "account doesn't exist";
private readonly ERR_PASSWORD_MISMATCH: string = "password doesn't match";
constructor(mode: UiMode | null = null) {
super(mode);
}
setup(): void {
super.setup();
}
override getModalTitle(_config?: ModalConfig): string {
return i18next.t("menu:changePassword");
}
override getWidth(_config?: ModalConfig): number {
return 160;
}
override getMargin(_config?: ModalConfig): [number, number, number, number] {
return [0, 0, 48, 0];
}
override getButtonLabels(_config?: ModalConfig): string[] {
return [i18next.t("settings:buttonSubmit"), i18next.t("menu:cancel")];
}
override getReadableErrorMessage(error: string): string {
const colonIndex = error?.indexOf(":");
if (colonIndex > 0) {
error = error.slice(0, colonIndex);
}
switch (error) {
case this.ERR_PASSWORD:
return i18next.t("menu:invalidRegisterPassword");
case this.ERR_ACCOUNT_EXIST:
return i18next.t("menu:accountNonExistent");
case this.ERR_PASSWORD_MISMATCH:
return i18next.t("menu:passwordNotMatchingConfirmPassword");
}
return super.getReadableErrorMessage(error);
}
override getInputFieldConfigs(): InputFieldConfig[] {
const inputFieldConfigs: InputFieldConfig[] = [];
inputFieldConfigs.push({
label: i18next.t("menu:password"),
isPassword: true,
});
inputFieldConfigs.push({
label: i18next.t("menu:confirmPassword"),
isPassword: true,
});
return inputFieldConfigs;
}
override show(args: [ModalConfig, ...any]): boolean {
if (super.show(args)) {
const config = args[0];
const originalSubmitAction = this.submitAction;
this.submitAction = () => {
if (globalScene.tweens.getTweensOf(this.modalContainer).length === 0) {
// Prevent overlapping overrides on action modification
this.submitAction = originalSubmitAction;
this.sanitizeInputs();
globalScene.ui.setMode(UiMode.LOADING, { buttonActions: [] });
const onFail = (error: string | null) => {
globalScene.ui.setMode(UiMode.CHANGE_PASSWORD_FORM, Object.assign(config, { errorMessage: error?.trim() }));
globalScene.ui.playError();
};
const [passwordInput, confirmPasswordInput] = this.inputs;
if (!passwordInput?.text) {
return onFail(this.getReadableErrorMessage("invalid password"));
}
if (passwordInput.text !== confirmPasswordInput.text) {
return onFail(this.ERR_PASSWORD_MISMATCH);
}
pokerogueApi.account.changePassword({ password: passwordInput.text }).then(error => {
if (!error && originalSubmitAction) {
globalScene.ui.playSelect();
originalSubmitAction();
// Only clear inputs if the action was successful
for (const input of this.inputs) {
input.setText("");
}
} else {
onFail(error);
}
});
}
};
// Upon pressing cancel, the inputs should be cleared
const originalCancelAction = this.cancelAction;
this.cancelAction = () => {
globalScene.ui.playSelect();
for (const input of this.inputs) {
input.setText("");
}
originalCancelAction?.();
};
return true;
}
return false;
}
override clear() {
super.clear();
this.setMouseCursorStyle("default"); //reset cursor
}
}

View File

@ -19,6 +19,7 @@ export abstract class FormModalUiHandler extends ModalUiHandler {
protected inputs: InputText[];
protected errorMessage: Phaser.GameObjects.Text;
protected submitAction: Function | null;
protected cancelAction: (() => void) | null;
protected tween: Phaser.Tweens.Tween;
protected formLabels: Phaser.GameObjects.Text[];
@ -126,22 +127,37 @@ export abstract class FormModalUiHandler extends ModalUiHandler {
});
}
show(args: any[]): boolean {
override show(args: any[]): boolean {
if (super.show(args)) {
this.inputContainers.map(ic => ic.setVisible(true));
const config = args[0] as FormModalConfig;
this.submitAction = config.buttonActions.length ? config.buttonActions[0] : null;
this.cancelAction = config.buttonActions[1] ?? null;
if (this.buttonBgs.length) {
this.buttonBgs[0].off("pointerdown");
this.buttonBgs[0].on("pointerdown", () => {
if (this.submitAction && globalScene.tweens.getTweensOf(this.modalContainer).length === 0) {
this.submitAction();
// #region: Override button pointerDown
// Override the pointerDown event for the buttonBgs to call the `submitAction` and `cancelAction`
// properties that we set above, allowing their behavior to change after this method terminates
// Some subclasses use this to add behavior to the submit and cancel action
this.buttonBgs[0].off("pointerdown");
this.buttonBgs[0].on("pointerdown", () => {
if (this.submitAction && globalScene.tweens.getTweensOf(this.modalContainer).length === 0) {
this.submitAction();
}
});
const cancelBg = this.buttonBgs[1];
if (cancelBg) {
cancelBg.off("pointerdown");
cancelBg.on("pointerdown", () => {
// The seemingly redundant cancelAction check is intentionally left in as a defensive programming measure
if (this.cancelAction && globalScene.tweens.getTweensOf(this.modalContainer).length === 0) {
this.cancelAction();
}
});
}
//#endregion: Override pointerDown events
this.modalContainer.y += 24;
this.modalContainer.setAlpha(0);

View File

@ -311,6 +311,17 @@ export class MenuUiHandler extends MessageUiHandler {
},
keepOpen: true,
},
{
// Note: i18n key is under `menu`, not `menuUiHandler` to avoid duplication
label: i18next.t("menu:changePassword"),
handler: () => {
ui.setOverlayMode(UiMode.CHANGE_PASSWORD_FORM, {
buttonActions: [() => ui.revertMode(), () => ui.revertMode()],
});
return true;
},
keepOpen: true,
},
{
label: i18next.t("menuUiHandler:consentPreferences"),
handler: () => {

View File

@ -7,7 +7,7 @@ import { UiHandler } from "#ui/ui-handler";
import { addWindow, WindowVariant } from "#ui/ui-theme";
export interface ModalConfig {
buttonActions: Function[];
buttonActions: ((...args: any[]) => any)[];
}
export abstract class ModalUiHandler extends UiHandler {

View File

@ -13,6 +13,7 @@ import { BallUiHandler } from "#ui/ball-ui-handler";
import { BattleMessageUiHandler } from "#ui/battle-message-ui-handler";
import type { BgmBar } from "#ui/bgm-bar";
import { GameChallengesUiHandler } from "#ui/challenges-select-ui-handler";
import { ChangePasswordFormUiHandler } from "#ui/change-password-form-ui-handler";
import { CommandUiHandler } from "#ui/command-ui-handler";
import { ConfirmUiHandler } from "#ui/confirm-ui-handler";
import { EggGachaUiHandler } from "#ui/egg-gacha-ui-handler";
@ -102,6 +103,7 @@ const noTransitionModes = [
UiMode.ADMIN,
UiMode.MYSTERY_ENCOUNTER,
UiMode.RUN_INFO,
UiMode.CHANGE_PASSWORD_FORM,
];
export class UI extends Phaser.GameObjects.Container {
@ -172,6 +174,7 @@ export class UI extends Phaser.GameObjects.Container {
new AutoCompleteUiHandler(),
new AdminUiHandler(),
new MysteryEncounterUiHandler(),
new ChangePasswordFormUiHandler(),
];
}

View File

@ -44,6 +44,22 @@ describe("Abilities - Intimidate", () => {
expect(enemy.getStatStage(Stat.ATK)).toBe(-2);
});
// TODO: This fails due to a limitation in our switching logic - the animations and field entry occur concurrently
// inside `SummonPhase`, unshifting 2 `PostSummmonPhase`s and proccing intimidate twice
it.todo("should lower all opponents' ATK by 1 stage on initial switch prompt", async () => {
await game.classicMode.runToSummon([SpeciesId.MIGHTYENA, SpeciesId.POOCHYENA]);
await game.classicMode.startBattleWithSwitch(1);
const [poochyena, mightyena] = game.scene.getPlayerField();
expect(poochyena.species.speciesId).toBe(SpeciesId.POOCHYENA);
const enemy = game.field.getEnemyPokemon();
expect(enemy).toHaveStatStage(Stat.ATK, -1);
expect(poochyena).toHaveAbilityApplied(AbilityId.INTIMIDATE);
expect(mightyena).not.toHaveAbilityApplied(AbilityId.INTIMIDATE);
});
it("should lower ATK of all opponents in a double battle", async () => {
game.override.battleStyle("double");
await game.classicMode.startBattle([SpeciesId.MIGHTYENA]);

View File

@ -1,6 +1,7 @@
import { getGameMode } from "#app/game-mode";
import overrides from "#app/overrides";
import { BattleStyle } from "#enums/battle-style";
import { Button } from "#enums/buttons";
import { GameModes } from "#enums/game-modes";
import { Nature } from "#enums/nature";
import type { SpeciesId } from "#enums/species-id";
@ -100,4 +101,33 @@ export class ClassicModeHelper extends GameManagerHelper {
await this.game.phaseInterceptor.to(CommandPhase);
console.log("==================[New Turn]==================");
}
/**
* Queue inputs to switch at the start of the next battle, and then start it.
* @param pokemonIndex - The 0-indexed position of the party pokemon to switch to.
* Should never be called with 0 as that will select the currently active pokemon and freeze
* @returns A Promise that resolves once the battle has been started and the switch prompt resolved
* @todo Make this work for double battles
* @example
* ```ts
* await game.classicMode.runToSummon([SpeciesId.MIGHTYENA, SpeciesId.POOCHYENA])
* await game.startBattleWithSwitch(1);
* ```
*/
public async startBattleWithSwitch(pokemonIndex: number): Promise<void> {
this.game.scene.battleStyle = BattleStyle.SWITCH;
this.game.onNextPrompt(
"CheckSwitchPhase",
UiMode.CONFIRM,
() => {
this.game.scene.ui.getHandler().setCursor(0);
this.game.scene.ui.getHandler().processInput(Button.ACTION);
},
() => this.game.isCurrentPhase("CommandPhase") || this.game.isCurrentPhase("TurnInitPhase"),
);
this.game.doSelectPartyPokemon(pokemonIndex);
await this.game.phaseInterceptor.to("CommandPhase");
console.log("==================[New Battle (Initial Switch)]==================");
}
}