TGUI ORM MACHINE - Alloys Images (#19113)

* ORM improved alloy name

* capital letter

* Add images to "Alloys" on ORM

* FML-main part done

* Few changes

* Recipe and Descriptions

* Forgot this. widens the ORM

* quick fix

* Slight alignment fix. New images on PR

* TGUI merge conflict and tiny alignment

* diff line endings!

* added ;

* Holes and stuff

* merge conflict fix, hopefully

* SMELT moved

* Alignment and tgui bundle

* Merge Conflict fix

* Update to master + tgui bundle

* TGUI Bundle

* TGUI BUNDLE

Co-authored-by: Henri23729 <iki-hs@hotmail.com>
This commit is contained in:
Deniz
2022-10-25 23:48:53 +01:00
committed by GitHub
co-authored by Henri23729
parent 7a8cef043a
commit a272267193
6 changed files with 164 additions and 64 deletions
+2 -1
View File
@@ -329,7 +329,8 @@ GLOBAL_LIST_EMPTY(asset_datums)
verify = FALSE
/datum/asset/simple/materials/register()
for(var/n in list("metal", "glass", "silver", "gold", "diamond", "uranium", "plasma", "clown", "mime", "titanium", "plastic"))
for(var/n in list("metal", "glass", "silver", "gold", "diamond", "uranium", "plasma", "clown", "mime", "titanium", "plastic",
"rglass", "plasteel", "plastitanium", "plasmaglass", "titaniumglass", "plastitaniumglass"))
assets["sheet-[n].png"] = icon('icons/obj/items.dmi', "sheet-[n]")
assets["sheet-bluespace.png"] = icon('icons/obj/telescience.dmi', "polycrystal")
..()
+2 -1
View File
@@ -286,6 +286,7 @@
alloys += list(list(
"id" = D.id,
"name" = D.name,
"description" = D.desc,
"amount" = get_num_smeltable_alloy(D)
))
data["alloys"] = alloys
@@ -375,7 +376,7 @@
ui = SStgui.try_update_ui(user, src, ui_key, ui, force_open)
if(!ui)
ui = new(user, src, ui_key, "OreRedemption", name, 400, 600)
ui = new(user, src, ui_key, "OreRedemption", name, 500, 600)
ui.open()
ui.set_autoupdate(FALSE)
@@ -206,6 +206,7 @@
/datum/design/rglass
name = "Reinforced Glass"
desc = "Metal + Glass"
id = "rglass"
build_type = AUTOLATHE | SMELTER
materials = list(MAT_METAL = 1000, MAT_GLASS = MINERAL_MATERIAL_AMOUNT)
@@ -1,16 +1,17 @@
///////SMELTABLE ALLOYS///////
/datum/design/plasteel_alloy
name = "Plasteel (Plasma + Iron)"
name = "Plasteel"
desc = "Plasma + Iron"
id = "plasteel"
build_type = SMELTER
materials = list(MAT_METAL = MINERAL_MATERIAL_AMOUNT, MAT_PLASMA = MINERAL_MATERIAL_AMOUNT)
build_path = /obj/item/stack/sheet/plasteel
category = list("initial")
/datum/design/plastitanium_alloy
name = "Plastitanium (Plasma + Titanium)"
name = "Plastitanium"
desc = "Plasma + Titanium"
id = "plastitanium"
build_type = SMELTER
materials = list(MAT_TITANIUM = MINERAL_MATERIAL_AMOUNT, MAT_PLASMA = MINERAL_MATERIAL_AMOUNT)
@@ -18,7 +19,8 @@
category = list("initial")
/datum/design/plaglass_alloy
name = "Plasma Glass (Plasma + Glass)"
name = "Plasma Glass"
desc = "Plasma + Glass"
id = "plasmaglass"
build_type = SMELTER
materials = list(MAT_PLASMA = MINERAL_MATERIAL_AMOUNT, MAT_GLASS = MINERAL_MATERIAL_AMOUNT)
@@ -26,7 +28,8 @@
category = list("initial")
/datum/design/titaniumglass_alloy
name = "Titanium Glass (Titanium + Glass)"
name = "Titanium Glass"
desc = "Titanium + Glass"
id = "titaniumglass"
build_type = SMELTER
materials = list(MAT_TITANIUM = MINERAL_MATERIAL_AMOUNT, MAT_GLASS = MINERAL_MATERIAL_AMOUNT)
@@ -34,7 +37,8 @@
category = list("initial")
/datum/design/plastitaniumglass_alloy
name = "Plastitanium Glass (Plasma + Titanium + Glass)"
name = "Plastitanium Glass"
desc = "Plasma + Titanium + Glass"
id = "plastitaniumglass"
build_type = SMELTER
materials = list(MAT_PLASMA = MINERAL_MATERIAL_AMOUNT, MAT_TITANIUM = MINERAL_MATERIAL_AMOUNT, MAT_GLASS = MINERAL_MATERIAL_AMOUNT)
+147 -54
View File
@@ -9,6 +9,7 @@ import {
NumberInput,
Section,
} from '../components';
import { FlexItem } from '../components/Flex';
import { Window } from '../layouts';
const formatPoints = (amt) => amt.toLocaleString('en-US') + ' pts';
@@ -27,7 +28,8 @@ export const OreRedemption = (properties, context) => {
<IdDisk height="100%" />
</Flex.Item>
<Flex.Item grow="1" overflow="hidden">
<Ores height="100%" />
<Sheet height="43%" />
<Alloy height="57%" />
</Flex.Item>
</Flex>
</Window.Content>
@@ -127,33 +129,51 @@ const IdDisk = (properties, context) => {
);
};
const Ores = (properties, context) => {
/*
Manages titles under "Sheet"
*/
const Sheet = (properties, context) => {
const { act, data } = useBackend(context);
const { sheets, alloys } = data;
const { sheets } = data;
const { ...rest } = properties;
return (
<Section className="OreRedemption__Ores" p="0" {...rest}>
<OreHeader
title="Sheets"
columns={[
['Available', '20%'],
['Smelt', '15%'],
['Ore Value', '20%'],
['Available', '25%'],
['Ore Value', '15%'],
['Smelt', '20%'],
]}
/>
{sheets.map((sheet) => (
<OreLine key={sheet.id} ore={sheet} />
<SheetLine key={sheet.id} ore={sheet} />
))}
</Section>
);
};
/*
Manages titles under "Alloy"
*/
const Alloy = (properties, context) => {
const { act, data } = useBackend(context);
const { alloys } = data;
const { ...rest } = properties;
return (
<Section className="OreRedemption__Ores" p="0" {...rest}>
<OreHeader
title="Alloys"
columns={[
['Available', '20%'],
['Smelt', '15%'],
['', '20%'],
['Recipe', '50%'],
['Available', '11%'],
['Smelt', '20%'],
]}
/>
{alloys.map((alloy) => (
<OreLine key={alloy.id} ore={alloy} />
<AlloyLine key={alloy.id} ore={alloy} />
))}
</Section>
);
@@ -180,7 +200,11 @@ const OreHeader = (properties, context) => {
);
};
const OreLine = (properties, context) => {
/*
********* SHEETS BOX PROPERTIES *********
*/
const SheetLine = (properties, context) => {
const { act } = useBackend(context);
const { ore } = properties;
if (
@@ -192,51 +216,120 @@ const OreLine = (properties, context) => {
}
const cleanId = ore.id.replace('$', '');
return (
<Box className="OreLine">
<Box className="SheetLine">
<Flex width="100%">
<Flex.Item basis="45%" align="center">
{ore.value && (
<Box
as="img"
src={'sheet-' + (iconNameOverrides[cleanId] || cleanId) + '.png'}
verticalAlign="middle"
ml="-0.5rem"
<Flex.Item basis="45%" align="middle">
<Box
as="img"
src={'sheet-' + (iconNameOverrides[cleanId] || cleanId) + '.png'}
verticalAlign="middle"
ml="0rem"
/>
)}
{ore.name}
</Flex.Item>
<Flex.Item
basis="20%"
textAlign="center"
color={ore.amount > 0 ? 'good' : 'gray'}
bold={ore.amount > 0}
align="center"
>
{ore.amount.toLocaleString('en-US')}
</Flex.Item>
<Flex.Item
basis="15%"
textAlign="center"
align="center"
lineHeight="32px"
>
<NumberInput
value={0}
minValue={0}
maxValue={Math.min(ore.amount, 50)}
stepPixelSize={6}
onChange={(_e, value) =>
act(ore.value ? 'sheet' : 'alloy', {
'id': ore.id,
'amount': value,
})
}
/>
</Flex.Item>
<Flex.Item basis="20%" textAlign="center" align="center">
{ore.value}
</Flex.Item>
{ore.name}
</Flex.Item>
<Flex.Item
basis="20%"
textAlign="center"
color={ore.amount > 0 ? 'good' : 'gray'}
bold={ore.amount > 0}
align="center"
>
{ore.amount.toLocaleString('en-US')}
</Flex.Item>
<Flex.Item
basis="20%"
textAlign="center"
align="center"
>
{ore.value}
</Flex.Item>
<Flex.Item
basis="20%"
textAlign="center"
align="center"
lineHeight="32px"
>
<NumberInput
value={0}
minValue={0}
maxValue={Math.min(ore.amount, 50)}
stepPixelSize={6}
onChange={(_e, value) =>
act(ore.value ? 'sheet' : 'alloy', {
'id': ore.id,
'amount': value,
})
}
/>
</Flex.Item>
</Flex>
</Box>
);
};
/*
********* ALLOYS BOX PROPERTIES *********
*/
const AlloyLine = (properties, context) => {
const { act } = useBackend(context);
const { ore } = properties;
const cleanId = ore.id.replace('$', '');
return (
<Box className="SheetLine">
<Flex width="100%">
<Flex.Item basis="7%" align="middle">
<Box
as="img"
src={'sheet-' + (cleanId) + '.png'}
verticalAlign="middle"
ml="`0rem"
/>
</Flex.Item>
<FlexItem
basis="30%"
textAlign="middle"
align="center"
>
{ore.name}
</FlexItem>
<Flex.Item
basis="35%"
textAlign="middle"
color={ore.amount > 0 ? 'good' : 'gray'}
align="center"
>
{ore.description}
</Flex.Item>
<Flex.Item
basis="10%"
textAlign="center"
color={ore.amount > 0 ? 'good' : 'gray'}
bold={ore.amount > 0}
align="center"
>
{ore.amount.toLocaleString('en-US')}
</Flex.Item>
<Flex.Item
basis="20%"
textAlign="center"
align="center"
lineHeight="32px"
>
<NumberInput
value={0}
minValue={0}
maxValue={Math.min(ore.amount, 50)}
stepPixelSize={6}
onChange={(_e, value) =>
act(ore.value ? 'sheet' : 'alloy', {
'id': ore.id,
'amount': value,
})
}
/>
</Flex.Item>
</Flex>
</Box>
);
};
File diff suppressed because one or more lines are too long