Improve navigation and accessibility
This commit is contained in:
@@ -73,6 +73,8 @@ const toggle_play = () => playing ? player.pause() : player.play()
|
||||
{#if file.id && !audio_reload}
|
||||
<!-- svelte-ignore a11y-media-has-caption -->
|
||||
<audio
|
||||
on:loadstart={() => {dispatch("loading", true)}}
|
||||
on:load={() => {dispatch("loading", false)}}
|
||||
bind:this={player}
|
||||
class="player"
|
||||
controls
|
||||
|
@@ -38,6 +38,7 @@ let dispatch = createEventDispatcher()
|
||||
const download = () => { dispatch("download") }
|
||||
const next = () => { dispatch("next") }
|
||||
const prev = () => { dispatch("prev") }
|
||||
const loading = e => {dispatch("loading", e.detail)}
|
||||
|
||||
</script>
|
||||
|
||||
@@ -51,11 +52,11 @@ const prev = () => { dispatch("prev") }
|
||||
{:else if viewer_type === "rate_limit"}
|
||||
<RateLimit bind:this={viewer} on:download={download}></RateLimit>
|
||||
{:else if viewer_type === "image"}
|
||||
<Image bind:this={viewer}></Image>
|
||||
<Image bind:this={viewer} on:loading={loading}></Image>
|
||||
{:else if viewer_type === "video"}
|
||||
<Video bind:this={viewer} on:download={download} on:prev={prev} on:next={next}></Video>
|
||||
<Video bind:this={viewer} on:loading={loading} on:download={download} on:prev={prev} on:next={next}></Video>
|
||||
{:else if viewer_type === "audio"}
|
||||
<Audio bind:this={viewer} on:prev={prev} on:next={next}></Audio>
|
||||
<Audio bind:this={viewer} on:loading={loading} on:prev={prev} on:next={next}></Audio>
|
||||
{:else if viewer_type === "pdf"}
|
||||
<PDF bind:this={viewer}></PDF>
|
||||
{:else if viewer_type === "text"}
|
||||
|
@@ -1,4 +1,7 @@
|
||||
<script>
|
||||
import { createEventDispatcher } from "svelte"
|
||||
let dispatch = createEventDispatcher()
|
||||
|
||||
export const set_file = f => file = f
|
||||
let file = {
|
||||
id: "",
|
||||
@@ -51,6 +54,8 @@ const mouseup = (e) => {
|
||||
|
||||
<div bind:this={container} class="container" class:zoom>
|
||||
<img
|
||||
on:loadstart={() => {dispatch("loading", true)}}
|
||||
on:load={() => {dispatch("loading", false)}}
|
||||
on:dblclick={() => {zoom = !zoom}}
|
||||
on:doubletap={() => {zoom = !zoom}}
|
||||
on:mousedown={mousedown}
|
||||
|
@@ -62,6 +62,8 @@ let download = () => { dispatch("download", {}) }
|
||||
{#if !video_reload}
|
||||
<!-- svelte-ignore a11y-media-has-caption -->
|
||||
<video
|
||||
on:loadstart={() => {dispatch("loading", true)}}
|
||||
on:load={() => {dispatch("loading", false)}}
|
||||
bind:this={player}
|
||||
controls
|
||||
playsinline
|
||||
|
Reference in New Issue
Block a user