mirror of
https://github.com/openfrontio/OpenFrontIO.git
synced 2026-06-26 08:44:36 +00:00
Lavodan
7fe3b03b83
## Description: Fixes #2257 (well, a part of it) This PR implements a new async helper function in client Utils.ts ( getSvgAspectRatio), which caches and then retrieves aspect ratios for Svg files. (I am not married to it being in Utils.ts, I just couldn't find a better place to put it, and it seemed like something that should be accessible to many files). It then implements this helper in RadialMenu.ts to fix incorrect aspect ratios. It uses the default value for the smaller side, and the computed value for the larger side. Before fixing the stretching in EventsDisplay.ts, this PR first consolidates the hard coded html for toggle buttons into a helper function (renderToggleButton). Afterwards, it adds width calculation to this helper function using getSvgAspectRatio. ## Potential flaws - getSvgAspectRatio might potentially be in the wrong file - EventsDisplay.ts consolidation may be out of scope, but it seemed necessary to make clean changes. It also introduces a slight delay before toggle buttons are loaded once a player enters the match - If the icon is not cached yet, the RadialMenu implementation shows the old stretched icon for a split second. In regular gameplay this should probably not be noticeable, - For some reason (I guess because of slightly too many characters) prettier split up exactly one of the renderToggleButton calls which makes it ugly, but thats what prettier wants lol - Not sure if I should add any tests? If so feel free to tell me, but I didn't so far. ## Screenshots Before <img width="323" height="416" alt="image" src="https://github.com/user-attachments/assets/709493c8-c8d6-48c1-9d44-4d6608d7da93" /> After <img width="323" height="390" alt="image" src="https://github.com/user-attachments/assets/a786c83e-2ef9-47d6-9858-1aeaa4ae548a" /> ## Please complete the following: - [x] I have added screenshots for all UI updates - [x] I process any text displayed to the user through translateText() and I've added it to the en.json file - [x] I have added relevant tests to the test directory - [x] I confirm I have thoroughly tested these changes and take full responsibility for any bugs introduced ## Please put your Discord username so you can be contacted if a bug or regression is found: Lavodan --------- Co-authored-by: Evan <evanpelle@gmail.com>