Tutorial: Remove NS1 tutorial, change getting started guide to .js (#258)

This commit is contained in:
Mughur
2022-12-22 00:49:12 +02:00
committed by GitHub
parent b004b7203d
commit addcee73fc
5 changed files with 163 additions and 292 deletions

View File

@@ -9,7 +9,6 @@ import ArrowBackIos from "@mui/icons-material/ArrowBackIos";
import { ITutorialEvents } from "./ITutorialEvents";
import { CopyableText } from "../React/CopyableText";
import List from "@mui/material/List";
import ListItem from "@mui/material/ListItem";
import EqualizerIcon from "@mui/icons-material/Equalizer";
import LastPageIcon from "@mui/icons-material/LastPage";
@@ -28,7 +27,6 @@ import {
iTutorialSteps,
iTutorialEnd,
} from "../../InteractiveTutorial";
import { NSSelection } from "./NSSelection";
interface IContent {
content: React.ReactElement;
@@ -47,23 +45,10 @@ const useStyles = makeStyles((theme: Theme) =>
}),
);
enum Language {
None,
NS1,
NS2,
}
export function InteractiveTutorialRoot(): React.ReactElement {
const [nsSelectionOpen, setNSSelectionOpen] = useState(false);
const [language, setLanguage] = useState(Language.None);
const classes = useStyles();
const tutorialScriptExtension = {
[Language.None]: ".script",
[Language.NS1]: ".script",
[Language.NS2]: ".js",
}[language];
const tutorialScriptName = `n00dles${tutorialScriptExtension}`;
const tutorialScriptName = `n00dles.js`;
const contents: { [number: string]: IContent | undefined } = {
[iTutorialSteps.Start as number]: {
@@ -83,47 +68,6 @@ export function InteractiveTutorialRoot(): React.ReactElement {
),
canNext: true,
},
[iTutorialSteps.NSSelection as number]: {
content: (
<>
<Typography>The tutorial will adjust to your programming ability.</Typography>
<Typography>Bitburner has 2 types of scripts:</Typography>
<List>
<ListItem>
<Typography>NS1: Javascript from 2009, very simple. Recommended for beginners to programming.</Typography>
</ListItem>
<ListItem>
<Typography>
NS2: Native, modern Javascript. Recommended if you know any programming language or are serious about
learning programming.
</Typography>
</ListItem>
</List>
<Typography>
Both are available at all time and interchangeably. This choice is only for the tutorial.
</Typography>
<Button
onClick={() => {
setLanguage(Language.NS1);
iTutorialNextStep();
}}
>
Use NS1
</Button>
<Button
onClick={() => {
setLanguage(Language.NS2);
iTutorialNextStep();
}}
>
Use NS2
</Button>
<Button onClick={() => setNSSelectionOpen(true)}>More info</Button>
<br />
</>
),
canNext: false,
},
[iTutorialSteps.GoToCharacterPage as number]: {
content: (
<>
@@ -320,7 +264,7 @@ export function InteractiveTutorialRoot(): React.ReactElement {
<Typography></Typography>
</>
),
canNext: true,
canNext: false,
},
[iTutorialSteps.TerminalManualHack as number]: {
content: (
@@ -364,7 +308,7 @@ export function InteractiveTutorialRoot(): React.ReactElement {
<Typography>Let's head home before creating our first script!</Typography>
</>
),
canNext: true,
canNext: false,
},
[iTutorialSteps.TerminalCreateScript as number]: {
content: (
@@ -378,9 +322,7 @@ export function InteractiveTutorialRoot(): React.ReactElement {
</Typography>
<Typography classes={{ root: classes.textfield }}>{"[home ~/]> nano"}</Typography>
<Typography>
Scripts must end with the {tutorialScriptExtension} extension. Let's make a script now by entering{" "}
</Typography>
<Typography>Scripts must end with the .js extension. Let's make a script now by entering </Typography>
<Typography classes={{ root: classes.textfield }}>{`[home ~/]> nano ${tutorialScriptName}`}</Typography>
<Typography>
@@ -394,20 +336,12 @@ export function InteractiveTutorialRoot(): React.ReactElement {
content: (
<>
<Typography>
This is the script editor. You can use it to program your scripts.{" "}
{language !== Language.NS2 && <>Scripts are written in a simplified version of javascript.</>} Copy and
paste the following code into the script editor: <br />
This is the script editor. You can use it to program your scripts. Copy and paste the following code into
the script editor: <br />
</Typography>
<Typography classes={{ root: classes.code }}>
{language !== Language.NS2 && (
<CopyableText
value={`while(true) {
hack('n00dles');
}`}
/>
)}
{language === Language.NS2 && (
{
<CopyableText
value={`export async function main(ns) {
while(true) {
@@ -415,7 +349,7 @@ export function InteractiveTutorialRoot(): React.ReactElement {
}
}`}
/>
)}
}
</Typography>
<Typography>
For anyone with basic programming experience, this code should be straightforward. This script will
@@ -589,8 +523,17 @@ export function InteractiveTutorialRoot(): React.ReactElement {
content: (
<Typography>
This page contains a lot of different documentation about the game's content and mechanics. I know it's a lot,
but I highly suggest you read (or at least skim) through this before you start playing . That's the end of the
tutorial. Hope you enjoy the game!
but I highly suggest you read (or at least skim) through this before you start playing.
<br />
<br />
The{" "}
<a href="https://bitburner.readthedocs.io/en/latest/guidesandtips/gettingstartedguideforbeginnerprogrammers.html">
Getting Started
</a>{" "}
contains the guide for new players, navigating you through most of early game.
<br />
<br />
That's the end of the tutorial. Hope you enjoy the game!
</Typography>
),
canNext: true,
@@ -614,7 +557,6 @@ export function InteractiveTutorialRoot(): React.ReactElement {
if (content === undefined) throw new Error("error in the tutorial");
return (
<>
<NSSelection open={nsSelectionOpen} onClose={() => setNSSelectionOpen(false)} />
<Paper square sx={{ maxWidth: "70vw", p: 2 }}>
{content.content}
{step !== iTutorialSteps.TutorialPageInfo && (