More tgui-next uis (#47333)

* More uis

cargo express console

cargo express routes

ui scale change

delete clockwork slab

chem acclimator proper

codex gigas

gigas cleanup

crew console

crew monitor work

scrap crew console for a later pr

lint fixes + rebuild

get rid of some temp files

get rid of more temp files

much better codex gigas

remove unused file

* rebuild

* rebuild
This commit is contained in:
Rob Bailey
2019-10-25 02:55:40 -07:00
committed by AnturK
parent 261c9c90f8
commit c49367f895
13 changed files with 284 additions and 102 deletions
+2 -2
View File
@@ -13,8 +13,8 @@
All sales are near instantaneous - please choose carefully"
icon_screen = "supply_express"
circuit = /obj/item/circuitboard/computer/cargo/express
ui_x = 1000
ui_y = 800
ui_x = 600
ui_y = 700
blockade_warning = "Bluespace instability detected. Delivery impossible."
req_access = list(ACCESS_QM)
+1 -1
View File
@@ -27,7 +27,7 @@
var/emptying = FALSE
ui_x = 320
ui_y = 300
ui_y = 310
/obj/machinery/plumbing/acclimator/Initialize(mapload, bolt)
. = ..()
@@ -1,45 +0,0 @@
import { Fragment } from 'inferno';
import { act } from '../byond';
import { Box, Button, Section } from '../components';
export const Acclimator = props => {
const { state } = props;
const { config, data } = state;
const { ref } = config;
return (
<Fragment>
<Section title="Acclimator">
Current Temperature - {data.chem_temp}
<Box mt={1} />
Target Temperature -
<Button
icon="thermometer-half"
content={data.target_temperature}
onClick={() => act(ref, 'set_target_temperature')} />
<Box mt={1} />
Acceptable Temperature Difference -
<Button
icon="thermometer-quarter"
content={data.allowed_temperature_difference}
onClick={() => act(ref, 'set_allowed_temperature_difference')} />
</Section>
<Section title="Status">
Current Operation - {data.acclimate_state}
<Box mt={1} />
<Button
icon="power-off"
content={data.enabled ? 'On' : 'Off'}
selected={data.enabled}
onClick={() => act(ref, 'toggle_power')} />
<Box mt={1} />
Change Volume
<Button
icon="flask"
content={data.max_volume}
onClick={() => act(ref, 'change_volume')} />
<Box mt={1} />
Current State - {data.emptying ? "Emptying" : "Filling"}
</Section>
</Fragment>
);
};
@@ -2,6 +2,7 @@ import { map } from 'common/fp';
import { Fragment } from 'inferno';
import { act } from '../byond';
import { AnimatedNumber, Box, Button, LabeledList, Section, Tabs } from '../components';
import { InterfaceLockNoticeBox } from './common/InterfaceLockNoticeBox';
export const Cargo = props => {
const { state } = props;
@@ -294,3 +295,57 @@ const Cart = props => {
</Fragment>
);
};
export const CargoExpress = props => {
const { state } = props;
const { config, data } = state;
const { ref } = config;
const supplies = data.supplies || {};
return (
<Fragment>
<InterfaceLockNoticeBox
siliconUser={data.siliconUser}
locked={data.locked}
onLockStatusChange={() => act(ref, 'lock')}
accessText="a QM-level ID card"
/>
{!data.locked &&(
<Fragment>
<Section
title="Cargo Express"
buttons={(
<Box inline bold>
<AnimatedNumber value={Math.round(data.points)} /> credits
</Box>
)}>
<LabeledList>
<LabeledList.Item label="Landing Location">
<Button
content="Cargo Bay"
selected={!data.usingBeacon}
onClick={() => act(ref, 'LZCargo')}
/>
<Button
content={(<Fragment>{data.beaconzone} ({data.beaconName})</Fragment>)}
selected={data.usingBeacon}
disabled={!data.hasBeacon}
onClick={() => act(ref, 'LZBeacon')}
/>
<Button
content={data.printMsg}
disabled={!data.canBuyBeacon}
onClick={() => act(ref, 'printBeacon')}
/>
</LabeledList.Item>
<LabeledList.Item label="Notice">
{data.message}
</LabeledList.Item>
</LabeledList>
</Section>
<Catalog state={state} supplies={supplies} />
</Fragment>
)}
</Fragment>
);
};
@@ -0,0 +1,58 @@
import { Fragment } from 'inferno';
import { act } from '../byond';
import { Box, Button, Section, LabeledList } from '../components';
export const ChemAcclimator = props => {
const { state } = props;
const { config, data } = state;
const { ref } = config;
return (
<Fragment>
<Section title="Acclimator">
<LabeledList>
<LabeledList.Item label="Current Temperature">
{data.chem_temp}
</LabeledList.Item>
<LabeledList.Item label="Target Temperature">
<Button
icon="thermometer-half"
content={data.target_temperature}
onClick={() => act(ref, 'set_target_temperature')}
/>
</LabeledList.Item>
<LabeledList.Item label="Acceptable Temp. Difference">
<Button
icon="thermometer-quarter"
content={data.allowed_temperature_difference}
onClick={() => act(ref, 'set_allowed_temperature_difference')}
/>
</LabeledList.Item>
</LabeledList>
</Section>
<Section title="Status">
<LabeledList>
<LabeledList.Item label="Current Operation">
{data.acclimate_state}
</LabeledList.Item>
<LabeledList.Item label="Power">
<Button
icon="power-off"
selected={data.enabled}
onClick={() => act(ref, 'toggle_power')}
/>
</LabeledList.Item>
<LabeledList.Item label="Change Volume">
<Button
icon="flask"
content={data.max_volume}
onClick={() => act(ref, 'change_volume')}
/>
</LabeledList.Item>
<LabeledList.Item label="Current State">
{data.emptying ? 'Emptying' : 'Filling'}
</LabeledList.Item>
</LabeledList>
</Section>
</Fragment>
);
};
@@ -0,0 +1,105 @@
import { act } from '../byond';
import { Button, LabeledList, Section } from '../components';
// TODO: refactor the backend of this it's a trainwreck
export const CodexGigas = props => {
const { state } = props;
const { config, data } = state;
const { ref } = config;
const prefixes = [
"Dark",
"Hellish",
"Fallen",
"Fiery",
"Sinful",
"Blood",
"Fluffy",
];
const titles = [
"Lord",
"Prelate",
"Count",
"Viscount",
"Vizier",
"Elder",
"Adept",
];
const names = [
"hal",
"ve",
"odr",
"neit",
"ci",
"quon",
"mya",
"folth",
"wren",
"geyr",
"hil",
"niet",
"twou",
"phi",
"coa",
];
const suffixes = [
"the Red",
"the Soulless",
"the Master",
"the Lord of all things",
"Jr.",
];
return (
<Section>
{data.name}
<LabeledList>
<LabeledList.Item label="Prefix">
{prefixes.map(prefix => (
<Button
key={prefix.toLowerCase()}
content={prefix}
disabled={data.currentSection !== 1}
onClick={() => act(ref, prefix + ' ')}
/>
))}
</LabeledList.Item>
<LabeledList.Item label="Title">
{titles.map(title => (
<Button
key={title.toLowerCase()}
content={title}
disabled={data.currentSection >= 2}
onClick={() => act(ref, title + ' ')}
/>
))}
</LabeledList.Item>
<LabeledList.Item label="Name">
{names.map(name => (
<Button
key={name.toLowerCase()}
content={name}
disabled={data.currentSection >= 4}
onClick={() => act(ref, name)}
/>
))}
</LabeledList.Item>
<LabeledList.Item label="Suffix">
{suffixes.map(suffix => (
<Button
key={suffix.toLowerCase()}
content={suffix}
disabled={data.currentSection !== 4}
onClick={() => act(ref, ' ' + suffix)}
/>
))}
</LabeledList.Item>
<LabeledList.Item label="Submit">
<Button
content="Search"
disabled={data.currentSection <= 4}
onClick={() => act(ref, 'search')}
/>
</LabeledList.Item>
</LabeledList>
</Section>
);
};
@@ -1,7 +1,8 @@
import { Button, Flex, NoticeBox } from '../../components';
import { Fragment } from 'inferno';
export const InterfaceLockNoticeBox = props => {
const { siliconUser, locked, onLockStatusChange } = props;
const { siliconUser, locked, onLockStatusChange, accessText } = props;
// For silicon users
if (siliconUser) {
return (
@@ -30,7 +31,7 @@ export const InterfaceLockNoticeBox = props => {
// For everyone else
return (
<NoticeBox>
Swipe an ID card to {locked ? 'unlock' : 'lock'} this interface.
Swipe {accessText ? accessText : 'an ID card'} to {locked ? 'unlock' : 'lock'} this interface.
</NoticeBox>
);
};
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
+15 -6
View File
@@ -1,4 +1,3 @@
import { Acclimator } from './interfaces/Acclimator';
import { AiAirlock } from './interfaces/AiAirlock';
import { AirAlarm } from './interfaces/AirAlarm';
import { AirlockElectronics } from './interfaces/AirlockElectronics';
@@ -12,12 +11,14 @@ import { BluespaceArtillery } from './interfaces/BluespaceArtillery';
import { BorgPanel } from './interfaces/BorgPanel';
import { BrigTimer } from './interfaces/BrigTimer';
import { Canister } from './interfaces/Canister';
import { Cargo } from './interfaces/Cargo';
import { Cargo, CargoExpress } from './interfaces/Cargo';
import { CellularEmporium } from './interfaces/CellularEmporium';
import { ChemAcclimator } from './interfaces/ChemAcclimator';
import { CentcomPodLauncher } from './interfaces/CentcomPodLauncher';
import { ChemDispenser } from './interfaces/ChemDispenser';
import { ChemHeater } from './interfaces/ChemHeater';
import { ChemMaster } from './interfaces/ChemMaster';
import { CodexGigas } from './interfaces/CodexGigas';
import { Crayon } from './interfaces/Crayon';
import { Cryo } from './interfaces/Cryo';
import { DisposalUnit } from './interfaces/DisposalUnit';
@@ -29,10 +30,6 @@ import { VaultController } from './interfaces/VaultController';
import { Wires } from './interfaces/Wires';
const ROUTES = {
acclimator: {
component: () => Acclimator,
scrollable: false,
},
ai_airlock: {
component: () => AiAirlock,
scrollable: false,
@@ -89,6 +86,10 @@ const ROUTES = {
component: () => Cargo,
scrollable: true,
},
cargo_express: {
component: () => CargoExpress,
scrollable: true,
},
cellular_emporium: {
component: () => CellularEmporium,
scrollable: true,
@@ -97,6 +98,10 @@ const ROUTES = {
component: () => CentcomPodLauncher,
scrollable: false,
},
acclimator: {
component: () => ChemAcclimator,
scrollable: false,
},
chem_dispenser: {
component: () => ChemDispenser,
scrollable: true,
@@ -109,6 +114,10 @@ const ROUTES = {
component: () => ChemMaster,
scrollable: true,
},
codex_gigas: {
component: () => CodexGigas,
scrollable: false,
},
crayon: {
component: () => Crayon,
scrollable: true,
@@ -36,4 +36,22 @@ $color-map: (
'bad': $color-bad,
'highlight': $color-highlight,
'label': $pale-blue,
'health-0': $color-health-0,
'health-1': $color-health-1,
'health-2': $color-health-2,
'health-3': $color-health-3,
'health-4': $color-health-4,
'health-5': $color-health-5,
'dept-cap': $color-dept-cap,
'dept-sec': $color-dept-sec,
'dept-med': $color-dept-med,
'dept-sci': $color-dept-sci,
'dept-eng': $color-dept-eng,
'dept-cargo': $color-dept-cargo,
'dept-cent': $color-dept-cent,
'dept-other': $color-dept-other,
'damage-oxy': $color-damage-oxy,
'damage-toxin': $color-damage-toxin,
'damage-burn': $color-damage-burn,
'damage-brute': $color-damage-brute,
);
@@ -102,3 +102,27 @@ $input-color-background: $white;
// Tooltips
$tooltip-color-border: $dark-gray;
$tooltip-color-background: $gray;
// "health" indicator colors
$color-health-0: #17d568;
$color-health-1: #2ecc71;
$color-health-2: #e67e22;
$color-health-3: #ed5100;
$color-health-4: #e74c3c;
$color-health-5: #ed2814;
// Department Colors
$color-dept-cap: #c06616;
$color-dept-sec: #e74c3c;
$color-dept-med: #3498db;
$color-dept-sci: #9b59b6;
$color-dept-eng: #f1c40f;
$color-dept-cargo: #f39c12;
$color-dept-cent: #00c100;
$color-dept-other: #c38312;
// Damage type colors
$color-damage-oxy: #3498db;
$color-damage-toxin: #2ecc71;
$color-damage-burn: #e67e22;
$color-damage-brute: #e74c3c;
-43
View File
@@ -1,43 +0,0 @@
<ui-display>
<ui-button action='toggle'>{{data.recollection ? "Recital":"Recollection"}}</ui-button>
</ui-display>
{{#if data.recollection}}
<ui-display>
{{{data.rec_text}}}
{{#each data.recollection_categories}}
<br><ui-button action='rec_category' params='{"category": "{{name}}"}'>{{{name}}} - {{{desc}}}</ui-button>
{{/each}}
{{{data.rec_section}}}
{{{data.rec_binds}}}
</ui-display>
{{else}}
<ui-display title='Power' button>
<ui-section>
{{{data.power}}}
</ui-section>
</ui-display>
<ui-display>
<ui-section>
<ui-button state='{{data.selected == "Driver" ? "selected" : null}}' action='select' params='{"category": "Driver"}'>Driver</ui-button>
<ui-button state='{{data.selected == "Script" ? "selected" : null}}' action='select' params='{"category": "Script"}'>Scripts</ui-button>
<ui-button state='{{data.selected == "Application" ? "selected" : null}}' action='select' params='{"category": "Application"}'>Applications</ui-button>
<br>{{{data.tier_info}}}
</ui-section>
<ui-section>
{{{data.scripturecolors}}}
</ui-section><hr>
<ui-section>
{{#each data.scripture}}
<div><ui-button tooltip='{{{tip}}}' tooltip-side='right' action='recite' params='{"category": "{{type}}"}'>Recite {{{required}}}</ui-button>
{{#if quickbind}}
{{#if bound}}
<ui-button action='bind' params='{"category": "{{type}}"}'>Unbind {{{bound}}}</ui-button>
{{else}}
<ui-button action='bind' params='{"category": "{{type}}"}'>Quickbind</ui-button>
{{/if}}
{{/if}}
{{{name}}} {{{descname}}} {{{invokers}}}</div>
{{/each}}
</ui-section>
</ui-display>
{{/if}}