Refactored SourceFile-related code to TypeScript

src/Augmentation/ui/InstalledAugmentations.tsx

@@ -0,0 +1,40 @@
+/**
+ * React Component for displaying a list of the player's installed Augmentations
+ * on the Augmentations UI
+ */
+import * as React from "react";
+
+import { Player } from "../../Player";
+import { Augmentations } from "../../Augmentation/Augmentations";
+import { AugmentationNames } from "../../Augmentation/data/AugmentationNames";
+import { Settings } from "../../Settings/Settings";
+import { OwnedAugmentationsOrderSetting } from "../../Settings/SettingEnums";
+
+import { AugmentationAccordion } from "../../ui/React/AugmentationAccordion";
+
+export function InstalledAugmentations(): React.ReactElement {
+    const sourceAugs = Player.augmentations.slice();
+
+    if (Settings.OwnedAugmentationsOrder === OwnedAugmentationsOrderSetting.Alphabetically) {
+        sourceAugs.sort((aug1, aug2) => {
+            return aug1.name <= aug2.name ? -1 : 1;
+        });
+    }
+
+    const augs = sourceAugs.map((e) => {
+        const aug = Augmentations[e.name];
+
+        let level = null;
+        if (e.name === AugmentationNames.NeuroFluxGovernor) {
+            level = e.level;
+        }
+
+        return (
+            <AugmentationAccordion aug={aug} key={e.name} level={level} />
+        )
+    });
+
+    return (
+        <ul>{augs}</ul>
+    )
+}

src/Augmentation/ui/InstalledAugmentationsAndSourceFiles.tsx

@@ -0,0 +1,56 @@
+/**
+ * React Component for displaying all of the player's installed Augmentations and
+ * Source-Files.
+ *
+ * It also contains 'configuration' buttons that allow you to change how the
+ * Augs/SF's are displayed
+ */
+import * as React from "react";
+
+import { Settings } from "../../Settings/Settings";
+import { OwnedAugmentationsOrderSetting } from "../../Settings/SettingEnums";
+
+type IProps = {
+
+}
+
+type IState = {
+    rerenderFlag: boolean;
+}
+
+export class InstalledAugmentationsAndSourceFiles extends React.Component<IProps, IState> {
+    constructor(props: IProps) {
+        super(props);
+
+        this.state = {
+            rerenderFlag: false,
+        }
+
+        this.sortByAcquirementTime = this.sortByAcquirementTime.bind(this);
+        this.sortInOrder = this.sortInOrder.bind(this);
+    }
+
+    rerender() {
+        this.setState((prevState) => {
+            return {
+                rerenderFlag: !prevState.rerenderFlag,
+            }
+        });
+    }
+
+    sortByAcquirementTime() {
+        Settings.OwnedAugmentationsOrder = OwnedAugmentationsOrderSetting.AcquirementTime;
+        this.rerender();
+    }
+
+    sortInOrder() {
+        Settings.OwnedAugmentationsOrder = OwnedAugmentationsOrderSetting.Alphabetically
+        this.rerender();
+    }
+
+    render() {
+        return (
+
+        )
+    }
+}

src/Augmentation/ui/ListConfiguration.tsx

@@ -0,0 +1,5 @@
+/**
+ * React Component for configuring the way installed augmentations and
+ * Source-Files are displayed in the Augmentations UI
+ */
+import * as React from "react";

src/Augmentation/ui/OwnedSourceFiles.tsx

@@ -0,0 +1,40 @@
+/**
+ * React Component for displaying a list of the player's Source-Files
+ * on the Augmentations UI
+ */
+import * as React from "react";
+
+import { Player } from "../../Player";
+import { Augmentations } from "../../Augmentation/Augmentations";
+import { AugmentationNames } from "../../Augmentation/data/AugmentationNames";
+import { Settings } from "../../Settings/Settings";
+import { OwnedAugmentationsOrderSetting } from "../../Settings/SettingEnums";
+
+import { AugmentationAccordion } from "../../ui/React/AugmentationAccordion";
+
+export function OwnedSourceFiles(): React.ReactElement {
+    const sourceAugs = Player.augmentations.slice();
+
+    if (Settings.OwnedAugmentationsOrder === OwnedAugmentationsOrderSetting.Alphabetically) {
+        sourceAugs.sort((aug1, aug2) => {
+            return aug1.name <= aug2.name ? -1 : 1;
+        });
+    }
+
+    const augs = sourceAugs.map((e) => {
+        const aug = Augmentations[e.name];
+
+        let level = null;
+        if (e.name === AugmentationNames.NeuroFluxGovernor) {
+            level = e.level;
+        }
+
+        return (
+            <AugmentationAccordion aug={aug} key={e.name} level={level} />
+        )
+    });
+
+    return (
+        <ul>{augs}</ul>
+    )
+}

src/Augmentation/ui/PurchasedAugmentations.tsx

@@ -0,0 +1,30 @@
+/**
+ * React component for displaying all of the player's purchased (but not installed)
+ * Augmentations on the Augmentations UI.
+ */
+import * as React from "react";
+
+import { Augmentations } from "../../Augmentation/Augmentations";
+import { AugmentationNames } from "../../Augmentation/data/AugmentationNames";
+import { Player } from "../../Player";
+
+import { AugmentationAccordion } from "../../ui/React/AugmentationAccordion";
+
+export function PurchasedAugmentations(): React.ReactElement {
+    const augs: React.ReactElement[] = [];
+    for (const ownedAug of Player.queuedAugmentations) {
+        const aug = Augmentations[ownedAug.name];
+        let level = null;
+        if (ownedAug.name === AugmentationNames.NeuroFluxGovernor) {
+            level = ownedAug.level;
+        }
+
+        augs.push(
+            <AugmentationAccordion aug={aug} key={ownedAug.name} level={level} />
+        )
+    }
+
+    return (
+        <ul className="augmentations-list">{augs}</ul>
+    )
+}

src/Augmentation/ui/Root.tsx

@@ -0,0 +1,72 @@
+/**
+ * Root React component for the Augmentations UI page that display all of your
+ * owned and purchased Augmentations and Source-Files.
+ */
+import * as React from "react";
+
+import { Augmentations } from "../../Augmentation/Augmentations";
+import { Player } from "../../Player";
+
+import { StdButton } from "../../ui/React/StdButton";
+
+type IProps = {
+    exportGameFn: () => void;
+    installAugmentationsFn: () => void;
+}
+
+type IState = {
+
+}
+
+export class AugmentationsRoot extends React.Component<IProps, IState> {
+    constructor(props: IProps) {
+        super(props);
+    }
+
+    render() {
+        return (
+            <div>
+                <h1>Purchased Augmentations</h1>
+                <p>
+                    Below is a list of all Augmentations you have purchased but not
+                    yet installed. Click the button below to install them.
+                </p>
+                <p>
+                    WARNING: Installing your Augmentations resets most of your progress,
+                    including:
+                </p>
+                <p>- Stats/Skill levels and Experience</p>
+                <p>- Money</p>
+                <p>- Scripts on every computer but your home computer</p>
+                <p>- Purchased servers</p>
+                <p>- Hacknet Nodes</p>
+                <p>- Faction/Company reputation</p>
+                <p>- Stocks</p>
+                <p>
+                    Installing Augmentations lets you start over with the perks and
+                    benefits granted by all of the Augmentations you have ever
+                    installed. Also, you will keep any scripts and RAM/Core upgrades
+                    on your home computer (but you will lose all programs besides
+                    NUKE.exe)
+                </p>
+
+                <StdButton
+                    onClick={this.props.installAugmentationsFn}
+                    text="Install Augmentations"
+                    tooltip="'I never asked for this'"
+                />
+
+                <StdButton
+                    addClasses="flashing-button"
+                    onClick={this.props.exportGameFn}
+                    text="Backup Save (Export)"
+                    tooltip="It's always a good idea to backup/export your save!"
+                />
+
+                <ul className="augmentations-list">
+
+                </ul>
+            </div>
+        )
+    }
+}