Add minimize button to log windows

This commit is contained in:
theit8514
2021-12-26 17:38:25 -05:00
parent 169d3e6c77
commit 5607561c50

View File

@@ -77,6 +77,16 @@ interface IProps {
const useStyles = makeStyles((theme: Theme) => const useStyles = makeStyles((theme: Theme) =>
createStyles({ createStyles({
title: {
"&.is-minimized + *": {
border: "none",
margin: 0,
"max-height": 0,
padding: 0,
"pointer-events": "none",
visibility: "hidden"
},
},
logs: { logs: {
overflowY: "scroll", overflowY: "scroll",
overflowX: "hidden", overflowX: "hidden",
@@ -107,6 +117,7 @@ function LogWindow(props: IProps): React.ReactElement {
const classes = useStyles(); const classes = useStyles();
const container = useRef<HTMLDivElement>(null); const container = useRef<HTMLDivElement>(null);
const setRerender = useState(false)[1]; const setRerender = useState(false)[1];
const [minimized, setMinimized] = useState(false);
function rerender(): void { function rerender(): void {
setRerender((old) => !old); setRerender((old) => !old);
} }
@@ -149,6 +160,10 @@ function LogWindow(props: IProps): React.ReactElement {
return t.slice(0, maxLength - 3) + "..."; return t.slice(0, maxLength - 3) + "...";
} }
function minimize(): void {
setMinimized(!minimized);
}
function lineClass(s: string): string { function lineClass(s: string): string {
if (s.match(/(^\[[^\]]+\] )?ERROR/) || s.match(/(^\[[^\]]+\] )?FAIL/)) { if (s.match(/(^\[[^\]]+\] )?ERROR/) || s.match(/(^\[[^\]]+\] )?FAIL/)) {
return classes.error; return classes.error;
@@ -180,6 +195,7 @@ function LogWindow(props: IProps): React.ReactElement {
> >
<div onMouseDown={updateLayer}> <div onMouseDown={updateLayer}>
<Paper <Paper
className={classes.title + " " + (minimized ? 'is-minimized' : '')}
style={{ style={{
cursor: "grab", cursor: "grab",
}} }}
@@ -192,6 +208,7 @@ function LogWindow(props: IProps): React.ReactElement {
<Box position="absolute" right={0}> <Box position="absolute" right={0}>
{!workerScripts.has(script.pid) && <Button onClick={run}>Run</Button>} {!workerScripts.has(script.pid) && <Button onClick={run}>Run</Button>}
{workerScripts.has(script.pid) && <Button onClick={kill}>Kill</Button>} {workerScripts.has(script.pid) && <Button onClick={kill}>Kill</Button>}
<Button onClick={minimize}>{minimized ? "\u{1F5D6}" : "\u{1F5D5}"}</Button>
<Button onClick={props.onClose}>Close</Button> <Button onClick={props.onClose}>Close</Button>
</Box> </Box>
</Box> </Box>