cdnutter
/
pokerogue
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Add more to summary UI

pull/1/head
Flashfyre 2023-04-08 20:35:45 -04:00
parent a5186d378d
commit 8bacb9bc84
10 changed files with 290 additions and 87 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

83
public/images/categories.json Normal file
View File

@ -0,0 +1,83 @@
{
"textures": [
{
"image": "categories.png",
"format": "RGBA8888",
"size": {
"w": 84,
"h": 11
},
"scale": 1,
"frames": [
{
"filename": "physical",
"rotated": false,
"trimmed": false,
"sourceSize": {
"w": 28,
"h": 11
},
"spriteSourceSize": {
"x": 0,
"y": 0,
"w": 28,
"h": 11
},
"frame": {
"x": 0,
"y": 0,
"w": 28,
"h": 11
}
},
{
"filename": "special",
"rotated": false,
"trimmed": false,
"sourceSize": {
"w": 28,
"h": 11
},
"spriteSourceSize": {
"x": 0,
"y": 0,
"w": 28,
"h": 11
},
"frame": {
"x": 28,
"y": 0,
"w": 28,
"h": 11
}
},
{
"filename": "status",
"rotated": false,
"trimmed": false,
"sourceSize": {
"w": 28,
"h": 11
},
"spriteSourceSize": {
"x": 0,
"y": 0,
"w": 28,
"h": 11
},
"frame": {
"x": 56,
"y": 0,
"w": 28,
"h": 11
}
}
]
}
],
"meta": {
"app": "https://www.codeandweb.com/texturepacker",
"version": "3.0",
"smartupdate": "$TexturePacker:SmartUpdate:624cc5ad31c0279b246b3f142bfd9c96:8422b1554e15389969070f2f708b78a0:70593749cf27aa2aea2f8132ad50259f$"
}
}

BIN
public/images/categories.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 267 B

BIN
public/images/ui/summary_bg.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.1 KiB

After

Width:  |  Height:  |  Size: 1.2 KiB

BIN
public/images/ui/summary_moves_overlay_pp.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 144 B

12
src/auto-play.ts
View File

@ -9,7 +9,7 @@ import CommandUiHandler from "./ui/command-ui-handler";
import FightUiHandler from "./ui/fight-ui-handler";
import MessageUiHandler from "./ui/message-ui-handler";
import ModifierSelectUiHandler from "./ui/modifier-select-ui-handler";
import PartyUiHandler from "./ui/party-ui-handler";
import PartyUiHandler, { PartyUiMode } from "./ui/party-ui-handler";
import ConfirmUiHandler from "./ui/confirm-ui-handler";
import { Mode } from "./ui/ui";
@ -129,6 +129,7 @@ export function initAutoPlay(speed: number) {
const originalCommandUiHandlerShow = commandUiHandler.show;
commandUiHandler.show = function (args: any[]) {
originalCommandUiHandlerShow.apply(this, [ args ]);
thisArg.time.delayedCall(20, () => {
const bestPartyMemberIndex = getBestPartyMemberIndex();
if (bestPartyMemberIndex) {
console.log(bestPartyMemberIndex, thisArg.getParty())
@ -140,6 +141,7 @@ export function initAutoPlay(speed: number) {
commandUiHandler.setCursor(0);
thisArg.time.delayedCall(20, () => this.processInput(keyCodes.Z));
}
});
};
const originalFightUiHandlerShow = fightUiHandler.show;
@ -162,7 +164,11 @@ export function initAutoPlay(speed: number) {
nextPartyMemberIndex = getBestPartyMemberIndex();
partyUiHandler.setCursor(nextPartyMemberIndex);
nextPartyMemberIndex = -1;
if (partyUiHandler.partyUiMode === PartyUiMode.MODIFIER || partyUiHandler.getCursor()) {
this.processInput(keyCodes.Z);
this.processInput(keyCodes.Z);
} else
this.processInput(keyCodes.X);
});
};
@ -194,6 +200,7 @@ export function initAutoPlay(speed: number) {
if (modifierSelectUiHandler.active)
return;
thisArg.time.delayedCall(20, () => {
originalModifierSelectUiHandlerShow.apply(this, [ args ]);
const party = thisArg.getParty();
@ -250,7 +257,7 @@ export function initAutoPlay(speed: number) {
modifierSelectUiHandler.setCursor(optionIndex);
thisArg.time.delayedCall(20, () => {
modifierSelectUiHandler.processInput(keyCodes.Z);
thisArg.time.delayedCall(100, () => {
thisArg.time.delayedCall(250, () => {
console.log(modifierTypes[optionIndex]?.name);
if (thisArg.getCurrentPhase() instanceof SelectModifierPhase) {
if (optionIndex < modifierSelectUiHandler.options.length - 1) {
@ -264,5 +271,6 @@ export function initAutoPlay(speed: number) {
};
thisArg.time.delayedCall(4000, () => trySelectModifier());
});
}
}

9
src/battle-scene.ts
View File

@ -11,11 +11,10 @@ import { Species } from './species';
import { initAutoPlay } from './auto-play';
import { Battle } from './battle';
import { populateAnims } from './battle-anims';
import { Moves } from './move';
export default class BattleScene extends Phaser.Scene {
private auto: boolean;
private autoSpeed: integer = 10;
private auto: boolean = true;
private autoSpeed: integer = 1;
private phaseQueue: Array<BattlePhase>;
private phaseQueuePrepend: Array<BattlePhase>;
@ -49,6 +48,7 @@ export default class BattleScene extends Phaser.Scene {
private rightKey: Phaser.Input.Keyboard.Key;
private actionKey: Phaser.Input.Keyboard.Key;
private cancelKey: Phaser.Input.Keyboard.Key;
private f2Key: Phaser.Input.Keyboard.Key;
private blockInput: boolean;
@ -140,6 +140,7 @@ export default class BattleScene extends Phaser.Scene {
this.loadImage('summary_moves', 'ui');
this.loadImage('summary_moves_effect', 'ui');
this.loadImage('summary_moves_overlay_row', 'ui');
this.loadImage('summary_moves_overlay_pp', 'ui');
this.loadAtlas('summary_moves_cursor', 'ui');
// Load arena images
@ -163,6 +164,7 @@ export default class BattleScene extends Phaser.Scene {
this.loadAtlas('items', '');
this.loadAtlas('types', '');
this.loadAtlas('statuses', '');
this.loadAtlas('categories', '');
for (let i = 0; i < 6; i++)
this.loadAtlas(`pokemon_icons_${i}`, 'ui');
@ -291,6 +293,7 @@ export default class BattleScene extends Phaser.Scene {
this.rightKey = this.input.keyboard.addKey(Phaser.Input.Keyboard.KeyCodes.RIGHT);
this.actionKey = this.input.keyboard.addKey(Phaser.Input.Keyboard.KeyCodes.Z);
this.cancelKey = this.input.keyboard.addKey(Phaser.Input.Keyboard.KeyCodes.X);
this.f2Key = this.input.keyboard.addKey(Phaser.Input.Keyboard.KeyCodes.F2)
Promise.all(loadPokemonAssets).then(() => {
if (this.auto)

6
src/gender.ts
View File

@ -14,12 +14,12 @@ export function getGenderSymbol(gender: Gender) {
return '';
}
export function getGenderColor(gender: Gender) {
export function getGenderColor(gender: Gender, shadow?: boolean) {
switch (gender) {
case Gender.MALE:
return '#40c8f8';
return shadow ? '#006090' : '#40c8f8';
case Gender.FEMALE:
return '#f89890';
return shadow ? '#984038' : '#f89890';
}
return '#ffffff';
}

8
src/text.ts
View File

@ -8,8 +8,8 @@ export enum TextStyle {
};
export function addTextObject(scene: Phaser.Scene, x: number, y: number, content: string, style: TextStyle, extraStyleOptions?: Phaser.Types.GameObjects.Text.TextStyle) {
let styleOptions;
let shadowColor;
let styleOptions: Phaser.Types.GameObjects.Text.TextStyle;
let shadowColor: string;
let shadowSize = 6;
switch (style) {
@ -67,9 +67,9 @@ export function addTextObject(scene: Phaser.Scene, x: number, y: number, content
styleOptions = {
fontFamily: 'emerald',
fontSize: '96px',
color: '#f4b4b0'
color: '#f89890'
};
shadowColor = '#d06c6a';
shadowColor = '#984038';
break;
}

2
src/ui/fight-ui-handler.ts
View File

@ -39,8 +39,6 @@ export default class FightUiHandler extends UiHandler {
const messageHandler = this.getUi().getMessageHandler();
messageHandler.bg.setTexture('bg_fight');
this.setCursor(this.cursor);
this.typeIcon.setVisible(true);
this.ppText.setVisible(true);
this.displayMoves();
}

115
src/ui/summary-ui-handler.ts
View File

@ -5,7 +5,9 @@ import * as Utils from "../utils";
import { PlayerPokemon } from "../pokemon";
import { Type } from "../type";
import { TextStyle, addTextObject } from "../text";
import Move from "../move";
import Move, { MoveCategory } from "../move";
import { getPokeballAtlasKey } from "../pokeball";
import { getGenderColor, getGenderSymbol } from "../gender";
enum Page {
PROFILE,
@ -21,7 +23,12 @@ export default class SummaryUiHandler extends UiHandler {
private summaryUiMode: SummaryUiMode;
private summaryContainer: Phaser.GameObjects.Container;
private numberText: Phaser.GameObjects.Text;
private pokemonSprite: Phaser.GameObjects.Sprite;
private nameText: Phaser.GameObjects.Text;
private pokeball: Phaser.GameObjects.Sprite;
private levelText: Phaser.GameObjects.Text;
private genderText: Phaser.GameObjects.Text;
private summaryPageContainer: Phaser.GameObjects.Container;
private movesContainer: Phaser.GameObjects.Container;
private moveDescriptionText: Phaser.GameObjects.Text;
@ -29,6 +36,10 @@ export default class SummaryUiHandler extends UiHandler {
private selectedMoveCursorObj: Phaser.GameObjects.Sprite;
private moveRowsContainer: Phaser.GameObjects.Container;
private extraMoveRowContainer: Phaser.GameObjects.Container;
private moveEffectContainer: Phaser.GameObjects.Container;
private movePowerText: Phaser.GameObjects.Text;
private moveAccuracyText: Phaser.GameObjects.Text;
private moveCategoryIcon: Phaser.GameObjects.Sprite;
private summaryPageTransitionContainer: Phaser.GameObjects.Container;
private moveDescriptionScrollTween: Phaser.Tweens.Tween;
@ -38,6 +49,7 @@ export default class SummaryUiHandler extends UiHandler {
private newMove: Move;
private moveSelectFunction: Function;
private transitioning: boolean;
private moveEffectsVisible: boolean;
private moveSelect: boolean;
private moveCursor: integer;
@ -58,9 +70,48 @@ export default class SummaryUiHandler extends UiHandler {
summaryBg.setOrigin(0, 1);
this.summaryContainer.add(summaryBg);
this.numberText = addTextObject(this.scene, 17, -150, '000', TextStyle.SUMMARY);
this.numberText.setOrigin(0, 1);
this.summaryContainer.add(this.numberText);
this.pokemonSprite = this.scene.add.sprite(56, -106, `pkmn__sub`);
this.summaryContainer.add(this.pokemonSprite);
this.nameText = addTextObject(this.scene, 6, -39, '', TextStyle.SUMMARY);
this.nameText.setOrigin(0, 1);
this.summaryContainer.add(this.nameText);
this.pokeball = this.scene.add.sprite(6, -23, 'pb');
this.pokeball.setOrigin(0, 1);
this.summaryContainer.add(this.pokeball);
this.levelText = addTextObject(this.scene, 36, -22, '', TextStyle.SUMMARY);
this.levelText.setOrigin(0, 1);
this.summaryContainer.add(this.levelText);
this.genderText = addTextObject(this.scene, 96, -22, '', TextStyle.SUMMARY);
this.genderText.setOrigin(0, 1);
this.summaryContainer.add(this.genderText);
this.moveEffectContainer = this.scene.add.container(106, -62);
this.summaryContainer.add(this.moveEffectContainer);
const moveEffectBg = this.scene.add.image(0, 0, 'summary_moves_effect');
moveEffectBg.setOrigin(0, 0);
this.moveEffectContainer.add(moveEffectBg);
this.movePowerText = addTextObject(this.scene, 99, 27, '0', TextStyle.WINDOW);
this.movePowerText.setOrigin(1, 1);
this.moveEffectContainer.add(this.movePowerText);
this.moveAccuracyText = addTextObject(this.scene, 99, 43, '0', TextStyle.WINDOW);
this.moveAccuracyText.setOrigin(1, 1);
this.moveEffectContainer.add(this.moveAccuracyText);
this.moveCategoryIcon = this.scene.add.sprite(99, 57, 'categories');
this.moveCategoryIcon.setOrigin(1, 1);
this.moveEffectContainer.add(this.moveCategoryIcon);
const getSummaryPageBg = () => {
const ret = this.scene.add.sprite(0, 0, this.getPageKey(0));
ret.setOrigin(0, 1);
@ -90,17 +141,29 @@ export default class SummaryUiHandler extends UiHandler {
this.summaryContainer.setVisible(true);
this.cursor = -1;
this.numberText.setText(Utils.padInt(this.pokemon.species.speciesId, 3));
this.pokemonSprite.play(this.pokemon.getSpriteKey());
this.pokemon.cry();
this.nameText.setText(this.pokemon.name);
this.pokeball.setFrame(getPokeballAtlasKey(this.pokemon.pokeball));
this.levelText.setText(this.pokemon.level.toString());
this.genderText.setText(getGenderSymbol(this.pokemon.gender));
this.genderText.setColor(getGenderColor(this.pokemon.gender));
this.genderText.setShadowColor(getGenderColor(this.pokemon.gender, true));
switch (this.summaryUiMode) {
case SummaryUiMode.DEFAULT:
this.setCursor(Page.PROFILE);
const page = args.length < 2 ? Page.PROFILE : args[2] as Page;
this.hideMoveEffect(true);
this.setCursor(page);
break;
case SummaryUiMode.LEARN_MOVE:
this.newMove = args[2] as Move;
this.moveSelectFunction = args[3] as Function;
this.showMoveEffect(true);
this.setCursor(Page.MOVES);
this.showMoveSelect();
break;
@ -178,6 +241,17 @@ export default class SummaryUiHandler extends UiHandler {
} else {
const pages = Utils.getEnumValues(Page);
switch (keyCode) {
case keyCodes.UP:
case keyCodes.DOWN:
const isDown = keyCode === keyCodes.DOWN;
const party = this.scene.getParty();
const partyMemberIndex = party.indexOf(this.pokemon);
if ((isDown && partyMemberIndex < party.length - 1) || (!isDown && partyMemberIndex)) {
const page = this.cursor;
this.clear();
this.show([ party[partyMemberIndex + (isDown ? 1 : -1)], this.summaryUiMode, page ]);
}
break;
case keyCodes.LEFT:
if (this.cursor)
success = this.setCursor(this.cursor - 1);
@ -204,6 +278,14 @@ export default class SummaryUiHandler extends UiHandler {
const selectedMove = this.getSelectedMove();
if (selectedMove) {
this.movePowerText.setText(selectedMove.power >= 0 ? selectedMove.power.toString() : '---');
this.moveAccuracyText.setText(selectedMove.accuracy >= 0 ? selectedMove.accuracy.toString() : '---');
this.moveCategoryIcon.setFrame(MoveCategory[selectedMove.category].toLowerCase());
this.showMoveEffect();
} else
this.hideMoveEffect();
this.moveDescriptionText.setText(selectedMove?.effect || '');
const moveDescriptionLineCount = Math.floor(this.moveDescriptionText.displayHeight / 14.83);
@ -245,6 +327,8 @@ export default class SummaryUiHandler extends UiHandler {
callback: () => {
this.moveCursorObj.setVisible(false);
this.scene.time.delayedCall(100, () => {
if (!this.moveCursorObj)
return;
this.moveCursorObj.setVisible(true);
});
}
@ -378,6 +462,7 @@ export default class SummaryUiHandler extends UiHandler {
this.extraMoveRowContainer.setVisible(true);
this.selectedMoveIndex = -1;
this.setCursor(0);
this.showMoveEffect();
}
hideMoveSelect() {
@ -400,6 +485,32 @@ export default class SummaryUiHandler extends UiHandler {
this.selectedMoveCursorObj.destroy();
this.selectedMoveCursorObj = null;
}
this.hideMoveEffect();
}
showMoveEffect(instant?: boolean) {
if (this.moveEffectsVisible)
return;
this.moveEffectsVisible = true;
this.scene.tweens.add({
targets: this.moveEffectContainer,
x: 6,
duration: instant ? 0 : 250,
ease: 'Sine.easeOut'
});
}
hideMoveEffect(instant?: boolean) {
if (!this.moveEffectsVisible)
return;
this.moveEffectsVisible = false;
this.scene.tweens.add({
targets: this.moveEffectContainer,
x: 106,
duration: instant ? 0 : 250,
ease: 'Sine.easeIn'
});
}
clear() {