Personal_mirrors/bitburner-src
1
0
Fork 0
mirror of https://github.com/bitburner-official/bitburner-src.git synced 2024-12-19 04:35:46 +01:00
Code Issues Packages Projects Releases Wiki Activity

Improve logbox behavior

Browse Source
This commit is contained in:
Olivier Gagnon 2021-10-07 15:02:54 -04:00
parent b1d1de9118
commit c06aff3437
5 changed files with 28 additions and 39 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
dist/vendor.bundle.js vendored
View File

File diff suppressed because one or more lines are too long

4
main.bundle.js
View File

File diff suppressed because one or more lines are too long

2
main.bundle.js.map
View File

File diff suppressed because one or more lines are too long

1
src/Server/AllServers.ts
View File

@ -148,4 +148,5 @@ export function prestigeAllServers(): void {
export function loadAllServers(saveString: string): void {
AllServers = JSON.parse(saveString, Reviver);
console.log(AllServers);
}

48
src/ui/React/LogBoxManager.tsx
View File

@ -8,6 +8,9 @@ import Button from "@mui/material/Button";
import Paper from "@mui/material/Paper";
import Draggable from "react-draggable";
import { ResizableBox } from "react-resizable";
import { Theme } from "@mui/material";
import makeStyles from "@mui/styles/makeStyles";
import createStyles from "@mui/styles/createStyles";
import ArrowForwardIosIcon from "@mui/icons-material/ArrowForwardIos";
export const LogBoxEvents = new EventEmitter<[RunningScript]>();
@ -55,7 +58,20 @@ interface IProps {
onClose: () => void;
}
const useStyles = makeStyles(() =>
createStyles({
logs: {
overflowY: "scroll",
overflowX: "hidden",
scrollbarWidth: "auto",
display: "flex",
flexDirection: "column-reverse",
},
}),
);
function LogWindow(props: IProps): React.ReactElement {
const classes = useStyles();
const container = useRef<HTMLDivElement>(null);
const setRerender = useState(false)[1];
function rerender(): void {
@ -72,35 +88,6 @@ function LogWindow(props: IProps): React.ReactElement {
props.onClose();
}
function drag(event: React.MouseEvent<HTMLElement, MouseEvent>): void {
const c = container.current;
if (c === null) return;
event.preventDefault();
let x = event.clientX;
let y = event.clientY;
let left = c.offsetLeft + c.clientWidth / 2;
let top = c.offsetTop + c.clientWidth / 5;
function mouseMove(event: MouseEvent): void {
const c = container.current;
if (c === null) return;
left += event.clientX - x;
top += event.clientY - y;
c.style.left = left + "px";
c.style.top = top + "px";
// reset right and bottom to avoid the window stretching
c.style.right = "";
c.style.bottom = "";
x = event.clientX;
y = event.clientY;
}
function mouseUp(): void {
document.removeEventListener("mouseup", mouseUp);
document.removeEventListener("mousemove", mouseMove);
}
document.addEventListener("mouseup", mouseUp);
document.addEventListener("mousemove", mouseMove);
}
return (
<Draggable handle="#drag">
<Paper
@ -132,10 +119,11 @@ function LogWindow(props: IProps): React.ReactElement {
</Paper>
<Paper sx={{ overflow: "scroll", overflowWrap: "break-word", whiteSpace: "pre-line" }}>
<ResizableBox
className={classes.logs}
height={500}
width={500}
handle={
<span style={{ position: "absolute", right: 0, bottom: 0 }}>
<span style={{ position: "absolute", right: "-10px", bottom: "-13px", cursor: "nw-resize" }}>
<ArrowForwardIosIcon color="primary" style={{ transform: "rotate(45deg)" }} />
</span>
}