Hacking missions inside GameRoot

This commit is contained in:
Olivier Gagnon 2021-09-19 17:05:27 -04:00
parent 0a2dbe66e4
commit 7a2dd16092
9 changed files with 33 additions and 29 deletions

@ -23,7 +23,6 @@ import { CreateGangPopup } from "./CreateGangPopup";
type IProps = { type IProps = {
faction: Faction; faction: Faction;
startHackingMissionFn: (faction: Faction) => void;
}; };
// Info text for all options on the UI // Info text for all options on the UI
@ -114,7 +113,7 @@ export function FactionRoot(props: IProps): React.ReactElement {
function startHackingMission(faction: Faction): void { function startHackingMission(faction: Faction): void {
player.singularityStopWork(); player.singularityStopWork();
props.startHackingMissionFn(faction); router.toHackingMission(faction);
} }
function startSecurityWork(faction: Faction): void { function startSecurityWork(faction: Faction): void {

@ -0,0 +1,13 @@
import React, { useEffect } from "react";
import { startHackingMission } from "../../Faction/FactionHelpers";
import { Faction } from "../../Faction/Faction";
interface IProps {
faction: Faction;
}
export function HackingMissionRoot(props: IProps): React.ReactElement {
useEffect(() => startHackingMission(props.faction));
return <div id="mission-container"></div>;
}

@ -10,6 +10,7 @@ import { getRandomInt } from "../utils/helpers/getRandomInt";
import { isString } from "../utils/helpers/isString"; import { isString } from "../utils/helpers/isString";
import { clearEventListeners } from "../utils/uiHelpers/clearEventListeners"; import { clearEventListeners } from "../utils/uiHelpers/clearEventListeners";
import { Router } from "./ui/GameRoot";
// For some reason `jsplumb` needs to be imported exactly like this, // For some reason `jsplumb` needs to be imported exactly like this,
// lowercase p, and later in the code used as `jsPlumb` uppercase P. wtf. // lowercase p, and later in the code used as `jsPlumb` uppercase P. wtf.
@ -1593,6 +1594,7 @@ HackingMission.prototype.finishMission = function (win) {
} else { } else {
dialogBoxCreate("Mission lost/forfeited! You did not gain any faction reputation."); dialogBoxCreate("Mission lost/forfeited! You did not gain any faction reputation.");
} }
Router.toFaction();
}; };
export { HackingMission, inMission, setInMission, currMission }; export { HackingMission, inMission, setInMission, currMission };

@ -51,12 +51,6 @@ import React from "react";
import ReactDOM from "react-dom"; import ReactDOM from "react-dom";
const Engine = { const Engine = {
// Display objects
// TODO-Refactor this into its own component
Display: {
missionContent: null,
},
indexedDb: undefined, indexedDb: undefined,
// Time variables (milliseconds unix epoch time) // Time variables (milliseconds unix epoch time)
@ -258,7 +252,6 @@ const Engine = {
// Load game from save or create new game // Load game from save or create new game
if (loadGame(saveString)) { if (loadGame(saveString)) {
initBitNodeMultipliers(Player); initBitNodeMultipliers(Player);
Engine.setDisplayElements(); // Sets variables for important DOM elements
updateSourceFileFlags(Player); updateSourceFileFlags(Player);
initAugmentations(); // Also calls Player.reapplyAllAugmentations() initAugmentations(); // Also calls Player.reapplyAllAugmentations()
Player.reapplyAllSourceFiles(); Player.reapplyAllSourceFiles();
@ -418,11 +411,6 @@ const Engine = {
); );
}, },
setDisplayElements: function () {
Engine.Display.missionContent = document.getElementById("mission-container");
Engine.Display.missionContent.style.display = "none";
},
start: function () { start: function () {
// Get time difference // Get time difference
const _thisUpdate = new Date().getTime(); const _thisUpdate = new Date().getTime();

@ -45,18 +45,6 @@
<div id="generic-react-container"></div> <div id="generic-react-container"></div>
</div> </div>
<div id="mission-container" class="generic-fullscreen-container"></div>
<!-- Interactive Tutorial Text Screen -->
<div id="interactive-tutorial-wrapper">
<div id="interactive-tutorial-container">
<p id="interactive-tutorial-text"></p>
<button id="interactive-tutorial-exit">Exit Tutorial</button>
<button id="interactive-tutorial-next">Next</button>
<button id="interactive-tutorial-back">Back</button>
</div>
</div>
<!-- Status text --> <!-- Status text -->
<div id="status-text-container"> <div id="status-text-container">
<p id="status-text"></p> <p id="status-text"></p>

@ -56,6 +56,7 @@ import { TerminalRoot } from "../Terminal/ui/TerminalRoot";
import { TutorialRoot } from "../Tutorial/ui/TutorialRoot"; import { TutorialRoot } from "../Tutorial/ui/TutorialRoot";
import { ActiveScriptsRoot } from "../ui/ActiveScripts/ActiveScriptsRoot"; import { ActiveScriptsRoot } from "../ui/ActiveScripts/ActiveScriptsRoot";
import { FactionsRoot } from "../Faction/ui/FactionsRoot"; import { FactionsRoot } from "../Faction/ui/FactionsRoot";
import { HackingMissionRoot } from "../HackingMission/ui/HackingMissionRoot";
import { FactionRoot } from "../Faction/ui/FactionRoot"; import { FactionRoot } from "../Faction/ui/FactionRoot";
import { CharacterStats } from "./CharacterStats"; import { CharacterStats } from "./CharacterStats";
import { TravelAgencyRoot } from "../Locations/ui/TravelAgencyRoot"; import { TravelAgencyRoot } from "../Locations/ui/TravelAgencyRoot";
@ -65,7 +66,6 @@ import { CharacterOverview } from "./React/CharacterOverview";
import { BladeburnerCinematic } from "../Bladeburner/ui/BladeburnerCinematic"; import { BladeburnerCinematic } from "../Bladeburner/ui/BladeburnerCinematic";
import { workerScripts } from "../Netscript/WorkerScripts"; import { workerScripts } from "../Netscript/WorkerScripts";
import { startHackingMission } from "../Faction/FactionHelpers";
import { enterBitNode } from "../RedPill"; import { enterBitNode } from "../RedPill";
import { Context } from "./Context"; import { Context } from "./Context";
@ -173,6 +173,9 @@ export let Router: IRouter = {
toLocation: () => { toLocation: () => {
throw new Error("Router called before initialization"); throw new Error("Router called before initialization");
}, },
toHackingMission: () => {
throw new Error("Router called before initialization");
},
}; };
function determineStartPage(player: IPlayer): Page { function determineStartPage(player: IPlayer): Page {
@ -262,6 +265,10 @@ export function GameRoot({ player, engine, terminal }: IProps): React.ReactEleme
setLocation(location); setLocation(location);
setPage(Page.Location); setPage(Page.Location);
}, },
toHackingMission: (faction: Faction) => {
setPage(Page.HackingMission);
setFaction(faction);
},
}; };
useEffect(() => { useEffect(() => {
@ -284,6 +291,8 @@ export function GameRoot({ player, engine, terminal }: IProps): React.ReactEleme
<BitverseRoot flume={flume} enter={enterBitNode} quick={quick} /> <BitverseRoot flume={flume} enter={enterBitNode} quick={quick} />
) : page === Page.Infiltration ? ( ) : page === Page.Infiltration ? (
<InfiltrationRoot location={location} /> <InfiltrationRoot location={location} />
) : page === Page.HackingMission ? (
<HackingMissionRoot faction={faction} />
) : page === Page.BladeburnerCinematic ? ( ) : page === Page.BladeburnerCinematic ? (
<BladeburnerCinematic /> <BladeburnerCinematic />
) : page === Page.Work ? ( ) : page === Page.Work ? (
@ -309,7 +318,7 @@ export function GameRoot({ player, engine, terminal }: IProps): React.ReactEleme
) : page === Page.Factions ? ( ) : page === Page.Factions ? (
<FactionsRoot player={player} router={Router} /> <FactionsRoot player={player} router={Router} />
) : page === Page.Faction ? ( ) : page === Page.Faction ? (
<FactionRoot faction={faction} startHackingMissionFn={startHackingMission} /> <FactionRoot faction={faction} />
) : page === Page.Milestones ? ( ) : page === Page.Milestones ? (
<MilestonesRoot player={player} /> <MilestonesRoot player={player} />
) : page === Page.Tutorial ? ( ) : page === Page.Tutorial ? (

@ -117,7 +117,6 @@ export function CharacterOverview({ save }: IProps): React.ReactElement {
const player = use.Player(); const player = use.Player();
const router = use.Router(); const router = use.Router();
if (router.page() === Page.BitVerse) return <></>;
const setRerender = useState(false)[1]; const setRerender = useState(false)[1];
useEffect(() => { useEffect(() => {

@ -5,6 +5,8 @@ import Box from "@mui/material/Box";
import Collapse from "@mui/material/Collapse"; import Collapse from "@mui/material/Collapse";
import Fab from "@mui/material/Fab"; import Fab from "@mui/material/Fab";
import VisibilityOffIcon from "@mui/icons-material/VisibilityOff"; import VisibilityOffIcon from "@mui/icons-material/VisibilityOff";
import { use } from "../Context";
import { Page } from "../Router";
const useStyles = makeStyles({ const useStyles = makeStyles({
nobackground: { nobackground: {
@ -19,6 +21,8 @@ interface IProps {
export function Overview({ children }: IProps): React.ReactElement { export function Overview({ children }: IProps): React.ReactElement {
const [open, setOpen] = useState(true); const [open, setOpen] = useState(true);
const classes = useStyles(); const classes = useStyles();
const router = use.Router();
if (router.page() === Page.BitVerse || router.page() === Page.HackingMission) return <></>;
return ( return (
<div style={{ position: "fixed", top: 0, right: 0, zIndex: 1500 }}> <div style={{ position: "fixed", top: 0, right: 0, zIndex: 1500 }}>
<Box display="flex" justifyContent="flex-end" flexDirection={"column"}> <Box display="flex" justifyContent="flex-end" flexDirection={"column"}>

@ -34,6 +34,7 @@ export enum Page {
Work, Work,
BladeburnerCinematic, BladeburnerCinematic,
Location, Location,
HackingMission,
} }
/** /**
@ -73,4 +74,5 @@ export interface IRouter {
toWork(): void; toWork(): void;
toBladeburnerCinematic(): void; toBladeburnerCinematic(): void;
toLocation(location: Location): void; toLocation(location: Location): void;
toHackingMission(faction: Faction): void;
} }