pixeldrain/fnx_web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Change filesystem navigator into a class with a svelte store implementation

Browse Source
This commit is contained in:
Wim Brand
2024-08-09 13:02:07 +02:00
parent c481a89051
commit 69744e41a6
28 changed files with 534 additions and 530 deletions
Download Patch File Download Diff File Expand all files Collapse all files

54
svelte/src/filesystem/viewers/FilePreview.svelte
View File

@@ -1,5 +1,5 @@
<script>
import { tick } from "svelte";
import { onMount, tick } from "svelte";
import Spinner from "../../util/Spinner.svelte";
import { fs_node_type } from "../FilesystemUtil";
import FileManager from "../filemanager/FileManager.svelte";
@@ -13,25 +13,25 @@ import Torrent from "./Torrent.svelte";
import Zip from "./Zip.svelte";
import CustomBanner from "./CustomBanner.svelte";
export let fs_navigator
export let nav
export let edit_window
export let state
let viewer
let viewer_type = ""
let last_path = ""
$: state_update(state.base)
const state_update = async (base) => {
if (base.path === last_path) {
onMount(() => nav.subscribe(state_update))
const state_update = async () => {
if (!nav.initialized || nav.base.path === last_path) {
return
}
last_path = base.path
last_path = nav.base.path
// Update the viewer area with the right viewer type
viewer_type = fs_node_type(base)
viewer_type = fs_node_type(nav.base)
console.debug("Previewing file", base, "viewer type", viewer_type)
console.debug("Previewing file", nav.base, "viewer type", viewer_type)
// Render the viewer component and set the file type
await tick()
@@ -52,40 +52,34 @@ export const toggle_playback = () => {
<Spinner></Spinner>
</div>
{:else if viewer_type === "dir"}
<FileManager
fs_navigator={fs_navigator}
state={state}
edit_window={edit_window}
on:loading
on:upload_picker
>
<CustomBanner path={state.path}/>
<FileManager nav={nav} edit_window={edit_window} on:loading on:upload_picker>
<CustomBanner path={$nav.path}/>
</FileManager>
{:else if viewer_type === "audio"}
<Audio state={state} bind:this={viewer} fs_navigator={fs_navigator}>
<CustomBanner path={state.path}/>
<Audio nav={nav} bind:this={viewer}>
<CustomBanner path={$nav.path}/>
</Audio>
{:else if viewer_type === "image"}
<Image state={state} bind:this={viewer} on:open_sibling/>
<Image nav={nav} bind:this={viewer}/>
{:else if viewer_type === "video"}
<Video state={state} bind:this={viewer} on:open_sibling/>
<Video nav={nav} bind:this={viewer} on:open_sibling/>
{:else if viewer_type === "pdf"}
<Pdf state={state}/>
<Pdf nav={nav}/>
{:else if viewer_type === "text"}
<Text state={state} bind:this={viewer}>
<CustomBanner path={state.path}/>
<Text nav={nav} bind:this={viewer}>
<CustomBanner path={$nav.path}/>
</Text>
{:else if viewer_type === "torrent"}
<Torrent state={state} bind:this={viewer} on:loading on:download>
<CustomBanner path={state.path}/>
<Torrent nav={nav} bind:this={viewer} on:loading on:download>
<CustomBanner path={$nav.path}/>
</Torrent>
{:else if viewer_type === "zip"}
<Zip state={state} bind:this={viewer} on:loading on:download>
<CustomBanner path={state.path}/>
<Zip nav={nav} bind:this={viewer} on:loading on:download>
<CustomBanner path={$nav.path}/>
</Zip>
{:else}
<File state={state} on:download>
<CustomBanner path={state.path}/>
<File nav={nav} on:download>
<CustomBanner path={$nav.path}/>
</File>
{/if}