UI: Improvements to Create Program tab (#449)

* Progress indicator for programs that are in progress
* Button for a program that is currently being worked (unfocused) is just a refocus button
This commit is contained in:
Minzenkatze 2023-03-28 17:23:36 +02:00 committed by GitHub
parent dadf42bfe8
commit a1441b31f2
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

@ -86,22 +86,37 @@ export function ProgramsRoot(): React.ReactElement {
(create.req() && <Create sx={{ mr: 1 }} />) || <Lock sx={{ mr: 1 }} />} (create.req() && <Create sx={{ mr: 1 }} />) || <Lock sx={{ mr: 1 }} />}
{program.name} {program.name}
</Typography> </Typography>
{!Player.hasProgram(program.name) && create.req() && ( {!Player.hasProgram(program.name) &&
<Button create.req() &&
sx={{ my: 1, width: "100%" }} (isCreateProgramWork(Player.currentWork) && Player.currentWork?.programName === program.name ? (
onClick={(event) => { //Button if the program is currently being worked on
if (!event.isTrusted) return; <Button
if (isCreateProgramWork(Player.currentWork)) { sx={{ my: 1, width: "100%" }}
Player.finishWork(true); onClick={(event) => {
} if (!event.isTrusted) return;
Player.startWork(new CreateProgramWork({ singularity: false, programName: program.name })); Player.startFocusing();
Player.startFocusing(); Router.toPage(Page.Work);
Router.toPage(Page.Work); }}
}} >
> Resume focus
Create program </Button>
</Button> ) : (
)} //Button if the program is not currently worked on
<Button
sx={{ my: 1, width: "100%" }}
onClick={(event) => {
if (!event.isTrusted) return;
if (isCreateProgramWork(Player.currentWork)) {
Player.finishWork(true);
}
Player.startWork(new CreateProgramWork({ singularity: false, programName: program.name }));
Player.startFocusing();
Router.toPage(Page.Work);
}}
>
Create program
</Button>
))}
{Player.hasProgram(program.name) || getHackingLevelRemaining(create.level) === 0 || ( {Player.hasProgram(program.name) || getHackingLevelRemaining(create.level) === 0 || (
<Typography color={Settings.theme.hack}> <Typography color={Settings.theme.hack}>
<b>Unlocks in:</b> {getHackingLevelRemaining(create.level)} hacking levels <b>Unlocks in:</b> {getHackingLevelRemaining(create.level)} hacking levels
@ -112,6 +127,13 @@ export function ProgramsRoot(): React.ReactElement {
<b>Current completion:</b> {curCompletion}% <b>Current completion:</b> {curCompletion}%
</Typography> </Typography>
)} )}
{/*Displays the current completion of the program currently being created*/}
{isCreateProgramWork(Player.currentWork) && Player.currentWork?.programName === program.name && (
<Typography color={Settings.theme.infolight}>
<b>Current completion:</b>{" "}
{((100 * Player.currentWork.unitCompleted) / Player.currentWork.unitNeeded()).toFixed(2)}%
</Typography>
)}
<Typography>{create.tooltip}</Typography> <Typography>{create.tooltip}</Typography>
</> </>
</Box> </Box>