diff --git a/code/modules/modular_computers/file_system/programs/airestorer.dm b/code/modules/modular_computers/file_system/programs/airestorer.dm index a60be4529b5..4e9cd855772 100644 --- a/code/modules/modular_computers/file_system/programs/airestorer.dm +++ b/code/modules/modular_computers/file_system/programs/airestorer.dm @@ -8,7 +8,7 @@ usage_flags = PROGRAM_CONSOLE | PROGRAM_LAPTOP transfer_access = ACCESS_HEADS available_on_ntnet = TRUE - tgui_id = "AiRestorer" + tgui_id = "NtosAiRestorer" ui_x = 370 ui_y = 400 /// Variable dictating if we are in the process of restoring the AI in the inserted intellicard diff --git a/code/modules/modular_computers/file_system/programs/ntdownloader.dm b/code/modules/modular_computers/file_system/programs/ntdownloader.dm index 2a07474c0a9..352f13f3053 100644 --- a/code/modules/modular_computers/file_system/programs/ntdownloader.dm +++ b/code/modules/modular_computers/file_system/programs/ntdownloader.dm @@ -10,7 +10,7 @@ requires_ntnet_feature = NTNET_SOFTWAREDOWNLOAD available_on_ntnet = 0 ui_header = "downloader_finished.gif" - tgui_id = "NtosNetMonitor" + tgui_id = "NtosNetDownloader" ui_x = 480 ui_y = 735 diff --git a/tgui/packages/tgui/interfaces/Achievements.js b/tgui/packages/tgui/interfaces/Achievements.js index 1ae7d8970c3..50d00b0fe82 100644 --- a/tgui/packages/tgui/interfaces/Achievements.js +++ b/tgui/packages/tgui/interfaces/Achievements.js @@ -1,13 +1,105 @@ import { useBackend } from '../backend'; import { Box, Icon, Table, Tabs } from '../components'; +import { Window } from '../layouts'; -export const Achievement = props => { +export const Achievements = (props, context) => { + const { data } = useBackend(context); + const { + achievements, + categories, + highscore, + user_ckey, + } = data; + return ( + + + + {categories.map(category => ( + + + {achievements + .filter(x => x.category === category) + .map(achievement => { + if (achievement.score) { + return ( + + ); + } + return ( + + ); + })} +
+ + ))} + + + {highscore.map(highscore => ( + + + + + # + + + Key + + + Score + + + {Object.keys(highscore.scores).map((key, index) => ( + + + {index + 1} + + + {index === 0 && ( + + )} + {key} + {index === 0 && ( + + )} + + + {highscore.scores[key]} + + + ))} +
+ + ))} + + + + + + ); +}; + +const Achievement = props => { + const { achievement } = props; const { name, desc, icon_class, value, - } = props; + } = achievement; return ( @@ -24,13 +116,14 @@ export const Achievement = props => { ); }; -export const Score = props => { +const Score = props => { + const { achievement } = props; const { name, desc, icon_class, value, - } = props; + } = achievement; return ( @@ -46,89 +139,3 @@ export const Score = props => { ); }; - -export const Achievements = props => { - const { data } = useBackend(props); - return ( - - {data.categories.map(category => ( - - - {data.achievements - .filter(x => x.category === category) - .map(achievement => { - if (achievement.score) { - return ( - - ); - } - return ( - - ); - })} - - - ))} - - - {data.highscore.map(highscore => ( - - - - - # - - - Key - - - Score - - - {Object.keys(highscore.scores).map((key, index) => ( - - - {index+1} - - - {index === 0 && ( - - )} - {key} - {index === 0 && ( - - )} - - - {highscore.scores[key]} - - - ))} -
- - ))} - - - - ); -}; diff --git a/tgui/packages/tgui/interfaces/AiAirlock.js b/tgui/packages/tgui/interfaces/AiAirlock.js index 55a3cd4a226..f3e06a6d318 100644 --- a/tgui/packages/tgui/interfaces/AiAirlock.js +++ b/tgui/packages/tgui/interfaces/AiAirlock.js @@ -1,196 +1,200 @@ import { Fragment } from 'inferno'; import { useBackend } from '../backend'; import { Button, LabeledList, Section } from '../components'; +import { Window } from '../layouts'; + +const dangerMap = { + 2: { + color: 'good', + localStatusText: 'Offline', + }, + 1: { + color: 'average', + localStatusText: 'Caution', + }, + 0: { + color: 'bad', + localStatusText: 'Optimal', + }, +}; export const AiAirlock = props => { const { act, data } = useBackend(props); - const dangerMap = { - 2: { - color: 'good', - localStatusText: 'Offline', - }, - 1: { - color: 'average', - localStatusText: 'Caution', - }, - 0: { - color: 'bad', - localStatusText: 'Optimal', - }, - }; const statusMain = dangerMap[data.power.main] || dangerMap[0]; const statusBackup = dangerMap[data.power.backup] || dangerMap[0]; const statusElectrify = dangerMap[data.shock] || dangerMap[0]; return ( - -
- - act('disrupt-main')} /> - )}> - {data.power.main ? 'Online' : 'Offline'} - {' '} - {(!data.wires.main_1 || !data.wires.main_2) - && '[Wires have been cut!]' - || (data.power.main_timeleft > 0 - && `[${data.power.main_timeleft}s]`)} - - act('disrupt-backup')} /> - )}> - {data.power.backup ? 'Online' : 'Offline'} - {' '} - {(!data.wires.backup_1 || !data.wires.backup_2) - && '[Wires have been cut!]' - || (data.power.backup_timeleft > 0 - && `[${data.power.backup_timeleft}s]`)} - - + + +
+ + act('shock-restore')} /> + icon="lightbulb-o" + disabled={!data.power.main} + content="Disrupt" + onClick={() => act('disrupt-main')} /> + )}> + {data.power.main ? 'Online' : 'Offline'} + {' '} + {(!data.wires.main_1 || !data.wires.main_2) + && '[Wires have been cut!]' + || (data.power.main_timeleft > 0 + && `[${data.power.main_timeleft}s]`)} + + act('shock-temp')} /> + icon="lightbulb-o" + disabled={!data.power.backup} + content="Disrupt" + onClick={() => act('disrupt-backup')} /> + )}> + {data.power.backup ? 'Online' : 'Offline'} + {' '} + {(!data.wires.backup_1 || !data.wires.backup_2) + && '[Wires have been cut!]' + || (data.power.backup_timeleft > 0 + && `[${data.power.backup_timeleft}s]`)} + + +
+
+ + act('shock-perm')} /> - - )}> - {data.shock === 2 ? 'Safe' : 'Electrified'} - {' '} - {!data.wires.shock - && '[Wires have been cut!]' - || (data.shock_timeleft > 0 - && `[${data.shock_timeleft}s]`) - || (data.shock_timeleft === -1 - && '[Permanent]')} - - -
-
- - act('idscan-toggle')} /> - )}> - {!data.wires.id_scanner && '[Wires have been cut!]'} - - act('emergency-toggle')} /> - )} /> - - act('bolt-toggle')} /> - )}> - {!data.wires.bolts && '[Wires have been cut!]'} - - act('light-toggle')} /> - )}> - {!data.wires.lights && '[Wires have been cut!]'} - - act('safe-toggle')} /> - )}> - {!data.wires.safe && '[Wires have been cut!]'} - - act('speed-toggle')} /> - )}> - {!data.wires.timing && '[Wires have been cut!]'} - - - act('open-close')} /> - )}> - {!!(data.locked || data.welded) && ( - - [Door is {data.locked ? 'bolted' : ''} - {(data.locked && data.welded) ? ' and ' : ''} - {data.welded ? 'welded' : ''}!] - - )} - - -
- + icon={data.id_scanner ? 'power-off' : 'times'} + content={data.id_scanner ? 'Enabled' : 'Disabled'} + selected={data.id_scanner} + disabled={!data.wires.id_scanner} + onClick={() => act('idscan-toggle')} /> + )}> + {!data.wires.id_scanner && '[Wires have been cut!]'} + + act('emergency-toggle')} /> + )} /> + + act('bolt-toggle')} /> + )}> + {!data.wires.bolts && '[Wires have been cut!]'} + + act('light-toggle')} /> + )}> + {!data.wires.lights && '[Wires have been cut!]'} + + act('safe-toggle')} /> + )}> + {!data.wires.safe && '[Wires have been cut!]'} + + act('speed-toggle')} /> + )}> + {!data.wires.timing && '[Wires have been cut!]'} + + + act('open-close')} /> + )}> + {!!(data.locked || data.welded) && ( + + [Door is {data.locked ? 'bolted' : ''} + {(data.locked && data.welded) ? ' and ' : ''} + {data.welded ? 'welded' : ''}!] + + )} + + +
+ + ); }; diff --git a/tgui/packages/tgui/interfaces/AiRestorer.js b/tgui/packages/tgui/interfaces/AiRestorer.js index 5ddba051157..e91d392d10a 100644 --- a/tgui/packages/tgui/interfaces/AiRestorer.js +++ b/tgui/packages/tgui/interfaces/AiRestorer.js @@ -1,9 +1,20 @@ import { Fragment } from 'inferno'; -import { useBackend } from "../backend"; -import { Section, Box, Button, NoticeBox, ProgressBar, LabeledList } from "../components"; +import { useBackend } from '../backend'; +import { Box, Button, LabeledList, NoticeBox, ProgressBar, Section } from '../components'; +import { Window } from '../layouts'; -export const AiRestorer = props => { - const { act, data } = useBackend(props); +export const AiRestorer = () => { + return ( + + + + + + ); +}; + +export const AiRestorerContent = (props, context) => { + const { act, data } = useBackend(context); const { AI_present, error, @@ -14,7 +25,6 @@ export const AiRestorer = props => { health, ejectable, } = data; - return ( {error && ( @@ -28,8 +38,7 @@ export const AiRestorer = props => { icon="eject" content={AI_present ? name : "----------"} disabled={!AI_present} - onClick={() => act('PRG_eject')} - /> + onClick={() => act('PRG_eject')} /> )} {!!AI_present && (
{ content="Begin Reconstruction" disabled={restoring} mt={1} - onClick={() => act('PRG_beginReconstruction')} - /> + onClick={() => act('PRG_beginReconstruction')} />
{laws.map(law => ( diff --git a/tgui/packages/tgui/interfaces/DisposalUnit.js b/tgui/packages/tgui/interfaces/DisposalUnit.js index 105573dba6e..e734e3b30e0 100644 --- a/tgui/packages/tgui/interfaces/DisposalUnit.js +++ b/tgui/packages/tgui/interfaces/DisposalUnit.js @@ -1,8 +1,9 @@ import { useBackend } from '../backend'; import { Button, LabeledList, ProgressBar, Section } from '../components'; +import { Window } from '../layouts'; -export const DisposalUnit = props => { - const { act, data } = useBackend(props); +export const DisposalUnit = (props, context) => { + const { act, data } = useBackend(context); let stateColor; let stateText; if (data.full_pressure) { @@ -22,50 +23,54 @@ export const DisposalUnit = props => { stateText = 'Off'; } return ( -
- - - {stateText} - - - - - -
+ + +
+ + + {stateText} + + + + + +
+ + ); }; diff --git a/tgui/packages/tgui/interfaces/NtosAiRestorer.js b/tgui/packages/tgui/interfaces/NtosAiRestorer.js new file mode 100644 index 00000000000..ddb2c32898d --- /dev/null +++ b/tgui/packages/tgui/interfaces/NtosAiRestorer.js @@ -0,0 +1,12 @@ +import { NtosWindow } from '../layouts'; +import { AiRestorerContent } from './AiRestorer'; + +export const AiRestorer = () => { + return ( + + + + + + ); +}; diff --git a/tgui/packages/tgui/interfaces/NtosFileManager.js b/tgui/packages/tgui/interfaces/NtosFileManager.js index 2ebfad75b07..9e5da68298c 100644 --- a/tgui/packages/tgui/interfaces/NtosFileManager.js +++ b/tgui/packages/tgui/interfaces/NtosFileManager.js @@ -1,8 +1,51 @@ -import { Section, Table, Button } from "../components"; -import { useBackend } from "../backend"; -import { Fragment } from "inferno"; +import { Fragment } from 'inferno'; +import { useBackend } from '../backend'; +import { Button, Section, Table } from '../components'; +import { NtosWindow } from '../layouts'; -export const FileTable = props => { +export const NtosFileManager = (props, context) => { + const { act, data } = useBackend(context); + const { + usbconnected, + files = [], + usbfiles = [], + } = data; + return ( + + +
+ act('PRG_copytousb', { name: file })} + onDelete={file => act('PRG_deletefile', { name: file })} + onRename={(file, newName) => act('PRG_rename', { + name: file, + new_name: newName, + })} + onDuplicate={file => act('PRG_clone', { file: file })} /> +
+ {usbconnected && ( +
+ act('PRG_copyfromusb', { name: file })} + onDelete={file => act('PRG_deletefile', { name: file })} + onRename={(file, newName) => act('PRG_rename', { + name: file, + new_name: newName, + })} + onDuplicate={file => act('PRG_clone', { file: file })} /> +
+ )} + + + ); +}; + +const FileTable = props => { const { files = [], usbconnected, @@ -11,7 +54,6 @@ export const FileTable = props => { onDelete, onRename, } = props; - return ( @@ -75,45 +117,3 @@ export const FileTable = props => {
); }; - -export const NtosFileManager = props => { - const { act, data } = useBackend(props); - - const { - usbconnected, - files = [], - usbfiles = [], - } = data; - - return ( - -
- act('PRG_copytousb', { name: file })} - onDelete={file => act('PRG_deletefile', { name: file })} - onRename={(file, newName) => act('PRG_rename', { - name: file, - new_name: newName, - })} - onDuplicate={file => act('PRG_clone', { file: file })} /> -
- {usbconnected && ( -
- act('PRG_copyfromusb', { name: file })} - onDelete={file => act('PRG_deletefile', { name: file })} - onRename={(file, newName) => act('PRG_rename', { - name: file, - new_name: newName, - })} - onDuplicate={file => act('PRG_clone', { file: file })} /> -
- )} - - ); -}; diff --git a/tgui/packages/tgui/interfaces/NtosNetDownloader.js b/tgui/packages/tgui/interfaces/NtosNetDownloader.js index da3359fb871..e1f88711674 100644 --- a/tgui/packages/tgui/interfaces/NtosNetDownloader.js +++ b/tgui/packages/tgui/interfaces/NtosNetDownloader.js @@ -1,10 +1,9 @@ -import { Fragment } from 'inferno'; import { useBackend } from '../backend'; import { Box, Button, Flex, Icon, LabeledList, NoticeBox, ProgressBar, Section } from '../components'; +import { NtosWindow } from '../layouts'; -export const NtosNetDownloader = props => { - const { state } = props; - const { act, data } = useBackend(props); +export const NtosNetDownloader = (props, context) => { + const { act, data } = useBackend(context); const { disk_size, disk_used, @@ -14,58 +13,58 @@ export const NtosNetDownloader = props => { hackedavailable, } = data; return ( - - {!!error && ( - - - {error} - -
- +
+ + act('toggle_function', { id: "1" })} /> + )} /> + act('toggle_function', { id: "2" })} /> + )} /> + act('toggle_function', { id: "3" })} /> + )} /> + act('toggle_function', { id: "4" })} /> + )} /> + +
+
+ {!!idsalarm && ( + + + NETWORK INCURSION DETECTED + + + Abnormal activity has been detected in the network. + Check system logs for more information + + + )} + + +
+ + ); }; diff --git a/tgui/packages/tgui/interfaces/NtosStationAlertConsole.js b/tgui/packages/tgui/interfaces/NtosStationAlertConsole.js new file mode 100644 index 00000000000..67fdbcc9361 --- /dev/null +++ b/tgui/packages/tgui/interfaces/NtosStationAlertConsole.js @@ -0,0 +1,12 @@ +import { NtosWindow } from '../layouts'; +import { StationAlertConsoleContent } from './StationAlertConsole'; + +export const NtosStationAlertConsole = () => { + return ( + + + + + + ); +}; diff --git a/tgui/packages/tgui/interfaces/StationAlertConsole.js b/tgui/packages/tgui/interfaces/StationAlertConsole.js index c372b532e9d..df649ae6fa5 100644 --- a/tgui/packages/tgui/interfaces/StationAlertConsole.js +++ b/tgui/packages/tgui/interfaces/StationAlertConsole.js @@ -1,9 +1,20 @@ import { Fragment } from 'inferno'; import { useBackend } from '../backend'; import { Section } from '../components'; +import { Window } from '../layouts'; -export const StationAlertConsole = props => { - const { data } = useBackend(props); +export const StationAlertConsole = () => { + return ( + + + + + + ); +}; + +export const StationAlertConsoleContent = (props, context) => { + const { data } = useBackend(context); const categories = data.alarms || []; const fire = categories['Fire'] || []; const atmos = categories['Atmosphere'] || []; diff --git a/tgui/packages/tgui/layouts/NtosWindow.js b/tgui/packages/tgui/layouts/NtosWindow.js index 010a7b4fda3..b3acb7e7287 100644 --- a/tgui/packages/tgui/layouts/NtosWindow.js +++ b/tgui/packages/tgui/layouts/NtosWindow.js @@ -4,7 +4,11 @@ import { refocusLayout } from './Layout'; import { Window } from './Window'; export const NtosWindow = (props, context) => { - const { children } = props; + const { + resizable, + theme = 'ntos', + children, + } = props; const { act, data } = useBackend(context); const { PC_batteryicon, @@ -17,7 +21,9 @@ export const NtosWindow = (props, context) => { PC_showexitprogram, } = data; return ( - +
{ }; /** - * A generic instance of a logger. + * A generic instance of the logger. * * Does not have a namespace associated with it. */ diff --git a/tgui/packages/tgui/routes.js b/tgui/packages/tgui/routes.js index f8041aab55a..c25ab22528e 100644 --- a/tgui/packages/tgui/routes.js +++ b/tgui/packages/tgui/routes.js @@ -19,26 +19,10 @@ export const getRoutedComponent = state => { }; // const ROUTES = { -// achievements: { -// component: () => Achievements, -// scrollable: true, -// }, -// ai_airlock: { -// component: () => AiAirlock, -// scrollable: false, -// }, -// ai_restorer: { -// component: () => AiRestorer, -// scrollable: true, -// }, // airlock_electronics: { // component: () => AirlockElectronics, // scrollable: false, // }, -// apc: { -// component: () => Apc, -// scrollable: false, -// }, // atmos_alert: { // component: () => AtmosAlertConsole, // scrollable: true, @@ -93,10 +77,6 @@ export const getRoutedComponent = state => { // wrapper: () => CameraConsoleWrapper, // scrollable: true, // }, -// canister: { -// component: () => Canister, -// scrollable: false, -// }, // canvas: { // component: () => Canvas, // scrollable: false, @@ -327,12 +307,6 @@ export const getRoutedComponent = state => { // component: () => NtnetRelay, // scrollable: false, // }, -// ntos_ai_restorer: { -// component: () => AiRestorer, -// wrapper: () => NtosWrapper, -// scrollable: true, -// theme: 'ntos', -// }, // ntos_atmos: { // component: () => NtosAtmos, // wrapper: () => NtosWrapper, @@ -369,24 +343,12 @@ export const getRoutedComponent = state => { // scrollable: true, // theme: 'ntos', // }, -// ntos_file_manager: { -// component: () => NtosFileManager, -// wrapper: () => NtosWrapper, -// scrollable: true, -// theme: 'ntos', -// }, // ntos_job_manager: { // component: () => NtosJobManager, // wrapper: () => NtosWrapper, // scrollable: true, // theme: 'ntos', // }, -// ntos_main: { -// component: () => NtosMain, -// wrapper: () => NtosWrapper, -// scrollable: true, -// theme: 'ntos', -// }, // ntos_net_chat: { // component: () => NtosNetChat, // wrapper: () => NtosWrapper, @@ -399,24 +361,6 @@ export const getRoutedComponent = state => { // scrollable: false, // theme: 'syndicate', // }, -// ntos_net_downloader: { -// component: () => NtosNetDownloader, -// wrapper: () => NtosWrapper, -// scrollable: true, -// theme: 'ntos', -// }, -// ntos_net_monitor: { -// component: () => NtosNetMonitor, -// wrapper: () => NtosWrapper, -// scrollable: true, -// theme: 'ntos', -// }, -// ntos_power_monitor: { -// component: () => PowerMonitor, -// wrapper: () => NtosWrapper, -// scrollable: true, -// theme: 'ntos', -// }, // ntos_revelation: { // component: () => NtosRevelation, // wrapper: () => NtosWrapper, @@ -435,12 +379,6 @@ export const getRoutedComponent = state => { // scrollable: true, // theme: 'ntos', // }, -// ntos_station_alert: { -// component: () => StationAlertConsole, -// wrapper: () => NtosWrapper, -// scrollable: true, -// theme: 'ntos', -// }, // ntos_supermatter_monitor: { // component: () => NtosSupermatterMonitor, // wrapper: () => NtosWrapper, @@ -484,10 +422,6 @@ export const getRoutedComponent = state => { // component: () => PortableScrubber, // scrollable: false, // }, -// power_monitor: { -// component: () => PowerMonitor, -// scrollable: true, -// }, // proximity_sensor: { // component: () => ProximitySensor, // scrollable: false, @@ -546,10 +480,6 @@ export const getRoutedComponent = state => { // component: () => SmartVend, // scrollable: true, // }, -// smes: { -// component: () => Smes, -// scrollable: false, -// }, // smoke_machine: { // component: () => SmokeMachine, // scrollable: false, @@ -566,10 +496,6 @@ export const getRoutedComponent = state => { // component: () => SpawnersMenu, // scrollable: true, // }, -// station_alert: { -// component: () => StationAlertConsole, -// scrollable: true, -// }, // suit_storage_unit: { // component: () => SuitStorageUnit, // scrollable: false, @@ -580,51 +506,6 @@ export const getRoutedComponent = state => { // scrollable: true, // theme: 'syndicate', // }, -// tanks: { -// component: () => Tank, -// scrollable: false, -// }, -// tank_dispenser: { -// component: () => TankDispenser, -// scrollable: false, -// }, -// teleporter: { -// component: () => Teleporter, -// scrollable: false, -// }, -// thermomachine: { -// component: () => ThermoMachine, -// scrollable: false, -// }, -// timer: { -// component: () => Timer, -// scrollable: false, -// }, -// transfer_valve: { -// component: () => TransferValve, -// scrollable: false, -// }, -// turbine_computer: { -// component: () => TurbineComputer, -// scrollable: false, -// }, -// uplink: { -// component: () => Uplink, -// scrollable: true, -// theme: 'syndicate', -// }, -// vault_controller: { -// component: () => VaultController, -// scrollable: false, -// }, -// vending: { -// component: () => Vending, -// scrollable: true, -// }, -// wires: { -// component: () => Wires, -// scrollable: false, -// }, // scan_consolenew: { // component: () => DnaConsole, // scrollable: true,