From 919f8480dd469c79d42598b35cbb78af03c86f0d Mon Sep 17 00:00:00 2001 From: nickofolas Date: Fri, 18 Mar 2022 23:22:21 -0500 Subject: [PATCH] Grafting UI framework --- src/Locations/ui/SpecialLocation.tsx | 72 ++++++------ src/PersonObjects/Grafting/formulas/.gitkeep | 0 .../Grafting/ui/GraftingRoot.tsx | 103 ++++++++++++++++++ src/PersonObjects/IPlayer.ts | 2 +- src/PersonObjects/Player/PlayerObject.ts | 4 +- .../Player/PlayerObjectGeneralMethods.tsx | 2 +- src/Sidebar/ui/SidebarRoot.tsx | 2 +- src/ui/GameRoot.tsx | 10 +- src/ui/Router.ts | 4 +- 9 files changed, 151 insertions(+), 48 deletions(-) create mode 100644 src/PersonObjects/Grafting/formulas/.gitkeep create mode 100644 src/PersonObjects/Grafting/ui/GraftingRoot.tsx diff --git a/src/Locations/ui/SpecialLocation.tsx b/src/Locations/ui/SpecialLocation.tsx index d7be2c170..6e0d77d6e 100644 --- a/src/Locations/ui/SpecialLocation.tsx +++ b/src/Locations/ui/SpecialLocation.tsx @@ -54,7 +54,7 @@ export function SpecialLocation(props: IProps): React.ReactElement { router.toBladeburner(); } else if (p.strength >= 100 && p.defense >= 100 && p.dexterity >= 100 && p.agility >= 100) { // Apply for Bladeburner division - p.startBladeburner({new: true}); + p.startBladeburner({ new: true }); dialogBoxCreate("You have been accepted into the Bladeburner division!"); setRerender((old) => !old); @@ -71,8 +71,8 @@ export function SpecialLocation(props: IProps): React.ReactElement { /** * Click handler for Resleeving button at New Tokyo VitaLife */ - function handleResleeving(): void { - router.toResleeves(); + function handleGrafting(): void { + router.toGrafting(); } function renderBladeburner(): React.ReactElement { @@ -150,11 +150,11 @@ export function SpecialLocation(props: IProps): React.ReactElement { ); } - function renderResleeving(): React.ReactElement { - if (!player.canAccessResleeving()) { + function renderGrafting(): React.ReactElement { + if (!player.canAccessGrafting()) { return <>; } - return ; + return ; } function handleCotMG(): void { @@ -174,35 +174,35 @@ export function SpecialLocation(props: IProps): React.ReactElement { function renderCotMG(): React.ReactElement { // prettier-ignore - const symbol = - {" `` "}
- {" -odmmNmds: "}
- {" `hNmo:..-omNh. "}
- {" yMd` `hNh "}
- {" mMd oNm "}
- {" oMNo .mM/ "}
- {" `dMN+ -mM+ "}
- {" -mMNo -mN+ "}
- {" .+- :mMNo/mN/ "}
- {":yNMd. :NMNNN/ "}
- {"-mMMMh. /NMMh` "}
- {" .dMMMd. /NMMMy` "}
- {" `yMMMd. /NNyNMMh` "}
- {" `sMMMd. +Nm: +NMMh. "}
- {" oMMMm- oNm: /NMMd. "}
- {" +NMMmsMm- :mMMd. "}
- {" /NMMMm- -mMMd. "}
- {" /MMMm- -mMMd. "}
- {" `sMNMMm- .mMmo "}
- {" `sMd:hMMm. ./. "}
- {" `yMy` `yNMd` "}
- {" `hMs` oMMy "}
- {" `hMh sMN- "}
- {" /MM- .NMo "}
- {" +MM: :MM+ "}
- {" sNNo-.`.-omNy` "}
- {" -smNNNNmdo- "}
- {" `..` "}
+ const symbol = + {" `` "}
+ {" -odmmNmds: "}
+ {" `hNmo:..-omNh. "}
+ {" yMd` `hNh "}
+ {" mMd oNm "}
+ {" oMNo .mM/ "}
+ {" `dMN+ -mM+ "}
+ {" -mMNo -mN+ "}
+ {" .+- :mMNo/mN/ "}
+ {":yNMd. :NMNNN/ "}
+ {"-mMMMh. /NMMh` "}
+ {" .dMMMd. /NMMMy` "}
+ {" `yMMMd. /NNyNMMh` "}
+ {" `sMMMd. +Nm: +NMMh. "}
+ {" oMMMm- oNm: /NMMd. "}
+ {" +NMMmsMm- :mMMd. "}
+ {" /NMMMm- -mMMd. "}
+ {" /MMMm- -mMMd. "}
+ {" `sMNMMm- .mMmo "}
+ {" `sMd:hMMm. ./. "}
+ {" `yMy` `yNMd` "}
+ {" `hMs` oMMy "}
+ {" `hMh sMN- "}
+ {" /MM- .NMo "}
+ {" +MM: :MM+ "}
+ {" sNNo-.`.-omNy` "}
+ {" -smNNNNmdo- "}
+ {" `..` "}
if (player.hasAugmentation(AugmentationNames.StaneksGift3, true)) { return ( <> @@ -298,7 +298,7 @@ export function SpecialLocation(props: IProps): React.ReactElement { switch (props.loc.name) { case LocationName.NewTokyoVitaLife: { - return renderResleeving(); + return renderGrafting(); } case LocationName.Sector12CityHall: { return ; diff --git a/src/PersonObjects/Grafting/formulas/.gitkeep b/src/PersonObjects/Grafting/formulas/.gitkeep new file mode 100644 index 000000000..e69de29bb diff --git a/src/PersonObjects/Grafting/ui/GraftingRoot.tsx b/src/PersonObjects/Grafting/ui/GraftingRoot.tsx new file mode 100644 index 000000000..7efa09eca --- /dev/null +++ b/src/PersonObjects/Grafting/ui/GraftingRoot.tsx @@ -0,0 +1,103 @@ +import React, { useState } from "react"; + +import { + Typography, + Container, + Box, + Paper, + List, + ListItemButton, + Button +} from "@mui/material"; +import { + Construction +} from "@mui/icons-material"; + +import { use } from "../../../ui/Context"; +import { Augmentations } from "../../../Augmentation/Augmentations"; +import { AugmentationNames } from "../../../Augmentation/data/AugmentationNames" +import { Settings } from "../../../Settings/Settings"; + +import { IPlayer } from "../../IPlayer"; + +const getAvailableAugs = (player: IPlayer): string[] => { + const augs: string[] = []; + + for (const [augName, aug] of Object.entries(Augmentations)) { + if ( + augName === AugmentationNames.NeuroFluxGovernor || + augName === AugmentationNames.TheRedPill || + aug.isSpecial + ) continue; + augs.push(augName); + } + + return augs.filter( + (augmentation: string) => !player.hasAugmentation(augmentation) + ); +} + +export const GraftingRoot = (): React.ReactElement => { + const player = use.Player(); + const [selectedAug, setSelectedAug] = useState(getAvailableAugs(player)[0]); + + return <> + + Grafting Laboratory + + blah blah blah exposition that isn't important right now
+ Lorem ipsum dolor sit amet et et sed et et sanctus duo vero. + Stet amet iriure consetetur elit in magna et diam dolores invidunt ipsum gubergren nihil. + Diam et et ipsum consectetuer voluptua et clita lorem sit. + Et et lorem id no suscipit wisi. + Illum velit takimata et aliquyam takimata labore vel dolor dolores duo amet lorem elitr facer invidunt. +
+ + + Craft Augmentations + + here goes a list with available augmentations with a purchase button (with price shown) to the side of it
+ getAvailableAugs function to the rescue +
+ + + {getAvailableAugs(player).map((k, i) => ( + setSelectedAug(k)} selected={selectedAug === k}> + + {k} + + + ))} + + + + {selectedAug} + + + + Time to Craft: bar + + + {(() => { + const aug = Augmentations[selectedAug]; + + const info = typeof aug.info === "string" ? {aug.info} : aug.info + const tooltip = (<>{info}

{aug.stats}); + return tooltip; + })()} +
+
+
+
+ + + name tbd + + probably some info about the cumulative negative effects here + + +
+ +} diff --git a/src/PersonObjects/IPlayer.ts b/src/PersonObjects/IPlayer.ts index 7b5053adc..24470271e 100644 --- a/src/PersonObjects/IPlayer.ts +++ b/src/PersonObjects/IPlayer.ts @@ -181,7 +181,7 @@ export interface IPlayer { canAccessBladeburner(): boolean; canAccessCorporation(): boolean; canAccessGang(): boolean; - canAccessResleeving(): boolean; + canAccessGrafting(): boolean; canAfford(cost: number): boolean; gainHackingExp(exp: number): void; gainStrengthExp(exp: number): void; diff --git a/src/PersonObjects/Player/PlayerObject.ts b/src/PersonObjects/Player/PlayerObject.ts index 0ecf6628c..4d1500ef1 100644 --- a/src/PersonObjects/Player/PlayerObject.ts +++ b/src/PersonObjects/Player/PlayerObject.ts @@ -190,7 +190,7 @@ export class PlayerObject implements IPlayer { canAccessBladeburner: () => boolean; canAccessCorporation: () => boolean; canAccessGang: () => boolean; - canAccessResleeving: () => boolean; + canAccessGrafting: () => boolean; canAfford: (cost: number) => boolean; gainHackingExp: (exp: number) => void; gainStrengthExp: (exp: number) => void; @@ -577,7 +577,7 @@ export class PlayerObject implements IPlayer { this.gainCodingContractReward = generalMethods.gainCodingContractReward; this.travel = generalMethods.travel; this.gotoLocation = generalMethods.gotoLocation; - this.canAccessResleeving = generalMethods.canAccessResleeving; + this.canAccessGrafting = generalMethods.canAccessGrafting; this.giveExploit = generalMethods.giveExploit; this.giveAchievement = generalMethods.giveAchievement; this.getIntelligenceBonus = generalMethods.getIntelligenceBonus; diff --git a/src/PersonObjects/Player/PlayerObjectGeneralMethods.tsx b/src/PersonObjects/Player/PlayerObjectGeneralMethods.tsx index ee97fc982..238e2893f 100644 --- a/src/PersonObjects/Player/PlayerObjectGeneralMethods.tsx +++ b/src/PersonObjects/Player/PlayerObjectGeneralMethods.tsx @@ -2641,7 +2641,7 @@ export function gotoLocation(this: IPlayer, to: LocationName): boolean { return true; } -export function canAccessResleeving(this: IPlayer): boolean { +export function canAccessGrafting(this: IPlayer): boolean { return this.bitNodeN === 10 || SourceFileFlags[10] > 0; } diff --git a/src/Sidebar/ui/SidebarRoot.tsx b/src/Sidebar/ui/SidebarRoot.tsx index bd1a1fbf8..b1d98e2ea 100644 --- a/src/Sidebar/ui/SidebarRoot.tsx +++ b/src/Sidebar/ui/SidebarRoot.tsx @@ -617,7 +617,7 @@ export function SidebarRoot(props: IProps): React.ReactElement { key={"City"} className={clsx({ [classes.active]: - props.page === Page.City || props.page === Page.Resleeves || props.page === Page.Location, + props.page === Page.City || props.page === Page.Grafting || props.page === Page.Location, })} onClick={clickCity} > diff --git a/src/ui/GameRoot.tsx b/src/ui/GameRoot.tsx index 40790ab3e..ed0114ccc 100644 --- a/src/ui/GameRoot.tsx +++ b/src/ui/GameRoot.tsx @@ -42,7 +42,7 @@ import { BladeburnerRoot } from "../Bladeburner/ui/BladeburnerRoot"; import { GangRoot } from "../Gang/ui/GangRoot"; import { CorporationRoot } from "../Corporation/ui/CorporationRoot"; import { InfiltrationRoot } from "../Infiltration/ui/InfiltrationRoot"; -import { ResleeveRoot } from "../PersonObjects/Resleeving/ui/ResleeveRoot"; +import { GraftingRoot } from "../PersonObjects/Grafting/ui/GraftingRoot"; import { WorkInProgressRoot } from "./WorkInProgressRoot"; import { GameOptionsRoot } from "./React/GameOptionsRoot"; import { SleeveRoot } from "../PersonObjects/Sleeve/ui/SleeveRoot"; @@ -135,7 +135,7 @@ export let Router: IRouter = { toInfiltration: uninitialized, toJob: uninitialized, toMilestones: uninitialized, - toResleeves: uninitialized, + toGrafting: uninitialized, toScriptEditor: uninitialized, toSleeves: uninitialized, toStockMarket: uninitialized, @@ -226,7 +226,7 @@ export function GameRoot({ player, engine, terminal }: IProps): React.ReactEleme toGang: () => setPage(Page.Gang), toHacknetNodes: () => setPage(Page.Hacknet), toMilestones: () => setPage(Page.Milestones), - toResleeves: () => setPage(Page.Resleeves), + toGrafting: () => setPage(Page.Grafting), toScriptEditor: (files: Record, options?: ScriptEditorRouteOptions) => { setEditorOptions({ files, @@ -429,8 +429,8 @@ export function GameRoot({ player, engine, terminal }: IProps): React.ReactEleme mainPage = ; break; } - case Page.Resleeves: { - mainPage = ; + case Page.Grafting: { + mainPage = ; break; } case Page.Travel: { diff --git a/src/ui/Router.ts b/src/ui/Router.ts index 2e4613611..e761d917c 100644 --- a/src/ui/Router.ts +++ b/src/ui/Router.ts @@ -23,7 +23,7 @@ export enum Page { Job, Milestones, Options, - Resleeves, + Grafting, Sleeves, Stats, StockMarket, @@ -74,7 +74,7 @@ export interface IRouter { toInfiltration(location: Location): void; toJob(): void; toMilestones(): void; - toResleeves(): void; + toGrafting(): void; toScriptEditor(files?: Record, options?: ScriptEditorRouteOptions): void; toSleeves(): void; toStockMarket(): void;