Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[UI] Reorganize and cleanup images/ui folder #461

Merged
merged 19 commits into from
Feb 13, 2025

Conversation

MokaStitcher
Copy link
Contributor

@MokaStitcher MokaStitcher commented Feb 9, 2025

Goes with #419
The main changes to review are in loading-scene and scene-base

What are the changes the user will see?

nothing (compared to the UI Theme PR)

Why am I making these changes?

to avoid having too many changed files on the main PR

What are the changes from a developer perspective?

  • deleted ui/legacy folder
  • created an ImagesFolder enum to keep track of the various folders where images are stored
  • changed the loadImages, loadAtlas and LoadSpritesheet functions in SceneBase to expect an ImagesFolder
  • renamed the statuses and types images to status_icons and type_icons and moved them to the ui folder
  • tried to organize UI images in subfolders
    • cursors
    • game-icons, for pokemon specific icons (candy, ribbon, etc.)
    • menu-icons, for generic icons (save, settings, etc.)
    • notification-bars
    • party for party ui specific images
    • pokemon_info for ui elements used to display pokemon info in battle and elsewhere (hp, exp, etc)
    • status-icons for the status icons, since there is an image per language
    • summary for party ui specific images
    • time-of-day_ for the time of day icons
    • type-icons for the type icons, since there is an image per language
    • windows for the game windows (+ battle message box and trainer nameplate)
  • renamed a couple icon files
  • deleted a few unused images
  • all changes are reflected in loading-scene.ts

There are still a few unsorted images but the folder should be way easier to navigate now

Screenshots/Videos

new folder structure

image

How to test the changes?

run the game and make sure there are no black and green boxes I guess lol

Checklist

  • I'm using beta as my base branch
  • There is no overlap with another PR?
  • The PR is self-contained and cannot be split into smaller PRs?
  • Have I provided a clear explanation of the changes?
  • Have I tested the changes manually?
  • Are all unit tests still passing? (npm run test:silent)
    • Have I created new automated tests (npm run create-test) or updated existing tests related to the PR's changes?
  • Have I provided screenshots/videos of the changes (if applicable)? see main PR
    • Have I made sure that any UI change works for both UI themes (default and legacy)?

Are there any localization additions or changes? If so:

@MokaStitcher MokaStitcher added the UI/UX User interface/-experience related label Feb 9, 2025
@MokaStitcher MokaStitcher mentioned this pull request Feb 9, 2025
11 tasks
Copy link
Contributor

@Tempo-anon Tempo-anon left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Just some nits. Otherwise it's just deletions and renames

this.loadImage("summary_moves", currentFolder);
this.loadImage("summary_moves_effect", currentFolder);
this.loadImage("summary_moves_overlay_row", currentFolder);
this.loadImage("summary_moves_overlay_pp", currentFolder);
for (let t = 1; t <= 3; t++) {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

nit: magic numbers here

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

the whole thing is magic strings that depend on the existing files. This is just a shortcut instead of doing

this.loadImage(`summary_tabs_1`, currentFolder);
this.loadImage(`summary_tabs_2`, currentFolder);
this.loadImage(`summary_tabs_3`, currentFolder);

I guess I could export the Page enum from the summary UI handler and use its length instead of 3, but I'm not sure how useful that would be in the long run?
But I will add a comment to explain what these correspond to.

# Conflicts:
#	src/data/battle-anims.ts
#	src/loading-scene.ts
#	src/phases/encounter-phase.ts
#	src/scene-base.ts
# Conflicts:
#	src/loading-scene.ts
#	src/ui/run-history-ui-handler.ts
@MokaStitcher
Copy link
Contributor Author

Suggestion to rename the "statuses" files and keys to "status"

#419 (comment)

@MokaStitcher
Copy link
Contributor Author

Created an ImagesFolder enum instead of what I was doing before, so dismissing the review

@frutescens frutescens merged commit 4df33ef into refactor/ui-theme Feb 13, 2025
@frutescens frutescens deleted the refactor/ui-images-folder branch February 13, 2025 23:53
CodeTappert pushed a commit that referenced this pull request Feb 14, 2025
* remove unneeded 'uiTheme' parameter from text related functions

* remove legacy-specific code and images in ui handlers

* improve handling of localized images and atlases

* refactor UI elements that change color based on window type

* make scrollbar proper nineslices and dependant on window type

* change legacy theme to light. Remove legacy files loading

* use same json for language dependant atlases

* make windows and cursor ui theme dependant

* use old legacy summary move cursor for both themes

* change ui theme settings to dark/light

* doc update

* create main/shadow color combinations for text color

* replace uses of getTextColor with setTextColor and getBBCodeFrag calls

* update pr template

* code review suggestions & documentation

* code review suggestions

* add doc to textColor enum

* move window dependent keys array

* [UI] Reorganize and cleanup images/ui folder (#461)

* delete ui/legacy folder

* move time of day icons to their own folder

* move pokemon battle info images to their own folder

* move party ui images to their own folder

* move summary ui images to their own folder

* move various cursors to their own folder

* move icons to their own folders

* move info bars to their own folder

* consolidate windows folder

* consolidate game-icons folder

* consolidate cursors folder

* cleanup

* move status and type atlases to their own folder

* create an enum to keep track of valid images folders

* rename status icons and type icons files
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
UI/UX User interface/-experience related
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants