mirror of
https://github.com/Bubberstation/Bubberstation.git
synced 2026-08-31 00:58:26 +01:00
[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  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  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:
co-authored by
Ghom
SyncIt21
parent
396b36393c
commit
5f7a1fa550
@@ -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;
|
||||
|
||||
Reference in New Issue
Block a user