mirror of
https://github.com/bitburner-official/bitburner-src.git
synced 2026-04-17 23:08:36 +02:00
Update Intro
This commit is contained in:
@@ -1,9 +1,10 @@
|
|||||||
import React from "react";
|
import React from "react";
|
||||||
import { Location } from "../../Locations/Location";
|
import { Location } from "../../Locations/Location";
|
||||||
import Grid from "@mui/material/Grid";
|
import Grid from "@mui/material/Grid";
|
||||||
import Typography from "@mui/material/Typography";
|
|
||||||
import Button from "@mui/material/Button";
|
|
||||||
import { numeralWrapper } from "../../ui/numeralFormat";
|
import { numeralWrapper } from "../../ui/numeralFormat";
|
||||||
|
import { Button, Paper, Typography, Container, Tooltip, Box } from "@mui/material";
|
||||||
|
import { Report } from "@mui/icons-material";
|
||||||
|
import { Settings } from "../../Settings/Settings";
|
||||||
|
|
||||||
interface IProps {
|
interface IProps {
|
||||||
Location: Location;
|
Location: Location;
|
||||||
@@ -41,9 +42,9 @@ function coloredArrow(difficulty: number): JSX.Element {
|
|||||||
} else {
|
} else {
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
{arrowPart("white", difficulty * 13)}
|
{arrowPart(Settings.theme.primary, difficulty * 13)}
|
||||||
{arrowPart("orange", (difficulty - 1) * 13)}
|
{arrowPart(Settings.theme.warning, (difficulty - 1) * 13)}
|
||||||
{arrowPart("red", (difficulty - 2) * 13)}
|
{arrowPart(Settings.theme.error, (difficulty - 2) * 13)}
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
@@ -51,65 +52,84 @@ function coloredArrow(difficulty: number): JSX.Element {
|
|||||||
|
|
||||||
export function Intro(props: IProps): React.ReactElement {
|
export function Intro(props: IProps): React.ReactElement {
|
||||||
return (
|
return (
|
||||||
<>
|
<Container sx={{ alignItems: "center" }}>
|
||||||
<Grid container spacing={3}>
|
<Paper sx={{ p: 1, mb: 1, display: "grid", justifyItems: "center" }}>
|
||||||
<Grid item xs={10}>
|
<Typography variant="h4">
|
||||||
<Typography variant="h4">Infiltrating {props.Location.name}</Typography>
|
Infiltrating <b>{props.Location.name}</b>
|
||||||
</Grid>
|
</Typography>
|
||||||
<Grid item xs={10}>
|
<Typography variant="h6">
|
||||||
<Typography variant="h5" color="primary">
|
<b>Maximum Level: </b>
|
||||||
Maximum level: {props.MaxLevel}
|
{props.MaxLevel}
|
||||||
</Typography>
|
</Typography>
|
||||||
</Grid>
|
<Typography
|
||||||
<Grid item xs={10}>
|
variant="h6"
|
||||||
<Typography variant="h5" color="primary">
|
sx={{
|
||||||
Difficulty: {numeralWrapper.format(props.Difficulty * 33.3333, "0")} / 100
|
color:
|
||||||
</Typography>
|
props.Difficulty > 2
|
||||||
</Grid>
|
? Settings.theme.error
|
||||||
|
: props.Difficulty > 1
|
||||||
|
? Settings.theme.warning
|
||||||
|
: Settings.theme.primary,
|
||||||
|
display: "flex",
|
||||||
|
alignItems: "center",
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<b>Difficulty: </b>
|
||||||
|
{numeralWrapper.format(props.Difficulty * 33.3333, "0")} / 100
|
||||||
|
{props.Difficulty > 1.5 && (
|
||||||
|
<Tooltip
|
||||||
|
title={
|
||||||
|
<Typography color="error">
|
||||||
|
This location is too heavily guarded for your current stats. It is recommended that you try training,
|
||||||
|
or finding an easier location.
|
||||||
|
</Typography>
|
||||||
|
}
|
||||||
|
>
|
||||||
|
<Report sx={{ ml: 1 }} />
|
||||||
|
</Tooltip>
|
||||||
|
)}
|
||||||
|
</Typography>
|
||||||
|
|
||||||
{props.Difficulty > 1.5 && (
|
<Typography sx={{ lineHeight: "1em", whiteSpace: "pre" }}>[{coloredArrow(props.Difficulty)}]</Typography>
|
||||||
<Grid item xs={10}>
|
<Typography
|
||||||
<Typography variant="h5" color="primary">
|
sx={{ lineHeight: "1em", whiteSpace: "pre" }}
|
||||||
Warning: This location is too heavily guarded for your current stats, try training or finding an easier
|
>{` ^ ^ ^ ^`}</Typography>
|
||||||
location.
|
<Typography
|
||||||
</Typography>
|
sx={{ lineHeight: "1em", whiteSpace: "pre" }}
|
||||||
</Grid>
|
>{` Trivial Normal Hard Impossible`}</Typography>
|
||||||
)}
|
</Paper>
|
||||||
|
|
||||||
<Grid item xs={10}>
|
<Paper sx={{ p: 1, textAlign: "center", display: "grid", justifyItems: "center" }}>
|
||||||
<Typography sx={{ lineHeight: "1em", whiteSpace: "pre" }}>[{coloredArrow(props.Difficulty)}]</Typography>
|
<Typography sx={{ width: "75%" }}>
|
||||||
<Typography
|
<b>Infiltration</b> is a series of short minigames that get progressively harder. You take damage for failing
|
||||||
sx={{ lineHeight: "1em", whiteSpace: "pre" }}
|
them. Reaching the maximum level rewards you with intel that you can trade for money or reputation.
|
||||||
>{` ^ ^ ^ ^`}</Typography>
|
<br />
|
||||||
<Typography
|
<br />
|
||||||
sx={{ lineHeight: "1em", whiteSpace: "pre" }}
|
<b>Gameplay:</b>
|
||||||
>{` Trivial Normal Hard Impossible`}</Typography>
|
</Typography>
|
||||||
</Grid>
|
<ul>
|
||||||
<Grid item xs={10}>
|
|
||||||
<Typography>
|
<Typography>
|
||||||
Infiltration is a series of short minigames that get progressively harder. You take damage for failing them.
|
<li>
|
||||||
Reaching the maximum level rewards you with intel you can trade for money or reputation.
|
The minigames you play are randomly selected.
|
||||||
|
<br />
|
||||||
|
It might take you few tries to get used to them.
|
||||||
|
</li>
|
||||||
|
<li>No game requires use of the mouse.</li>
|
||||||
|
<li>
|
||||||
|
<b>Spacebar</b> is the default action/confirm button.
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
The <b>arrow keys</b> and <b>WASD</b> can be used interchangeably.
|
||||||
|
</li>
|
||||||
|
<li>Sometimes the rest of the keyboard is used.</li>
|
||||||
</Typography>
|
</Typography>
|
||||||
<br />
|
</ul>
|
||||||
<Typography>
|
|
||||||
The minigames you play are randomly selected. It might take you few tries to get used to them.
|
<Box sx={{ display: "grid", gridTemplateColumns: "1fr 1fr", width: "100%" }}>
|
||||||
</Typography>
|
|
||||||
<br />
|
|
||||||
<Typography>No game require use of the mouse.</Typography>
|
|
||||||
<br />
|
|
||||||
<Typography>Spacebar is the default action/confirm button.</Typography>
|
|
||||||
<br />
|
|
||||||
<Typography>Everything that uses arrow can also use WASD</Typography>
|
|
||||||
<br />
|
|
||||||
<Typography>Sometimes the rest of the keyboard is used.</Typography>
|
|
||||||
</Grid>
|
|
||||||
<Grid item xs={3}>
|
|
||||||
<Button onClick={props.start}>Start</Button>
|
<Button onClick={props.start}>Start</Button>
|
||||||
</Grid>
|
|
||||||
<Grid item xs={3}>
|
|
||||||
<Button onClick={props.cancel}>Cancel</Button>
|
<Button onClick={props.cancel}>Cancel</Button>
|
||||||
</Grid>
|
</Box>
|
||||||
</Grid>
|
</Paper>
|
||||||
</>
|
</Container>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user