Bulk of design overhaul

2026-05-03 06:17:04 +02:00 · 2022-04-17 12:51:14 -05:00
parent 02d0d0df53
commit 9db90709fd
6 changed files with 736 additions and 668 deletions
@@ -0,0 +1,106 @@
+import DownloadIcon from "@mui/icons-material/Download";
+import PaletteIcon from "@mui/icons-material/Palette";
+import SaveIcon from "@mui/icons-material/Save";
+import UploadIcon from "@mui/icons-material/Upload";
+import { Box, Button, Container, Grid, Link, ListItem, Tooltip, Typography } from "@mui/material";
+import { Theme } from "@mui/material/styles";
+import createStyles from "@mui/styles/createStyles";
+import makeStyles from "@mui/styles/makeStyles";
+import React, { useRef, useState } from "react";
+import { FileDiagnosticModal } from "../../Diagnostic/FileDiagnosticModal";
+import { IPlayer } from "../../PersonObjects/IPlayer";
+import { ImportData, saveObject } from "../../SaveObject";
+import { Settings } from "../../Settings/Settings";
+import { StyleEditorButton } from "../../Themes/ui/StyleEditorButton";
+import { ThemeEditorButton } from "../../Themes/ui/ThemeEditorButton";
+import { ConfirmationModal } from "../../ui/React/ConfirmationModal";
+import { DeleteGameButton } from "../../ui/React/DeleteGameButton";
+import { SnackbarEvents, ToastVariant } from "../../ui/React/Snackbar";
+import { SoftResetButton } from "../../ui/React/SoftResetButton";
+import { IRouter } from "../../ui/Router";
+import { convertTimeMsToTimeElapsedString } from "../../utils/StringHelperFunctions";
+import { GameOptionsTabs } from "../GameOptionsTabs";
+import { CurrentOptionsPage } from "./CurrentOptionsPage";
+import { GameOptionsSidebar } from "./GameOptionsSidebar";
+
+const useStyles = makeStyles((theme: Theme) =>
+  createStyles({
+    root: {
+      width: 50,
+      padding: theme.spacing(2),
+      userSelect: "none",
+    },
+  }),
+);
+
+interface IProps {
+  player: IPlayer;
+  router: IRouter;
+  save: () => void;
+  export: () => void;
+  forceKill: () => void;
+  softReset: () => void;
+}
+
+export function GameOptionsRoot(props: IProps): React.ReactElement {
+  const classes = useStyles();
+  const [currentTab, setCurrentTab] = useState(GameOptionsTabs.SYSTEM);
+
+  return (
+    <>
+      <Container disableGutters maxWidth="lg" sx={{ mx: 0 }}>
+        <Typography variant="h4">Options</Typography>
+        <Box sx={{ display: "grid", gridTemplateColumns: "1fr 3fr", gap: 1 }}>
+          <GameOptionsSidebar
+            tab={currentTab}
+            setTab={(tab: GameOptionsTabs) => setCurrentTab(tab)}
+            player={props.player}
+            router={props.router}
+            save={props.save}
+            export={props.export}
+            forceKill={props.forceKill}
+            softReset={props.softReset}
+          />
+          <CurrentOptionsPage currentTab={currentTab} player={props.player} />
+        </Box>
+      </Container>
+
+      <div className={classes.root} style={{ width: "90%" }}>
+        <Grid container spacing={3}>
+          <Grid item xs={12} sm={6}>
+            {!location.href.startsWith("file://") && (
+              <>
+                <ListItem>
+                  <Typography>danielyxie / BigD (Original developer): </Typography>
+                  <form action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_blank">
+                    <input type="hidden" name="cmd" value="_s-xclick" />
+                    <input
+                      type="hidden"
+                      name="encrypted"
+                      value="-----BEGIN PKCS7-----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-----END PKCS7-----"
+                    />
+                    <input
+                      type="image"
+                      src="https://www.paypalobjects.com/en_US/i/btn/btn_donateCC_LG.gif"
+                      name="submit"
+                      alt="PayPal - The safer, easier way to pay online!"
+                    />
+                  </form>
+                </ListItem>
+
+                <ListItem>
+                  <Typography>
+                    hydroflame (Current maintainer):{" "}
+                    <Link href="https://www.google.com/search?q=Where+to+donate+blood+near+me%3F" target="_blank">
+                      Donate blood!
+                    </Link>{" "}
+                  </Typography>
+                </ListItem>
+              </>
+            )}
+          </Grid>
+        </Grid>
+      </div>
+    </>
+  );
+}