cyberpresidentvanellope/CHOMPStation2
1
0
Fork 0
mirror of https://github.com/CHOMPStation2/CHOMPStation2.git synced 2025-12-11 18:53:06 +00:00
Code Issues Packages Projects Releases Wiki Activity

[MIRROR] Polish the microwave UI (#10748)

Browse Source 
Co-authored-by: ShadowLarkens <shadowlarkens@gmail.com>
This commit is contained in:
CHOMPStation2StaffMirrorBot
2025-04-26 03:12:52 -07:00
committed by GitHub
parent 8691060706
commit c8c53b84ec
8 changed files with 100 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
code/modules/asset_cache/assets/microwave.dm Normal file
View File

@@ -0,0 +1,5 @@
/datum/asset/simple/microwave
assets = list(
"microwave.png" = 'icons/obj/microwave_ui/base.png',
"microwave.gif" = 'icons/obj/microwave_ui/microwave.gif',
)

3
code/modules/food/kitchen/microwave.dm
View File

@@ -253,7 +253,8 @@
/obj/machinery/microwave/ui_assets(mob/user)
return list(
get_asset_datum(/datum/asset/spritesheet_batched/kitchen_recipes)
get_asset_datum(/datum/asset/spritesheet_batched/kitchen_recipes),
get_asset_datum(/datum/asset/simple/microwave)
)
/obj/machinery/microwave/tgui_static_data(mob/user)

BIN
icons/obj/microwave_ui/base.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 63 KiB

BIN
icons/obj/microwave_ui/microwave.gif Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 260 KiB

78
tgui/packages/tgui/interfaces/Microwave.tsx
View File

@@ -1,9 +1,12 @@
import { resolveAsset } from 'tgui/assets';
import { useBackend } from 'tgui/backend';
import { Window } from 'tgui/layouts';
import {
Box,
Button,
DmIcon,
Icon,
Image,
Section,
Stack,
Tooltip,
@@ -44,30 +47,78 @@ export const Microwave = (props) => {
let inner;
const first_item = items[0] || null;
if (broken) {
inner = (
<Section fill>
<Box color="bad">Bzzzzttttt!!</Box>
<Stack vertical fill align="center" justify="center">
<Stack.Item>
<Box color="bad" fontSize={6}>
Bzzzzttttt!!
</Box>
</Stack.Item>
<Stack.Item>
<Stack align="center" justify="space-around">
<Stack.Item>
<Icon name="fire" color="orange" size={10} />
</Stack.Item>
<Stack.Item>
<Icon name="fire" color="orange" size={10} />
</Stack.Item>
<Stack.Item>
<Icon name="fire" color="orange" size={10} />
</Stack.Item>
</Stack>
</Stack.Item>
</Stack>
</Section>
);
} else if (operating) {
inner = (
<Section fill>
<Box color="good">
Microwaving in progress!
<br />
Please wait...!
<Stack fill vertical align="center" justify="center">
<Stack.Item>
<Box position="relative" className="Microwave__Hover">
<Image src={resolveAsset('microwave.png')} />
{first_item ? (
<Box
position="absolute"
className="Microwave__Hover"
left={8}
top={10}
>
<DmIcon
icon={first_item.icon.icon}
icon_state={first_item.icon.icon_state}
width="64px"
height="64px"
/>
</Box>
) : null}
<Image
position="absolute"
left={0}
top={0}
src={resolveAsset('microwave.gif')}
/>
</Box>
</Stack.Item>
</Stack>
</Section>
);
} else if (dirty) {
inner = (
<Section fill>
<Section fill textAlign="center">
<Stack fill vertical align="center" justify="center" fontSize={2}>
<Stack.Item>
<Box color="bad">
This microwave is dirty!
<br />
Please clean it before use!
</Box>
</Stack.Item>
</Stack>
</Section>
);
} else if (items.length) {
@@ -75,14 +126,20 @@ export const Microwave = (props) => {
} else {
inner = (
<Section fill>
<Box color="bad">{config.title} is empty.</Box>
<Stack fill align="center" justify="center">
<Stack.Item>
<Box color="bad" fontSize={2}>
{config.title} is empty.
</Box>
</Stack.Item>
</Stack>
</Section>
);
}
return (
<Window width={520} height={300}>
<Window.Content scrollable>{inner}</Window.Content>
<Window.Content>{inner}</Window.Content>
</Window>
);
};
@@ -96,6 +153,7 @@ const MicrowaveContents = (props) => {
<Section
fill
title="Ingredients"
scrollable
buttons={
<Stack>
<Stack.Item>
@@ -201,6 +259,10 @@ const MicrowaveContents = (props) => {
ml="16px"
mt="16px"
className={classes(['kitchen_recipes32x32', recipe])}
style={{
transform: 'scale(3)',
imageRendering: 'pixelated',
}}
/>
) : (
<DmIcon

15
tgui/packages/tgui/styles/interfaces/Microwave.scss Normal file
View File

@@ -0,0 +1,15 @@
@keyframes microwave-floating {
0% {
transform: translateY(0);
}
50% {
transform: translateY(-16px);
}
100% {
transform: translateY(0);
}
}
.Microwave__Hover {
animation: microwave-floating 2s ease-in-out infinite;
}

1
tgui/packages/tgui/styles/main.scss
View File

@@ -36,6 +36,7 @@
@include meta.load-css('./interfaces/CrewManifest.scss');
@include meta.load-css('./interfaces/ExperimentConfigure.scss');
@include meta.load-css('./interfaces/FishingMinigame.scss');
@include meta.load-css('./interfaces/Microwave.scss');
@include meta.load-css('./interfaces/NuclearBomb.scss');
@include meta.load-css('./interfaces/Paper.scss');
@include meta.load-css('./interfaces/Pda.scss');

1
vorestation.dme
View File

@@ -2141,6 +2141,7 @@
#include "code\modules\asset_cache\assets\fontawesome.dm"
#include "code\modules\asset_cache\assets\icon_ref_map.dm"
#include "code\modules\asset_cache\assets\jquery.dm"
#include "code\modules\asset_cache\assets\microwave.dm"
#include "code\modules\asset_cache\assets\ntos.dm"
#include "code\modules\asset_cache\assets\permissions.dm"
#include "code\modules\asset_cache\assets\preferences.dm"