Add search view

This commit is contained in:
2023-05-25 17:06:17 +02:00
parent fff705bc2a
commit 9e5f2ae6d4
5 changed files with 289 additions and 66 deletions

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,7 +13,6 @@ import Torrent from "./Torrent.svelte";
import Zip from "./Zip.svelte";
export let fs_navigator
export let toolbar_visible
export let edit_window
export let state
@@ -32,60 +31,42 @@ export const state_update = async () => {
viewer.update()
}
}
onMount(() => {
state_update()
})
</script>
<div class="file_preview checkers" class:toolbar_visible>
{#if viewer_type === ""}
<div class="center">
<Spinner></Spinner>
</div>
{:else if viewer_type === "dir"}
<FileManager
fs_navigator={fs_navigator}
state={state}
edit_window={edit_window}
on:loading
/>
{:else if viewer_type === "audio"}
<Audio state={state} on:open_sibling/>
{:else if viewer_type === "image"}
<Image state={state} on:open_sibling/>
{:else if viewer_type === "video"}
<Video state={state} bind:this={viewer} on:open_sibling/>
{:else if viewer_type === "pdf"}
<Pdf state={state}/>
{:else if viewer_type === "text"}
<Text state={state}/>
{:else if viewer_type === "torrent"}
<Torrent state={state} bind:this={viewer} on:loading on:download/>
{:else if viewer_type === "zip"}
<Zip state={state} bind:this={viewer} on:loading on:download />
{:else}
<File state={state} on:download/>
{/if}
</div>
{#if viewer_type === ""}
<div class="center">
<Spinner></Spinner>
</div>
{:else if viewer_type === "dir"}
<FileManager
fs_navigator={fs_navigator}
state={state}
edit_window={edit_window}
on:loading
/>
{:else if viewer_type === "audio"}
<Audio state={state} on:open_sibling/>
{:else if viewer_type === "image"}
<Image state={state} on:open_sibling/>
{:else if viewer_type === "video"}
<Video state={state} bind:this={viewer} on:open_sibling/>
{:else if viewer_type === "pdf"}
<Pdf state={state}/>
{:else if viewer_type === "text"}
<Text state={state}/>
{:else if viewer_type === "torrent"}
<Torrent state={state} bind:this={viewer} on:loading on:download/>
{:else if viewer_type === "zip"}
<Zip state={state} bind:this={viewer} on:loading on:download />
{:else}
<File state={state} on:download/>
{/if}
<style>
.file_preview {
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
display: block;
min-height: 100px;
min-width: 100px;
transition: left 0.25s;
overflow: auto;
text-align: center;
border-radius: 8px;
border: 2px solid var(--separator);
}
.file_preview.toolbar_visible {
left: 8em;
}
.center{
position: relative;
display: block;