From 6f26d9196d66c9fcf061ff4426d90b3e348baf9d Mon Sep 17 00:00:00 2001 From: Brandon Bay Date: Wed, 4 Sep 2024 10:59:21 -0400 Subject: [PATCH] Add ability and passive tooltips to starter select screen --- .../utils/mocks/mocksContainer/mockText.ts | 4 +++ src/ui/starter-select-ui-handler.ts | 36 +++++++++++++++++-- src/ui/ui.ts | 18 +++++++--- 3 files changed, 51 insertions(+), 7 deletions(-) diff --git a/src/test/utils/mocks/mocksContainer/mockText.ts b/src/test/utils/mocks/mocksContainer/mockText.ts index 6b9ecf083fd..424354703d7 100644 --- a/src/test/utils/mocks/mocksContainer/mockText.ts +++ b/src/test/utils/mocks/mocksContainer/mockText.ts @@ -197,6 +197,10 @@ export default class MockText implements MockGameObject { this.color = color; }); + setInteractive(hitArea, hitAreaCallback, dropZone) { + return null; + } + setShadowColor(color) { // Sets the shadow color. // return this.phaserText.setShadowColor(color); diff --git a/src/ui/starter-select-ui-handler.ts b/src/ui/starter-select-ui-handler.ts index 6b75c46bd45..7c07aa5a7ea 100644 --- a/src/ui/starter-select-ui-handler.ts +++ b/src/ui/starter-select-ui-handler.ts @@ -561,10 +561,13 @@ export default class StarterSelectUiHandler extends MessageUiHandler { this.pokemonAbilityLabelText = addTextObject(this.scene, 6, 127 + starterInfoYOffset, i18next.t("starterSelectUiHandler:ability"), TextStyle.SUMMARY_ALT, { fontSize: starterInfoTextSize }); this.pokemonAbilityLabelText.setOrigin(0, 0); this.pokemonAbilityLabelText.setVisible(false); + this.starterSelectContainer.add(this.pokemonAbilityLabelText); this.pokemonAbilityText = addTextObject(this.scene, starterInfoXPos, 127 + starterInfoYOffset, "", TextStyle.SUMMARY_ALT, { fontSize: starterInfoTextSize }); this.pokemonAbilityText.setOrigin(0, 0); + this.pokemonAbilityText.setInteractive(new Phaser.Geom.Rectangle(0, 0, 250, 55), Phaser.Geom.Rectangle.Contains); + this.starterSelectContainer.add(this.pokemonAbilityText); this.pokemonPassiveLabelText = addTextObject(this.scene, 6, 136 + starterInfoYOffset, i18next.t("starterSelectUiHandler:passive"), TextStyle.SUMMARY_ALT, { fontSize: starterInfoTextSize }); @@ -574,6 +577,7 @@ export default class StarterSelectUiHandler extends MessageUiHandler { this.pokemonPassiveText = addTextObject(this.scene, starterInfoXPos, 136 + starterInfoYOffset, "", TextStyle.SUMMARY_ALT, { fontSize: starterInfoTextSize }); this.pokemonPassiveText.setOrigin(0, 0); + this.pokemonPassiveText.setInteractive(new Phaser.Geom.Rectangle(0, 0, 250, 55), Phaser.Geom.Rectangle.Contains); this.starterSelectContainer.add(this.pokemonPassiveText); this.pokemonPassiveDisabledIcon = this.scene.add.sprite(starterInfoXPos, 137 + starterInfoYOffset, "icon_stop"); @@ -1921,6 +1925,18 @@ export default class StarterSelectUiHandler extends MessageUiHandler { } } while (newAbilityIndex !== this.abilityCursor); starterAttributes.ability = newAbilityIndex; // store the selected ability + + const { visible: tooltipVisible, content: oldTooltip } = (this.scene as BattleScene).ui.getTooltip(); + + if (tooltipVisible) { + const oldAbility = allAbilities[this.lastSpecies.getAbility(this.abilityCursor)]; + const newAbility = allAbilities[this.lastSpecies.getAbility(newAbilityIndex)]; + + if (oldTooltip.replace(/\s/g, "") === oldAbility.description.replace(/\s/g, "")) { + (this.scene as BattleScene).ui.editTooltip("", `${newAbility.description}`); + } + } + this.setSpeciesDetails(this.lastSpecies, undefined, undefined, undefined, undefined, newAbilityIndex, undefined); success = true; } @@ -2693,6 +2709,12 @@ export default class StarterSelectUiHandler extends MessageUiHandler { this.abilityCursor = species ? this.scene.gameData.getStarterSpeciesDefaultAbilityIndex(species) : 0; this.natureCursor = species ? this.scene.gameData.getSpeciesDefaultNature(species) : 0; + if ((this.scene as BattleScene).ui.getTooltip().visible) { + (this.scene as BattleScene).ui.hideTooltip(); + } + this.pokemonAbilityText.off("pointerover"); + this.pokemonPassiveText.off("pointerover"); + const starterAttributes : StarterAttributes | null = species ? {...this.starterPreferences[species.speciesId]} : null; if (starterAttributes?.nature) { @@ -3081,8 +3103,8 @@ export default class StarterSelectUiHandler extends MessageUiHandler { } if (dexEntry.caughtAttr) { - const ability = this.lastSpecies.getAbility(abilityIndex!); // TODO: is this bang correct? - this.pokemonAbilityText.setText(allAbilities[ability].name); + const ability = allAbilities[this.lastSpecies.getAbility(abilityIndex!)]; // TODO: is this bang correct? + this.pokemonAbilityText.setText(ability.name); const isHidden = abilityIndex === (this.lastSpecies.ability2 ? 2 : 1); this.pokemonAbilityText.setColor(this.getTextColor(!isHidden ? TextStyle.SUMMARY_ALT : TextStyle.SUMMARY_GOLD)); @@ -3091,6 +3113,11 @@ export default class StarterSelectUiHandler extends MessageUiHandler { const passiveAttr = this.scene.gameData.starterData[species.speciesId].passiveAttr; const passiveAbility = allAbilities[starterPassiveAbilities[this.lastSpecies.speciesId]]; + if (this.pokemonAbilityText.visible) { + this.pokemonAbilityText.on("pointerover", () => (this.scene as BattleScene).ui.showTooltip("", `${ability.description}`, true)); + this.pokemonAbilityText.on("pointerout", () => (this.scene as BattleScene).ui.hideTooltip()); + } + if (passiveAbility) { const isUnlocked = !!(passiveAttr & PassiveAttr.UNLOCKED); const isEnabled = !!(passiveAttr & PassiveAttr.ENABLED); @@ -3107,6 +3134,11 @@ export default class StarterSelectUiHandler extends MessageUiHandler { this.pokemonPassiveText.setAlpha(textAlpha); this.pokemonPassiveText.setShadowColor(this.getTextColor(textStyle, true)); + if (this.pokemonPassiveText.visible && isUnlocked && isEnabled) { + this.pokemonPassiveText.on("pointerover", () => (this.scene as BattleScene).ui.showTooltip("", `${passiveAbility.description}`, true)); + this.pokemonPassiveText.on("pointerout", () => (this.scene as BattleScene).ui.hideTooltip()); + } + const iconPosition = { x: this.pokemonPassiveText.x + this.pokemonPassiveText.displayWidth + 1, y: this.pokemonPassiveText.y + this.pokemonPassiveText.displayHeight / 2 diff --git a/src/ui/ui.ts b/src/ui/ui.ts index 8ec91b59480..54e2baeffec 100644 --- a/src/ui/ui.ts +++ b/src/ui/ui.ts @@ -359,19 +359,27 @@ export default class UI extends Phaser.GameObjects.Container { return false; } + getTooltip(): { visible: boolean; title: string; content: string } { + return { visible: this.tooltipContainer.visible, title: this.tooltipTitle.text, content: this.tooltipContent.text }; + } + showTooltip(title: string, content: string, overlap?: boolean): void { this.tooltipContainer.setVisible(true); + this.editTooltip(title, content); + if (overlap) { + (this.scene as BattleScene).uiContainer.moveAbove(this.tooltipContainer, this); + } else { + (this.scene as BattleScene).uiContainer.moveBelow(this.tooltipContainer, this); + } + } + + editTooltip(title: string, content: string): void { this.tooltipTitle.setText(title || ""); const wrappedContent = this.tooltipContent.runWordWrap(content); this.tooltipContent.setText(wrappedContent); this.tooltipContent.y = title ? 16 : 4; this.tooltipBg.width = Math.min(Math.max(this.tooltipTitle.displayWidth, this.tooltipContent.displayWidth) + 12, 684); this.tooltipBg.height = (title ? 31 : 19) + 10.5 * (wrappedContent.split("\n").length - 1); - if (overlap) { - (this.scene as BattleScene).uiContainer.moveAbove(this.tooltipContainer, this); - } else { - (this.scene as BattleScene).uiContainer.moveBelow(this.tooltipContainer, this); - } } hideTooltip(): void {