Improve summary UI

This commit is contained in:
Flashfyre 2023-04-07 00:17:55 -04:00
parent b9f21551f4
commit 860c1a5c11
5 changed files with 146 additions and 31 deletions

View File

@ -391,8 +391,7 @@ export class CommandPhase extends BattlePhase {
}
end() {
super.end();
this.scene.ui.setMode(Mode.MESSAGE);
this.scene.ui.setMode(Mode.MESSAGE).then(() => super.end());
}
}
@ -695,8 +694,7 @@ export class SwitchPhase extends BattlePhase {
this.scene.ui.setMode(Mode.PARTY, this.isModal ? PartyUiMode.SWITCH : PartyUiMode.FAINT_SWITCH, (slotIndex: integer) => {
if (slotIndex && slotIndex < 6)
this.scene.unshiftPhase(new SwitchSummonPhase(this.scene, slotIndex, this.doReturn));
this.scene.ui.setMode(Mode.MESSAGE);
super.end();
this.scene.ui.setMode(Mode.MESSAGE).then(() => super.end());
}, PartyUiHandler.FilterNonFainted);
}
}
@ -780,6 +778,13 @@ export class LearnMovePhase extends PartyMemberPokemonPhase {
const pokemon = this.getPokemon();
const move = allMoves[this.moveId - 1];
const existingMoveIndex = pokemon.moveset.findIndex(m => m.moveId === move.id);
if (existingMoveIndex > -1) {
this.end();
return;
}
const emptyMoveIndex = pokemon.moveset.length < 4
? pokemon.moveset.length
: pokemon.moveset.findIndex(m => m === null);

View File

@ -334,9 +334,6 @@ export default class BattleScene extends Phaser.Scene {
} else {
this.pushPhase(new EncounterPhase(this));
this.pushPhase(new SummonPhase(this));
this.pushPhase(new LearnMovePhase(this, 0, Moves.AERIAL_ACE));
this.pushPhase(new LearnMovePhase(this, 0, Moves.AERIAL_ACE));
this.pushPhase(new LearnMovePhase(this, 0, Moves.AERIAL_ACE));
}
this.currentBattle = new Battle((this.currentBattle?.waveIndex || 0) + 1);

View File

@ -170,9 +170,8 @@ export default class PartyUiHandler extends MessageUiHandler {
}, null, true);
}
} else if (option === PartyOption.SUMMARY) {
this.clearOptions();
ui.playSelect();
ui.setModeWithoutClear(Mode.SUMMARY, this.scene.getParty()[this.cursor]);
ui.setModeWithoutClear(Mode.SUMMARY, this.scene.getParty()[this.cursor]).then(() => this.clearOptions());
} else if (option === PartyOption.CANCEL)
this.processInput(keyCodes.X);
} else if (keyCode === keyCodes.X) {

View File

@ -23,11 +23,15 @@ export default class SummaryUiHandler extends UiHandler {
private summaryContainer: Phaser.GameObjects.Container;
private summaryPageContainer: Phaser.GameObjects.Container;
private movesContainer: Phaser.GameObjects.Container;
private moveDescriptionText: Phaser.GameObjects.Text;
private moveCursorObj: Phaser.GameObjects.Sprite;
private selectedMoveCursorObj: Phaser.GameObjects.Sprite;
private moveRowsContainer: Phaser.GameObjects.Container;
private extraMoveRowContainer: Phaser.GameObjects.Container;
private summaryPageTransitionContainer: Phaser.GameObjects.Container;
private moveCursorBlinkTimer: Phaser.Time.TimerEvent;
private pokemon: PlayerPokemon;
private newMove: Move;
private moveSelectFunction: Function;
@ -111,11 +115,37 @@ export default class SummaryUiHandler extends UiHandler {
if (this.moveCursor < this.pokemon.moveset.length) {
if (this.summaryUiMode === SummaryUiMode.LEARN_MOVE)
this.moveSelectFunction(this.moveCursor);
else
else {
if (this.selectedMoveIndex === -1)
this.selectedMoveIndex = this.moveCursor;
else {
if (this.selectedMoveIndex !== this.moveCursor) {
const tempMove = this.pokemon.moveset[this.selectedMoveIndex];
this.pokemon.moveset[this.selectedMoveIndex] = this.pokemon.moveset[this.moveCursor];
this.pokemon.moveset[this.moveCursor] = tempMove;
const selectedMoveRow = this.moveRowsContainer.getAt(this.selectedMoveIndex) as Phaser.GameObjects.Container;
const switchMoveRow = this.moveRowsContainer.getAt(this.moveCursor) as Phaser.GameObjects.Container;
this.moveRowsContainer.moveTo(selectedMoveRow, this.moveCursor);
this.moveRowsContainer.moveTo(switchMoveRow, this.selectedMoveIndex);
selectedMoveRow.setY(this.moveCursor * 16);
switchMoveRow.setY(this.selectedMoveIndex * 16);
}
this.selectedMoveIndex = -1;
if (this.selectedMoveCursorObj) {
this.selectedMoveCursorObj.destroy();
this.selectedMoveCursorObj = null;
}
}
}
success = true;
} else if (this.moveCursor === 4)
this.processInput(keyCodes.X);
else
ui.playError();
} else if (keyCode === keyCodes.X) {
this.hideMoveSelect();
success = true;
@ -165,6 +195,11 @@ export default class SummaryUiHandler extends UiHandler {
if (changed) {
this.moveCursor = cursor;
const selectedMove = this.getSelectedMove();
this.moveDescriptionText.setText(selectedMove?.effect || '');
}
if (!this.moveCursorObj) {
this.moveCursorObj = this.scene.add.sprite(-2, 0, 'summary_moves_cursor', 'highlight');
this.moveCursorObj.setOrigin(0, 1);
@ -172,6 +207,29 @@ export default class SummaryUiHandler extends UiHandler {
}
this.moveCursorObj.setY(16 * this.moveCursor + 1);
if (this.moveCursorBlinkTimer)
this.moveCursorBlinkTimer.destroy();
this.moveCursorBlinkTimer = this.scene.time.addEvent({
loop: true,
delay: 600,
callback: () => {
this.moveCursorObj.setVisible(false);
this.scene.time.delayedCall(100, () => {
this.moveCursorObj.setVisible(true);
});
}
});
if (this.selectedMoveIndex > -1) {
if (!this.selectedMoveCursorObj) {
this.selectedMoveCursorObj = this.scene.add.sprite(-2, 0, 'summary_moves_cursor', 'select');
this.selectedMoveCursorObj.setOrigin(0, 1);
this.movesContainer.add(this.selectedMoveCursorObj);
this.movesContainer.moveBelow(this.selectedMoveCursorObj, this.moveCursorObj);
}
this.selectedMoveCursorObj.setY(16 * this.selectedMoveIndex + 1);
}
} else {
changed = this.cursor !== cursor;
@ -228,6 +286,7 @@ export default class SummaryUiHandler extends UiHandler {
pageContainer.add(this.movesContainer);
this.extraMoveRowContainer = this.scene.add.container(0, 64);
this.extraMoveRowContainer.setVisible(false);
this.movesContainer.add(this.extraMoveRowContainer);
const extraRowOverlay = this.scene.add.image(-2, 1, 'summary_moves_overlay_row');
@ -239,25 +298,57 @@ export default class SummaryUiHandler extends UiHandler {
extraRowText.setOrigin(0, 1);
this.extraMoveRowContainer.add(extraRowText);
this.moveRowsContainer = this.scene.add.container(0, 0);
this.movesContainer.add(this.moveRowsContainer);
for (let m = 0; m < 4; m++) {
const move = m < this.pokemon.moveset.length ? this.pokemon.moveset[m] : null;
const moveRowContainer = this.scene.add.container(0, 16 * m);
this.moveRowsContainer.add(moveRowContainer);
if (move) {
const typeIcon = this.scene.add.sprite(0, 16 * m, 'types', Type[move.getMove().type].toLowerCase());
const typeIcon = this.scene.add.sprite(0, 0, 'types', Type[move.getMove().type].toLowerCase());
typeIcon.setOrigin(0, 1);
this.movesContainer.add(typeIcon);
moveRowContainer.add(typeIcon);
}
const moveText = addTextObject(this.scene, 35, 16 * m, move ? move.getName() : '-', TextStyle.SUMMARY);
const moveText = addTextObject(this.scene, 35, 0, move ? move.getName() : '-', TextStyle.SUMMARY);
moveText.setOrigin(0, 1);
this.movesContainer.add(moveText);
moveRowContainer.add(moveText);
}
this.moveDescriptionText = addTextObject(this.scene, 2, 84, '', TextStyle.WINDOW, { wordWrap: { width: 900 } });
this.movesContainer.add(this.moveDescriptionText);
const maskRect = this.scene.make.graphics({});
maskRect.fillStyle(0xFFFFFF);
maskRect.beginPath();
maskRect.fillRect(2, 83, 149, 46);
const moveDescriptionTextMask = maskRect.createGeometryMask();
this.moveDescriptionText.setMask(moveDescriptionTextMask);
console.log(this.moveDescriptionText.displayHeight);
break;
}
}
getSelectedMove(): Move {
if (this.cursor !== Page.MOVES)
return null;
if (this.moveCursor < 4 && this.moveCursor < this.pokemon.moveset.length)
return this.pokemon.moveset[this.moveCursor].getMove();
else if (this.summaryUiMode === SummaryUiMode.LEARN_MOVE && this.moveCursor === 4)
return this.newMove;
return null;
}
showMoveSelect() {
this.moveSelect = true;
this.extraMoveRowContainer.setVisible(true);
this.selectedMoveIndex = -1;
this.setCursor(0);
}
@ -268,6 +359,19 @@ export default class SummaryUiHandler extends UiHandler {
}
this.moveSelect = false;
this.extraMoveRowContainer.setVisible(false);
if (this.moveCursorBlinkTimer) {
this.moveCursorBlinkTimer.destroy();
this.moveCursorBlinkTimer = null;
}
if (this.moveCursorObj) {
this.moveCursorObj.destroy();
this.moveCursorObj = null;
}
if (this.selectedMoveCursorObj) {
this.selectedMoveCursorObj.destroy();
this.selectedMoveCursorObj = null;
}
}
clear() {

View File

@ -31,6 +31,8 @@ export default class UI extends Phaser.GameObjects.Container {
private handlers: UiHandler[];
private overlay: Phaser.GameObjects.Rectangle;
private transitioning: boolean;
constructor(scene: BattleScene) {
super(scene, 0, scene.game.canvas.height / 6);
@ -47,7 +49,7 @@ export default class UI extends Phaser.GameObjects.Container {
];
}
setup() {
setup(): void {
for (let handler of this.handlers) {
handler.setup();
}
@ -57,19 +59,22 @@ export default class UI extends Phaser.GameObjects.Container {
this.overlay.setVisible(false);
}
getHandler() {
getHandler(): UiHandler {
return this.handlers[this.mode];
}
getMessageHandler() {
getMessageHandler(): BattleMessageUiHandler {
return this.handlers[Mode.MESSAGE] as BattleMessageUiHandler;
}
processInput(keyCode: integer) {
processInput(keyCode: integer): void {
if (this.transitioning)
return;
this.getHandler().processInput(keyCode);
}
showText(text: string, delay?: integer, callback?: Function, callbackDelay?: integer, prompt?: boolean) {
showText(text: string, delay?: integer, callback?: Function, callbackDelay?: integer, prompt?: boolean): void {
const handler = this.getHandler();
if (handler instanceof MessageUiHandler)
(handler as MessageUiHandler).showText(text, delay, callback, callbackDelay, prompt);
@ -77,7 +82,7 @@ export default class UI extends Phaser.GameObjects.Container {
this.getMessageHandler().showText(text, delay, callback, callbackDelay, prompt);
}
clearText() {
clearText(): void {
const handler = this.getHandler();
if (handler instanceof MessageUiHandler)
(handler as MessageUiHandler).clearText();
@ -93,11 +98,11 @@ export default class UI extends Phaser.GameObjects.Container {
return changed;
}
playSelect() {
playSelect(): void {
this.scene.sound.play('select');
}
playError() {
playError(): void {
this.scene.sound.play('error');
}
@ -108,27 +113,32 @@ export default class UI extends Phaser.GameObjects.Container {
return;
}
const doSetMode = () => {
if (clear)
this.getHandler().clear();
this.mode = mode;
this.getHandler().show(args);
resolve();
};
if (transitionModes.indexOf(this.mode) > -1 || transitionModes.indexOf(mode) > -1) {
this.transitioning = true;
this.overlay.setAlpha(0);
this.overlay.setVisible(true);
this.scene.tweens.add({
targets: this.overlay,
alpha: 1,
duration: 250,
ease: 'Sine.easeOut',
onComplete: () => {
this.scene.time.delayedCall(250, () => {
this.scene.time.delayedCall(100, () => {
doSetMode();
this.scene.tweens.add({
targets: this.overlay,
alpha: 0,
duration: 250,
ease: 'Sine.easeIn',
onComplete: () => this.overlay.setVisible(false)
});
this.transitioning = false;
});
}
});