diff --git a/frontend/src/components/window/Workspace.svelte b/frontend/src/components/window/Workspace.svelte index 472574ad81..b09ded67ed 100644 --- a/frontend/src/components/window/Workspace.svelte +++ b/frontend/src/components/window/Workspace.svelte @@ -17,7 +17,7 @@ /* └─ */ layers: 55, } as const; - let panelSizes: Record = PANEL_SIZES; + let panelSizes: Record = { ...PANEL_SIZES }; let documentPanel: Panel | undefined; let gutterResizeRestore: [number, number] | undefined = undefined; let pointerCaptureId: number | undefined = undefined; @@ -41,6 +41,25 @@ const editor = getContext("editor"); const portfolio = getContext("portfolio"); + function isPanelName(name: string): name is keyof typeof PANEL_SIZES { + return name in PANEL_SIZES; + } + + function resetPanelSizes(e: MouseEvent) { + const gutter = e.currentTarget; + if (!(gutter instanceof HTMLDivElement)) return; + + const nextSibling = gutter.nextElementSibling; + const prevSibling = gutter.previousElementSibling; + if (!(nextSibling instanceof HTMLDivElement) || !(prevSibling instanceof HTMLDivElement)) return; + + const nextSiblingName = nextSibling.getAttribute("data-subdivision-name") || undefined; + const prevSiblingName = prevSibling.getAttribute("data-subdivision-name") || undefined; + if (!nextSiblingName || !prevSiblingName || !isPanelName(nextSiblingName) || !isPanelName(prevSiblingName)) return; + + panelSizes = { ...panelSizes, [nextSiblingName]: PANEL_SIZES[nextSiblingName], [prevSiblingName]: PANEL_SIZES[prevSiblingName] }; + } + function resizePanel(e: PointerEvent) { const gutter = e.target; if (!(gutter instanceof HTMLDivElement)) return; @@ -157,14 +176,14 @@ /> {#if $portfolio.dataPanelOpen} - resizePanel(e)} /> + resizePanel(e)} on:dblclick={(e) => resetPanelSizes(e)} /> {/if} {#if $portfolio.propertiesPanelOpen || $portfolio.layersPanelOpen} - resizePanel(e)} /> + resizePanel(e)} on:dblclick={(e) => resetPanelSizes(e)} /> {#if $portfolio.propertiesPanelOpen} @@ -172,7 +191,7 @@ {/if} {#if $portfolio.propertiesPanelOpen && $portfolio.layersPanelOpen} - resizePanel(e)} /> + resizePanel(e)} on:dblclick={(e) => resetPanelSizes(e)} /> {/if} {#if $portfolio.layersPanelOpen}