Personal_mirrors/bitburner-src
1
0
Fork 0
mirror of https://github.com/bitburner-official/bitburner-src.git synced 2024-12-02 04:23:48 +01:00
Code Issues Packages Projects Releases Wiki Activity

convert work in progress to mui

Browse Source
This commit is contained in:
Olivier Gagnon 2021-09-22 03:25:12 -04:00
parent c79fa240e1
commit 28aca06208
1 changed files with 224 additions and 207 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

137
src/ui/WorkInProgressRoot.tsx
View File

@ -13,6 +13,10 @@ import { Companies } from "../Company/Companies";
import { Locations } from "../Locations/Locations"; import { Locations } from "../Locations/Locations";
import { LocationName } from "../Locations/data/LocationNames"; import { LocationName } from "../Locations/data/LocationNames";
import Typography from "@mui/material/Typography";
import Grid from "@mui/material/Grid";
import Button from "@mui/material/Button";
import { createProgressBarText } from "../../utils/helpers/createProgressBarText"; import { createProgressBarText } from "../../utils/helpers/createProgressBarText";
const CYCLES_PER_SEC = 1000 / CONSTANTS.MilliPerCycle; const CYCLES_PER_SEC = 1000 / CONSTANTS.MilliPerCycle;
@ -40,8 +44,9 @@ export function WorkInProgressRoot(): React.ReactElement {
player.stopFocusing(); player.stopFocusing();
} }
return ( return (
<div> <Grid container direction="column" justifyContent="center" alignItems="center" style={{ minHeight: "100vh" }}>
<p> <Grid item>
<Typography>
You are currently {player.currentWorkFactionDescription} for your faction {faction.name} You are currently {player.currentWorkFactionDescription} for your faction {faction.name}
<br /> <br />
(Current Faction Reputation: {Reputation(faction.playerReputation)}). <br /> (Current Faction Reputation: {Reputation(faction.playerReputation)}). <br />
@ -53,8 +58,8 @@ export function WorkInProgressRoot(): React.ReactElement {
<Money money={player.workMoneyGained} /> (<MoneyRate money={player.workMoneyGainRate * CYCLES_PER_SEC} />){" "} <Money money={player.workMoneyGained} /> (<MoneyRate money={player.workMoneyGainRate * CYCLES_PER_SEC} />){" "}
<br /> <br />
<br /> <br />
{Reputation(player.workRepGained)} ({ReputationRate(player.workRepGainRate * CYCLES_PER_SEC)}) reputation for {Reputation(player.workRepGained)} ({ReputationRate(player.workRepGainRate * CYCLES_PER_SEC)}) reputation
this faction <br /> for this faction <br />
<br /> <br />
{numeralWrapper.formatExp(player.workHackExpGained)} ( {numeralWrapper.formatExp(player.workHackExpGained)} (
{numeralWrapper.formatExp(player.workHackExpGainRate * CYCLES_PER_SEC)} / sec) hacking exp <br /> {numeralWrapper.formatExp(player.workHackExpGainRate * CYCLES_PER_SEC)} / sec) hacking exp <br />
@ -74,15 +79,15 @@ export function WorkInProgressRoot(): React.ReactElement {
You will automatically finish after working for 20 hours. You can cancel earlier if you wish. You will automatically finish after working for 20 hours. You can cancel earlier if you wish.
<br /> <br />
There is no penalty for cancelling earlier. There is no penalty for cancelling earlier.
</p> </Typography>
</Grid>
<button onClick={cancel} className="work-button"> <Grid item>
<Button sx={{ mx: 2 }} onClick={cancel}>
Stop Faction Work Stop Faction Work
</button> </Button>
<button onClick={unfocus} className="work-button"> <Button onClick={unfocus}>Do something else simultaneously</Button>
Do something else simultaneously </Grid>
</button> </Grid>
</div>
); );
} }
@ -110,8 +115,9 @@ export function WorkInProgressRoot(): React.ReactElement {
} }
return ( return (
<div> <Grid container direction="column" justifyContent="center" alignItems="center" style={{ minHeight: "100vh" }}>
<p> <Grid item>
<Typography>
You have been {className} for {convertTimeMsToTimeElapsedString(player.timeWorked)} You have been {className} for {convertTimeMsToTimeElapsedString(player.timeWorked)}
<br /> <br />
<br /> <br />
@ -133,12 +139,12 @@ export function WorkInProgressRoot(): React.ReactElement {
{numeralWrapper.formatExp(player.workChaExpGained)} ( {numeralWrapper.formatExp(player.workChaExpGained)} (
{numeralWrapper.formatExp(player.workChaExpGainRate * CYCLES_PER_SEC)} / sec) charisma exp <br /> {numeralWrapper.formatExp(player.workChaExpGainRate * CYCLES_PER_SEC)} / sec) charisma exp <br />
You may cancel at any time You may cancel at any time
</p> </Typography>
</Grid>
<button onClick={cancel} className="work-button"> <Grid item>
{stopText} <Button onClick={cancel}>{stopText}</Button>
</button> </Grid>
</div> </Grid>
); );
} }
@ -165,8 +171,9 @@ export function WorkInProgressRoot(): React.ReactElement {
const penaltyString = penalty === 0.5 ? "half" : "three-quarters"; const penaltyString = penalty === 0.5 ? "half" : "three-quarters";
return ( return (
<div> <Grid container direction="column" justifyContent="center" alignItems="center" style={{ minHeight: "100vh" }}>
<p> <Grid item>
<Typography>
You are currently working as a {position} at {player.companyName} (Current Company Reputation:{" "} You are currently working as a {position} at {player.companyName} (Current Company Reputation:{" "}
{Reputation(companyRep)})<br /> {Reputation(companyRep)})<br />
<br /> <br />
@ -178,8 +185,8 @@ export function WorkInProgressRoot(): React.ReactElement {
<Money money={player.workMoneyGained} /> (<MoneyRate money={player.workMoneyGainRate * CYCLES_PER_SEC} />){" "} <Money money={player.workMoneyGained} /> (<MoneyRate money={player.workMoneyGainRate * CYCLES_PER_SEC} />){" "}
<br /> <br />
<br /> <br />
{Reputation(player.workRepGained)} ({ReputationRate(player.workRepGainRate * CYCLES_PER_SEC)}) reputation for {Reputation(player.workRepGained)} ({ReputationRate(player.workRepGainRate * CYCLES_PER_SEC)}) reputation
this company <br /> for this company <br />
<br /> <br />
{numeralWrapper.formatExp(player.workHackExpGained)} ( {numeralWrapper.formatExp(player.workHackExpGained)} (
{`${numeralWrapper.formatExp(player.workHackExpGainRate * CYCLES_PER_SEC)} / sec`} {`${numeralWrapper.formatExp(player.workHackExpGainRate * CYCLES_PER_SEC)} / sec`}
@ -202,17 +209,17 @@ export function WorkInProgressRoot(): React.ReactElement {
{`${numeralWrapper.formatExp(player.workChaExpGainRate * CYCLES_PER_SEC)} / sec`} {`${numeralWrapper.formatExp(player.workChaExpGainRate * CYCLES_PER_SEC)} / sec`}
) charisma exp <br /> ) charisma exp <br />
<br /> <br />
You will automatically finish after working for 8 hours. You can cancel earlier if you wish, but you will only You will automatically finish after working for 8 hours. You can cancel earlier if you wish, but you will
gain {penaltyString} of the reputation you've earned so far. only gain {penaltyString} of the reputation you've earned so far.
</p> </Typography>
</Grid>
<button onClick={cancel} className="work-button"> <Grid item>
<Button sx={{ mx: 2 }} onClick={cancel}>
Stop Working Stop Working
</button> </Button>
<button onClick={unfocus} className="work-button"> <Button onClick={unfocus}>Do something else simultaneously</Button>
Do something else simultaneously </Grid>
</button> </Grid>
</div>
); );
} }
@ -234,8 +241,9 @@ export function WorkInProgressRoot(): React.ReactElement {
const position = player.jobs[player.companyName]; const position = player.jobs[player.companyName];
return ( return (
<div> <Grid container direction="column" justifyContent="center" alignItems="center" style={{ minHeight: "100vh" }}>
<p> <Grid item>
<Typography>
You are currently working as a {position} at {player.companyName} (Current Company Reputation:{" "} You are currently working as a {position} at {player.companyName} (Current Company Reputation:{" "}
{Reputation(companyRep)})<br /> {Reputation(companyRep)})<br />
<br /> <br />
@ -272,17 +280,17 @@ export function WorkInProgressRoot(): React.ReactElement {
{`${numeralWrapper.formatExp(player.workChaExpGainRate * CYCLES_PER_SEC)} / sec`} {`${numeralWrapper.formatExp(player.workChaExpGainRate * CYCLES_PER_SEC)} / sec`}
) charisma exp <br /> ) charisma exp <br />
<br /> <br />
You will automatically finish after working for 8 hours. You can cancel earlier if you wish, and there will be You will automatically finish after working for 8 hours. You can cancel earlier if you wish, and there will
no penalty because this is a part-time job. be no penalty because this is a part-time job.
</p> </Typography>
</Grid>
<button onClick={cancel} className="work-button"> <Grid item>
<Button sx={{ mx: 2 }} onClick={cancel}>
Stop Working Stop Working
</button> </Button>
<button onClick={unfocus} className="work-button"> <Button onClick={unfocus}>Do something else simultaneously</Button>
Do something else simultaneously </Grid>
</button> </Grid>
</div>
); );
} }
@ -299,32 +307,39 @@ export function WorkInProgressRoot(): React.ReactElement {
const progressBar = createProgressBarText({ progress: (numBars + 1) / 20, totalTicks: 20 }); const progressBar = createProgressBarText({ progress: (numBars + 1) / 20, totalTicks: 20 });
return ( return (
<div> <Grid container direction="column" justifyContent="center" alignItems="center" style={{ minHeight: "100vh" }}>
<Grid item>
<Typography>
<p>You are attempting to {player.crimeType}.</p> <p>You are attempting to {player.crimeType}.</p>
<br /> <br />
<p>Time remaining: {convertTimeMsToTimeElapsedString(player.timeNeededToCompleteWork - player.timeWorked)}</p> <p>
Time remaining: {convertTimeMsToTimeElapsedString(player.timeNeededToCompleteWork - player.timeWorked)}
</p>
<br /> <br />
<pre>{progressBar}</pre> <pre>{progressBar}</pre>
</Typography>
<button </Grid>
className="work-button" <Grid item>
<Button
onClick={() => { onClick={() => {
router.toLocation(Locations[LocationName.Slums]); router.toLocation(Locations[LocationName.Slums]);
player.finishCrime(true); player.finishCrime(true);
}} }}
> >
Cancel crime Cancel crime
</button> </Button>
</div> </Grid>
</Grid>
); );
} }
if (player.createProgramName !== "") { if (player.createProgramName !== "") {
return ( return (
<div> <Grid container direction="column" justifyContent="center" alignItems="center" style={{ minHeight: "100vh" }}>
<p> <Grid item>
<Typography>
You are currently working on coding {player.createProgramName}.<br /> You are currently working on coding {player.createProgramName}.<br />
<br /> <br />
You have been working for {convertTimeMsToTimeElapsedString(player.timeWorked)} You have been working for {convertTimeMsToTimeElapsedString(player.timeWorked)}
@ -333,17 +348,19 @@ export function WorkInProgressRoot(): React.ReactElement {
The program is {((player.timeWorkedCreateProgram / player.timeNeededToCompleteWork) * 100).toFixed(2)} The program is {((player.timeWorkedCreateProgram / player.timeNeededToCompleteWork) * 100).toFixed(2)}
% complete. <br /> % complete. <br />
If you cancel, your work will be saved and you can come back to complete the program later. If you cancel, your work will be saved and you can come back to complete the program later.
</p> </Typography>
<button </Grid>
className="work-button" <Grid item>
<Button
onClick={() => { onClick={() => {
player.finishCreateProgramWork(true); player.finishCreateProgramWork(true);
router.toTerminal(); router.toTerminal();
}} }}
> >
Cancel work on creating program Cancel work on creating program
</button> </Button>
</div> </Grid>
</Grid>
); );
} }