mika/pokerogue
1
0
Fork 0
mirror of https://github.com/pagefaultgames/pokerogue.git synced 2025-08-05 23:19:25 +02:00
Code Issues Packages Projects Releases Wiki Activity

Merge b9c42bfaea into 375587213e

Browse Source
This commit is contained in:
Wlowscha 2025-08-04 23:32:06 -05:00 committed by GitHub
commit d79c4a23f0
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
50 changed files with 214 additions and 244 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
src/battle-scene.ts
View File

@ -478,8 +478,8 @@ export class BattleScene extends SceneBase {
this.uiContainer = uiContainer;
const overlayWidth = this.game.canvas.width / 6;
const overlayHeight = this.game.canvas.height / 6 - 48;
const overlayWidth = this.scaledCanvas.width;
const overlayHeight = this.scaledCanvas.height - 48;
this.fieldOverlay = this.add.rectangle(0, overlayHeight * -1 - 48, overlayWidth, overlayHeight, 0x424242);
this.fieldOverlay.setName("rect-field-overlay");
this.fieldOverlay.setOrigin(0, 0);
@ -537,34 +537,29 @@ export class BattleScene extends SceneBase {
this.candyBar.setup();
this.fieldUI.add(this.candyBar);
this.biomeWaveText = addTextObject(
this.game.canvas.width / 6 - 2,
0,
startingWave.toString(),
TextStyle.BATTLE_INFO,
);
this.biomeWaveText = addTextObject(this.scaledCanvas.width - 2, 0, startingWave.toString(), TextStyle.BATTLE_INFO);
this.biomeWaveText.setName("text-biome-wave");
this.biomeWaveText.setOrigin(1, 0.5);
this.fieldUI.add(this.biomeWaveText);
this.moneyText = addTextObject(this.game.canvas.width / 6 - 2, 0, "", TextStyle.MONEY);
this.moneyText = addTextObject(this.scaledCanvas.width - 2, 0, "", TextStyle.MONEY);
this.moneyText.setName("text-money");
this.moneyText.setOrigin(1, 0.5);
this.fieldUI.add(this.moneyText);
this.scoreText = addTextObject(this.game.canvas.width / 6 - 2, 0, "", TextStyle.PARTY, { fontSize: "54px" });
this.scoreText = addTextObject(this.scaledCanvas.width - 2, 0, "", TextStyle.PARTY, { fontSize: "54px" });
this.scoreText.setName("text-score");
this.scoreText.setOrigin(1, 0.5);
this.fieldUI.add(this.scoreText);
this.luckText = addTextObject(this.game.canvas.width / 6 - 2, 0, "", TextStyle.PARTY, { fontSize: "54px" });
this.luckText = addTextObject(this.scaledCanvas.width - 2, 0, "", TextStyle.PARTY, { fontSize: "54px" });
this.luckText.setName("text-luck");
this.luckText.setOrigin(1, 0.5);
this.luckText.setVisible(false);
this.fieldUI.add(this.luckText);
this.luckLabelText = addTextObject(
this.game.canvas.width / 6 - 2,
this.scaledCanvas.width - 2,
0,
i18next.t("common:luckIndicator"),
TextStyle.PARTY,
@ -586,10 +581,7 @@ export class BattleScene extends SceneBase {
this.spriteSparkleHandler = new PokemonSpriteSparkleHandler();
this.spriteSparkleHandler.setup();
this.pokemonInfoContainer = new PokemonInfoContainer(
this.game.canvas.width / 6 + 52,
-(this.game.canvas.height / 6) + 66,
);
this.pokemonInfoContainer = new PokemonInfoContainer(this.scaledCanvas.width + 52, -this.scaledCanvas.height + 66);
this.pokemonInfoContainer.setup();
this.fieldUI.add(this.pokemonInfoContainer);
@ -2054,7 +2046,7 @@ export class BattleScene extends SceneBase {
} else {
this.luckText.setTint(0xffef5c, 0x47ff69, 0x6b6bff, 0xff6969);
}
this.luckLabelText.setX(this.game.canvas.width / 6 - 2 - (this.luckText.displayWidth + 2));
this.luckLabelText.setX(this.scaledCanvas.width - 2 - (this.luckText.displayWidth + 2));
this.tweens.add({
targets: labels,
duration: duration,
@ -2088,7 +2080,7 @@ export class BattleScene extends SceneBase {
const enemyModifierCount = this.enemyModifiers.filter(m => m.isIconVisible()).length;
const biomeWaveTextHeight = this.biomeWaveText.getBottomLeft().y - this.biomeWaveText.getTopLeft().y;
this.biomeWaveText.setY(
-(this.game.canvas.height / 6) +
-this.scaledCanvas.height +
(enemyModifierCount ? (enemyModifierCount <= 12 ? 15 : 24) : 0) +
biomeWaveTextHeight / 2,
);
@ -2100,7 +2092,7 @@ export class BattleScene extends SceneBase {
const offsetY = (this.scoreText.visible ? this.scoreText : this.moneyText).y + 15;
this.partyExpBar.setY(offsetY);
this.candyBar.setY(offsetY + 15);
this.ui?.achvBar.setY(this.game.canvas.height / 6 + offsetY);
this.ui?.achvBar.setY(this.scaledCanvas.height + offsetY);
}
/**

6
src/data/mystery-encounters/encounters/bug-type-superfan-encounter.ts
View File

@ -715,15 +715,13 @@ function doBugTypeMoveTutor(): Promise<void> {
const moveOptions = globalScene.currentBattle.mysteryEncounter!.misc.moveTutorOptions;
await showEncounterDialogue(`${namespace}:battle_won`, `${namespace}:speaker`);
const overlayScale = 1;
const moveInfoOverlay = new MoveInfoOverlay({
delayVisibility: false,
scale: overlayScale,
onSide: true,
right: true,
x: 1,
y: -MoveInfoOverlay.getHeight(overlayScale, true) - 1,
width: globalScene.game.canvas.width / 6 - 2,
y: -MoveInfoOverlay.getHeight(true) - 1,
width: globalScene.scaledCanvas.width - 2,
});
globalScene.ui.add(moveInfoOverlay);

6
src/data/mystery-encounters/encounters/global-trade-system-encounter.ts
View File

@ -564,14 +564,14 @@ function generateTradeOption(alreadyUsedSpecies: PokemonSpecies[], originalBst?:
function showTradeBackground() {
return new Promise<void>(resolve => {
const tradeContainer = globalScene.add.container(0, -globalScene.game.canvas.height / 6);
const tradeContainer = globalScene.add.container(0, -globalScene.scaledCanvas.height);
tradeContainer.setName("Trade Background");
const flyByStaticBg = globalScene.add.rectangle(
0,
0,
globalScene.game.canvas.width / 6,
globalScene.game.canvas.height / 6,
globalScene.scaledCanvas.width,
globalScene.scaledCanvas.height,
0,
);
flyByStaticBg.setName("Black Background");

6
src/data/mystery-encounters/encounters/weird-dream-encounter.ts
View File

@ -648,15 +648,15 @@ function getTransformedSpecies(
}
function doShowDreamBackground() {
const transformationContainer = globalScene.add.container(0, -globalScene.game.canvas.height / 6);
const transformationContainer = globalScene.add.container(0, -globalScene.scaledCanvas.height);
transformationContainer.name = "Dream Background";
// In case it takes a bit for video to load
const transformationStaticBg = globalScene.add.rectangle(
0,
0,
globalScene.game.canvas.width / 6,
globalScene.game.canvas.height / 6,
globalScene.scaledCanvas.width,
globalScene.scaledCanvas.height,
0,
);
transformationStaticBg.setName("Black Background");

2
src/field/damage-number-handler.ts
View File

@ -30,7 +30,7 @@ export class DamageNumberHandler {
const baseScale = target.getSpriteScale() / 6;
const damageNumber = addTextObject(
target.x,
-(globalScene.game.canvas.height / 6) + target.y - target.getSprite().height / 2,
-globalScene.scaledCanvas.height + target.y - target.getSprite().height / 2,
formatStat(amount, true),
TextStyle.SUMMARY,
);

6
src/phases/egg-hatch-phase.ts
View File

@ -148,9 +148,9 @@ export class EggHatchPhase extends Phase {
this.eggHatchOverlay = globalScene.add.rectangle(
0,
-globalScene.game.canvas.height / 6,
globalScene.game.canvas.width / 6,
globalScene.game.canvas.height / 6,
-globalScene.scaledCanvas.height,
globalScene.scaledCanvas.width,
globalScene.scaledCanvas.height,
0xffffff,
);
this.eggHatchOverlay.setOrigin(0, 0);

4
src/phases/end-card-phase.ts
View File

@ -25,8 +25,8 @@ export class EndCardPhase extends Phase {
globalScene.field.add(this.endCard);
this.text = addTextObject(
globalScene.game.canvas.width / 12,
globalScene.game.canvas.height / 6 - 16,
globalScene.scaledCanvas.width / 2,
globalScene.scaledCanvas.height - 16,
i18next.t("battle:congratulations"),
TextStyle.SUMMARY,
{ fontSize: "128px" },

8
src/phases/evolution-phase.ts
View File

@ -90,16 +90,16 @@ export class EvolutionPhase extends Phase {
.setVisible(false);
this.evolutionBgOverlay = globalScene.add
.rectangle(0, 0, globalScene.game.canvas.width / 6, globalScene.game.canvas.height / 6, 0x262626)
.rectangle(0, 0, globalScene.scaledCanvas.width, globalScene.scaledCanvas.height, 0x262626)
.setOrigin(0)
.setAlpha(0);
this.evolutionContainer.add([this.evolutionBaseBg, this.evolutionBgOverlay, this.evolutionBg]);
this.evolutionOverlay = globalScene.add.rectangle(
0,
-globalScene.game.canvas.height / 6,
globalScene.game.canvas.width / 6,
globalScene.game.canvas.height / 6 - 48,
-globalScene.scaledCanvas.height,
globalScene.scaledCanvas.width,
globalScene.scaledCanvas.height - 48,
0xffffff,
);
this.evolutionOverlay.setOrigin(0).setAlpha(0);

2
src/timed-event-manager.ts
View File

@ -653,7 +653,7 @@ export class TimedEventDisplay extends Phaser.GameObjects.Container {
console.log(this.event.bannerKey);
const padding = 5;
const showTimer = this.event.eventType !== EventType.NO_TIMER_DISPLAY;
const yPosition = globalScene.game.canvas.height / 6 - padding - (showTimer ? 10 : 0) - (this.event.yOffset ?? 0);
const yPosition = globalScene.scaledCanvas.height - padding - (showTimer ? 10 : 0) - (this.event.yOffset ?? 0);
this.banner = new Phaser.GameObjects.Image(globalScene, this.availableWidth / 2, yPosition - padding, key);
this.banner.setName("img-event-banner");
this.banner.setOrigin(0.5, 1);

4
src/ui/abstact-option-select-ui-handler.ts
View File

@ -66,7 +66,7 @@ export abstract class AbstractOptionSelectUiHandler extends UiHandler {
setup() {
const ui = this.getUi();
this.optionSelectContainer = globalScene.add.container(globalScene.game.canvas.width / 6 - 1, -48);
this.optionSelectContainer = globalScene.add.container(globalScene.scaledCanvas.width - 1, -48);
this.optionSelectContainer.setName(`option-select-${this.mode ? UiMode[this.mode] : "UNKNOWN"}`);
this.optionSelectContainer.setVisible(false);
ui.add(this.optionSelectContainer);
@ -135,7 +135,7 @@ export abstract class AbstractOptionSelectUiHandler extends UiHandler {
this.optionSelectText.setName("text-option-select");
this.optionSelectTextContainer.add(this.optionSelectText);
this.optionSelectContainer.setPosition(
globalScene.game.canvas.width / 6 - 1 - (this.config?.xOffset || 0),
globalScene.scaledCanvas.width - 1 - (this.config?.xOffset || 0),
-48 + (this.config?.yOffset || 0),
);
this.optionSelectBg.width = Math.max(this.optionSelectText.displayWidth + 24, this.getWindowWidth());

6
src/ui/achv-bar.ts
View File

@ -21,7 +21,7 @@ export class AchvBar extends Phaser.GameObjects.Container {
public shown: boolean;
constructor() {
super(globalScene, globalScene.game.canvas.width / 6, 0);
super(globalScene, globalScene.scaledCanvas.width, 0);
this.playerGender = globalScene.gameData.gender;
}
@ -118,7 +118,7 @@ export class AchvBar extends Phaser.GameObjects.Container {
globalScene.tweens.add({
targets: this,
x: globalScene.game.canvas.width / 6 - this.bg.width / 2,
x: globalScene.scaledCanvas.width - this.bg.width / 2,
duration: 500,
ease: "Sine.easeOut",
});
@ -136,7 +136,7 @@ export class AchvBar extends Phaser.GameObjects.Container {
globalScene.tweens.add({
targets: this,
x: globalScene.game.canvas.width / 6,
x: globalScene.scaledCanvas.width,
duration: 500,
ease: "Sine.easeIn",
onComplete: () => {

4
src/ui/achvs-ui-handler.ts
View File

@ -72,9 +72,9 @@ export class AchvsUiHandler extends MessageUiHandler {
const ui = this.getUi();
/** Width of the global canvas / 6 */
const WIDTH = globalScene.game.canvas.width / 6;
const WIDTH = globalScene.scaledCanvas.width;
/** Height of the global canvas / 6 */
const HEIGHT = globalScene.game.canvas.height / 6;
const HEIGHT = globalScene.scaledCanvas.height;
this.mainContainer = globalScene.add.container(1, -HEIGHT + 1);

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

@ -37,7 +37,7 @@ export class BallUiHandler extends UiHandler {
const optionsText = addTextObject(0, 0, optionsTextContent, TextStyle.WINDOW, { align: "right", maxLines: 6 });
const optionsTextWidth = optionsText.displayWidth;
this.pokeballSelectContainer = globalScene.add.container(
globalScene.game.canvas.width / 6 - 51 - Math.max(64, optionsTextWidth),
globalScene.scaledCanvas.width - 51 - Math.max(64, optionsTextWidth),
-49,
);
this.pokeballSelectContainer.setVisible(false);

3
src/ui/base-stats-overlay.ts
View File

@ -16,7 +16,6 @@ interface BaseStatsOverlaySettings {
const HEIGHT = 120;
const BORDER = 8;
const GLOBAL_SCALE = 6;
const shortStats = ["HP", "ATK", "DEF", "SPATK", "SPDEF", "SPD"];
export class BaseStatsOverlay extends Phaser.GameObjects.Container implements InfoToggle {
@ -109,7 +108,7 @@ export class BaseStatsOverlay extends Phaser.GameObjects.Container implements In
// width of this element
static getWidth(_scale: number): number {
return globalScene.game.canvas.width / GLOBAL_SCALE / 2;
return globalScene.scaledCanvas.width / 2;
}
// height of this element

2
src/ui/battle-info/player-battle-info.ts
View File

@ -39,7 +39,7 @@ export class PlayerBattleInfo extends BattleInfo {
statOverflow: 1,
},
};
super(Math.floor(globalScene.game.canvas.width / 6) - 10, -72, true, posParams);
super(Math.floor(globalScene.scaledCanvas.width) - 10, -72, true, posParams);
this.hpNumbersContainer = globalScene.add.container(-15, 10).setName("container_hp");

8
src/ui/battle-message-ui-handler.ts
View File

@ -94,7 +94,7 @@ export class BattleMessageUiHandler extends MessageUiHandler {
this.levelUpStatsContainer = levelUpStatsContainer;
const levelUpStatsLabelsContent = addTextObject(globalScene.game.canvas.width / 6 - 73, -94, "", TextStyle.WINDOW, {
const levelUpStatsLabelsContent = addTextObject(globalScene.scaledCanvas.width - 73, -94, "", TextStyle.WINDOW, {
maxLines: 6,
});
let levelUpStatsLabelText = "";
@ -106,7 +106,7 @@ export class BattleMessageUiHandler extends MessageUiHandler {
levelUpStatsLabelsContent.x -= levelUpStatsLabelsContent.displayWidth;
const levelUpStatsBg = addWindow(
globalScene.game.canvas.width / 6,
globalScene.scaledCanvas.width,
-100,
80 + levelUpStatsLabelsContent.displayWidth,
100,
@ -117,7 +117,7 @@ export class BattleMessageUiHandler extends MessageUiHandler {
levelUpStatsContainer.add(levelUpStatsLabelsContent);
const levelUpStatsIncrContent = addTextObject(
globalScene.game.canvas.width / 6 - 50,
globalScene.scaledCanvas.width - 50,
-94,
"+\n+\n+\n+\n+\n+",
TextStyle.WINDOW,
@ -128,7 +128,7 @@ export class BattleMessageUiHandler extends MessageUiHandler {
this.levelUpStatsIncrContent = levelUpStatsIncrContent;
const levelUpStatsValuesContent = addBBCodeTextObject(
globalScene.game.canvas.width / 6 - 7,
globalScene.scaledCanvas.width - 7,
-94,
"",
TextStyle.WINDOW,

6
src/ui/candy-bar.ts
View File

@ -19,7 +19,7 @@ export class CandyBar extends Phaser.GameObjects.Container {
public shown: boolean;
constructor() {
super(globalScene, globalScene.game.canvas.width / 6, -(globalScene.game.canvas.height / 6) + 15);
super(globalScene, globalScene.scaledCanvas.width, -globalScene.scaledCanvas.height + 15);
}
setup(): void {
@ -80,7 +80,7 @@ export class CandyBar extends Phaser.GameObjects.Container {
this.tween = globalScene.tweens.add({
targets: this,
x: globalScene.game.canvas.width / 6 - (this.bg.width - 5),
x: globalScene.scaledCanvas.width - (this.bg.width - 5),
duration: 500,
ease: "Sine.easeOut",
onComplete: () => {
@ -111,7 +111,7 @@ export class CandyBar extends Phaser.GameObjects.Container {
this.tween = globalScene.tweens.add({
targets: this,
x: globalScene.game.canvas.width / 6,
x: globalScene.scaledCanvas.width,
duration: 500,
ease: "Sine.easeIn",
onComplete: () => {

6
src/ui/challenges-select-ui-handler.ts
View File

@ -58,11 +58,11 @@ export class GameChallengesUiHandler extends UiHandler {
this.widestTextBox = 0;
this.challengesContainer = globalScene.add.container(1, -(globalScene.game.canvas.height / 6) + 1);
this.challengesContainer = globalScene.add.container(1, -globalScene.scaledCanvas.height + 1);
this.challengesContainer.setName("challenges");
this.challengesContainer.setInteractive(
new Phaser.Geom.Rectangle(0, 0, globalScene.game.canvas.width / 6, globalScene.game.canvas.height / 6),
new Phaser.Geom.Rectangle(0, 0, globalScene.scaledCanvas.width, globalScene.scaledCanvas.height),
Phaser.Geom.Rectangle.Contains,
);
@ -79,7 +79,7 @@ export class GameChallengesUiHandler extends UiHandler {
this.challengesContainer.add(bgOverlay);
// TODO: Change this back to /9 when adding in difficulty
const headerBg = addWindow(0, 0, globalScene.game.canvas.width / 6, 24);
const headerBg = addWindow(0, 0, globalScene.scaledCanvas.width, 24);
headerBg.setName("window-header-bg");
headerBg.setOrigin(0, 0);

6
src/ui/char-sprite.ts
View File

@ -10,7 +10,7 @@ export class CharSprite extends Phaser.GameObjects.Container {
public shown: boolean;
constructor() {
super(globalScene, globalScene.game.canvas.width / 6 + 32, -42);
super(globalScene, globalScene.scaledCanvas.width + 32, -42);
}
setup(): void {
@ -49,7 +49,7 @@ export class CharSprite extends Phaser.GameObjects.Container {
globalScene.tweens.add({
targets: this,
x: globalScene.game.canvas.width / 6 - 102,
x: globalScene.scaledCanvas.width - 102,
duration: 750,
ease: "Cubic.easeOut",
onComplete: () => {
@ -95,7 +95,7 @@ export class CharSprite extends Phaser.GameObjects.Container {
globalScene.tweens.add({
targets: this,
x: globalScene.game.canvas.width / 6 + 32,
x: globalScene.scaledCanvas.width + 32,
duration: 750,
ease: "Cubic.easeIn",
onComplete: () => {

4
src/ui/confirm-ui-handler.ts
View File

@ -69,7 +69,7 @@ export class ConfirmUiHandler extends AbstractOptionSelectUiHandler {
const xOffset = args.length >= 7 && args[6] !== null ? (args[6] as number) : 0;
const yOffset = args.length >= 8 && args[7] !== null ? (args[7] as number) : 0;
this.optionSelectContainer.setPosition(globalScene.game.canvas.width / 6 - 1 + xOffset, -48 + yOffset);
this.optionSelectContainer.setPosition(globalScene.scaledCanvas.width - 1 + xOffset, -48 + yOffset);
this.setCursor(this.switchCheck ? this.switchCheckCursor : 0);
return true;
@ -103,7 +103,7 @@ export class ConfirmUiHandler extends AbstractOptionSelectUiHandler {
const xOffset = args.length >= 4 && args[3] !== null ? (args[3] as number) : 0;
const yOffset = args.length >= 5 && args[4] !== null ? (args[4] as number) : 0;
this.optionSelectContainer.setPosition(globalScene.game.canvas.width / 6 - 1 + xOffset, -48 + yOffset);
this.optionSelectContainer.setPosition(globalScene.scaledCanvas.width - 1 + xOffset, -48 + yOffset);
this.setCursor(this.switchCheck ? this.switchCheckCursor : 0);

6
src/ui/egg-gacha-ui-handler.ts
View File

@ -174,7 +174,7 @@ export class EggGachaUiHandler extends MessageUiHandler {
const ui = this.getUi();
this.eggGachaContainer = globalScene.add.container(0, -globalScene.game.canvas.height / 6).setVisible(false);
this.eggGachaContainer = globalScene.add.container(0, -globalScene.scaledCanvas.height).setVisible(false);
ui.add(this.eggGachaContainer);
const bg = globalScene.add.nineslice(0, 0, "default_bg", undefined, 320, 180, 0, 0, 16, 0).setOrigin(0);
@ -212,7 +212,7 @@ export class EggGachaUiHandler extends MessageUiHandler {
this.eggGachaOptionSelectBg = addWindow(0, 0, eggGachaOptionSelectWidth, 16 + 576 * this.scale).setOrigin(1);
this.eggGachaOptionsContainer = globalScene.add
.container(globalScene.game.canvas.width / 6, 148)
.container(globalScene.scaledCanvas.width, 148)
.add(this.eggGachaOptionSelectBg);
this.eggGachaContainer.add(this.eggGachaOptionsContainer);
@ -278,7 +278,7 @@ export class EggGachaUiHandler extends MessageUiHandler {
this.eggGachaContainer.add(this.eggGachaOptionsContainer);
for (const voucher of getEnumValues(VoucherType)) {
const container = globalScene.add.container(globalScene.game.canvas.width / 6 - 56 * voucher, 0);
const container = globalScene.add.container(globalScene.scaledCanvas.width - 56 * voucher, 0);
const bg = addWindow(0, 0, 56, 22).setOrigin(1, 0);
container.add(bg);

2
src/ui/egg-hatch-scene-handler.ts
View File

@ -19,7 +19,7 @@ export class EggHatchSceneHandler extends UiHandler {
}
setup() {
this.eggHatchContainer = globalScene.add.container(0, -globalScene.game.canvas.height / 6);
this.eggHatchContainer = globalScene.add.container(0, -globalScene.scaledCanvas.height);
globalScene.fieldUI.add(this.eggHatchContainer);
const eggLightraysAnimFrames = globalScene.anims.generateFrameNames("egg_lightrays", { start: 0, end: 3 });

8
src/ui/egg-list-ui-handler.ts
View File

@ -36,11 +36,11 @@ export class EggListUiHandler extends MessageUiHandler {
setup() {
const ui = this.getUi();
this.eggListContainer = globalScene.add.container(0, -globalScene.game.canvas.height / 6).setVisible(false);
this.eggListContainer = globalScene.add.container(0, -globalScene.scaledCanvas.height).setVisible(false);
ui.add(this.eggListContainer);
const bgColor = globalScene.add
.rectangle(0, 0, globalScene.game.canvas.width / 6, globalScene.game.canvas.height / 6, 0x006860)
.rectangle(0, 0, globalScene.scaledCanvas.width, globalScene.scaledCanvas.height, 0x006860)
.setOrigin(0);
const eggListBg = globalScene.add.image(0, 0, "egg_list_bg").setOrigin(0);
@ -69,9 +69,7 @@ export class EggListUiHandler extends MessageUiHandler {
.withUpdateGridCallBack(() => this.updateEggIcons())
.withUpdateSingleElementCallback((i: number) => this.setEggDetails(i));
this.eggListMessageBoxContainer = globalScene.add
.container(0, globalScene.game.canvas.height / 6)
.setVisible(false);
this.eggListMessageBoxContainer = globalScene.add.container(0, globalScene.scaledCanvas.height).setVisible(false);
const eggListMessageBox = addWindow(1, -1, 318, 28).setOrigin(0, 1);
this.eggListMessageBoxContainer.add(eggListMessageBox);

6
src/ui/egg-summary-ui-handler.ts
View File

@ -59,11 +59,11 @@ export class EggSummaryUiHandler extends MessageUiHandler {
setup() {
const ui = this.getUi();
this.summaryContainer = globalScene.add.container(0, -globalScene.game.canvas.height / 6);
this.summaryContainer = globalScene.add.container(0, -globalScene.scaledCanvas.height);
this.summaryContainer.setVisible(false);
ui.add(this.summaryContainer);
this.eggHatchContainer = globalScene.add.container(0, -globalScene.game.canvas.height / 6);
this.eggHatchContainer = globalScene.add.container(0, -globalScene.scaledCanvas.height);
this.eggHatchContainer.setVisible(false);
ui.add(this.eggHatchContainer);
@ -92,7 +92,7 @@ export class EggSummaryUiHandler extends MessageUiHandler {
iconContainerX + numCols * iconSize,
iconContainerY + 3,
4,
globalScene.game.canvas.height / 6 - 20,
globalScene.scaledCanvas.height - 20,
numRows,
);
this.summaryContainer.add(scrollBar);

2
src/ui/evolution-scene-handler.ts
View File

@ -22,7 +22,7 @@ export class EvolutionSceneHandler extends MessageUiHandler {
const ui = this.getUi();
this.evolutionContainer = globalScene.add.container(0, -globalScene.game.canvas.height / 6);
this.evolutionContainer = globalScene.add.container(0, -globalScene.scaledCanvas.height);
const messageBg = globalScene.add.sprite(0, 0, "bg", globalScene.windowType).setOrigin(0, 1).setVisible(false);

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

@ -105,15 +105,13 @@ export class FightUiHandler extends UiHandler implements InfoToggle {
]);
// prepare move overlay
const overlayScale = 1;
this.moveInfoOverlay = new MoveInfoOverlay({
delayVisibility: true,
scale: overlayScale,
onSide: true,
right: true,
x: 0,
y: -MoveInfoOverlay.getHeight(overlayScale, true),
width: globalScene.game.canvas.width / 6 + 4,
y: -MoveInfoOverlay.getHeight(true),
width: globalScene.scaledCanvas.width + 4,
hideEffectBox: true,
hideBg: true,
});

2
src/ui/filter-text.ts
View File

@ -62,7 +62,7 @@ export class FilterText extends Phaser.GameObjects.Container {
this.dialogueMessageBox = addWindow(
-this.textPadding,
0,
globalScene.game.canvas.width / 6 + this.textPadding * 2,
globalScene.scaledCanvas.width + this.textPadding * 2,
49,
false,
false,

2
src/ui/login-form-ui-handler.ts
View File

@ -49,7 +49,7 @@ export class LoginFormUiHandler extends FormModalUiHandler {
private buildExternalPartyContainer() {
this.externalPartyContainer = globalScene.add.container(0, 0);
this.externalPartyContainer.setInteractive(
new Phaser.Geom.Rectangle(0, 0, globalScene.game.canvas.width / 12, globalScene.game.canvas.height / 12),
new Phaser.Geom.Rectangle(0, 0, globalScene.scaledCanvas.width / 2, globalScene.scaledCanvas.height / 2),
Phaser.Geom.Rectangle.Contains,
);
this.externalPartyTitle = addTextObject(0, 4, "", TextStyle.SETTINGS_LABEL);

10
src/ui/menu-ui-handler.ts
View File

@ -96,10 +96,10 @@ export class MenuUiHandler extends MessageUiHandler {
ui.bgmBar = this.bgmBar;
this.menuContainer = globalScene.add.container(1, -(globalScene.game.canvas.height / 6) + 1);
this.menuContainer = globalScene.add.container(1, -globalScene.scaledCanvas.height + 1);
this.menuContainer.setName("menu");
this.menuContainer.setInteractive(
new Phaser.Geom.Rectangle(0, 0, globalScene.game.canvas.width / 6, globalScene.game.canvas.height / 6),
new Phaser.Geom.Rectangle(0, 0, globalScene.scaledCanvas.width, globalScene.scaledCanvas.height),
Phaser.Geom.Rectangle.Contains,
);
@ -146,10 +146,10 @@ export class MenuUiHandler extends MessageUiHandler {
this.scale = getTextStyleOptions(TextStyle.WINDOW, globalScene.uiTheme).scale;
this.menuBg = addWindow(
globalScene.game.canvas.width / 6 - (this.optionSelectText.displayWidth + 25),
globalScene.scaledCanvas.width - (this.optionSelectText.displayWidth + 25),
0,
this.optionSelectText.displayWidth + 19 + 24 * this.scale,
globalScene.game.canvas.height / 6 - 2,
globalScene.scaledCanvas.height - 2,
);
this.menuBg.setOrigin(0, 0);
@ -174,7 +174,7 @@ export class MenuUiHandler extends MessageUiHandler {
this.dialogueMessageBox = addWindow(
-this.textPadding,
0,
globalScene.game.canvas.width / 6 + this.textPadding * 2,
globalScene.scaledCanvas.width + this.textPadding * 2,
49,
false,
false,

10
src/ui/modal-ui-handler.ts
View File

@ -46,7 +46,7 @@ export abstract class ModalUiHandler extends UiHandler {
this.modalContainer = globalScene.add.container(0, 0);
this.modalContainer.setInteractive(
new Phaser.Geom.Rectangle(0, 0, globalScene.game.canvas.width / 6, globalScene.game.canvas.height / 6),
new Phaser.Geom.Rectangle(0, 0, globalScene.scaledCanvas.width, globalScene.scaledCanvas.height),
Phaser.Geom.Rectangle.Contains,
);
@ -105,8 +105,8 @@ export abstract class ModalUiHandler extends UiHandler {
const overlay = globalScene.add.rectangle(
(this.getWidth() + marginLeft + marginRight) / 2,
(this.getHeight() + marginTop + marginBottom) / 2,
globalScene.game.canvas.width / 6,
globalScene.game.canvas.height / 6,
globalScene.scaledCanvas.width,
globalScene.scaledCanvas.height,
0,
);
overlay.setOrigin(0.5, 0.5);
@ -159,8 +159,8 @@ export abstract class ModalUiHandler extends UiHandler {
const width = this.getWidth(config);
const height = this.getHeight(config);
this.modalContainer.setPosition(
(globalScene.game.canvas.width / 6 - (width + (marginRight - marginLeft))) / 2,
(-globalScene.game.canvas.height / 6 - (height + (marginBottom - marginTop))) / 2,
(globalScene.scaledCanvas.width - (width + (marginRight - marginLeft))) / 2,
(-globalScene.scaledCanvas.height - (height + (marginBottom - marginTop))) / 2,
);
this.modalBg.setSize(width, height);

33
src/ui/modifier-select-ui-handler.ts
View File

@ -86,10 +86,7 @@ export class ModifierSelectUiHandler extends AwaitableUiHandler {
transferButtonText.setOrigin(1, 0);
this.transferButtonContainer.add(transferButtonText);
this.checkButtonContainer = globalScene.add.container(
globalScene.game.canvas.width / 6 - 1,
OPTION_BUTTON_YPOSITION,
);
this.checkButtonContainer = globalScene.add.container(globalScene.scaledCanvas.width - 1, OPTION_BUTTON_YPOSITION);
this.checkButtonContainer.setName("use-btn");
this.checkButtonContainer.setVisible(false);
ui.add(this.checkButtonContainer);
@ -129,8 +126,8 @@ export class ModifierSelectUiHandler extends AwaitableUiHandler {
this.lockRarityButtonContainer.add(this.lockRarityButtonText);
this.continueButtonContainer = globalScene.add.container(
globalScene.game.canvas.width / 12,
-(globalScene.game.canvas.height / 12),
globalScene.scaledCanvas.width / 2,
-(globalScene.scaledCanvas.height / 2),
);
this.continueButtonContainer.setVisible(false);
ui.add(this.continueButtonContainer);
@ -146,15 +143,13 @@ export class ModifierSelectUiHandler extends AwaitableUiHandler {
this.continueButtonContainer.add(continueButtonText);
// prepare move overlay
const overlayScale = 1;
this.moveInfoOverlay = new MoveInfoOverlay({
delayVisibility: true,
scale: overlayScale,
onSide: true,
right: true,
x: 1,
y: -MoveInfoOverlay.getHeight(overlayScale, true) - 1,
width: globalScene.game.canvas.width / 6 - 2,
y: -MoveInfoOverlay.getHeight(true) - 1,
width: globalScene.scaledCanvas.width - 2,
});
ui.add(this.moveInfoOverlay);
// register the overlay to receive toggle events
@ -219,10 +214,10 @@ export class ModifierSelectUiHandler extends AwaitableUiHandler {
shopTypeOptions.length > SHOP_OPTIONS_ROW_LIMIT ? -SINGLE_SHOP_ROW_YOFFSET : -DOUBLE_SHOP_ROW_YOFFSET;
for (let m = 0; m < typeOptions.length; m++) {
const sliceWidth = globalScene.game.canvas.width / 6 / (typeOptions.length + 2);
const sliceWidth = globalScene.scaledCanvas.width / (typeOptions.length + 2);
const option = new ModifierOption(
sliceWidth * (m + 1) + sliceWidth * 0.5,
-globalScene.game.canvas.height / 12 + optionsYOffset,
-globalScene.scaledCanvas.height / 2 + optionsYOffset,
typeOptions[m],
);
option.setScale(0.5);
@ -243,10 +238,10 @@ export class ModifierSelectUiHandler extends AwaitableUiHandler {
row ? SHOP_OPTIONS_ROW_LIMIT : 0,
row ? undefined : SHOP_OPTIONS_ROW_LIMIT,
);
const sliceWidth = globalScene.game.canvas.width / 6 / (rowOptions.length + 2);
const sliceWidth = globalScene.scaledCanvas.width / (rowOptions.length + 2);
const option = new ModifierOption(
sliceWidth * (col + 1) + sliceWidth * 0.5,
-globalScene.game.canvas.height / 12 - globalScene.game.canvas.height / 32 - (42 - (28 * row - 1)),
-globalScene.scaledCanvas.height / 2 - globalScene.game.canvas.height / 32 - (42 - (28 * row - 1)),
shopTypeOptions[m],
);
option.setScale(0.375);
@ -558,27 +553,27 @@ export class ModifierSelectUiHandler extends AwaitableUiHandler {
// Continue button when no shop items
this.cursorObj.setScale(1.25);
this.cursorObj.setPosition(
globalScene.game.canvas.width / 18 + 23,
-globalScene.game.canvas.height / 12 -
globalScene.scaledCanvas.width / 3 + 23,
-globalScene.scaledCanvas.height / 2 -
(this.shopOptionsRows.length > 1 ? SINGLE_SHOP_ROW_YOFFSET - 2 : DOUBLE_SHOP_ROW_YOFFSET - 2),
);
ui.showText(i18next.t("modifierSelectUiHandler:continueNextWaveDescription"));
return ret;
}
const sliceWidth = globalScene.game.canvas.width / 6 / (options.length + 2);
const sliceWidth = globalScene.scaledCanvas.width / (options.length + 2);
if (this.rowCursor < 2) {
// Cursor on free items
this.cursorObj.setPosition(
sliceWidth * (cursor + 1) + sliceWidth * 0.5 - 20,
-globalScene.game.canvas.height / 12 -
-globalScene.scaledCanvas.height / 2 -
(this.shopOptionsRows.length > 1 ? SINGLE_SHOP_ROW_YOFFSET - 2 : DOUBLE_SHOP_ROW_YOFFSET - 2),
);
} else {
// Cursor on paying items
this.cursorObj.setPosition(
sliceWidth * (cursor + 1) + sliceWidth * 0.5 - 16,
-globalScene.game.canvas.height / 12 -
-globalScene.scaledCanvas.height / 2 -
globalScene.game.canvas.height / 32 -
(-14 + 28 * (this.rowCursor - (this.shopOptionsRows.length - 1))),
);

48
src/ui/move-info-overlay.ts
View File

@ -10,17 +10,24 @@ import { fixedInt, getLocalizedSpriteKey } from "#utils/common";
import i18next from "i18next";
export interface MoveInfoOverlaySettings {
delayVisibility?: boolean; // if true, showing the overlay will only set it to active and populate the fields and the handler using this field has to manually call setVisible later.
scale?: number; // scale the box? A scale of 0.5 is recommended
top?: boolean; // should the effect box be on top?
right?: boolean; // should the effect box be on the right?
onSide?: boolean; // should the effect be on the side? ignores top argument if true
//location and width of the component; unaffected by scaling
/**
* If true, showing the overlay will only set it to active and populate the fields
* and the handler using this field has to manually call `setVisible` later.
*/
delayVisibility?: boolean;
/** Whether the effect box should be on top */
top?: boolean;
/** Whether the effect box should be on the right */
right?: boolean;
/** Whether the effect box should be on the side. Overrides the `top` param if `true`. */
onSide?: boolean;
/** `x` position of the component, unaffected by scaling */
x?: number;
/** `y` position of the component, unaffected by scaling */
y?: number;
/** Default is always half the screen, regardless of scale */
/** Width of the component, unaffected by scaling. Defaults to half the screen width. */
width?: number;
/** Determines whether to display the small secondary box */
/** Whether to display the small secondary box */
hideEffectBox?: boolean;
hideBg?: boolean;
}
@ -54,12 +61,11 @@ export class MoveInfoOverlay extends Phaser.GameObjects.Container implements Inf
options.top = false;
}
super(globalScene, options?.x, options?.y);
const scale = options?.scale || 1; // set up the scale
this.setScale(scale);
this.setScale(1);
this.options = options || {};
// prepare the description box
const width = (options?.width || MoveInfoOverlay.getWidth(scale)) / scale; // divide by scale as we always want this to be half a window wide
const width = options?.width || MoveInfoOverlay.getWidth(); // we always want this to be half a window wide
this.descBg = addWindow(
options?.onSide && !options?.right ? EFF_WIDTH : 0,
options?.top ? EFF_HEIGHT : 0,
@ -88,19 +94,19 @@ export class MoveInfoOverlay extends Phaser.GameObjects.Container implements Inf
y: options?.y || 0,
};
if (maskPointOrigin.x < 0) {
maskPointOrigin.x += globalScene.game.canvas.width / GLOBAL_SCALE;
maskPointOrigin.x += globalScene.scaledCanvas.width;
}
if (maskPointOrigin.y < 0) {
maskPointOrigin.y += globalScene.game.canvas.height / GLOBAL_SCALE;
maskPointOrigin.y += globalScene.scaledCanvas.height;
}
const moveDescriptionTextMaskRect = globalScene.make.graphics();
moveDescriptionTextMaskRect.fillStyle(0xff0000);
moveDescriptionTextMaskRect.fillRect(
maskPointOrigin.x + ((options?.onSide && !options?.right ? EFF_WIDTH : 0) + BORDER) * scale,
maskPointOrigin.y + ((options?.top ? EFF_HEIGHT : 0) + BORDER - 2) * scale,
width - ((options?.onSide ? EFF_WIDTH : 0) - BORDER * 2) * scale,
(DESC_HEIGHT - (BORDER - 2) * 2) * scale,
maskPointOrigin.x + ((options?.onSide && !options?.right ? EFF_WIDTH : 0) + BORDER),
maskPointOrigin.y + ((options?.top ? EFF_HEIGHT : 0) + BORDER - 2),
width - ((options?.onSide ? EFF_WIDTH : 0) - BORDER * 2),
DESC_HEIGHT - (BORDER - 2) * 2,
);
moveDescriptionTextMaskRect.setScale(6);
const moveDescriptionTextMask = this.createGeometryMask(moveDescriptionTextMaskRect);
@ -233,12 +239,12 @@ export class MoveInfoOverlay extends Phaser.GameObjects.Container implements Inf
}
// width of this element
static getWidth(_scale: number): number {
return globalScene.game.canvas.width / GLOBAL_SCALE / 2;
static getWidth(): number {
return globalScene.scaledCanvas.width / 2;
}
// height of this element
static getHeight(scale: number, onSide?: boolean): number {
return (onSide ? Math.max(EFF_HEIGHT, DESC_HEIGHT) : EFF_HEIGHT + DESC_HEIGHT) * scale;
static getHeight(onSide?: boolean): number {
return onSide ? Math.max(EFF_HEIGHT, DESC_HEIGHT) : EFF_HEIGHT + DESC_HEIGHT;
}
}

2
src/ui/mystery-encounter-ui-handler.ts
View File

@ -471,7 +471,7 @@ export class MysteryEncounterUiHandler extends UiHandler {
// View Party Button
const viewPartyText = addBBCodeTextObject(
globalScene.game.canvas.width / 6,
globalScene.scaledCanvas.width,
-24,
getBBCodeFrag(i18next.t("mysteryEncounterMessages:view_party_button"), TextStyle.PARTY),
TextStyle.PARTY,

6
src/ui/party-exp-bar.ts
View File

@ -14,7 +14,7 @@ export class PartyExpBar extends Phaser.GameObjects.Container {
public shown: boolean;
constructor() {
super(globalScene, globalScene.game.canvas.width / 6, -(globalScene.game.canvas.height / 6) + 15);
super(globalScene, globalScene.scaledCanvas.width, -globalScene.scaledCanvas.height + 15);
}
setup(): void {
@ -66,7 +66,7 @@ export class PartyExpBar extends Phaser.GameObjects.Container {
this.tween = globalScene.tweens.add({
targets: this,
x: globalScene.game.canvas.width / 6 - (this.bg.width - 5),
x: globalScene.scaledCanvas.width - (this.bg.width - 5),
duration: 500 / Math.pow(2, globalScene.expGainsSpeed),
ease: "Sine.easeOut",
onComplete: () => {
@ -92,7 +92,7 @@ export class PartyExpBar extends Phaser.GameObjects.Container {
this.tween = globalScene.tweens.add({
targets: this,
x: globalScene.game.canvas.width / 6,
x: globalScene.scaledCanvas.width,
duration: 500,
ease: "Sine.easeIn",
onComplete: () => {

10
src/ui/party-ui-handler.ts
View File

@ -311,7 +311,7 @@ export class PartyUiHandler extends MessageUiHandler {
this.partyCancelButton = partyCancelButton;
this.optionsContainer = globalScene.add.container(globalScene.game.canvas.width / 6 - 1, -1);
this.optionsContainer = globalScene.add.container(globalScene.scaledCanvas.width - 1, -1);
partyContainer.add(this.optionsContainer);
this.iconAnimHandler = new PokemonIconAnimHandler();
@ -323,14 +323,12 @@ export class PartyUiHandler extends MessageUiHandler {
this.partyDiscardModeButton = partyDiscardModeButton;
// prepare move overlay. in case it appears to be too big, set the overlayScale to .5
const overlayScale = 1;
// prepare move overlay
this.moveInfoOverlay = new MoveInfoOverlay({
scale: overlayScale,
top: true,
x: 1,
y: -MoveInfoOverlay.getHeight(overlayScale) - 1,
width: globalScene.game.canvas.width / 12 - 30,
y: -MoveInfoOverlay.getHeight() - 1,
width: globalScene.scaledCanvas.width / 2 - 30,
});
ui.add(this.moveInfoOverlay);

8
src/ui/pokeball-tray.ts
View File

@ -10,7 +10,7 @@ export class PokeballTray extends Phaser.GameObjects.Container {
public shown: boolean;
constructor(player: boolean) {
super(globalScene, player ? globalScene.game.canvas.width / 6 : 0, player ? -72 : -144);
super(globalScene, player ? globalScene.scaledCanvas.width : 0, player ? -72 : -144);
this.player = player;
}
@ -36,7 +36,7 @@ export class PokeballTray extends Phaser.GameObjects.Container {
.map((_, i) =>
globalScene.add.sprite(
(this.player ? -83 : 76) +
(globalScene.game.canvas.width / 6) * (this.player ? -1 : 1) +
globalScene.scaledCanvas.width * (this.player ? -1 : 1) +
10 * i * (this.player ? 1 : -1),
-8,
"pb_tray_ball",
@ -67,7 +67,7 @@ export class PokeballTray extends Phaser.GameObjects.Container {
this.bg.alpha = 1;
this.balls.forEach((ball, b) => {
ball.x += (globalScene.game.canvas.width / 6 + 104) * (this.player ? 1 : -1);
ball.x += (globalScene.scaledCanvas.width + 104) * (this.player ? 1 : -1);
let ballFrame = "ball";
if (b >= party.length) {
ballFrame = "empty";
@ -115,7 +115,7 @@ export class PokeballTray extends Phaser.GameObjects.Container {
this.balls.forEach((ball, b) => {
globalScene.tweens.add({
targets: ball,
x: `${this.player ? "-" : "+"}=${globalScene.game.canvas.width / 6}`,
x: `${this.player ? "-" : "+"}=${globalScene.scaledCanvas.width}`,
duration: 250,
delay: b * 100,
ease: "Sine.easeIn",

35
src/ui/pokedex-info-overlay.ts
View File

@ -7,7 +7,6 @@ import { fixedInt } from "#utils/common";
export interface PokedexInfoOverlaySettings {
delayVisibility?: boolean; // if true, showing the overlay will only set it to active and populate the fields and the handler using this field has to manually call setVisible later.
scale?: number; // scale the box? A scale of 0.5 is recommended
//location and width of the component; unaffected by scaling
x?: number;
y?: number;
@ -36,17 +35,15 @@ export class PokedexInfoOverlay extends Phaser.GameObjects.Container implements
private maskPointOriginX: number;
private maskPointOriginY: number;
public scale: number;
public width: number;
constructor(options?: PokedexInfoOverlaySettings) {
super(globalScene, options?.x, options?.y);
this.scale = options?.scale || 1; // set up the scale
this.setScale(this.scale);
this.setScale(1);
this.options = options || {};
// prepare the description box
this.width = (options?.width || PokedexInfoOverlay.getWidth(this.scale)) / this.scale; // divide by scale as we always want this to be half a window wide
this.width = options?.width || PokedexInfoOverlay.getWidth(); // we always want this to be half a window wide
this.descBg = addWindow(0, 0, this.width, DESC_HEIGHT);
this.descBg.setOrigin(0, 0);
this.add(this.descBg);
@ -61,19 +58,19 @@ export class PokedexInfoOverlay extends Phaser.GameObjects.Container implements
this.maskPointOriginY = options?.y || 0;
if (this.maskPointOriginX < 0) {
this.maskPointOriginX += globalScene.game.canvas.width / GLOBAL_SCALE;
this.maskPointOriginX += globalScene.scaledCanvas.width;
}
if (this.maskPointOriginY < 0) {
this.maskPointOriginY += globalScene.game.canvas.height / GLOBAL_SCALE;
this.maskPointOriginY += globalScene.scaledCanvas.height;
}
this.textMaskRect = globalScene.make.graphics();
this.textMaskRect.fillStyle(0xff0000);
this.textMaskRect.fillRect(
this.maskPointOriginX + BORDER * this.scale,
this.maskPointOriginY + (BORDER - 2) * this.scale,
this.width - BORDER * 2 * this.scale,
(DESC_HEIGHT - (BORDER - 2) * 2) * this.scale,
this.maskPointOriginX + BORDER,
this.maskPointOriginY + (BORDER - 2),
this.width - BORDER * 2,
DESC_HEIGHT - (BORDER - 2) * 2,
);
this.textMaskRect.setScale(6);
const textMask = this.createGeometryMask(this.textMaskRect);
@ -111,10 +108,10 @@ export class PokedexInfoOverlay extends Phaser.GameObjects.Container implements
this.textMaskRect.clear();
this.textMaskRect.fillStyle(0xff0000);
this.textMaskRect.fillRect(
this.maskPointOriginX + BORDER * this.scale,
this.maskPointOriginY + (BORDER - 2) * this.scale + (48 - newHeight),
this.width - BORDER * 2 * this.scale,
(newHeight - (BORDER - 2) * 2) * this.scale,
this.maskPointOriginX + BORDER,
this.maskPointOriginY + (BORDER - 2) + (48 - newHeight),
this.width - BORDER * 2,
newHeight - (BORDER - 2) * 2,
);
const updatedMask = this.createGeometryMask(this.textMaskRect);
this.desc.setMask(updatedMask);
@ -167,12 +164,12 @@ export class PokedexInfoOverlay extends Phaser.GameObjects.Container implements
}
// width of this element
static getWidth(_scale: number): number {
return globalScene.game.canvas.width / GLOBAL_SCALE / 2;
static getWidth(): number {
return globalScene.scaledCanvas.width / 2;
}
// height of this element
static getHeight(scale: number, _onSide?: boolean): number {
return DESC_HEIGHT * scale;
static getHeight(): number {
return DESC_HEIGHT;
}
}

23
src/ui/pokedex-page-ui-handler.ts
View File

@ -299,15 +299,15 @@ export class PokedexPageUiHandler extends MessageUiHandler {
const langSettingKey = Object.keys(languageSettings).find(lang => currentLanguage.includes(lang)) ?? "en";
const textSettings = languageSettings[langSettingKey];
this.starterSelectContainer = globalScene.add.container(0, -globalScene.game.canvas.height / 6);
this.starterSelectContainer = globalScene.add.container(0, -globalScene.scaledCanvas.height);
this.starterSelectContainer.setVisible(false);
ui.add(this.starterSelectContainer);
const bgColor = globalScene.add.rectangle(
0,
0,
globalScene.game.canvas.width / 6,
globalScene.game.canvas.height / 6,
globalScene.scaledCanvas.width,
globalScene.scaledCanvas.height,
0x006860,
);
bgColor.setOrigin(0, 0);
@ -602,7 +602,7 @@ export class PokedexPageUiHandler extends MessageUiHandler {
this.filterInstructionsContainer.setVisible(true);
this.starterSelectContainer.add(this.filterInstructionsContainer);
this.starterSelectMessageBoxContainer = globalScene.add.container(0, globalScene.game.canvas.height / 6);
this.starterSelectMessageBoxContainer = globalScene.add.container(0, globalScene.scaledCanvas.height);
this.starterSelectMessageBoxContainer.setVisible(false);
this.starterSelectContainer.add(this.starterSelectMessageBoxContainer);
@ -629,7 +629,7 @@ export class PokedexPageUiHandler extends MessageUiHandler {
this.menuContainer = globalScene.add.container(-130, 0);
this.menuContainer.setName("menu");
this.menuContainer.setInteractive(
new Phaser.Geom.Rectangle(0, 0, globalScene.game.canvas.width / 6, globalScene.game.canvas.height / 6),
new Phaser.Geom.Rectangle(0, 0, globalScene.scaledCanvas.width, globalScene.scaledCanvas.height),
Phaser.Geom.Rectangle.Contains,
);
@ -659,10 +659,10 @@ export class PokedexPageUiHandler extends MessageUiHandler {
this.scale = getTextStyleOptions(TextStyle.WINDOW, globalScene.uiTheme).scale;
this.menuBg = addWindow(
globalScene.game.canvas.width / 6 - 83,
globalScene.scaledCanvas.width - 83,
0,
this.optionSelectText.displayWidth + 19 + 24 * this.scale,
globalScene.game.canvas.height / 6 - 2,
globalScene.scaledCanvas.height - 2,
);
this.menuBg.setOrigin(0, 0);
@ -682,19 +682,16 @@ export class PokedexPageUiHandler extends MessageUiHandler {
this.menuContainer.bringToTop(this.baseStatsOverlay);
// add the info overlay last to be the top most ui element and prevent the IVs from overlaying this
const overlayScale = 1;
this.moveInfoOverlay = new MoveInfoOverlay({
scale: overlayScale,
top: true,
x: 1,
y: globalScene.game.canvas.height / 6 - MoveInfoOverlay.getHeight(overlayScale) - 29,
y: globalScene.scaledCanvas.height - MoveInfoOverlay.getHeight() - 29,
});
this.starterSelectContainer.add(this.moveInfoOverlay);
this.infoOverlay = new PokedexInfoOverlay({
scale: overlayScale,
x: 1,
y: globalScene.game.canvas.height / 6 - PokedexInfoOverlay.getHeight(overlayScale) - 29,
y: globalScene.scaledCanvas.height - PokedexInfoOverlay.getHeight() - 29,
});
this.starterSelectContainer.add(this.infoOverlay);
@ -1103,7 +1100,7 @@ export class PokedexPageUiHandler extends MessageUiHandler {
this.starterSelectMessageBoxContainer.setY(0);
this.message.setY(4);
} else {
this.starterSelectMessageBoxContainer.setY(globalScene.game.canvas.height / 6);
this.starterSelectMessageBoxContainer.setY(globalScene.scaledCanvas.height);
this.starterSelectMessageBox.setOrigin(0, 1);
this.message.setY(singleLine ? -22 : -37);
}

10
src/ui/pokedex-ui-handler.ts
View File

@ -245,15 +245,15 @@ export class PokedexUiHandler extends MessageUiHandler {
const langSettingKey = Object.keys(languageSettings).find(lang => currentLanguage.includes(lang)) ?? "en";
const textSettings = languageSettings[langSettingKey];
this.starterSelectContainer = globalScene.add.container(0, -globalScene.game.canvas.height / 6);
this.starterSelectContainer = globalScene.add.container(0, -globalScene.scaledCanvas.height);
this.starterSelectContainer.setVisible(false);
ui.add(this.starterSelectContainer);
const bgColor = globalScene.add.rectangle(
0,
0,
globalScene.game.canvas.width / 6,
globalScene.game.canvas.height / 6,
globalScene.scaledCanvas.width,
globalScene.scaledCanvas.height,
0x006860,
);
bgColor.setOrigin(0, 0);
@ -544,7 +544,7 @@ export class PokedexUiHandler extends MessageUiHandler {
this.type2Icon.setOrigin(0, 0);
this.starterSelectContainer.add(this.type2Icon);
this.starterSelectMessageBoxContainer = globalScene.add.container(0, globalScene.game.canvas.height / 6);
this.starterSelectMessageBoxContainer = globalScene.add.container(0, globalScene.scaledCanvas.height);
this.starterSelectMessageBoxContainer.setVisible(false);
this.starterSelectContainer.add(this.starterSelectMessageBoxContainer);
@ -784,7 +784,7 @@ export class PokedexUiHandler extends MessageUiHandler {
this.starterSelectMessageBoxContainer.setY(0);
this.message.setY(4);
} else {
this.starterSelectMessageBoxContainer.setY(globalScene.game.canvas.height / 6);
this.starterSelectMessageBoxContainer.setY(globalScene.scaledCanvas.height);
this.starterSelectMessageBox.setOrigin(0, 1);
this.message.setY(singleLine ? -22 : -37);
}

6
src/ui/run-history-ui-handler.ts
View File

@ -54,14 +54,14 @@ export class RunHistoryUiHandler extends MessageUiHandler {
const loadSessionBg = globalScene.add.rectangle(
0,
0,
globalScene.game.canvas.width / 6,
-globalScene.game.canvas.height / 6,
globalScene.scaledCanvas.width,
-globalScene.scaledCanvas.height,
0x006860,
);
loadSessionBg.setOrigin(0, 0);
this.runSelectContainer.add(loadSessionBg);
this.runContainerInitialY = -globalScene.game.canvas.height / 6 + 8;
this.runContainerInitialY = -globalScene.scaledCanvas.height + 8;
this.runsContainer = globalScene.add.container(8, this.runContainerInitialY);
this.runSelectContainer.add(this.runsContainer);

14
src/ui/run-info-ui-handler.ts
View File

@ -74,7 +74,7 @@ export class RunInfoUiHandler extends UiHandler {
}
override async setup() {
this.runContainer = globalScene.add.container(1, -(globalScene.game.canvas.height / 6) + 1);
this.runContainer = globalScene.add.container(1, -globalScene.scaledCanvas.height + 1);
// The import of the modifiersModule is loaded here to sidestep async/await issues.
this.modifiersModule = Modifier;
this.runContainer.setVisible(false);
@ -120,7 +120,7 @@ export class RunInfoUiHandler extends UiHandler {
// Creates Header and adds to this.runContainer
this.addHeader();
this.statsBgWidth = (globalScene.game.canvas.width / 6 - 2) / 3;
this.statsBgWidth = (globalScene.scaledCanvas.width - 2) / 3;
// Creates Run Result Container
this.runResultContainer = globalScene.add.container(0, 24);
@ -147,7 +147,7 @@ export class RunInfoUiHandler extends UiHandler {
this.showParty(true);
this.runContainer.setInteractive(
new Phaser.Geom.Rectangle(0, 0, globalScene.game.canvas.width / 6, globalScene.game.canvas.height / 6),
new Phaser.Geom.Rectangle(0, 0, globalScene.scaledCanvas.width, globalScene.scaledCanvas.height),
Phaser.Geom.Rectangle.Contains,
);
this.getUi().bringToTop(this.runContainer);
@ -174,7 +174,7 @@ export class RunInfoUiHandler extends UiHandler {
* It does not check if the run has any PokemonHeldItemModifiers though.
*/
private addHeader() {
const headerBg = addWindow(0, 0, globalScene.game.canvas.width / 6 - 2, 24);
const headerBg = addWindow(0, 0, globalScene.scaledCanvas.width - 2, 24);
headerBg.setOrigin(0, 0);
this.runContainer.add(headerBg);
if (this.runInfo.modifiers.length !== 0) {
@ -723,7 +723,7 @@ export class RunInfoUiHandler extends UiHandler {
private parsePartyInfo(): void {
const party = this.runInfo.party;
const currentLanguage = i18next.resolvedLanguage ?? "en";
const windowHeight = (globalScene.game.canvas.height / 6 - 23) / 6;
const windowHeight = (globalScene.scaledCanvas.height - 23) / 6;
party.forEach((p: PokemonData, i: number) => {
const pokemonInfoWindow = new RoundRectangle(globalScene, 0, 14, this.statsBgWidth * 2 + 10, windowHeight - 2, 3);
@ -971,8 +971,8 @@ export class RunInfoUiHandler extends UiHandler {
endCard.setOrigin(0);
endCard.setScale(0.5);
const text = addTextObject(
globalScene.game.canvas.width / 12,
globalScene.game.canvas.height / 6 - 16,
globalScene.scaledCanvas.width / 2,
globalScene.scaledCanvas.height - 16,
i18next.t("battle:congratulations"),
TextStyle.SUMMARY,
{ fontSize: "128px" },

6
src/ui/save-slot-select-ui-handler.ts
View File

@ -54,14 +54,14 @@ export class SaveSlotSelectUiHandler extends MessageUiHandler {
const loadSessionBg = globalScene.add.rectangle(
0,
0,
globalScene.game.canvas.width / 6,
-globalScene.game.canvas.height / 6,
globalScene.scaledCanvas.width,
-globalScene.scaledCanvas.height,
0x006860,
);
loadSessionBg.setOrigin(0, 0);
this.saveSlotSelectContainer.add(loadSessionBg);
this.sessionSlotsContainerInitialY = -globalScene.game.canvas.height / 6 + 8;
this.sessionSlotsContainerInitialY = -globalScene.scaledCanvas.height + 8;
this.sessionSlotsContainer = globalScene.add.container(8, this.sessionSlotsContainerInitialY);
this.saveSlotSelectContainer.add(this.sessionSlotsContainer);

2
src/ui/saving-icon-handler.ts
View File

@ -8,7 +8,7 @@ export class SavingIconHandler extends Phaser.GameObjects.Container {
private shown: boolean;
constructor() {
super(globalScene, globalScene.game.canvas.width / 6 - 4, globalScene.game.canvas.height / 6 - 4);
super(globalScene, globalScene.scaledCanvas.width - 4, globalScene.scaledCanvas.height - 4);
}
setup(): void {

12
src/ui/settings/abstract-binding-ui-handler.ts
View File

@ -73,8 +73,8 @@ export abstract class AbstractBindingUiHandler extends UiHandler {
// Setup backgrounds and text objects for UI.
this.titleBg = addWindow(
globalScene.game.canvas.width / 6 - this.getWindowWidth(),
-(globalScene.game.canvas.height / 6) + 28 + 21,
globalScene.scaledCanvas.width - this.getWindowWidth(),
-globalScene.scaledCanvas.height + 28 + 21,
this.getWindowWidth(),
24,
);
@ -82,8 +82,8 @@ export abstract class AbstractBindingUiHandler extends UiHandler {
this.optionSelectContainer.add(this.titleBg);
this.actionBg = addWindow(
globalScene.game.canvas.width / 6 - this.getWindowWidth(),
-(globalScene.game.canvas.height / 6) + this.getWindowHeight() + 28 + 21 + 21,
globalScene.scaledCanvas.width - this.getWindowWidth(),
-globalScene.scaledCanvas.height + this.getWindowHeight() + 28 + 21 + 21,
this.getWindowWidth(),
24,
);
@ -102,8 +102,8 @@ export abstract class AbstractBindingUiHandler extends UiHandler {
this.optionSelectContainer.add(this.timerText);
this.optionSelectBg = addWindow(
globalScene.game.canvas.width / 6 - this.getWindowWidth(),
-(globalScene.game.canvas.height / 6) + this.getWindowHeight() + 28,
globalScene.scaledCanvas.width - this.getWindowWidth(),
-globalScene.scaledCanvas.height + this.getWindowHeight() + 28,
this.getWindowWidth(),
this.getWindowHeight(),
);

14
src/ui/settings/abstract-control-settings-ui-handler.ts
View File

@ -96,11 +96,11 @@ export abstract class AbstractControlSettingsUiHandler extends UiHandler {
const ui = this.getUi();
this.navigationIcons = {};
this.settingsContainer = globalScene.add.container(1, -(globalScene.game.canvas.height / 6) + 1);
this.settingsContainer = globalScene.add.container(1, -globalScene.scaledCanvas.height + 1);
this.settingsContainer.setName(`settings-${this.titleSelected}`);
this.settingsContainer.setInteractive(
new Phaser.Geom.Rectangle(0, 0, globalScene.game.canvas.width / 6, globalScene.game.canvas.height / 6),
new Phaser.Geom.Rectangle(0, 0, globalScene.scaledCanvas.width, globalScene.scaledCanvas.height),
Phaser.Geom.Rectangle.Contains,
);
@ -109,15 +109,15 @@ export abstract class AbstractControlSettingsUiHandler extends UiHandler {
this.optionsBg = addWindow(
0,
this.navigationContainer.height,
globalScene.game.canvas.width / 6 - 2,
globalScene.game.canvas.height / 6 - 16 - this.navigationContainer.height - 2,
globalScene.scaledCanvas.width - 2,
globalScene.scaledCanvas.height - 16 - this.navigationContainer.height - 2,
);
this.optionsBg.setOrigin(0, 0);
this.actionsBg = addWindow(
0,
globalScene.game.canvas.height / 6 - this.navigationContainer.height,
globalScene.game.canvas.width / 6 - 2,
globalScene.scaledCanvas.height - this.navigationContainer.height,
globalScene.scaledCanvas.width - 2,
22,
);
this.actionsBg.setOrigin(0, 0);
@ -597,7 +597,7 @@ export abstract class AbstractControlSettingsUiHandler extends UiHandler {
// Check if the cursor object exists, if not, create it.
if (!this.cursorObj) {
const cursorWidth = globalScene.game.canvas.width / 6 - (this.scrollBar.visible ? 16 : 10);
const cursorWidth = globalScene.scaledCanvas.width - (this.scrollBar.visible ? 16 : 10);
this.cursorObj = globalScene.add.nineslice(0, 0, "summary_moves_cursor", undefined, cursorWidth, 16, 1, 1, 1, 1);
this.cursorObj.setOrigin(0, 0); // Set the origin to the top-left corner.
this.optionsContainer.add(this.cursorObj); // Add the cursor to the options container.

14
src/ui/settings/abstract-settings-ui-handler.ts
View File

@ -56,10 +56,10 @@ export class AbstractSettingsUiHandler extends MessageUiHandler {
setup() {
const ui = this.getUi();
this.settingsContainer = globalScene.add.container(1, -(globalScene.game.canvas.height / 6) + 1);
this.settingsContainer = globalScene.add.container(1, -globalScene.scaledCanvas.height + 1);
this.settingsContainer.setName(`settings-${this.title}`);
this.settingsContainer.setInteractive(
new Phaser.Geom.Rectangle(0, 0, globalScene.game.canvas.width / 6, globalScene.game.canvas.height / 6 - 20),
new Phaser.Geom.Rectangle(0, 0, globalScene.scaledCanvas.width, globalScene.scaledCanvas.height - 20),
Phaser.Geom.Rectangle.Contains,
);
@ -70,16 +70,16 @@ export class AbstractSettingsUiHandler extends MessageUiHandler {
this.optionsBg = addWindow(
0,
this.navigationContainer.height,
globalScene.game.canvas.width / 6 - 2,
globalScene.game.canvas.height / 6 - 16 - this.navigationContainer.height - 2,
globalScene.scaledCanvas.width - 2,
globalScene.scaledCanvas.height - 16 - this.navigationContainer.height - 2,
);
this.optionsBg.setName("window-options-bg");
this.optionsBg.setOrigin(0, 0);
const actionsBg = addWindow(
0,
globalScene.game.canvas.height / 6 - this.navigationContainer.height,
globalScene.game.canvas.width / 6 - 2,
globalScene.scaledCanvas.height - this.navigationContainer.height,
globalScene.scaledCanvas.width - 2,
22,
);
actionsBg.setOrigin(0, 0);
@ -375,7 +375,7 @@ export class AbstractSettingsUiHandler extends MessageUiHandler {
const ret = super.setCursor(cursor);
if (!this.cursorObj) {
const cursorWidth = globalScene.game.canvas.width / 6 - (this.scrollBar.visible ? 16 : 10);
const cursorWidth = globalScene.scaledCanvas.width - (this.scrollBar.visible ? 16 : 10);
this.cursorObj = globalScene.add.nineslice(0, 0, "summary_moves_cursor", undefined, cursorWidth, 16, 1, 1, 1, 1);
this.cursorObj.setOrigin(0, 0);
this.optionsContainer.add(this.cursorObj);

2
src/ui/settings/navigation-menu.ts
View File

@ -124,7 +124,7 @@ export class NavigationMenu extends Phaser.GameObjects.Container {
*/
setup() {
const navigationManager = NavigationManager.getInstance();
const headerBg = addWindow(0, 0, globalScene.game.canvas.width / 6 - 2, 24);
const headerBg = addWindow(0, 0, globalScene.scaledCanvas.width - 2, 24);
headerBg.setOrigin(0, 0);
this.add(headerBg);
this.width = headerBg.width;

14
src/ui/starter-select-ui-handler.ts
View File

@ -408,15 +408,15 @@ export class StarterSelectUiHandler extends MessageUiHandler {
const langSettingKey = Object.keys(languageSettings).find(lang => currentLanguage.includes(lang)) ?? "en";
const textSettings = languageSettings[langSettingKey];
this.starterSelectContainer = globalScene.add.container(0, -globalScene.game.canvas.height / 6);
this.starterSelectContainer = globalScene.add.container(0, -globalScene.scaledCanvas.height);
this.starterSelectContainer.setVisible(false);
ui.add(this.starterSelectContainer);
const bgColor = globalScene.add.rectangle(
0,
0,
globalScene.game.canvas.width / 6,
globalScene.game.canvas.height / 6,
globalScene.scaledCanvas.width,
globalScene.scaledCanvas.height,
0x006860,
);
bgColor.setOrigin(0, 0);
@ -1164,7 +1164,7 @@ export class StarterSelectUiHandler extends MessageUiHandler {
this.filterInstructionsContainer.setVisible(true);
this.starterSelectContainer.add(this.filterInstructionsContainer);
this.starterSelectMessageBoxContainer = globalScene.add.container(0, globalScene.game.canvas.height / 6);
this.starterSelectMessageBoxContainer = globalScene.add.container(0, globalScene.scaledCanvas.height);
this.starterSelectMessageBoxContainer.setVisible(false);
this.starterSelectContainer.add(this.starterSelectMessageBoxContainer);
@ -1188,12 +1188,10 @@ export class StarterSelectUiHandler extends MessageUiHandler {
this.starterSelectContainer.add(this.statsContainer);
// add the info overlay last to be the top most ui element and prevent the IVs from overlaying this
const overlayScale = 1;
this.moveInfoOverlay = new MoveInfoOverlay({
scale: overlayScale,
top: true,
x: 1,
y: globalScene.game.canvas.height / 6 - MoveInfoOverlay.getHeight(overlayScale) - 29,
y: globalScene.scaledCanvas.height - MoveInfoOverlay.getHeight() - 29,
});
this.starterSelectContainer.add(this.moveInfoOverlay);
@ -1394,7 +1392,7 @@ export class StarterSelectUiHandler extends MessageUiHandler {
this.starterSelectMessageBoxContainer.setY(0);
this.message.setY(4);
} else {
this.starterSelectMessageBoxContainer.setY(globalScene.game.canvas.height / 6);
this.starterSelectMessageBoxContainer.setY(globalScene.scaledCanvas.height);
this.starterSelectMessageBox.setOrigin(0, 1);
this.message.setY(singleLine ? -22 : -37);
}

8
src/ui/title-ui-handler.ts
View File

@ -36,12 +36,12 @@ export class TitleUiHandler extends OptionSelectUiHandler {
const ui = this.getUi();
this.titleContainer = globalScene.add.container(0, -(globalScene.game.canvas.height / 6));
this.titleContainer = globalScene.add.container(0, -globalScene.scaledCanvas.height);
this.titleContainer.setName("title");
this.titleContainer.setAlpha(0);
ui.add(this.titleContainer);
const logo = globalScene.add.image(globalScene.game.canvas.width / 6 / 2, 8, "logo");
const logo = globalScene.add.image(globalScene.scaledCanvas.width / 2, 8, "logo");
logo.setOrigin(0.5, 0);
this.titleContainer.add(logo);
@ -53,7 +53,7 @@ export class TitleUiHandler extends OptionSelectUiHandler {
this.playerCountLabel = addTextObject(
// Actual y position will be determined after the title menu has been populated with options
globalScene.game.canvas.width / 6 - 2,
globalScene.scaledCanvas.width - 2,
0,
`? ${i18next.t("menu:playersOnline")}`,
TextStyle.MESSAGE,
@ -131,7 +131,7 @@ export class TitleUiHandler extends OptionSelectUiHandler {
if (ret) {
// Moving player count to top of the menu
this.playerCountLabel.setY(globalScene.game.canvas.height / 6 - 13 - this.getWindowHeight());
this.playerCountLabel.setY(globalScene.scaledCanvas.height - 13 - this.getWindowHeight());
this.splashMessage = randItem(getSplashMessages());
this.splashMessageText.setText(

16
src/ui/ui.ts
View File

@ -121,7 +121,7 @@ export class UI extends Phaser.GameObjects.Container {
private overlayActive: boolean;
constructor() {
super(globalScene, 0, globalScene.game.canvas.height / 6);
super(globalScene, 0, globalScene.scaledCanvas.height);
this.mode = UiMode.MESSAGE;
this.modeChain = [];
@ -180,13 +180,7 @@ export class UI extends Phaser.GameObjects.Container {
for (const handler of this.handlers) {
handler.setup();
}
this.overlay = globalScene.add.rectangle(
0,
0,
globalScene.game.canvas.width / 6,
globalScene.game.canvas.height / 6,
0,
);
this.overlay = globalScene.add.rectangle(0, 0, globalScene.scaledCanvas.width, globalScene.scaledCanvas.height, 0);
this.overlay.setName("rect-ui-overlay");
this.overlay.setOrigin(0, 0);
globalScene.uiContainer.add(this.overlay);
@ -437,15 +431,15 @@ export class UI extends Phaser.GameObjects.Container {
if (isTouch) {
// If we are in the top left quadrant on mobile, move the tooltip to the top right corner
if (pointerX <= globalScene.game.canvas.width / 2 && pointerY <= globalScene.game.canvas.height / 2) {
x = globalScene.game.canvas.width / 6 - tooltipWidth - padding;
x = globalScene.scaledCanvas.width - tooltipWidth - padding;
}
} else {
// If the tooltip would go offscreen on the right, or is close to it, move to the left of the cursor
if (x + tooltipWidth + padding > globalScene.game.canvas.width / 6) {
if (x + tooltipWidth + padding > globalScene.scaledCanvas.width) {
x = Math.max(padding, pointerX / 6 - tooltipWidth - padding);
}
// If the tooltip would go offscreen at the bottom, or is close to it, move above the cursor
if (y + tooltipHeight + padding > globalScene.game.canvas.height / 6) {
if (y + tooltipHeight + padding > globalScene.scaledCanvas.height) {
y = Math.max(padding, pointerY / 6 - tooltipHeight - padding);
}
}