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

Using scaledCanvas everywhere

Browse Source
This commit is contained in:
Wlowscha 2025-07-28 22:45:04 +02:00
parent 5fb381cc48
commit 2df8a7f255
No known key found for this signature in database
GPG Key ID: 3C8F1AD330565D04
45 changed files with 142 additions and 153 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -721,7 +721,7 @@ function doBugTypeMoveTutor(): Promise<void> {
right: true,
x: 1,
y: -MoveInfoOverlay.getHeight(true) - 1,
width: globalScene.game.canvas.width / 6 - 2,
width: globalScene.scaledCanvas.width - 2,
});
globalScene.ui.add(moveInfoOverlay);

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

@ -561,14 +561,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);

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

@ -26,7 +26,7 @@ export class EndCardPhase extends Phase {
this.text = addTextObject(
globalScene.game.canvas.width / 12,
globalScene.game.canvas.height / 6 - 16,
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);

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);

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

@ -111,7 +111,7 @@ export class FightUiHandler extends UiHandler implements InfoToggle {
right: true,
x: 0,
y: -MoveInfoOverlay.getHeight(true),
width: globalScene.game.canvas.width / 6 + 4,
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,

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);
@ -154,8 +154,8 @@ export abstract class ModalUiHandler extends UiHandler {
const [width, height] = [this.getWidth(config), 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);

13
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);
@ -152,7 +149,7 @@ export class ModifierSelectUiHandler extends AwaitableUiHandler {
right: true,
x: 1,
y: -MoveInfoOverlay.getHeight(true) - 1,
width: globalScene.game.canvas.width / 6 - 2,
width: globalScene.scaledCanvas.width - 2,
});
ui.add(this.moveInfoOverlay);
// register the overlay to receive toggle events
@ -217,7 +214,7 @@ 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,
@ -241,7 +238,7 @@ 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)),
@ -564,7 +561,7 @@ export class ModifierSelectUiHandler extends AwaitableUiHandler {
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(

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: () => {

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

@ -302,7 +302,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();

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",

20
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);
@ -685,13 +685,13 @@ export class PokedexPageUiHandler extends MessageUiHandler {
this.moveInfoOverlay = new MoveInfoOverlay({
top: true,
x: 1,
y: globalScene.game.canvas.height / 6 - MoveInfoOverlay.getHeight() - 29,
y: globalScene.scaledCanvas.height - MoveInfoOverlay.getHeight() - 29,
});
this.starterSelectContainer.add(this.moveInfoOverlay);
this.infoOverlay = new PokedexInfoOverlay({
x: 1,
y: globalScene.game.canvas.height / 6 - PokedexInfoOverlay.getHeight() - 29,
y: globalScene.scaledCanvas.height - PokedexInfoOverlay.getHeight() - 29,
});
this.starterSelectContainer.add(this.infoOverlay);
@ -1100,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

@ -244,15 +244,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);
@ -543,7 +543,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);
@ -783,7 +783,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);

12
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);
@ -972,7 +972,7 @@ export class RunInfoUiHandler extends UiHandler {
endCard.setScale(0.5);
const text = addTextObject(
globalScene.game.canvas.width / 12,
globalScene.game.canvas.height / 6 - 16,
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;

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

@ -404,15 +404,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);
@ -1160,7 +1160,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);
@ -1187,7 +1187,7 @@ export class StarterSelectUiHandler extends MessageUiHandler {
this.moveInfoOverlay = new MoveInfoOverlay({
top: true,
x: 1,
y: globalScene.game.canvas.height / 6 - MoveInfoOverlay.getHeight() - 29,
y: globalScene.scaledCanvas.height - MoveInfoOverlay.getHeight() - 29,
});
this.starterSelectContainer.add(this.moveInfoOverlay);
@ -1388,7 +1388,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);
}
}