[MIRROR] Fixes broken icons in the crafting menu for good (#28788)

* Fixes broken icons in the crafting menu for good (#84788)

## About The Pull Request
- Continuation of #75649

Even after that PR some icons that are not 32x32 still appear broken
under the requirement sections
![Screenshot
(430)](https://github.com/tgstation/tgstation/assets/110812394/75bb357f-18c4-4556-b267-2df192ddd8d7)

Now all icons are cached away into its own list and we look it up. To
reduce this list size we only store icons that are not the standard
32x32(from debugging there are only 20 items as of now). Icons that are
of standard size can be inferred from the cooking mode & the atom id.
Basically we now get correct icons for everything

![Screenshot
(431)](https://github.com/tgstation/tgstation/assets/110812394/6e1b55ef-3d12-4d1b-8579-33c5a2c120fa)

Sometime soon i do plan to follow up on
https://github.com/tgstation/tgstation/pull/75649#issuecomment-1562767046
& remove all `preview_icons` but not today

## Changelog
🆑
fix: all icons in the crafting menu (some that you missed) are now fixed
permanently
/🆑

---------

Co-authored-by: Ghom <42542238+Ghommie@ users.noreply.github.com>

* Fixes broken icons in the crafting menu for good

---------

Co-authored-by: SyncIt21 <110812394+SyncIt21@users.noreply.github.com>
Co-authored-by: Ghom <42542238+Ghommie@ users.noreply.github.com>
This commit is contained in:
SkyratBot
2024-07-12 09:35:34 +05:30
committed by GitHub
co-authored by Ghom SyncIt21
parent 396b36393c
commit 5f7a1fa550
2 changed files with 44 additions and 30 deletions
+16 -11
View File
@@ -499,12 +499,26 @@
var/list/atoms = mode ? GLOB.cooking_recipes_atoms : GLOB.crafting_recipes_atoms
// Prepare atom data
//load sprite sheets and select the correct one based on the mode
var/static/list/sprite_sheets
if(isnull(sprite_sheets))
sprite_sheets = ui_assets()
var/datum/asset/spritesheet/sheet = sprite_sheets[mode ? 2 : 1]
data["icon_data"] = list()
for(var/atom/atom as anything in atoms)
var/atom_id = atoms.Find(atom)
data["atom_data"] += list(list(
"name" = initial(atom.name),
"is_reagent" = ispath(atom, /datum/reagent/)
"is_reagent" = ispath(atom, /datum/reagent/),
))
var/icon_size = sheet.icon_size_id("a[atom_id]")
if(!endswith(icon_size, "32x32"))
data["icon_data"]["[atom_id]"] = "[icon_size] a[atom_id]"
// Prepare materials data
for(var/atom/atom as anything in material_occurences)
if(material_occurences[atom] == 1)
@@ -578,16 +592,7 @@
data["ref"] = "[REF(recipe)]"
var/atom/atom = recipe.result
//load sprite sheets and select the correct one based on the mode
var/static/list/sprite_sheets
if(isnull(sprite_sheets))
sprite_sheets = ui_assets()
var/datum/asset/spritesheet/sheet = sprite_sheets[mode ? 2 : 1]
//infer icon size of this atom
var/atom_id = atoms.Find(atom)
var/icon_size = sheet.icon_size_id("a[atom_id]")
data["icon"] = "[icon_size] a[atom_id]"
data["id"] = atoms.Find(atom)
var/recipe_data = recipe.crafting_ui_data()
for(var/new_data in recipe_data)
@@ -108,12 +108,17 @@ enum TABS {
type AtomData = {
name: string;
is_reagent: BooleanLike;
icon: string;
};
type Atoms = {
[key: number]: number;
};
type Icons = {
[key: number]: string;
};
type Material = {
atom_id: string;
occurences: number;
@@ -121,7 +126,7 @@ type Material = {
type Recipe = {
ref: string;
icon: string;
id: number;
name: string;
desc: string;
category: string;
@@ -154,6 +159,7 @@ type Data = {
// Static
diet: Diet;
atom_data: AtomData[];
icon_data: Icons;
recipes: Recipe[];
categories: string[];
material_occurences: Material[];
@@ -161,6 +167,14 @@ type Data = {
complexity: number;
};
const findIcon = (atom_id: number, data: Data): string => {
let icon: string = data.icon_data[atom_id];
if (!icon) {
icon = (data.mode ? 'cooking32x32' : 'crafting32x32') + ' a' + atom_id;
}
return icon;
};
export const PersonalCrafting = (props) => {
const { act, data } = useBackend<Data>();
const {
@@ -555,10 +569,12 @@ export const PersonalCrafting = (props) => {
};
const MaterialContent = (props) => {
const { atom_id, occurences } = props;
const { data } = useBackend<Data>();
const { atom_id, occurences } = props;
const name = data.atom_data[atom_id - 1].name;
const mode = data.mode;
const icon = findIcon(atom_id, data);
return (
<Stack>
<Stack.Item>
@@ -567,10 +583,7 @@ const MaterialContent = (props) => {
inline
ml={-1.5}
mr={-0.5}
className={classes([
mode ? 'cooking32x32' : 'crafting32x32',
'a' + atom_id,
])}
className={icon}
/>
</Stack.Item>
<Stack.Item
@@ -627,7 +640,7 @@ const RecipeContentCompact = ({ item, craftable, busy, mode }) => {
<Section>
<Stack my={-0.75}>
<Stack.Item>
<Box className={item.icon} />
<Box className={findIcon(item.id, data)} />
</Stack.Item>
<Stack.Item grow>
<Stack>
@@ -756,7 +769,7 @@ const RecipeContentCompact = ({ item, craftable, busy, mode }) => {
};
const RecipeContent = ({ item, craftable, busy, mode, diet }) => {
const { act } = useBackend<Data>();
const { act, data } = useBackend<Data>();
return (
<Section>
<Stack>
@@ -767,7 +780,7 @@ const RecipeContent = ({ item, craftable, busy, mode, diet }) => {
transform: 'scale(1.5)',
}}
m={'16px'}
className={item.icon}
className={findIcon(item.id, data)}
/>
</Box>
</Stack.Item>
@@ -929,9 +942,8 @@ const RecipeContent = ({ item, craftable, busy, mode, diet }) => {
const AtomContent = ({ atom_id, amount }) => {
const { data } = useBackend<Data>();
const name = data.atom_data[atom_id - 1]?.name;
const is_reagent = data.atom_data[atom_id - 1]?.is_reagent;
const mode = data.mode;
const atom: AtomData = data.atom_data[atom_id - 1];
return (
<Box my={1}>
<Box
@@ -939,14 +951,11 @@ const AtomContent = ({ atom_id, amount }) => {
inline
my={-1}
mr={0.5}
className={classes([
mode ? 'cooking32x32' : 'crafting32x32',
'a' + atom_id,
])}
className={findIcon(atom_id, data)}
/>
<Box inline verticalAlign="middle">
{name}
{is_reagent ? `\xa0${amount}u` : amount > 1 && `\xa0${amount}x`}
{atom.name}
{atom.is_reagent ? `\xa0${amount}u` : amount > 1 && `\xa0${amount}x`}
</Box>
</Box>
) as any;