Compare commits
2
Commits
525ce024bc
...
ee63f8b783
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
ee63f8b783 | ||
|
|
6b6edc9a0d |
@@ -16,6 +16,7 @@ class BackfillRequest(BaseModel):
|
|||||||
account_id: int
|
account_id: int
|
||||||
chat_id: int
|
chat_id: int
|
||||||
media: bool = False
|
media: bool = False
|
||||||
|
full: bool = False
|
||||||
|
|
||||||
|
|
||||||
class FetchMediaRequest(BaseModel):
|
class FetchMediaRequest(BaseModel):
|
||||||
@@ -70,7 +71,7 @@ async def enqueue_backfill(
|
|||||||
pool,
|
pool,
|
||||||
body.account_id,
|
body.account_id,
|
||||||
"backfill",
|
"backfill",
|
||||||
{"chat_id": body.chat_id, "media": body.media},
|
{"chat_id": body.chat_id, "media": body.media, "full": body.full},
|
||||||
)
|
)
|
||||||
return EnqueueResponse(job_id=job_id)
|
return EnqueueResponse(job_id=job_id)
|
||||||
|
|
||||||
|
|||||||
@@ -103,7 +103,10 @@ async def track_chat(
|
|||||||
await enqueue(pool, body.account_id, "enrich_chat", {"chat_id": chat_id})
|
await enqueue(pool, body.account_id, "enrich_chat", {"chat_id": chat_id})
|
||||||
if body.backfill:
|
if body.backfill:
|
||||||
await enqueue(
|
await enqueue(
|
||||||
pool, body.account_id, "backfill", {"chat_id": chat_id, "media": True}
|
pool,
|
||||||
|
body.account_id,
|
||||||
|
"backfill",
|
||||||
|
{"chat_id": chat_id, "media": True, "full": True},
|
||||||
)
|
)
|
||||||
return await discover.get_item(pool, body.account_id, chat_id)
|
return await discover.get_item(pool, body.account_id, chat_id)
|
||||||
|
|
||||||
|
|||||||
@@ -118,6 +118,16 @@ async def upsert_message( # noqa: PLR0913
|
|||||||
)
|
)
|
||||||
|
|
||||||
|
|
||||||
|
async def max_message_id(
|
||||||
|
pool: asyncpg.Pool, account_id: int, chat_id: int
|
||||||
|
) -> int | None:
|
||||||
|
return await pool.fetchval(
|
||||||
|
"SELECT max(message_id) FROM messages WHERE account_id = $1 AND chat_id = $2",
|
||||||
|
account_id,
|
||||||
|
chat_id,
|
||||||
|
)
|
||||||
|
|
||||||
|
|
||||||
async def mark_deleted_box(
|
async def mark_deleted_box(
|
||||||
pool: asyncpg.Pool, account_id: int, message_ids: list[int]
|
pool: asyncpg.Pool, account_id: int, message_ids: list[int]
|
||||||
) -> None:
|
) -> None:
|
||||||
|
|||||||
@@ -1,7 +1,11 @@
|
|||||||
|
from pyrogram import Client
|
||||||
from pyrogram.errors import PeerIdInvalid
|
from pyrogram.errors import PeerIdInvalid
|
||||||
|
from pyrogram.types import Message
|
||||||
|
|
||||||
from userbot.modules.capture import capture_message
|
from userbot.modules.capture import capture_message
|
||||||
|
from userbot.modules.capture import repository as capture_repo
|
||||||
from userbot.modules.capture.chat_meta import meta_from_chat
|
from userbot.modules.capture.chat_meta import meta_from_chat
|
||||||
|
from userbot.modules.capture.context import CaptureContext
|
||||||
from userbot.modules.jobs.context import JobContext
|
from userbot.modules.jobs.context import JobContext
|
||||||
from userbot.modules.jobs.registry import register
|
from userbot.modules.jobs.registry import register
|
||||||
from userbot.modules.stt import repository as stt_repo
|
from userbot.modules.stt import repository as stt_repo
|
||||||
@@ -12,6 +16,33 @@ from utils.policy.models import CaptureToggles
|
|||||||
SAVE_EVERY = 100
|
SAVE_EVERY = 100
|
||||||
|
|
||||||
|
|
||||||
|
async def resolve_min_id(ctx: JobContext, chat_id: int) -> int:
|
||||||
|
cursor = ctx.job.cursor or {}
|
||||||
|
if "min_id" in cursor:
|
||||||
|
return int(cursor["min_id"])
|
||||||
|
if ctx.job.params.get("full"):
|
||||||
|
return 0
|
||||||
|
newest = await capture_repo.max_message_id(ctx.pool, ctx.account_id, chat_id)
|
||||||
|
return newest + 1 if newest else 0
|
||||||
|
|
||||||
|
|
||||||
|
async def maybe_transcribe(
|
||||||
|
client: Client,
|
||||||
|
capture: CaptureContext,
|
||||||
|
chat_id: int,
|
||||||
|
message: Message,
|
||||||
|
self_id: int | None,
|
||||||
|
) -> None:
|
||||||
|
if not (should_transcribe_on_backfill(message, self_id) and message.chat):
|
||||||
|
return
|
||||||
|
meta = meta_from_chat(message.chat, capture.contacts.ids)
|
||||||
|
already = await stt_repo.is_transcribed(
|
||||||
|
capture.pool, capture.account_id, chat_id, message.id
|
||||||
|
)
|
||||||
|
if capture.resolve(meta).stt and not already:
|
||||||
|
await safe_transcribe(client, capture, chat_id, message.id)
|
||||||
|
|
||||||
|
|
||||||
@register("backfill")
|
@register("backfill")
|
||||||
async def backfill(ctx: JobContext) -> None:
|
async def backfill(ctx: JobContext) -> None:
|
||||||
client = ctx.client
|
client = ctx.client
|
||||||
@@ -26,24 +57,21 @@ async def backfill(ctx: JobContext) -> None:
|
|||||||
media=bool(ctx.job.params.get("media")),
|
media=bool(ctx.job.params.get("media")),
|
||||||
self_destruct_media=False,
|
self_destruct_media=False,
|
||||||
)
|
)
|
||||||
max_id = (ctx.job.cursor or {}).get("max_id", 0)
|
max_id = int((ctx.job.cursor or {}).get("max_id", 0))
|
||||||
|
min_id = await resolve_min_id(ctx, chat_id)
|
||||||
|
await ctx.save_cursor({"max_id": max_id, "min_id": min_id})
|
||||||
processed = ctx.job.progress.get("processed", 0)
|
processed = ctx.job.progress.get("processed", 0)
|
||||||
kwargs = {"max_id": max_id} if max_id else {}
|
|
||||||
self_id = client.me.id if client.me else None
|
self_id = client.me.id if client.me else None
|
||||||
try:
|
try:
|
||||||
async for message in client.get_chat_history(chat_id, **kwargs):
|
async for message in client.get_chat_history(
|
||||||
|
chat_id, max_id=max_id, min_id=min_id
|
||||||
|
):
|
||||||
await capture_message(client, message, capture, toggles)
|
await capture_message(client, message, capture, toggles)
|
||||||
if should_transcribe_on_backfill(message, self_id) and message.chat:
|
await maybe_transcribe(client, capture, chat_id, message, self_id)
|
||||||
meta = meta_from_chat(message.chat, capture.contacts.ids)
|
|
||||||
already = await stt_repo.is_transcribed(
|
|
||||||
capture.pool, capture.account_id, chat_id, message.id
|
|
||||||
)
|
|
||||||
if capture.resolve(meta).stt and not already:
|
|
||||||
await safe_transcribe(client, capture, chat_id, message.id)
|
|
||||||
processed += 1
|
processed += 1
|
||||||
if processed % SAVE_EVERY == 0:
|
if processed % SAVE_EVERY == 0:
|
||||||
next_max = message.id - 1
|
next_max = message.id - 1
|
||||||
await ctx.save_cursor({"max_id": next_max})
|
await ctx.save_cursor({"max_id": next_max, "min_id": min_id})
|
||||||
await ctx.report_progress({"processed": processed, "max_id": next_max})
|
await ctx.report_progress({"processed": processed, "max_id": next_max})
|
||||||
if await ctx.is_canceled():
|
if await ctx.is_canceled():
|
||||||
return
|
return
|
||||||
|
|||||||
@@ -358,11 +358,12 @@ export function listJobs(status?: JobStatus): Promise<JobView[]> {
|
|||||||
|
|
||||||
export function enqueueBackfill(
|
export function enqueueBackfill(
|
||||||
chatId: number,
|
chatId: number,
|
||||||
media: boolean
|
media: boolean,
|
||||||
|
full = false
|
||||||
): Promise<{ job_id: number }> {
|
): Promise<{ job_id: number }> {
|
||||||
return request<{ job_id: number }>("/backfill", {
|
return request<{ job_id: number }>("/backfill", {
|
||||||
method: "POST",
|
method: "POST",
|
||||||
body: { account_id: accounts.selectedId, chat_id: chatId, media },
|
body: { account_id: accounts.selectedId, chat_id: chatId, media, full },
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -41,7 +41,7 @@
|
|||||||
backfilling = true;
|
backfilling = true;
|
||||||
try {
|
try {
|
||||||
await enqueueBackfill(chatId, true);
|
await enqueueBackfill(chatId, true);
|
||||||
toasts.success("Бэкфилл запущен");
|
toasts.success("Догружаем новые сообщения");
|
||||||
} catch {
|
} catch {
|
||||||
toasts.error("Не удалось запустить бэкфилл");
|
toasts.error("Не удалось запустить бэкфилл");
|
||||||
} finally {
|
} finally {
|
||||||
@@ -211,7 +211,7 @@
|
|||||||
smaller
|
smaller
|
||||||
loading={backfilling}
|
loading={backfilling}
|
||||||
onclick={backfill}
|
onclick={backfill}
|
||||||
aria-label="Скачать историю"
|
aria-label="Догрузить новые сообщения"
|
||||||
>
|
>
|
||||||
<Icon name="cloud-download" />
|
<Icon name="cloud-download" />
|
||||||
</Button>
|
</Button>
|
||||||
|
|||||||
@@ -4,6 +4,7 @@
|
|||||||
import type { MediaVersion } from "$lib/api/types";
|
import type { MediaVersion } from "$lib/api/types";
|
||||||
import Icon from "$lib/components/ui/Icon.svelte";
|
import Icon from "$lib/components/ui/Icon.svelte";
|
||||||
import Spinner from "$lib/components/ui/Spinner.svelte";
|
import Spinner from "$lib/components/ui/Spinner.svelte";
|
||||||
|
import { poster } from "$lib/media/poster";
|
||||||
|
|
||||||
interface Props {
|
interface Props {
|
||||||
version: MediaVersion;
|
version: MediaVersion;
|
||||||
@@ -37,7 +38,13 @@
|
|||||||
</a>
|
</a>
|
||||||
{:else if result.state === "ready" && vk === "video"}
|
{:else if result.state === "ready" && vk === "video"}
|
||||||
<a href={result.url} target="_blank" rel="noopener">
|
<a href={result.url} target="_blank" rel="noopener">
|
||||||
<video src={result.url} muted preload="metadata"></video>
|
<video
|
||||||
|
src={result.url}
|
||||||
|
muted
|
||||||
|
playsinline
|
||||||
|
preload="metadata"
|
||||||
|
use:poster
|
||||||
|
></video>
|
||||||
<span class="play"><Icon name="large-play" size="1.5rem" /></span>
|
<span class="play"><Icon name="large-play" size="1.5rem" /></span>
|
||||||
</a>
|
</a>
|
||||||
{:else if result.state === "ready"}
|
{:else if result.state === "ready"}
|
||||||
|
|||||||
@@ -7,6 +7,7 @@
|
|||||||
import Button from "$lib/components/ui/Button.svelte";
|
import Button from "$lib/components/ui/Button.svelte";
|
||||||
import Icon from "$lib/components/ui/Icon.svelte";
|
import Icon from "$lib/components/ui/Icon.svelte";
|
||||||
import Spinner from "$lib/components/ui/Spinner.svelte";
|
import Spinner from "$lib/components/ui/Spinner.svelte";
|
||||||
|
import { poster } from "$lib/media/poster";
|
||||||
import { toasts } from "$lib/stores/toasts.svelte";
|
import { toasts } from "$lib/stores/toasts.svelte";
|
||||||
|
|
||||||
interface Props {
|
interface Props {
|
||||||
@@ -149,7 +150,14 @@
|
|||||||
{:else if result?.state === "ready" && isVideo}
|
{:else if result?.state === "ready" && isVideo}
|
||||||
<!-- svelte-ignore a11y_media_has_caption -->
|
<!-- svelte-ignore a11y_media_has_caption -->
|
||||||
<!-- biome-ignore lint/a11y/useMediaCaption: archived media has no captions -->
|
<!-- biome-ignore lint/a11y/useMediaCaption: archived media has no captions -->
|
||||||
<video class="media-video" src={result.url} controls></video>
|
<video
|
||||||
|
class="media-video"
|
||||||
|
src={result.url}
|
||||||
|
controls
|
||||||
|
playsinline
|
||||||
|
preload="metadata"
|
||||||
|
use:poster
|
||||||
|
></video>
|
||||||
{:else if result?.state === "ready" && isAudio}
|
{:else if result?.state === "ready" && isAudio}
|
||||||
<!-- biome-ignore lint/a11y/useMediaCaption: archived media has no captions -->
|
<!-- biome-ignore lint/a11y/useMediaCaption: archived media has no captions -->
|
||||||
<audio src={result.url} controls></audio>
|
<audio src={result.url} controls></audio>
|
||||||
|
|||||||
@@ -15,6 +15,7 @@
|
|||||||
import ContextMenuItem from "$lib/components/ui/ContextMenuItem.svelte";
|
import ContextMenuItem from "$lib/components/ui/ContextMenuItem.svelte";
|
||||||
import Icon from "$lib/components/ui/Icon.svelte";
|
import Icon from "$lib/components/ui/Icon.svelte";
|
||||||
import Spinner from "$lib/components/ui/Spinner.svelte";
|
import Spinner from "$lib/components/ui/Spinner.svelte";
|
||||||
|
import { poster } from "$lib/media/poster";
|
||||||
import { toasts } from "$lib/stores/toasts.svelte";
|
import { toasts } from "$lib/stores/toasts.svelte";
|
||||||
import { ui } from "$lib/stores/ui.svelte";
|
import { ui } from "$lib/stores/ui.svelte";
|
||||||
|
|
||||||
@@ -143,7 +144,13 @@
|
|||||||
</button>
|
</button>
|
||||||
{:else if ready && isThumbVideo}
|
{:else if ready && isThumbVideo}
|
||||||
<button class="media-thumb" onclick={onopen} type="button">
|
<button class="media-thumb" onclick={onopen} type="button">
|
||||||
<video src={ready.url} muted preload="metadata"></video>
|
<video
|
||||||
|
src={ready.url}
|
||||||
|
muted
|
||||||
|
playsinline
|
||||||
|
preload="metadata"
|
||||||
|
use:poster
|
||||||
|
></video>
|
||||||
<span class="play"><Icon name="large-play" size="2.5rem" /></span>
|
<span class="play"><Icon name="large-play" size="2.5rem" /></span>
|
||||||
</button>
|
</button>
|
||||||
{:else if ready}
|
{:else if ready}
|
||||||
|
|||||||
@@ -48,8 +48,8 @@
|
|||||||
}
|
}
|
||||||
busy = true;
|
busy = true;
|
||||||
try {
|
try {
|
||||||
await enqueueBackfill(chatId, true);
|
await enqueueBackfill(chatId, true, true);
|
||||||
toasts.success("Бэкфилл запущен");
|
toasts.success("Полный бэкфилл запущен");
|
||||||
} catch {
|
} catch {
|
||||||
toasts.error("Не удалось запустить бэкфилл");
|
toasts.error("Не удалось запустить бэкфилл");
|
||||||
} finally {
|
} finally {
|
||||||
|
|||||||
@@ -79,8 +79,12 @@
|
|||||||
schedule();
|
schedule();
|
||||||
}
|
}
|
||||||
|
|
||||||
function kindLabel(kind: string): string {
|
function kindLabel(job: JobView): string {
|
||||||
return KIND_LABELS[kind] ?? kind;
|
const label = KIND_LABELS[job.kind] ?? job.kind;
|
||||||
|
if (job.kind !== "backfill") {
|
||||||
|
return label;
|
||||||
|
}
|
||||||
|
return job.params.full ? `${label} (полный)` : `${label} (новые)`;
|
||||||
}
|
}
|
||||||
|
|
||||||
function processed(job: JobView): number | null {
|
function processed(job: JobView): number | null {
|
||||||
@@ -117,7 +121,7 @@
|
|||||||
{#each jobs as job (job.id)}
|
{#each jobs as job (job.id)}
|
||||||
<div class="job">
|
<div class="job">
|
||||||
<div class="job-head">
|
<div class="job-head">
|
||||||
<span class="kind">{kindLabel(job.kind)}</span>
|
<span class="kind">{kindLabel(job)}</span>
|
||||||
{#if canCancel(job)}
|
{#if canCancel(job)}
|
||||||
<button
|
<button
|
||||||
type="button"
|
type="button"
|
||||||
|
|||||||
@@ -56,8 +56,8 @@
|
|||||||
}
|
}
|
||||||
starting = true;
|
starting = true;
|
||||||
try {
|
try {
|
||||||
await enqueueBackfill(selected, media);
|
await enqueueBackfill(selected, media, true);
|
||||||
toasts.success("Бэкфилл запущен");
|
toasts.success("Полный бэкфилл запущен");
|
||||||
version += 1;
|
version += 1;
|
||||||
} catch {
|
} catch {
|
||||||
toasts.error("Не удалось запустить бэкфилл");
|
toasts.error("Не удалось запустить бэкфилл");
|
||||||
@@ -135,6 +135,10 @@
|
|||||||
|
|
||||||
<section>
|
<section>
|
||||||
<div class="section-title">Бэкфилл</div>
|
<div class="section-title">Бэкфилл</div>
|
||||||
|
<p class="hint">
|
||||||
|
Полный бэкфилл перечитывает всю историю чата с самого начала. Кнопка в
|
||||||
|
шапке чата догружает только сообщения новее последнего сохранённого.
|
||||||
|
</p>
|
||||||
|
|
||||||
<button
|
<button
|
||||||
type="button"
|
type="button"
|
||||||
@@ -192,7 +196,7 @@
|
|||||||
onclick={start}
|
onclick={start}
|
||||||
>
|
>
|
||||||
<Icon name="cloud-download" />
|
<Icon name="cloud-download" />
|
||||||
<span>Запустить бэкфилл</span>
|
<span>Запустить полный бэкфилл</span>
|
||||||
</Button>
|
</Button>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|||||||
@@ -5,6 +5,7 @@
|
|||||||
import type { MediaRef } from "$lib/api/types";
|
import type { MediaRef } from "$lib/api/types";
|
||||||
import Icon from "$lib/components/ui/Icon.svelte";
|
import Icon from "$lib/components/ui/Icon.svelte";
|
||||||
import Spinner from "$lib/components/ui/Spinner.svelte";
|
import Spinner from "$lib/components/ui/Spinner.svelte";
|
||||||
|
import { poster } from "$lib/media/poster";
|
||||||
import { toasts } from "$lib/stores/toasts.svelte";
|
import { toasts } from "$lib/stores/toasts.svelte";
|
||||||
|
|
||||||
interface Props {
|
interface Props {
|
||||||
@@ -46,7 +47,13 @@
|
|||||||
<div class="AlbumTile" use:visible={start}>
|
<div class="AlbumTile" use:visible={start}>
|
||||||
{#if ready && isVideo}
|
{#if ready && isVideo}
|
||||||
<button class="tile" onclick={onopen} type="button">
|
<button class="tile" onclick={onopen} type="button">
|
||||||
<video src={ready.url} muted preload="metadata"></video>
|
<video
|
||||||
|
src={ready.url}
|
||||||
|
muted
|
||||||
|
playsinline
|
||||||
|
preload="metadata"
|
||||||
|
use:poster
|
||||||
|
></video>
|
||||||
<span class="play"><Icon name="large-play" size="2rem" /></span>
|
<span class="play"><Icon name="large-play" size="2rem" /></span>
|
||||||
</button>
|
</button>
|
||||||
{:else if ready}
|
{:else if ready}
|
||||||
|
|||||||
@@ -2,6 +2,7 @@
|
|||||||
import Icon from "$lib/components/ui/Icon.svelte";
|
import Icon from "$lib/components/ui/Icon.svelte";
|
||||||
import { formatDuration } from "$lib/format/duration";
|
import { formatDuration } from "$lib/format/duration";
|
||||||
import { claimPlayback, releasePlayback } from "$lib/media/playback";
|
import { claimPlayback, releasePlayback } from "$lib/media/playback";
|
||||||
|
import { POSTER_TIME, poster } from "$lib/media/poster";
|
||||||
|
|
||||||
interface Props {
|
interface Props {
|
||||||
transcript?: string | null;
|
transcript?: string | null;
|
||||||
@@ -54,6 +55,7 @@
|
|||||||
playsinline
|
playsinline
|
||||||
preload="metadata"
|
preload="metadata"
|
||||||
src={url}
|
src={url}
|
||||||
|
use:poster
|
||||||
></video>
|
></video>
|
||||||
<svg class="ring" viewBox="0 0 200 200" aria-hidden="true">
|
<svg class="ring" viewBox="0 0 200 200" aria-hidden="true">
|
||||||
<circle
|
<circle
|
||||||
@@ -70,7 +72,7 @@
|
|||||||
{/if}
|
{/if}
|
||||||
<span class="badge">
|
<span class="badge">
|
||||||
<Icon name="microphone" size="0.875rem" />
|
<Icon name="microphone" size="0.875rem" />
|
||||||
{formatDuration(paused && currentTime === 0 ? duration : remaining)}
|
{formatDuration(paused && currentTime <= POSTER_TIME ? duration : remaining)}
|
||||||
</span>
|
</span>
|
||||||
</button>
|
</button>
|
||||||
{#if transcript}
|
{#if transcript}
|
||||||
@@ -137,17 +139,26 @@
|
|||||||
height: 13rem;
|
height: 13rem;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
border: 0;
|
border: 0;
|
||||||
|
border-radius: 50%;
|
||||||
|
|
||||||
background: transparent;
|
background: transparent;
|
||||||
|
-webkit-tap-highlight-color: transparent;
|
||||||
|
|
||||||
|
&:focus {
|
||||||
|
outline: none;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
video {
|
video {
|
||||||
|
display: block;
|
||||||
|
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
border-radius: 50%;
|
border-radius: 50%;
|
||||||
|
|
||||||
object-fit: cover;
|
object-fit: cover;
|
||||||
background-color: var(--color-default-shadow);
|
background-color: var(--color-default-shadow);
|
||||||
|
clip-path: circle(50%);
|
||||||
}
|
}
|
||||||
|
|
||||||
.ring {
|
.ring {
|
||||||
|
|||||||
@@ -9,6 +9,7 @@
|
|||||||
import Spinner from "$lib/components/ui/Spinner.svelte";
|
import Spinner from "$lib/components/ui/Spinner.svelte";
|
||||||
import { formatListDate } from "$lib/format/datetime";
|
import { formatListDate } from "$lib/format/datetime";
|
||||||
import { formatBytes, mediaKindLabel } from "$lib/format/media";
|
import { formatBytes, mediaKindLabel } from "$lib/format/media";
|
||||||
|
import { poster } from "$lib/media/poster";
|
||||||
import { accounts } from "$lib/stores/accounts.svelte";
|
import { accounts } from "$lib/stores/accounts.svelte";
|
||||||
import { ui } from "$lib/stores/ui.svelte";
|
import { ui } from "$lib/stores/ui.svelte";
|
||||||
|
|
||||||
@@ -132,7 +133,13 @@
|
|||||||
{#if preview(item)?.state === "ready"}
|
{#if preview(item)?.state === "ready"}
|
||||||
{@const ready = preview(item) as Extract<InlineMedia, { state: "ready" }>}
|
{@const ready = preview(item) as Extract<InlineMedia, { state: "ready" }>}
|
||||||
{#if visualKind(item.kind) === "video"}
|
{#if visualKind(item.kind) === "video"}
|
||||||
<video src={ready.url} muted preload="metadata"></video>
|
<video
|
||||||
|
src={ready.url}
|
||||||
|
muted
|
||||||
|
playsinline
|
||||||
|
preload="metadata"
|
||||||
|
use:poster
|
||||||
|
></video>
|
||||||
<span class="play"><Icon name="play" size="1.5rem" /></span>
|
<span class="play"><Icon name="play" size="1.5rem" /></span>
|
||||||
{:else}
|
{:else}
|
||||||
<img src={ready.url} alt="">
|
<img src={ready.url} alt="">
|
||||||
|
|||||||
@@ -9,6 +9,7 @@
|
|||||||
import Icon from "$lib/components/ui/Icon.svelte";
|
import Icon from "$lib/components/ui/Icon.svelte";
|
||||||
import Spinner from "$lib/components/ui/Spinner.svelte";
|
import Spinner from "$lib/components/ui/Spinner.svelte";
|
||||||
import { peerName } from "$lib/format/peer";
|
import { peerName } from "$lib/format/peer";
|
||||||
|
import { poster } from "$lib/media/poster";
|
||||||
import { accounts } from "$lib/stores/accounts.svelte";
|
import { accounts } from "$lib/stores/accounts.svelte";
|
||||||
|
|
||||||
interface Group {
|
interface Group {
|
||||||
@@ -167,7 +168,9 @@
|
|||||||
<video
|
<video
|
||||||
src={previews[item.story_id]}
|
src={previews[item.story_id]}
|
||||||
muted
|
muted
|
||||||
|
playsinline
|
||||||
preload="metadata"
|
preload="metadata"
|
||||||
|
use:poster
|
||||||
></video>
|
></video>
|
||||||
<span class="play"><Icon name="play" size="1.5rem" /></span>
|
<span class="play"><Icon name="play" size="1.5rem" /></span>
|
||||||
{:else}
|
{:else}
|
||||||
|
|||||||
@@ -8,6 +8,7 @@
|
|||||||
import EmptyState from "$lib/components/ui/EmptyState.svelte";
|
import EmptyState from "$lib/components/ui/EmptyState.svelte";
|
||||||
import Icon from "$lib/components/ui/Icon.svelte";
|
import Icon from "$lib/components/ui/Icon.svelte";
|
||||||
import Spinner from "$lib/components/ui/Spinner.svelte";
|
import Spinner from "$lib/components/ui/Spinner.svelte";
|
||||||
|
import { poster } from "$lib/media/poster";
|
||||||
import { accounts } from "$lib/stores/accounts.svelte";
|
import { accounts } from "$lib/stores/accounts.svelte";
|
||||||
|
|
||||||
const PAGE = 60;
|
const PAGE = 60;
|
||||||
@@ -113,7 +114,9 @@
|
|||||||
<video
|
<video
|
||||||
src={previews[item.story_id]}
|
src={previews[item.story_id]}
|
||||||
muted
|
muted
|
||||||
|
playsinline
|
||||||
preload="metadata"
|
preload="metadata"
|
||||||
|
use:poster
|
||||||
></video>
|
></video>
|
||||||
<span class="play"><Icon name="play" size="1.5rem" /></span>
|
<span class="play"><Icon name="play" size="1.5rem" /></span>
|
||||||
{:else}
|
{:else}
|
||||||
|
|||||||
@@ -0,0 +1,20 @@
|
|||||||
|
export const POSTER_TIME = 0.001;
|
||||||
|
|
||||||
|
export function poster(node: HTMLVideoElement) {
|
||||||
|
const seek = () => {
|
||||||
|
if (node.currentTime === 0) {
|
||||||
|
node.currentTime = POSTER_TIME;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
node.addEventListener("loadedmetadata", seek);
|
||||||
|
if (node.readyState >= node.HAVE_METADATA) {
|
||||||
|
seek();
|
||||||
|
}
|
||||||
|
|
||||||
|
return {
|
||||||
|
destroy() {
|
||||||
|
node.removeEventListener("loadedmetadata", seek);
|
||||||
|
},
|
||||||
|
};
|
||||||
|
}
|
||||||
Reference in New Issue
Block a user