Merge pull request #1572 from danielyxie/dev

Added kill all scripts button

src/ui/GameRoot.tsx

@@ -74,6 +74,8 @@ import { InvitationModal } from "../Faction/ui/InvitationModal";
 import { enterBitNode } from "../RedPill";
 import { Context } from "./Context";
 
+const htmlLocation = location;
+
 interface IProps {
   terminal: ITerminal;
   player: IPlayer;
@@ -210,6 +212,14 @@ export function GameRoot({ player, engine, terminal }: IProps): React.ReactEleme
     return ITutorialEvents.subscribe(rerender);
   }, []);
 
+  function killAllScripts(): void {
+    for (const server of GetAllServers()) {
+      server.runningScripts = [];
+    }
+    saveObject.saveGame();
+    setTimeout(() => htmlLocation.reload(), 2000);
+  }
+
   Router = {
     page: () => page,
     toActiveScripts: () => setPage(Page.ActiveScripts),
@@ -280,7 +290,7 @@ export function GameRoot({ player, engine, terminal }: IProps): React.ReactEleme
       <Context.Router.Provider value={Router}>
         <Overview>
           {!ITutorial.isRunning ? (
-            <CharacterOverview save={() => saveObject.saveGame()} />
+            <CharacterOverview save={() => saveObject.saveGame()} killScripts={killAllScripts} />
           ) : (
             <InteractiveTutorialRoot />
           )}
@@ -362,12 +372,7 @@ export function GameRoot({ player, engine, terminal }: IProps): React.ReactEleme
                     player={player}
                     save={() => saveObject.saveGame()}
                     export={() => saveObject.exportGame()}
-                    forceKill={() => {
-                      for (const server of GetAllServers()) {
-                        server.runningScripts = [];
-                      }
-                      dialogBoxCreate("Forcefully deleted all running scripts. Please save and refresh page.");
-                    }}
+                    forceKill={killAllScripts}
                     softReset={() => {
                       dialogBoxCreate("Soft Reset!");
                       prestigeAugmentation();

src/ui/React/CharacterOverview.tsx

@@ -6,6 +6,7 @@ import makeStyles from "@mui/styles/makeStyles";
 import createStyles from "@mui/styles/createStyles";
 import { numeralWrapper } from "../../ui/numeralFormat";
 import { Reputation } from "./Reputation";
+import { KillScriptsModal } from "./KillScriptsModal";
 
 import Table from "@mui/material/Table";
 import TableBody from "@mui/material/TableBody";
@@ -15,12 +16,14 @@ import Typography from "@mui/material/Typography";
 import Button from "@mui/material/Button";
 import IconButton from "@mui/material/IconButton";
 import SaveIcon from "@mui/icons-material/Save";
+import ClearAllIcon from "@mui/icons-material/ClearAll";
 
 import { Settings } from "../../Settings/Settings";
 import { use } from "../Context";
 
 interface IProps {
   save: () => void;
+  killScripts: () => void;
 }
 
 function Intelligence(): React.ReactElement {
@@ -136,7 +139,8 @@ const useStyles = makeStyles((theme: Theme) =>
   }),
 );
 
-export function CharacterOverview({ save }: IProps): React.ReactElement {
+export function CharacterOverview({ save, killScripts }: IProps): React.ReactElement {
+  const [killOpen, setKillOpen] = useState(false);
   const player = use.Player();
 
   const setRerender = useState(false)[1];
@@ -148,152 +152,162 @@ export function CharacterOverview({ save }: IProps): React.ReactElement {
 
   const classes = useStyles();
   return (
-    <Table sx={{ display: "block", m: 1 }}>
-      <TableBody>
-        <TableRow>
-          <TableCell component="th" scope="row" classes={{ root: classes.cellNone }}>
-            <Typography classes={{ root: classes.hp }}>HP&nbsp;</Typography>
-          </TableCell>
-          <TableCell align="right" classes={{ root: classes.cellNone }}>
-            <Typography classes={{ root: classes.hp }}>
-              {numeralWrapper.formatHp(player.hp)}&nbsp;/&nbsp;{numeralWrapper.formatHp(player.max_hp)}
-            </Typography>
-          </TableCell>
-          <TableCell align="right" classes={{ root: classes.cellNone }}>
-            <Typography id="overview-hp-hook" classes={{ root: classes.hp }}>
-              {/*Hook for player scripts*/}
-            </Typography>
-          </TableCell>
-        </TableRow>
+    <>
+      <Table sx={{ display: "block", m: 1 }}>
+        <TableBody>
+          <TableRow>
+            <TableCell component="th" scope="row" classes={{ root: classes.cellNone }}>
+              <Typography classes={{ root: classes.hp }}>HP&nbsp;</Typography>
+            </TableCell>
+            <TableCell align="right" classes={{ root: classes.cellNone }}>
+              <Typography classes={{ root: classes.hp }}>
+                {numeralWrapper.formatHp(player.hp)}&nbsp;/&nbsp;{numeralWrapper.formatHp(player.max_hp)}
+              </Typography>
+            </TableCell>
+            <TableCell align="right" classes={{ root: classes.cellNone }}>
+              <Typography id="overview-hp-hook" classes={{ root: classes.hp }}>
+                {/*Hook for player scripts*/}
+              </Typography>
+            </TableCell>
+          </TableRow>
 
-        <TableRow>
-          <TableCell component="th" scope="row" classes={{ root: classes.cellNone }}>
-            <Typography classes={{ root: classes.money }}>Money&nbsp;</Typography>
-          </TableCell>
-          <TableCell align="right" classes={{ root: classes.cellNone }}>
-            <Typography classes={{ root: classes.money }}>
-              {numeralWrapper.formatMoney(player.money.toNumber())}
-            </Typography>
-          </TableCell>
-          <TableCell align="right" classes={{ root: classes.cellNone }}>
-            <Typography id="overview-money-hook" classes={{ root: classes.money }}>
-              {/*Hook for player scripts*/}
-            </Typography>
-          </TableCell>
-        </TableRow>
+          <TableRow>
+            <TableCell component="th" scope="row" classes={{ root: classes.cellNone }}>
+              <Typography classes={{ root: classes.money }}>Money&nbsp;</Typography>
+            </TableCell>
+            <TableCell align="right" classes={{ root: classes.cellNone }}>
+              <Typography classes={{ root: classes.money }}>
+                {numeralWrapper.formatMoney(player.money.toNumber())}
+              </Typography>
+            </TableCell>
+            <TableCell align="right" classes={{ root: classes.cellNone }}>
+              <Typography id="overview-money-hook" classes={{ root: classes.money }}>
+                {/*Hook for player scripts*/}
+              </Typography>
+            </TableCell>
+          </TableRow>
 
-        <TableRow>
-          <TableCell component="th" scope="row" classes={{ root: classes.cell }}>
-            <Typography classes={{ root: classes.hack }}>Hack&nbsp;</Typography>
-          </TableCell>
-          <TableCell align="right" classes={{ root: classes.cell }}>
-            <Typography classes={{ root: classes.hack }}>{numeralWrapper.formatSkill(player.hacking_skill)}</Typography>
-          </TableCell>
-          <TableCell align="right" classes={{ root: classes.cell }}>
-            <Typography id="overview-hack-hook" classes={{ root: classes.hack }}>
-              {/*Hook for player scripts*/}
-            </Typography>
-          </TableCell>
-        </TableRow>
+          <TableRow>
+            <TableCell component="th" scope="row" classes={{ root: classes.cell }}>
+              <Typography classes={{ root: classes.hack }}>Hack&nbsp;</Typography>
+            </TableCell>
+            <TableCell align="right" classes={{ root: classes.cell }}>
+              <Typography classes={{ root: classes.hack }}>
+                {numeralWrapper.formatSkill(player.hacking_skill)}
+              </Typography>
+            </TableCell>
+            <TableCell align="right" classes={{ root: classes.cell }}>
+              <Typography id="overview-hack-hook" classes={{ root: classes.hack }}>
+                {/*Hook for player scripts*/}
+              </Typography>
+            </TableCell>
+          </TableRow>
 
-        <TableRow>
-          <TableCell component="th" scope="row" classes={{ root: classes.cellNone }}>
-            <Typography classes={{ root: classes.combat }}>Str&nbsp;</Typography>
-          </TableCell>
-          <TableCell align="right" classes={{ root: classes.cellNone }}>
-            <Typography classes={{ root: classes.combat }}>{numeralWrapper.formatSkill(player.strength)}</Typography>
-          </TableCell>
-          <TableCell align="right" classes={{ root: classes.cellNone }}>
-            <Typography id="overview-str-hook" classes={{ root: classes.combat }}>
-              {/*Hook for player scripts*/}
-            </Typography>
-          </TableCell>
-        </TableRow>
+          <TableRow>
+            <TableCell component="th" scope="row" classes={{ root: classes.cellNone }}>
+              <Typography classes={{ root: classes.combat }}>Str&nbsp;</Typography>
+            </TableCell>
+            <TableCell align="right" classes={{ root: classes.cellNone }}>
+              <Typography classes={{ root: classes.combat }}>{numeralWrapper.formatSkill(player.strength)}</Typography>
+            </TableCell>
+            <TableCell align="right" classes={{ root: classes.cellNone }}>
+              <Typography id="overview-str-hook" classes={{ root: classes.combat }}>
+                {/*Hook for player scripts*/}
+              </Typography>
+            </TableCell>
+          </TableRow>
 
-        <TableRow>
-          <TableCell component="th" scope="row" classes={{ root: classes.cellNone }}>
-            <Typography classes={{ root: classes.combat }}>Def&nbsp;</Typography>
-          </TableCell>
-          <TableCell align="right" classes={{ root: classes.cellNone }}>
-            <Typography classes={{ root: classes.combat }}>{numeralWrapper.formatSkill(player.defense)}</Typography>
-          </TableCell>
-          <TableCell align="right" classes={{ root: classes.cellNone }}>
-            <Typography id="overview-def-hook" classes={{ root: classes.combat }}>
-              {/*Hook for player scripts*/}
-            </Typography>
-          </TableCell>
-        </TableRow>
+          <TableRow>
+            <TableCell component="th" scope="row" classes={{ root: classes.cellNone }}>
+              <Typography classes={{ root: classes.combat }}>Def&nbsp;</Typography>
+            </TableCell>
+            <TableCell align="right" classes={{ root: classes.cellNone }}>
+              <Typography classes={{ root: classes.combat }}>{numeralWrapper.formatSkill(player.defense)}</Typography>
+            </TableCell>
+            <TableCell align="right" classes={{ root: classes.cellNone }}>
+              <Typography id="overview-def-hook" classes={{ root: classes.combat }}>
+                {/*Hook for player scripts*/}
+              </Typography>
+            </TableCell>
+          </TableRow>
 
-        <TableRow>
-          <TableCell component="th" scope="row" classes={{ root: classes.cellNone }}>
-            <Typography classes={{ root: classes.combat }}>Dex&nbsp;</Typography>
-          </TableCell>
-          <TableCell align="right" classes={{ root: classes.cellNone }}>
-            <Typography classes={{ root: classes.combat }}>{numeralWrapper.formatSkill(player.dexterity)}</Typography>
-          </TableCell>
-          <TableCell align="right" classes={{ root: classes.cellNone }}>
-            <Typography id="overview-dex-hook" classes={{ root: classes.combat }}>
-              {/*Hook for player scripts*/}
-            </Typography>
-          </TableCell>
-        </TableRow>
-        <TableRow>
-          <TableCell component="th" scope="row" classes={{ root: classes.cell }}>
-            <Typography classes={{ root: classes.combat }}>Agi&nbsp;</Typography>
-          </TableCell>
-          <TableCell align="right" classes={{ root: classes.cell }}>
-            <Typography classes={{ root: classes.combat }}>{numeralWrapper.formatSkill(player.agility)}</Typography>
-          </TableCell>
-          <TableCell align="right" classes={{ root: classes.cell }}>
-            <Typography id="overview-agi-hook" classes={{ root: classes.combat }}>
-              {/*Hook for player scripts*/}
-            </Typography>
-          </TableCell>
-        </TableRow>
+          <TableRow>
+            <TableCell component="th" scope="row" classes={{ root: classes.cellNone }}>
+              <Typography classes={{ root: classes.combat }}>Dex&nbsp;</Typography>
+            </TableCell>
+            <TableCell align="right" classes={{ root: classes.cellNone }}>
+              <Typography classes={{ root: classes.combat }}>{numeralWrapper.formatSkill(player.dexterity)}</Typography>
+            </TableCell>
+            <TableCell align="right" classes={{ root: classes.cellNone }}>
+              <Typography id="overview-dex-hook" classes={{ root: classes.combat }}>
+                {/*Hook for player scripts*/}
+              </Typography>
+            </TableCell>
+          </TableRow>
+          <TableRow>
+            <TableCell component="th" scope="row" classes={{ root: classes.cell }}>
+              <Typography classes={{ root: classes.combat }}>Agi&nbsp;</Typography>
+            </TableCell>
+            <TableCell align="right" classes={{ root: classes.cell }}>
+              <Typography classes={{ root: classes.combat }}>{numeralWrapper.formatSkill(player.agility)}</Typography>
+            </TableCell>
+            <TableCell align="right" classes={{ root: classes.cell }}>
+              <Typography id="overview-agi-hook" classes={{ root: classes.combat }}>
+                {/*Hook for player scripts*/}
+              </Typography>
+            </TableCell>
+          </TableRow>
 
-        <TableRow>
-          <TableCell component="th" scope="row" classes={{ root: classes.cellNone }}>
-            <Typography classes={{ root: classes.cha }}>Cha&nbsp;</Typography>
-          </TableCell>
-          <TableCell align="right" classes={{ root: classes.cellNone }}>
-            <Typography classes={{ root: classes.cha }}>{numeralWrapper.formatSkill(player.charisma)}</Typography>
-          </TableCell>
-          <TableCell align="right" classes={{ root: classes.cellNone }}>
-            <Typography id="overview-cha-hook" classes={{ root: classes.cha }}>
-              {/*Hook for player scripts*/}
-            </Typography>
-          </TableCell>
-        </TableRow>
-        <Intelligence />
+          <TableRow>
+            <TableCell component="th" scope="row" classes={{ root: classes.cellNone }}>
+              <Typography classes={{ root: classes.cha }}>Cha&nbsp;</Typography>
+            </TableCell>
+            <TableCell align="right" classes={{ root: classes.cellNone }}>
+              <Typography classes={{ root: classes.cha }}>{numeralWrapper.formatSkill(player.charisma)}</Typography>
+            </TableCell>
+            <TableCell align="right" classes={{ root: classes.cellNone }}>
+              <Typography id="overview-cha-hook" classes={{ root: classes.cha }}>
+                {/*Hook for player scripts*/}
+              </Typography>
+            </TableCell>
+          </TableRow>
+          <Intelligence />
 
-        <TableRow>
-          <TableCell component="th" scope="row" classes={{ root: classes.cell }}>
-            <Typography id="overview-extra-hook-0" classes={{ root: classes.hack }}>
-              {/*Hook for player scripts*/}
-            </Typography>
-          </TableCell>
-          <TableCell component="th" scope="row" align="right" classes={{ root: classes.cell }}>
-            <Typography id="overview-extra-hook-1" classes={{ root: classes.hack }}>
-              {/*Hook for player scripts*/}
-            </Typography>
-          </TableCell>
-          <TableCell component="th" scope="row" align="right" classes={{ root: classes.cell }}>
-            <Typography id="overview-extra-hook-2" classes={{ root: classes.hack }}>
-              {/*Hook for player scripts*/}
-            </Typography>
-          </TableCell>
-        </TableRow>
-        <Work />
-        <Bladeburner />
+          <TableRow>
+            <TableCell component="th" scope="row" classes={{ root: classes.cell }}>
+              <Typography id="overview-extra-hook-0" classes={{ root: classes.hack }}>
+                {/*Hook for player scripts*/}
+              </Typography>
+            </TableCell>
+            <TableCell component="th" scope="row" align="right" classes={{ root: classes.cell }}>
+              <Typography id="overview-extra-hook-1" classes={{ root: classes.hack }}>
+                {/*Hook for player scripts*/}
+              </Typography>
+            </TableCell>
+            <TableCell component="th" scope="row" align="right" classes={{ root: classes.cell }}>
+              <Typography id="overview-extra-hook-2" classes={{ root: classes.hack }}>
+                {/*Hook for player scripts*/}
+              </Typography>
+            </TableCell>
+          </TableRow>
+          <Work />
+          <Bladeburner />
 
-        <TableRow>
-          <TableCell align="center" colSpan={2} classes={{ root: classes.cellNone }}>
-            <IconButton onClick={save}>
-              <SaveIcon color={Settings.AutosaveInterval !== 0 ? "primary" : "error"} />
-            </IconButton>
-          </TableCell>
-        </TableRow>
-      </TableBody>
-    </Table>
+          <TableRow>
+            <TableCell align="center" classes={{ root: classes.cellNone }}>
+              <IconButton onClick={save}>
+                <SaveIcon color={Settings.AutosaveInterval !== 0 ? "primary" : "error"} />
+              </IconButton>
+            </TableCell>
+            <TableCell align="center" classes={{ root: classes.cellNone }}>
+              <IconButton onClick={() => setKillOpen(true)}>
+                <ClearAllIcon color="error" />
+              </IconButton>
+            </TableCell>
+          </TableRow>
+        </TableBody>
+      </Table>
+      <KillScriptsModal open={killOpen} onClose={() => setKillOpen(false)} killScripts={killScripts} />
+    </>
   );
 }

src/ui/React/KillScriptsModal.tsx

@@ -0,0 +1,24 @@
+import React from "react";
+import { Modal } from "./Modal";
+import Typography from "@mui/material/Typography";
+import Button from "@mui/material/Button";
+
+interface IProps {
+  open: boolean;
+  onClose: () => void;
+  killScripts: () => void;
+}
+
+export function KillScriptsModal(props: IProps): React.ReactElement {
+  function onClick(): void {
+    props.killScripts();
+    props.onClose();
+  }
+
+  return (
+    <Modal open={props.open} onClose={props.onClose}>
+      <Typography>Forcefully kill all running scripts? This will also save your game and reload the game.</Typography>
+      <Button onClick={onClick}>KILL</Button>
+    </Modal>
+  );
+}