mirror of
https://github.com/bitburner-official/bitburner-src.git
synced 2024-11-26 09:33:49 +01:00
bound log box to parent div
This commit is contained in:
parent
8b69fd7faa
commit
c25067c062
@ -17,6 +17,7 @@ import { GetServer } from "../../Server/AllServers";
|
||||
import { Theme } from "@mui/material";
|
||||
import { findRunningScript } from "../../Script/ScriptHelpers";
|
||||
import { Player } from "../../Player";
|
||||
import { debounce } from "lodash";
|
||||
|
||||
let layerCounter = 0;
|
||||
|
||||
@ -118,6 +119,7 @@ const useStyles = makeStyles((theme: Theme) =>
|
||||
export const logBoxBaseZIndex = 1500;
|
||||
|
||||
function LogWindow(props: IProps): React.ReactElement {
|
||||
const draggableRef = useRef<HTMLDivElement>(null);
|
||||
const [script, setScript] = useState(props.script);
|
||||
const classes = useStyles();
|
||||
const container = useRef<HTMLDivElement>(null);
|
||||
@ -185,8 +187,39 @@ function LogWindow(props: IProps): React.ReactElement {
|
||||
return classes.primary;
|
||||
}
|
||||
|
||||
// Trigger fakeDrag once to make sure loaded data is not outside bounds
|
||||
useEffect(() => fakeDrag(), []);
|
||||
|
||||
// And trigger fakeDrag when the window is resized
|
||||
useEffect(() => {
|
||||
window.addEventListener("resize", fakeDrag);
|
||||
return () => {
|
||||
window.removeEventListener("resize", fakeDrag);
|
||||
};
|
||||
}, []);
|
||||
|
||||
|
||||
const fakeDrag = debounce((): void => {
|
||||
const node = draggableRef?.current;
|
||||
if (!node) return;
|
||||
|
||||
// No official way to trigger an onChange to recompute the bounds
|
||||
// See: https://github.com/react-grid-layout/react-draggable/issues/363#issuecomment-947751127
|
||||
triggerMouseEvent(node, "mouseover");
|
||||
triggerMouseEvent(node, "mousedown");
|
||||
triggerMouseEvent(document, "mousemove");
|
||||
triggerMouseEvent(node, "mouseup");
|
||||
triggerMouseEvent(node, "click");
|
||||
}, 100);
|
||||
|
||||
const triggerMouseEvent = (node: HTMLDivElement | Document, eventType: string): void => {
|
||||
const clickEvent = document.createEvent("MouseEvents");
|
||||
clickEvent.initEvent(eventType, true, true);
|
||||
node.dispatchEvent(clickEvent);
|
||||
};
|
||||
|
||||
return (
|
||||
<Draggable handle=".drag">
|
||||
<Draggable handle=".drag" bounds="body">
|
||||
<Paper
|
||||
style={{
|
||||
display: "flex",
|
||||
@ -205,7 +238,7 @@ function LogWindow(props: IProps): React.ReactElement {
|
||||
cursor: "grab",
|
||||
}}
|
||||
>
|
||||
<Box className="drag" display="flex" alignItems="center">
|
||||
<Box className="drag" display="flex" alignItems="center" ref={draggableRef}>
|
||||
<Typography color="primary" variant="h6" title={title(true)}>
|
||||
{title()}
|
||||
</Typography>
|
||||
|
Loading…
Reference in New Issue
Block a user