UI: Update general devmenu page (#835)

This commit is contained in:
missymae#2783 2023-10-23 02:01:21 -06:00 committed by GitHub
parent 9dd8275be1
commit ff0118f2f4
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 126 additions and 53 deletions

@ -8,6 +8,7 @@ import {
Select, Select,
SelectChangeEvent, SelectChangeEvent,
TextField, TextField,
Tooltip,
Typography, Typography,
} from "@mui/material"; } from "@mui/material";
import ExpandMoreIcon from "@mui/icons-material/ExpandMore"; import ExpandMoreIcon from "@mui/icons-material/ExpandMore";
@ -28,14 +29,25 @@ export function General(): React.ReactElement {
const [corporationName, setCorporationName] = useState(""); const [corporationName, setCorporationName] = useState("");
const [gangFaction, setGangFaction] = useState(FactionName.SlumSnakes); const [gangFaction, setGangFaction] = useState(FactionName.SlumSnakes);
const [devMoney, setDevMoney] = useState(0); const [devMoney, setDevMoney] = useState(0);
const [hash, setHash] = useState(Player.hashManager.hashes);
const [homeRam, setHomeRam] = useState(Player.getHomeComputer().maxRam);
// Money functions // Money functions
const moneyValues = [1e6, 1e9, 1e12, 1e15, Infinity];
const addCustomMoney = () => !Number.isNaN(devMoney) && Player.gainMoney(devMoney, "other"); const addCustomMoney = () => !Number.isNaN(devMoney) && Player.gainMoney(devMoney, "other");
const addMoney = (n: number) => () => Player.gainMoney(n, "other"); const addMoney = (n: number) => () => Player.gainMoney(n, "other");
const setMoney = (n: number) => () => (Player.money = Number(n)); const setMoney = (n: number) => () => (Player.money = Number(n));
const addHashes = () => (Player.hashManager.hashes += hash);
// Ram functions // Ram functions
const upgradeRam = () => (Player.getHomeComputer().maxRam *= 2); const doubleRam = () => {
Player.getHomeComputer().maxRam *= 2;
setHomeRam(homeRam * 2);
};
const setRam = (gb: number) => () => {
Player.getHomeComputer().maxRam = gb;
setHomeRam(gb);
};
// Node-clearing functions // Node-clearing functions
const quickB1tFlum3 = () => Router.toPage(Page.BitVerse, { flume: true, quick: true }); const quickB1tFlum3 = () => Router.toPage(Page.BitVerse, { flume: true, quick: true });
@ -91,66 +103,106 @@ export function General(): React.ReactElement {
if (error) throw new ReferenceError("Manually thrown error"); if (error) throw new ReferenceError("Manually thrown error");
}, [error]); }, [error]);
// Component css
const smallButtonStyle = { width: "12rem" };
const largeButtonStyle = { width: "20rem" };
const noArrowsNumberField = {
"& input::-webkit-outer-spin-button, & input::-webkit-inner-spin-button": {
display: "none",
},
"& input[type=number]": {
MozAppearance: "textfield",
},
};
return ( return (
<Accordion TransitionProps={{ unmountOnExit: true }}> <Accordion TransitionProps={{ unmountOnExit: true }}>
<AccordionSummary expandIcon={<ExpandMoreIcon />}> <AccordionSummary expandIcon={<ExpandMoreIcon />}>
<Typography>General</Typography> <Typography>General</Typography>
</AccordionSummary> </AccordionSummary>
<AccordionDetails> <AccordionDetails>
{moneyValues.map((value) => (
<Button key={`add money ${value}`} onClick={addMoney(value)}>
<pre>
+ <Money money={value} />
</pre>
</Button>
))}
<br />
<Typography>Add Money</Typography>
<TextField
placeholder={"$$$"}
type="number"
onChange={(x) => setDevMoney(parseFloat(x.target.value))}
sx={noArrowsNumberField}
/>
<Button style={smallButtonStyle} onClick={addCustomMoney}>
Give Money
</Button>
<Button <Button
style={smallButtonStyle}
onClick={setMoney(0)} onClick={setMoney(0)}
title="This sets your money to $0, this means the money you had will just vanish without being accounted for where it went and may offset some metrics." title="This sets your money to $0, this means the money you had will just vanish without being accounted for where it went and may offset some metrics."
> >
<pre> Clear Money
= <Money money={0} />
</pre>
</Button> </Button>
<Button onClick={addMoney(1e6)}>
<pre>
+ <Money money={1e6} />
</pre>
</Button>
<Button onClick={addMoney(1e9)}>
<pre>
+ <Money money={1e9} />
</pre>
</Button>
<Button onClick={addMoney(1e12)}>
<pre>
+ <Money money={1e12} />
</pre>
</Button>
<Button onClick={addMoney(1e15)}>
<pre>
+ <Money money={1000e12} />
</pre>
</Button>
<Button onClick={addMoney(Infinity)}>
<pre>
+ <Money money={Infinity} />
</pre>
</Button>
<Button onClick={upgradeRam}>+ RAM</Button>
<br /> <br />
<Typography>Add Custom Money</Typography> <TextField
<TextField onChange={(x) => setDevMoney(parseFloat(x.target.value))} /> disabled={!Player.hashManager}
<Button onClick={addCustomMoney}>Give Money</Button> type="number"
placeholder={"add Hacknet hashes"}
onChange={(x) => setHash(parseFloat(x.target.value))}
sx={noArrowsNumberField}
/>
<Button disabled={!Player.hashManager} style={smallButtonStyle} onClick={addHashes}>
Give Hashes
</Button>
<Button disabled={!Player.hashManager} style={smallButtonStyle} onClick={() => (Player.hashManager.hashes = 0)}>
Clear Hashes
</Button>
<br /> <br />
<Tooltip placement="top-start" title={`Current RAM: ${Player.getHomeComputer().maxRam} GB`}>
<Typography>Set Home Server RAM</Typography>
</Tooltip>
<Tooltip placement="top" title="Starting RAM">
<Button onClick={setRam(8)}>8 GB</Button>
</Tooltip>
<Button onClick={setRam(64)}>64 GB</Button>
<Button onClick={setRam(1024)}>1 TB</Button>
<Button onClick={setRam(1048576)}>1.05 PB</Button>
<Tooltip placement="top" title="Max RAM sold by Alpha Ent.">
<Button onClick={setRam(1073741824)}>1.07 EB</Button>
</Tooltip>
<Tooltip placement="top" title="Double Home server's current RAM">
<Button onClick={doubleRam}>RAM *= 2</Button>
</Tooltip>
<br />
<Typography>Corporation:</Typography>
{Player.corporation ? ( {Player.corporation ? (
<Button onClick={destroyCorporation}>Destroy Corporation</Button> <Button style={smallButtonStyle} onClick={destroyCorporation}>
Destroy Corporation
</Button>
) : ( ) : (
<> <>
<Typography>Corporation Name:</Typography> <TextField
<TextField value={corporationName} onChange={(x) => setCorporationName(x.target.value)} /> placeholder="Enter Corp Name"
<Button onClick={createCorporation}>Create Corporation</Button> value={corporationName}
onChange={(x) => setCorporationName(x.target.value)}
/>
<br />
<Button style={smallButtonStyle} onClick={createCorporation}>
Create Corporation
</Button>
</> </>
)} )}
<br /> <br />
<Typography>Gang Faction:</Typography>
{Player.gang ? ( {Player.gang ? (
<Button onClick={stopGang}>Stop Gang</Button> <Button style={smallButtonStyle} onClick={stopGang}>
Leave Gang
</Button>
) : ( ) : (
<> <>
<Typography>Gang Faction:</Typography>
<Select value={gangFaction} onChange={setGangFactionDropdown}> <Select value={gangFaction} onChange={setGangFactionDropdown}>
{GangConstants.Names.map((factionName) => ( {GangConstants.Names.map((factionName) => (
<MenuItem key={factionName} value={factionName}> <MenuItem key={factionName} value={factionName}>
@ -158,22 +210,45 @@ export function General(): React.ReactElement {
</MenuItem> </MenuItem>
))} ))}
</Select> </Select>
<Button onClick={startGang}>Start Gang</Button> <br />
<Button style={smallButtonStyle} onClick={startGang}>
Create Gang
</Button>
</> </>
)} )}
<br /> <br />
<Typography>Bladeburner:</Typography>
{Player.bladeburner ? ( {Player.bladeburner ? (
<Button onClick={leaveBladeburner}>Leave BladeBurner</Button> <Button style={smallButtonStyle} onClick={leaveBladeburner}>
Leave BladeBurner
</Button>
) : ( ) : (
<Button onClick={joinBladeburner}>Join BladeBurner</Button> <Button style={smallButtonStyle} onClick={joinBladeburner}>
Join BladeBurner
</Button>
)} )}
<br /> <br />
<Button onClick={quickB1tFlum3}>Quick b1t_flum3.exe</Button> <Typography>General:</Typography>
<Button onClick={b1tflum3}>Run b1t_flum3.exe</Button> <Button style={largeButtonStyle} onClick={quickB1tFlum3}>
<Button onClick={quickHackW0r1dD43m0n}>Quick w0rld_d34m0n</Button> Quick b1t_flum3.exe
<Button onClick={hackW0r1dD43m0n}>Hack w0rld_d34m0n</Button> </Button>
<Button onClick={() => setError(true)}>Throw Error</Button> <Button style={largeButtonStyle} onClick={b1tflum3}>
<Button onClick={checkMessages}>Check Messages</Button> Run b1t_flum3.exe
</Button>
<br />
<Button style={largeButtonStyle} onClick={quickHackW0r1dD43m0n}>
Quick w0rld_d34m0n
</Button>
<Button style={largeButtonStyle} onClick={hackW0r1dD43m0n}>
Hack w0rld_d34m0n
</Button>
<br />
<Button style={largeButtonStyle} onClick={() => setError(true)}>
Throw Error
</Button>
<Button style={largeButtonStyle} onClick={checkMessages}>
Check Messages
</Button>
</AccordionDetails> </AccordionDetails>
</Accordion> </Accordion>
); );

@ -72,9 +72,7 @@ export function HacknetUpgradeElem(props: IProps): React.ReactElement {
// We'll reuse a Bladeburner css class // We'll reuse a Bladeburner css class
return ( return (
<Paper sx={{ p: 1 }}> <Paper sx={{ p: 1 }}>
<Typography> <CopyableText value={upg.name} />
<CopyableText value={upg.name} />
</Typography>
<Typography> <Typography>
Cost: <Hashes hashes={cost} />, Bought: {level} times Cost: <Hashes hashes={cost} />, Bought: {level} times
</Typography> </Typography>

@ -19,7 +19,7 @@ export interface IConstructorParams {
/** Class representing a visitable location in the world */ /** Class representing a visitable location in the world */
export class Location { export class Location {
/** /**
* Name of city this location is in. If this property is null, it means this i * Name of city this location is in. If this property is null, it means this
* is a generic location that is available in all cities * is a generic location that is available in all cities
*/ */
city: CityName | null = null; city: CityName | null = null;

@ -14,7 +14,7 @@ interface GetMemberOptions {
class EnumHelper<EnumObj extends object, EnumMember extends Member<EnumObj> & string> { class EnumHelper<EnumObj extends object, EnumMember extends Member<EnumObj> & string> {
name: string; // Name, for including in error text name: string; // Name, for including in error text
defaultArgName: string; // Used as default for for validating ns arg name defaultArgName: string; // Used as default for validating ns arg name
valueArray: Array<EnumMember>; valueArray: Array<EnumMember>;
valueSet: Set<EnumMember>; // For quick isMember typecheck valueSet: Set<EnumMember>; // For quick isMember typecheck
fuzzMap: Map<string, EnumMember>; // For fuzzy lookup fuzzMap: Map<string, EnumMember>; // For fuzzy lookup