diff --git a/svelte/src/filesystem/Filesystem.svelte b/svelte/src/filesystem/Filesystem.svelte index 376c7ac..61f7566 100644 --- a/svelte/src/filesystem/Filesystem.svelte +++ b/svelte/src/filesystem/Filesystem.svelte @@ -73,6 +73,11 @@ const keydown = e => { case "r": nav.shuffle = !nav.shuffle break; + case "f": // F fullscreen + if (toolbar) { + toolbar.toggle_fullscreen() + } + break case "a": case "ArrowLeft": nav.open_sibling(-1) @@ -84,8 +89,8 @@ const keydown = e => { case " ": // Spacebar pauses / unpauses video and audio playback if (file_preview) { if (file_preview.toggle_playback()) { - evt.preventDefault() - evt.stopPropagation() + e.preventDefault() + e.stopPropagation() } } break @@ -143,6 +148,7 @@ const download = () => { bind:this={toolbar} nav={nav} file_viewer={file_viewer} + file_preview={file_preview} bind:details_visible={details_visible} edit_window={edit_window} bind:edit_visible={edit_visible} @@ -157,6 +163,7 @@ const download = () => { edit_window={edit_window} on:open_sibling={e => nav.open_sibling(e.detail)} on:download={download} + on:details={() => details_visible = !details_visible} /> diff --git a/svelte/src/filesystem/Toolbar.svelte b/svelte/src/filesystem/Toolbar.svelte index 2ba1746..8e62112 100644 --- a/svelte/src/filesystem/Toolbar.svelte +++ b/svelte/src/filesystem/Toolbar.svelte @@ -11,6 +11,7 @@ export let details_visible = false export let edit_window export let edit_visible = false export let file_viewer +export let file_preview $: share_url = generate_share_url($nav.path) let link_copied = false @@ -42,8 +43,8 @@ let share = async () => { } let fullscreen = false -const toggle_fullscreen = () => { - if (fullscreen || document.fullscreenElement) { +export const toggle_fullscreen = () => { + if (document.fullscreenElement !== null) { try { document.exitFullscreen() } catch (err) { @@ -51,7 +52,9 @@ const toggle_fullscreen = () => { } fullscreen = false } else { - file_viewer.requestFullscreen() + if (!file_preview.toggle_fullscreen()) { + file_viewer.requestFullscreen() + } fullscreen = true } } diff --git a/svelte/src/filesystem/viewers/File.svelte b/svelte/src/filesystem/viewers/File.svelte index f453d14..ca70661 100644 --- a/svelte/src/filesystem/viewers/File.svelte +++ b/svelte/src/filesystem/viewers/File.svelte @@ -3,6 +3,8 @@ import { createEventDispatcher } from "svelte"; import IconBlock from "../../layout/IconBlock.svelte"; import { fs_thumbnail_url } from "../FilesystemAPI.mjs"; import TextBlock from "../../layout/TextBlock.svelte" +import { formatDataVolume, formatDate } from "../../util/Formatting.svelte"; + let dispatch = createEventDispatcher() export let nav @@ -14,12 +16,17 @@ export let nav Type: {$nav.base.file_type}
- No preview is available for this file type. Download to view it locally. -
+ Size: {formatDataVolume($nav.base.file_size, 3)}
+ Upload date: {formatDate($nav.base.created, true, true, false)} +
+
{#if $nav.base.name === ".search_index.gz"} diff --git a/svelte/src/filesystem/viewers/FilePreview.svelte b/svelte/src/filesystem/viewers/FilePreview.svelte index eabf7fd..cbf2027 100644 --- a/svelte/src/filesystem/viewers/FilePreview.svelte +++ b/svelte/src/filesystem/viewers/FilePreview.svelte @@ -57,6 +57,13 @@ export const toggle_mute = () => { } return false } +export const toggle_fullscreen = () => { + if (viewer && viewer.toggle_fullscreen) { + viewer.toggle_fullscreen() + return true + } + return false +} export const seek = delta => { if (viewer && viewer.seek) { viewer.seek(delta) @@ -103,7 +110,7 @@ export const seek = delta => { {:else} - + {/if} diff --git a/svelte/src/filesystem/viewers/Video.svelte b/svelte/src/filesystem/viewers/Video.svelte index 69c4dd5..2990589 100644 --- a/svelte/src/filesystem/viewers/Video.svelte +++ b/svelte/src/filesystem/viewers/Video.svelte @@ -39,6 +39,14 @@ export const update = async () => { export const toggle_playback = () => playing ? player.pause() : player.play() export const toggle_mute = () => player.muted = !player.muted +export const toggle_fullscreen = () => { + if (document.fullscreenElement === null) { + player.requestFullscreen() + } else { + document.exitFullscreen() + } +} + export const seek = delta => { // fastseek can be pretty imprecise, so we don't use it for small seeks @@ -61,14 +69,6 @@ onMount(() => { } }) -const fullscreen = () => { - if (document.fullscreenElement === null) { - player.requestFullscreen() - } else { - document.exitFullscreen() - } -} - const video_keydown = e => { if (e.key === " ") { // Prevent spacebar from pausing playback in Chromium. This conflicts @@ -142,7 +142,7 @@ const video_keydown = e => { volume_up {/if} -