68 lines
2.3 KiB
Svelte
68 lines
2.3 KiB
Svelte
<script lang="ts">
|
|
import {Pane, Splitpanes} from "svelte-splitpanes";
|
|
import XRefTable from "./XRefTable.svelte";
|
|
import PrimitiveView from "./PrimitiveView.svelte";
|
|
import TreeView from "./TreeView.svelte";
|
|
import type FileViewState from "../models/FileViewState.svelte";
|
|
import {onMount} from 'svelte';
|
|
import PageList from "./PageList.svelte";
|
|
|
|
let {treeShowing, xrefTableShowing, pagesShowing, fState, height}: {
|
|
treeShowing: boolean,
|
|
xrefTableShowing: boolean,
|
|
pagesShowing: boolean,
|
|
fState: FileViewState,
|
|
height: number
|
|
} = $props()
|
|
|
|
function handleKeydown(event: KeyboardEvent) {
|
|
// Check for "Alt + Left Arrow"
|
|
if (event.altKey && event.key === 'ArrowLeft') {
|
|
fState.popPath();
|
|
}
|
|
}
|
|
|
|
function handleMouseButton(event: MouseEvent) {
|
|
// Check for mouse back button (button 4)
|
|
if (event.button === 3) {
|
|
fState.popPath();
|
|
}
|
|
}
|
|
|
|
onMount(() => {
|
|
window.addEventListener('keydown', handleKeydown);
|
|
window.addEventListener('mousedown', handleMouseButton);
|
|
|
|
return () => {
|
|
window.removeEventListener('keydown', handleKeydown);
|
|
window.removeEventListener('mousedown', handleMouseButton);
|
|
};
|
|
});
|
|
</script>
|
|
|
|
<Splitpanes theme="forge-movable">
|
|
<Pane size={treeShowing || pagesShowing ? 15 : 0} minSize={treeShowing || pagesShowing ? 1 : 0} maxSize={treeShowing || pagesShowing ? 100 : 0}>
|
|
<Splitpanes theme="forge-movable" horizontal>
|
|
<Pane size={treeShowing ? pagesShowing ? 50 : 100 : 0} minSize={treeShowing ? 2 : 0} maxSize={treeShowing ? 100 : 0}>
|
|
<TreeView {fState}></TreeView>
|
|
</Pane>
|
|
<Pane size={pagesShowing ? treeShowing ? 50 : 100 : 0} minSize={pagesShowing ? 2 : 0} maxSize={pagesShowing ? 100 : 0}>
|
|
<PageList {fState}></PageList>
|
|
</Pane>
|
|
</Splitpanes>
|
|
</Pane>
|
|
|
|
|
|
<Pane minSize={1}>
|
|
<div>
|
|
<PrimitiveView {fState} {height}></PrimitiveView>
|
|
</div>
|
|
</Pane>
|
|
|
|
<Pane size={xrefTableShowing ? 16 : 0} minSize={xrefTableShowing ? 1 : 0} maxSize={xrefTableShowing ? 100 : 0}>
|
|
<XRefTable {fState}></XRefTable>
|
|
</Pane>
|
|
</Splitpanes>
|
|
<style lang="postcss">
|
|
|
|
</style> |