mirror of
https://github.com/bitburner-official/bitburner-src.git
synced 2024-11-10 01:33:54 +01:00
Active Scripts
This commit is contained in:
parent
907314e76b
commit
1996deaf0a
@ -32,7 +32,7 @@
|
||||
|
||||
.loaderoverlay {
|
||||
$spinnerBoxSize: 200px;
|
||||
$themeColor: #6f3;
|
||||
$themeColor: #0c0;
|
||||
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
|
@ -4,7 +4,7 @@
|
||||
@import "reset";
|
||||
|
||||
:root {
|
||||
--my-font-color: #6f3;
|
||||
--my-font-color: #0c0;
|
||||
--my-background-color: #000;
|
||||
--my-highlight-color: #fff;
|
||||
--my-prompt-color: #f92672;
|
||||
|
@ -340,15 +340,13 @@ export class Blackjack extends Game<Props, State> {
|
||||
{/* Buttons */}
|
||||
{!gameInProgress ? (
|
||||
<div>
|
||||
<MuiButton color="primary" onClick={this.startOnClick} disabled={wagerInvalid || !this.canStartGame()}>
|
||||
<MuiButton onClick={this.startOnClick} disabled={wagerInvalid || !this.canStartGame()}>
|
||||
Start
|
||||
</MuiButton>
|
||||
</div>
|
||||
) : (
|
||||
<div>
|
||||
<MuiButton color="primary" onClick={this.playerHit}>
|
||||
Hit
|
||||
</MuiButton>
|
||||
<MuiButton onClick={this.playerHit}>Hit</MuiButton>
|
||||
<MuiButton color="secondary" onClick={this.playerStay}>
|
||||
Stay
|
||||
</MuiButton>
|
||||
|
@ -37,12 +37,12 @@ export function Adjuster(props: IProps): React.ReactElement {
|
||||
startAdornment: (
|
||||
<>
|
||||
<Tooltip title="Add a lot">
|
||||
<IconButton color="primary" onClick={tons} size="large">
|
||||
<IconButton onClick={tons} size="large">
|
||||
<DoubleArrowIcon style={{ transform: "rotate(-90deg)" }} />
|
||||
</IconButton>
|
||||
</Tooltip>
|
||||
<Tooltip title="Add">
|
||||
<IconButton color="primary" onClick={() => add(typeof value !== "string" ? value : 0)} size="large">
|
||||
<IconButton onClick={() => add(typeof value !== "string" ? value : 0)} size="large">
|
||||
<AddIcon />
|
||||
</IconButton>
|
||||
</Tooltip>
|
||||
@ -51,16 +51,12 @@ export function Adjuster(props: IProps): React.ReactElement {
|
||||
endAdornment: (
|
||||
<>
|
||||
<Tooltip title="Remove">
|
||||
<IconButton
|
||||
color="primary"
|
||||
onClick={() => subtract(typeof value !== "string" ? value : 0)}
|
||||
size="large"
|
||||
>
|
||||
<IconButton onClick={() => subtract(typeof value !== "string" ? value : 0)} size="large">
|
||||
<RemoveIcon />
|
||||
</IconButton>
|
||||
</Tooltip>
|
||||
<Tooltip title="Reset">
|
||||
<IconButton color="primary" onClick={reset} size="large">
|
||||
<IconButton onClick={reset} size="large">
|
||||
<ClearIcon />
|
||||
</IconButton>
|
||||
</Tooltip>
|
||||
|
@ -53,23 +53,21 @@ export function Augmentations(props: IProps): React.ReactElement {
|
||||
</td>
|
||||
<td>
|
||||
<Select
|
||||
id="dev-augs-dropdown"
|
||||
className="dropdown"
|
||||
onChange={setAugmentationDropdown}
|
||||
value={augmentation}
|
||||
startAdornment={
|
||||
<>
|
||||
<IconButton color="primary" onClick={queueAllAugs} size="large">
|
||||
<IconButton onClick={queueAllAugs} size="large">
|
||||
<ReplyAllIcon />
|
||||
</IconButton>
|
||||
<IconButton color="primary" onClick={queueAug} size="large">
|
||||
<IconButton onClick={queueAug} size="large">
|
||||
<ReplyIcon />
|
||||
</IconButton>
|
||||
</>
|
||||
}
|
||||
endAdornment={
|
||||
<>
|
||||
<IconButton color="primary" onClick={clearAugs} size="large">
|
||||
<IconButton onClick={clearAugs} size="large">
|
||||
<ClearIcon />
|
||||
</IconButton>
|
||||
</>
|
||||
|
@ -119,10 +119,10 @@ export function Factions(props: IProps): React.ReactElement {
|
||||
value={faction}
|
||||
startAdornment={
|
||||
<>
|
||||
<IconButton color="primary" onClick={receiveAllInvites} size="large">
|
||||
<IconButton onClick={receiveAllInvites} size="large">
|
||||
<ReplyAllIcon />
|
||||
</IconButton>
|
||||
<IconButton color="primary" onClick={receiveInvite} size="large">
|
||||
<IconButton onClick={receiveInvite} size="large">
|
||||
<ReplyIcon />
|
||||
</IconButton>
|
||||
</>
|
||||
|
@ -207,10 +207,10 @@ function setTheme() {
|
||||
/^#[0-9a-f]{3}(?:[0-9a-f]{3})?$/i.test(FconfSettings.THEME_BACKGROUND_COLOR) &&
|
||||
/^#[0-9a-f]{3}(?:[0-9a-f]{3})?$/i.test(FconfSettings.THEME_PROMPT_COLOR)
|
||||
) {
|
||||
document.body.style.setProperty("--my-highlight-color", FconfSettings.THEME_HIGHLIGHT_COLOR);
|
||||
document.body.style.setProperty("--my-font-color", FconfSettings.THEME_FONT_COLOR);
|
||||
document.body.style.setProperty("--my-background-color", FconfSettings.THEME_BACKGROUND_COLOR);
|
||||
document.body.style.setProperty("--my-prompt-color", FconfSettings.THEME_PROMPT_COLOR);
|
||||
// document.body.style.setProperty("--my-highlight-color", FconfSettings.THEME_HIGHLIGHT_COLOR);
|
||||
// document.body.style.setProperty("--my-font-color", FconfSettings.THEME_FONT_COLOR);
|
||||
// document.body.style.setProperty("--my-background-color", FconfSettings.THEME_BACKGROUND_COLOR);
|
||||
// document.body.style.setProperty("--my-prompt-color", FconfSettings.THEME_PROMPT_COLOR);
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -586,7 +586,7 @@ export function createAndAddWorkerScript(runningScriptObj, server, parent) {
|
||||
* Updates the online running time stat of all running scripts
|
||||
*/
|
||||
export function updateOnlineScriptTimes(numCycles = 1) {
|
||||
var time = (numCycles * Engine._idleSpeed) / 1000; //seconds
|
||||
var time = (numCycles * CONSTANTS._idleSpeed) / 1000; //seconds
|
||||
for (const ws of workerScripts.values()) {
|
||||
ws.scriptRef.onlineRunningTime += time;
|
||||
}
|
||||
|
@ -333,18 +333,18 @@ export function SidebarRoot(props: IProps): React.ReactElement {
|
||||
<Drawer open={open} anchor="left" variant="permanent">
|
||||
<ListItem classes={{ root: classes.listitem }} button onClick={toggleDrawer}>
|
||||
<ListItemIcon>
|
||||
{!open ? <ChevronRightIcon color={"primary"} /> : <ChevronLeftIcon color={"primary"} />}
|
||||
{!open ? <ChevronRightIcon color="primary" /> : <ChevronLeftIcon color="primary" />}
|
||||
</ListItemIcon>
|
||||
<ListItemText primary={<Typography color="primary">Bitburner v{CONSTANTS.Version}</Typography>} />
|
||||
<ListItemText primary={<Typography>Bitburner v{CONSTANTS.Version}</Typography>} />
|
||||
</ListItem>
|
||||
<Divider />
|
||||
<List>
|
||||
<ListItem classes={{ root: classes.listitem }} button onClick={() => setHackingOpen((old) => !old)}>
|
||||
<ListItemIcon>
|
||||
<ComputerIcon color={"primary"} />
|
||||
<ComputerIcon color="primary" />
|
||||
</ListItemIcon>
|
||||
<ListItemText primary={<Typography color="primary">Hacking</Typography>} />
|
||||
{hackingOpen ? <ExpandLessIcon color={"primary"} /> : <ExpandMoreIcon color={"primary"} />}
|
||||
<ListItemText primary={<Typography>Hacking</Typography>} />
|
||||
{hackingOpen ? <ExpandLessIcon /> : <ExpandMoreIcon />}
|
||||
</ListItem>
|
||||
<Collapse in={hackingOpen} timeout="auto" unmountOnExit>
|
||||
<List>
|
||||
@ -435,10 +435,10 @@ export function SidebarRoot(props: IProps): React.ReactElement {
|
||||
<Divider />
|
||||
<ListItem classes={{ root: classes.listitem }} button onClick={() => setCharacterOpen((old) => !old)}>
|
||||
<ListItemIcon>
|
||||
<AccountBoxIcon color={"primary"} />
|
||||
<AccountBoxIcon color="primary" />
|
||||
</ListItemIcon>
|
||||
<ListItemText primary={<Typography color="primary">Character</Typography>} />
|
||||
{characterOpen ? <ExpandLessIcon color={"primary"} /> : <ExpandMoreIcon color={"primary"} />}
|
||||
<ListItemText primary={<Typography>Character</Typography>} />
|
||||
{characterOpen ? <ExpandLessIcon /> : <ExpandMoreIcon />}
|
||||
</ListItem>
|
||||
<Collapse in={characterOpen} timeout="auto" unmountOnExit>
|
||||
<ListItem
|
||||
@ -545,10 +545,10 @@ export function SidebarRoot(props: IProps): React.ReactElement {
|
||||
<Divider />
|
||||
<ListItem classes={{ root: classes.listitem }} button onClick={() => setWorldOpen((old) => !old)}>
|
||||
<ListItemIcon>
|
||||
<PublicIcon color={"primary"} />
|
||||
<PublicIcon color="primary" />
|
||||
</ListItemIcon>
|
||||
<ListItemText primary={<Typography color="primary">World</Typography>} />
|
||||
{worldOpen ? <ExpandLessIcon color={"primary"} /> : <ExpandMoreIcon color={"primary"} />}
|
||||
<ListItemText primary={<Typography>World</Typography>} />
|
||||
{worldOpen ? <ExpandLessIcon /> : <ExpandMoreIcon />}
|
||||
</ListItem>
|
||||
<Collapse in={worldOpen} timeout="auto" unmountOnExit>
|
||||
<ListItem
|
||||
@ -678,10 +678,10 @@ export function SidebarRoot(props: IProps): React.ReactElement {
|
||||
<Divider />
|
||||
<ListItem classes={{ root: classes.listitem }} button onClick={() => setHelpOpen((old) => !old)}>
|
||||
<ListItemIcon>
|
||||
<LiveHelpIcon color={"primary"} />
|
||||
<LiveHelpIcon color="primary" />
|
||||
</ListItemIcon>
|
||||
<ListItemText primary={<Typography color="primary">Help</Typography>} />
|
||||
{helpOpen ? <ExpandLessIcon color={"primary"} /> : <ExpandMoreIcon color={"primary"} />}
|
||||
<ListItemText primary={<Typography>Help</Typography>} />
|
||||
{helpOpen ? <ExpandLessIcon /> : <ExpandMoreIcon />}
|
||||
</ListItem>
|
||||
<Collapse in={helpOpen} timeout="auto" unmountOnExit>
|
||||
<ListItem
|
||||
|
@ -10,6 +10,7 @@ import { ServerAccordions } from "./ServerAccordions";
|
||||
import { WorkerScript } from "../../Netscript/WorkerScript";
|
||||
|
||||
import Typography from "@mui/material/Typography";
|
||||
import TextField from "@mui/material/TextField";
|
||||
|
||||
type IProps = {
|
||||
workerScripts: Map<number, WorkerScript>;
|
||||
|
@ -5,10 +5,14 @@
|
||||
import * as React from "react";
|
||||
|
||||
import Typography from "@mui/material/Typography";
|
||||
import Accordion from "@mui/material/Accordion";
|
||||
import AccordionSummary from "@mui/material/AccordionSummary";
|
||||
import AccordionDetails from "@mui/material/AccordionDetails";
|
||||
import ExpandMoreIcon from "@mui/icons-material/ExpandMore";
|
||||
|
||||
import ListItemButton from "@mui/material/ListItemButton";
|
||||
import ListItemText from "@mui/material/ListItemText";
|
||||
|
||||
import Paper from "@mui/material/Paper";
|
||||
import Collapse from "@mui/material/Collapse";
|
||||
import ExpandMore from "@mui/icons-material/ExpandMore";
|
||||
import ExpandLess from "@mui/icons-material/ExpandLess";
|
||||
import { ServerAccordionContent } from "./ServerAccordionContent";
|
||||
|
||||
import { BaseServer } from "../../Server/BaseServer";
|
||||
@ -22,6 +26,7 @@ type IProps = {
|
||||
};
|
||||
|
||||
export function ServerAccordion(props: IProps): React.ReactElement {
|
||||
const [open, setOpen] = React.useState(false);
|
||||
const server = props.server;
|
||||
|
||||
// Accordion's header text
|
||||
@ -38,15 +43,14 @@ export function ServerAccordion(props: IProps): React.ReactElement {
|
||||
const headerTxt = `${paddedName} ${createProgressBarText(barOptions)}`;
|
||||
|
||||
return (
|
||||
<Accordion TransitionProps={{ unmountOnExit: true }}>
|
||||
<AccordionSummary expandIcon={<ExpandMoreIcon />}>
|
||||
<Typography style={{ whiteSpace: "pre-wrap" }} color="primary">
|
||||
{headerTxt}
|
||||
</Typography>
|
||||
</AccordionSummary>
|
||||
<AccordionDetails>
|
||||
<>
|
||||
<ListItemButton onClick={() => setOpen((old) => !old)} component={Paper}>
|
||||
<ListItemText primary={<Typography style={{ whiteSpace: "pre-wrap" }}>{headerTxt}</Typography>} />
|
||||
{open ? <ExpandLess color="primary" /> : <ExpandMore color="primary" />}
|
||||
</ListItemButton>
|
||||
<Collapse in={open} timeout={0} unmountOnExit>
|
||||
<ServerAccordionContent workerScripts={props.workerScripts} />
|
||||
</AccordionDetails>
|
||||
</Accordion>
|
||||
</Collapse>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
@ -2,6 +2,10 @@ import React, { useState } from "react";
|
||||
import { WorkerScript } from "../../Netscript/WorkerScript";
|
||||
import { WorkerScriptAccordion } from "./WorkerScriptAccordion";
|
||||
import { AccordionButton } from "../React/AccordionButton";
|
||||
import Paper from "@mui/material/Paper";
|
||||
import List from "@mui/material/List";
|
||||
import TablePagination from "@mui/material/TablePagination";
|
||||
import { TablePaginationActionsAll } from "../React/TablePaginationActionsAll";
|
||||
|
||||
const pageSize = 20;
|
||||
|
||||
@ -10,63 +14,34 @@ interface IProps {
|
||||
}
|
||||
|
||||
export function ServerAccordionContent(props: IProps): React.ReactElement {
|
||||
if (props.workerScripts.length > pageSize) {
|
||||
return <ServerAccordionContentPaginated workerScripts={props.workerScripts} />;
|
||||
}
|
||||
|
||||
return (
|
||||
<ul>
|
||||
{props.workerScripts.map((ws) => {
|
||||
return <WorkerScriptAccordion key={`${ws.name}_${ws.args}`} workerScript={ws} />;
|
||||
})}
|
||||
</ul>
|
||||
);
|
||||
}
|
||||
|
||||
export function ServerAccordionContentPaginated(props: IProps): React.ReactElement {
|
||||
const [page, setPage] = useState(0);
|
||||
const scripts: React.ReactElement[] = [];
|
||||
const maxPage = Math.ceil(props.workerScripts.length / pageSize);
|
||||
const maxScript = Math.min((page + 1) * pageSize, props.workerScripts.length);
|
||||
for (let i = page * pageSize; i < maxScript; i++) {
|
||||
const ws = props.workerScripts[i];
|
||||
scripts.push(<WorkerScriptAccordion key={`${ws.name}_${ws.args}`} workerScript={ws} />);
|
||||
}
|
||||
const [rowsPerPage, setRowsPerPage] = useState(10);
|
||||
const handleChangePage = (event: unknown, newPage: number) => {
|
||||
setPage(newPage);
|
||||
};
|
||||
|
||||
function capPage(page: number): number {
|
||||
if (page < 0) {
|
||||
page = 0;
|
||||
}
|
||||
|
||||
if (maxPage - 1 < page) {
|
||||
page = maxPage - 1;
|
||||
}
|
||||
|
||||
return page;
|
||||
}
|
||||
|
||||
// in case we're on an invalid page number because scripts were killed.
|
||||
const capped = capPage(page);
|
||||
if (capped !== page) setPage(capped);
|
||||
|
||||
function changePage(n: number): void {
|
||||
setPage((newPage) => {
|
||||
newPage += n;
|
||||
newPage = Math.round(newPage);
|
||||
return capPage(newPage);
|
||||
});
|
||||
}
|
||||
const handleChangeRowsPerPage = (event: React.ChangeEvent<HTMLInputElement>) => {
|
||||
setRowsPerPage(parseInt(event.target.value, 10));
|
||||
setPage(0);
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
<ul>{scripts}</ul>
|
||||
<AccordionButton onClick={() => changePage(-1e99)} text="<<" />
|
||||
<AccordionButton onClick={() => changePage(-1)} text="<" />
|
||||
<span className="text">
|
||||
{page + 1} / {maxPage}
|
||||
</span>
|
||||
<AccordionButton onClick={() => changePage(1)} text=">" />
|
||||
<AccordionButton onClick={() => changePage(1e99)} text=">>" />
|
||||
<List>
|
||||
{props.workerScripts.slice(page * rowsPerPage, page * rowsPerPage + rowsPerPage).map((ws) => (
|
||||
<WorkerScriptAccordion key={`${ws.name}_${ws.args}`} workerScript={ws} />
|
||||
))}
|
||||
</List>
|
||||
<TablePagination
|
||||
rowsPerPageOptions={[10, 15, 20]}
|
||||
component="div"
|
||||
count={props.workerScripts.length}
|
||||
rowsPerPage={rowsPerPage}
|
||||
page={page}
|
||||
onPageChange={handleChangePage}
|
||||
onRowsPerPageChange={handleChangeRowsPerPage}
|
||||
ActionsComponent={TablePaginationActionsAll}
|
||||
/>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
@ -6,10 +6,16 @@ import React, { useState, useEffect } from "react";
|
||||
|
||||
import { ServerAccordion } from "./ServerAccordion";
|
||||
|
||||
import TextField from "@mui/material/TextField";
|
||||
import Typography from "@mui/material/Typography";
|
||||
import Paper from "@mui/material/Paper";
|
||||
import List from "@mui/material/List";
|
||||
import TablePagination from "@mui/material/TablePagination";
|
||||
import { WorkerScript } from "../../Netscript/WorkerScript";
|
||||
import { WorkerScriptStartStopEventEmitter } from "../../Netscript/WorkerScriptStartStopEventEmitter";
|
||||
import { getServer } from "../../Server/ServerHelpers";
|
||||
import { BaseServer } from "../../Server/BaseServer";
|
||||
import { TablePaginationActionsAll } from "../React/TablePaginationActionsAll";
|
||||
|
||||
// Map of server hostname -> all workerscripts on that server for all active scripts
|
||||
interface IServerData {
|
||||
@ -32,6 +38,9 @@ type IState = {
|
||||
const subscriberId = "ActiveScriptsUI";
|
||||
|
||||
export function ServerAccordions(props: IProps): React.ReactElement {
|
||||
const [filter, setFilter] = useState("");
|
||||
const [page, setPage] = useState(0);
|
||||
const [rowsPerPage, setRowsPerPage] = useState(10);
|
||||
const setRerender = useState(false)[1];
|
||||
function rerender(): void {
|
||||
setRerender((old) => !old);
|
||||
@ -45,6 +54,20 @@ export function ServerAccordions(props: IProps): React.ReactElement {
|
||||
return () => WorkerScriptStartStopEventEmitter.removeSubscriber(subscriberId);
|
||||
}, []);
|
||||
|
||||
const handleChangePage = (event: unknown, newPage: number) => {
|
||||
setPage(newPage);
|
||||
};
|
||||
|
||||
const handleChangeRowsPerPage = (event: React.ChangeEvent<HTMLInputElement>) => {
|
||||
setRowsPerPage(parseInt(event.target.value, 10));
|
||||
setPage(0);
|
||||
};
|
||||
|
||||
function handleFilterChange(event: React.ChangeEvent<HTMLInputElement>): void {
|
||||
setFilter(event.target.value);
|
||||
setPage(0);
|
||||
}
|
||||
|
||||
const serverToScriptMap: IServerToScriptsMap = {};
|
||||
for (const ws of props.workerScripts.values()) {
|
||||
const server = getServer(ws.serverIp);
|
||||
@ -65,13 +88,40 @@ export function ServerAccordions(props: IProps): React.ReactElement {
|
||||
if (data !== undefined) data.workerScripts.push(ws);
|
||||
}
|
||||
|
||||
const filtered = Object.values(serverToScriptMap).filter((data) => data && data.server.hostname.includes(filter));
|
||||
|
||||
return (
|
||||
<ul className="active-scripts-list" id="active-scripts-list">
|
||||
{Object.values(serverToScriptMap).map((data) => {
|
||||
return (
|
||||
data && <ServerAccordion key={data.server.hostname} server={data.server} workerScripts={data.workerScripts} />
|
||||
);
|
||||
})}
|
||||
</ul>
|
||||
<>
|
||||
<TextField
|
||||
value={filter}
|
||||
onChange={handleFilterChange}
|
||||
color="primary"
|
||||
autoFocus
|
||||
variant="standard"
|
||||
InputProps={{
|
||||
startAdornment: <Typography m={1}>Filter:</Typography>,
|
||||
spellCheck: false,
|
||||
}}
|
||||
/>
|
||||
<List>
|
||||
{filtered.slice(page * rowsPerPage, page * rowsPerPage + rowsPerPage).map((data) => {
|
||||
return (
|
||||
data && (
|
||||
<ServerAccordion key={data.server.hostname} server={data.server} workerScripts={data.workerScripts} />
|
||||
)
|
||||
);
|
||||
})}
|
||||
</List>
|
||||
<TablePagination
|
||||
rowsPerPageOptions={[10, 15, 20]}
|
||||
component="div"
|
||||
count={filtered.length}
|
||||
rowsPerPage={rowsPerPage}
|
||||
page={page}
|
||||
onPageChange={handleChangePage}
|
||||
onRowsPerPageChange={handleChangeRowsPerPage}
|
||||
ActionsComponent={TablePaginationActionsAll}
|
||||
/>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
@ -7,6 +7,8 @@ import * as React from "react";
|
||||
import { numeralWrapper } from "../numeralFormat";
|
||||
|
||||
import Button from "@mui/material/Button";
|
||||
import Box from "@mui/material/Box";
|
||||
import Paper from "@mui/material/Paper";
|
||||
import Typography from "@mui/material/Typography";
|
||||
import Accordion from "@mui/material/Accordion";
|
||||
import AccordionSummary from "@mui/material/AccordionSummary";
|
||||
@ -15,6 +17,12 @@ import ExpandMoreIcon from "@mui/icons-material/ExpandMore";
|
||||
import { AccordionButton } from "../React/AccordionButton";
|
||||
import IconButton from "@mui/material/IconButton";
|
||||
import DeleteIcon from "@mui/icons-material/Delete";
|
||||
import ListItemButton from "@mui/material/ListItemButton";
|
||||
import ListItemText from "@mui/material/ListItemText";
|
||||
|
||||
import Collapse from "@mui/material/Collapse";
|
||||
import ExpandMore from "@mui/icons-material/ExpandMore";
|
||||
import ExpandLess from "@mui/icons-material/ExpandLess";
|
||||
|
||||
import { killWorkerScript } from "../../Netscript/killWorkerScript";
|
||||
import { WorkerScript } from "../../Netscript/WorkerScript";
|
||||
@ -30,6 +38,7 @@ type IProps = {
|
||||
};
|
||||
|
||||
export function WorkerScriptAccordion(props: IProps): React.ReactElement {
|
||||
const [open, setOpen] = React.useState(false);
|
||||
const workerScript = props.workerScript;
|
||||
const scriptRef = workerScript.scriptRef;
|
||||
|
||||
@ -48,39 +57,42 @@ export function WorkerScriptAccordion(props: IProps): React.ReactElement {
|
||||
const offlineEps = scriptRef.offlineExpGained / scriptRef.offlineRunningTime;
|
||||
|
||||
return (
|
||||
<Accordion TransitionProps={{ unmountOnExit: true }}>
|
||||
<AccordionSummary expandIcon={<ExpandMoreIcon />}>
|
||||
<Typography color="primary">{props.workerScript.name}</Typography>
|
||||
</AccordionSummary>
|
||||
<AccordionDetails>
|
||||
<pre>Threads: {numeralWrapper.formatThreads(props.workerScript.scriptRef.threads)}</pre>
|
||||
<pre>Args: {arrayToString(props.workerScript.args)}</pre>
|
||||
<pre>Online Time: {convertTimeMsToTimeElapsedString(scriptRef.onlineRunningTime * 1e3)}</pre>
|
||||
<pre>Offline Time: {convertTimeMsToTimeElapsedString(scriptRef.offlineRunningTime * 1e3)}</pre>
|
||||
<pre>
|
||||
Total online production: <Money money={scriptRef.onlineMoneyMade} />
|
||||
</pre>
|
||||
<pre>{Array(26).join(" ") + numeralWrapper.formatExp(scriptRef.onlineExpGained) + " hacking exp"}</pre>
|
||||
<pre>
|
||||
Online production rate: <Money money={onlineMps} /> / second
|
||||
</pre>
|
||||
<pre>{Array(25).join(" ") + numeralWrapper.formatExp(onlineEps) + " hacking exp / second"}</pre>
|
||||
<pre>
|
||||
Total offline production: <Money money={scriptRef.offlineMoneyMade} />
|
||||
</pre>
|
||||
<pre>{Array(27).join(" ") + numeralWrapper.formatExp(scriptRef.offlineExpGained) + " hacking exp"}</pre>
|
||||
<pre>
|
||||
Offline production rate: <Money money={offlineMps} /> / second
|
||||
</pre>
|
||||
<pre>{Array(26).join(" ") + numeralWrapper.formatExp(offlineEps) + " hacking exp / second"}</pre>
|
||||
<>
|
||||
<ListItemButton onClick={() => setOpen((old) => !old)} component={Paper}>
|
||||
<ListItemText primary={<Typography style={{ whiteSpace: "pre-wrap" }}>{props.workerScript.name}</Typography>} />
|
||||
{open ? <ExpandLess /> : <ExpandMore />}
|
||||
</ListItemButton>
|
||||
<Collapse in={open} timeout={0} unmountOnExit>
|
||||
<Box m={3}>
|
||||
<pre>Threads: {numeralWrapper.formatThreads(props.workerScript.scriptRef.threads)}</pre>
|
||||
<pre>Args: {arrayToString(props.workerScript.args)}</pre>
|
||||
<pre>Online Time: {convertTimeMsToTimeElapsedString(scriptRef.onlineRunningTime * 1e3)}</pre>
|
||||
<pre>Offline Time: {convertTimeMsToTimeElapsedString(scriptRef.offlineRunningTime * 1e3)}</pre>
|
||||
<pre>
|
||||
Total online production: <Money money={scriptRef.onlineMoneyMade} />
|
||||
</pre>
|
||||
<pre>{Array(26).join(" ") + numeralWrapper.formatExp(scriptRef.onlineExpGained) + " hacking exp"}</pre>
|
||||
<pre>
|
||||
Online production rate: <Money money={onlineMps} /> / second
|
||||
</pre>
|
||||
<pre>{Array(25).join(" ") + numeralWrapper.formatExp(onlineEps) + " hacking exp / second"}</pre>
|
||||
<pre>
|
||||
Total offline production: <Money money={scriptRef.offlineMoneyMade} />
|
||||
</pre>
|
||||
<pre>{Array(27).join(" ") + numeralWrapper.formatExp(scriptRef.offlineExpGained) + " hacking exp"}</pre>
|
||||
<pre>
|
||||
Offline production rate: <Money money={offlineMps} /> / second
|
||||
</pre>
|
||||
<pre>{Array(26).join(" ") + numeralWrapper.formatExp(offlineEps) + " hacking exp / second"}</pre>
|
||||
|
||||
<Button onClick={logClickHandler}>
|
||||
<Typography>Log</Typography>
|
||||
</Button>
|
||||
<IconButton onClick={killScriptClickHandler}>
|
||||
<DeleteIcon color="error" />
|
||||
</IconButton>
|
||||
</AccordionDetails>
|
||||
</Accordion>
|
||||
<Button onClick={logClickHandler}>
|
||||
<Typography>Log</Typography>
|
||||
</Button>
|
||||
<IconButton onClick={killScriptClickHandler}>
|
||||
<DeleteIcon color="error" />
|
||||
</IconButton>
|
||||
</Box>
|
||||
</Collapse>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
@ -257,7 +257,7 @@ export function GameOptionsRoot(props: IProps): React.ReactElement {
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
<FormControlLabel
|
||||
control={<Switch color="primary" checked={suppressMessages} onChange={handleSuppressMessagesChange} />}
|
||||
control={<Switch checked={suppressMessages} onChange={handleSuppressMessagesChange} />}
|
||||
label={
|
||||
<Tooltip
|
||||
title={
|
||||
@ -275,13 +275,7 @@ export function GameOptionsRoot(props: IProps): React.ReactElement {
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
<FormControlLabel
|
||||
control={
|
||||
<Switch
|
||||
color="primary"
|
||||
checked={suppressFactionInvites}
|
||||
onChange={handleSuppressFactionInvitesChange}
|
||||
/>
|
||||
}
|
||||
control={<Switch checked={suppressFactionInvites} onChange={handleSuppressFactionInvitesChange} />}
|
||||
label={
|
||||
<Tooltip
|
||||
title={
|
||||
@ -299,11 +293,7 @@ export function GameOptionsRoot(props: IProps): React.ReactElement {
|
||||
<ListItem>
|
||||
<FormControlLabel
|
||||
control={
|
||||
<Switch
|
||||
color="primary"
|
||||
checked={suppressTravelConfirmations}
|
||||
onChange={handleSuppressTravelConfirmationsChange}
|
||||
/>
|
||||
<Switch checked={suppressTravelConfirmations} onChange={handleSuppressTravelConfirmationsChange} />
|
||||
}
|
||||
label={
|
||||
<Tooltip
|
||||
@ -323,7 +313,6 @@ export function GameOptionsRoot(props: IProps): React.ReactElement {
|
||||
<FormControlLabel
|
||||
control={
|
||||
<Switch
|
||||
color="primary"
|
||||
checked={suppressBuyAugmentationConfirmation}
|
||||
onChange={handleSuppressBuyAugmentationConfirmationChange}
|
||||
/>
|
||||
@ -344,11 +333,7 @@ export function GameOptionsRoot(props: IProps): React.ReactElement {
|
||||
<ListItem>
|
||||
<FormControlLabel
|
||||
control={
|
||||
<Switch
|
||||
color="primary"
|
||||
checked={suppressHospitalizationPopup}
|
||||
onChange={handleSuppressHospitalizationPopupChange}
|
||||
/>
|
||||
<Switch checked={suppressHospitalizationPopup} onChange={handleSuppressHospitalizationPopupChange} />
|
||||
}
|
||||
label={
|
||||
<Tooltip
|
||||
@ -368,11 +353,7 @@ export function GameOptionsRoot(props: IProps): React.ReactElement {
|
||||
<ListItem>
|
||||
<FormControlLabel
|
||||
control={
|
||||
<Switch
|
||||
color="primary"
|
||||
checked={suppressBladeburnerPopup}
|
||||
onChange={handleSuppressBladeburnerPopupChange}
|
||||
/>
|
||||
<Switch checked={suppressBladeburnerPopup} onChange={handleSuppressBladeburnerPopupChange} />
|
||||
}
|
||||
label={
|
||||
<Tooltip
|
||||
@ -391,7 +372,7 @@ export function GameOptionsRoot(props: IProps): React.ReactElement {
|
||||
)}
|
||||
<ListItem>
|
||||
<FormControlLabel
|
||||
control={<Switch color="primary" checked={disableHotkeys} onChange={handleDisableHotkeysChange} />}
|
||||
control={<Switch checked={disableHotkeys} onChange={handleDisableHotkeysChange} />}
|
||||
label={
|
||||
<Tooltip
|
||||
title={
|
||||
@ -409,7 +390,7 @@ export function GameOptionsRoot(props: IProps): React.ReactElement {
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
<FormControlLabel
|
||||
control={<Switch color="primary" checked={disableASCIIArt} onChange={handleDisableASCIIArtChange} />}
|
||||
control={<Switch checked={disableASCIIArt} onChange={handleDisableASCIIArtChange} />}
|
||||
label={
|
||||
<Tooltip title={<Typography>If this is set all ASCII art will be disabled.</Typography>}>
|
||||
<Typography>Disable ascii art</Typography>
|
||||
@ -419,9 +400,7 @@ export function GameOptionsRoot(props: IProps): React.ReactElement {
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
<FormControlLabel
|
||||
control={
|
||||
<Switch color="primary" checked={disableTextEffects} onChange={handleDisableTextEffectsChange} />
|
||||
}
|
||||
control={<Switch checked={disableTextEffects} onChange={handleDisableTextEffectsChange} />}
|
||||
label={
|
||||
<Tooltip
|
||||
title={
|
||||
|
69
src/ui/React/TablePaginationActionsAll.tsx
Normal file
69
src/ui/React/TablePaginationActionsAll.tsx
Normal file
@ -0,0 +1,69 @@
|
||||
import * as React from "react";
|
||||
import { useTheme } from "@mui/material/styles";
|
||||
import Box from "@mui/material/Box";
|
||||
import Table from "@mui/material/Table";
|
||||
import TableBody from "@mui/material/TableBody";
|
||||
import TableCell from "@mui/material/TableCell";
|
||||
import TableContainer from "@mui/material/TableContainer";
|
||||
import TableFooter from "@mui/material/TableFooter";
|
||||
import TablePagination from "@mui/material/TablePagination";
|
||||
import TableRow from "@mui/material/TableRow";
|
||||
import Paper from "@mui/material/Paper";
|
||||
import IconButton from "@mui/material/IconButton";
|
||||
import FirstPageIcon from "@mui/icons-material/FirstPage";
|
||||
import KeyboardArrowLeft from "@mui/icons-material/KeyboardArrowLeft";
|
||||
import KeyboardArrowRight from "@mui/icons-material/KeyboardArrowRight";
|
||||
import LastPageIcon from "@mui/icons-material/LastPage";
|
||||
|
||||
interface TablePaginationActionsProps {
|
||||
count: number;
|
||||
page: number;
|
||||
rowsPerPage: number;
|
||||
onPageChange: (event: React.MouseEvent<HTMLButtonElement>, newPage: number) => void;
|
||||
}
|
||||
|
||||
export function TablePaginationActionsAll(props: TablePaginationActionsProps) {
|
||||
const theme = useTheme();
|
||||
const { count, page, rowsPerPage, onPageChange } = props;
|
||||
|
||||
const handleFirstPageButtonClick = (event: React.MouseEvent<HTMLButtonElement>) => {
|
||||
onPageChange(event, 0);
|
||||
};
|
||||
|
||||
const handleBackButtonClick = (event: React.MouseEvent<HTMLButtonElement>) => {
|
||||
onPageChange(event, page - 1);
|
||||
};
|
||||
|
||||
const handleNextButtonClick = (event: React.MouseEvent<HTMLButtonElement>) => {
|
||||
onPageChange(event, page + 1);
|
||||
};
|
||||
|
||||
const handleLastPageButtonClick = (event: React.MouseEvent<HTMLButtonElement>) => {
|
||||
onPageChange(event, Math.max(0, Math.ceil(count / rowsPerPage) - 1));
|
||||
};
|
||||
|
||||
return (
|
||||
<Box sx={{ flexShrink: 0, ml: 2.5 }}>
|
||||
<IconButton onClick={handleFirstPageButtonClick} disabled={page === 0} aria-label="first page">
|
||||
{theme.direction === "rtl" ? <LastPageIcon /> : <FirstPageIcon />}
|
||||
</IconButton>
|
||||
<IconButton onClick={handleBackButtonClick} disabled={page === 0} aria-label="previous page">
|
||||
{theme.direction === "rtl" ? <KeyboardArrowRight /> : <KeyboardArrowLeft />}
|
||||
</IconButton>
|
||||
<IconButton
|
||||
onClick={handleNextButtonClick}
|
||||
disabled={page >= Math.ceil(count / rowsPerPage) - 1}
|
||||
aria-label="next page"
|
||||
>
|
||||
{theme.direction === "rtl" ? <KeyboardArrowLeft /> : <KeyboardArrowRight />}
|
||||
</IconButton>
|
||||
<IconButton
|
||||
onClick={handleLastPageButtonClick}
|
||||
disabled={page >= Math.ceil(count / rowsPerPage) - 1}
|
||||
aria-label="last page"
|
||||
>
|
||||
{theme.direction === "rtl" ? <FirstPageIcon /> : <LastPageIcon />}
|
||||
</IconButton>
|
||||
</Box>
|
||||
);
|
||||
}
|
@ -23,6 +23,10 @@ export const colors = {
|
||||
warning: "#cc0",
|
||||
warningdark: "#990",
|
||||
|
||||
infolight: "#69f",
|
||||
info: "#36c",
|
||||
infodark: "#039",
|
||||
|
||||
welllight: "#444",
|
||||
well: "#222",
|
||||
white: "#fff",
|
||||
@ -53,6 +57,11 @@ export const theme = createTheme({
|
||||
main: colors.error,
|
||||
dark: colors.errordark,
|
||||
},
|
||||
info: {
|
||||
light: colors.infolight,
|
||||
main: colors.info,
|
||||
dark: colors.infodark,
|
||||
},
|
||||
warning: {
|
||||
light: colors.warninglight,
|
||||
main: colors.warning,
|
||||
@ -73,6 +82,7 @@ export const theme = createTheme({
|
||||
styleOverrides: {
|
||||
root: {
|
||||
backgroundColor: colors.well,
|
||||
color: colors.primary,
|
||||
},
|
||||
input: {
|
||||
"&::placeholder": {
|
||||
@ -114,22 +124,22 @@ export const theme = createTheme({
|
||||
},
|
||||
},
|
||||
},
|
||||
// MuiButton: {
|
||||
// styleOverrides: {
|
||||
// root: {
|
||||
// backgroundColor: "#333",
|
||||
// border: "1px solid " + colors.well,
|
||||
// // color: colors.primary,
|
||||
// margin: "5px",
|
||||
// padding: "3px 5px",
|
||||
// "&:hover": {
|
||||
// backgroundColor: colors.black,
|
||||
// },
|
||||
MuiButton: {
|
||||
styleOverrides: {
|
||||
root: {
|
||||
backgroundColor: "#333",
|
||||
border: "1px solid " + colors.well,
|
||||
// color: colors.primary,
|
||||
margin: "5px",
|
||||
padding: "3px 5px",
|
||||
"&:hover": {
|
||||
backgroundColor: colors.black,
|
||||
},
|
||||
|
||||
// borderRadius: 0,
|
||||
// },
|
||||
// },
|
||||
// },
|
||||
borderRadius: 0,
|
||||
},
|
||||
},
|
||||
},
|
||||
MuiSelect: {
|
||||
styleOverrides: {
|
||||
icon: {
|
||||
@ -233,11 +243,19 @@ export const theme = createTheme({
|
||||
MuiPaper: {
|
||||
styleOverrides: {
|
||||
root: {
|
||||
borderRadius: 0,
|
||||
backgroundColor: colors.black,
|
||||
border: "1px solid " + colors.welllight,
|
||||
},
|
||||
},
|
||||
},
|
||||
MuiTablePagination: {
|
||||
styleOverrides: {
|
||||
select: {
|
||||
color: colors.primary,
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user