Show clear GPU status and move upscale progress into the queue
This commit is contained in:
@@ -1,8 +1,8 @@
|
||||
<template>
|
||||
<div v-if="clipId" class="space-y-2">
|
||||
<button type="button" class="rounded-2xl border border-amber-300/40 px-4 py-2 text-sm text-amber-100 disabled:opacity-50" :disabled="busy || loading || !state" @click="openDialog">Upscale</button>
|
||||
<NuxtLink v-if="state?.source.upscaledFromClipId" :to="`/?clip=${state.source.upscaledFromClipId}`" class="block text-xs text-amber-200 underline">Upscaled copy · Open original</NuxtLink>
|
||||
<div v-if="state?.job" class="max-w-sm text-xs text-zinc-400" aria-live="polite">
|
||||
<NuxtLink v-if="state?.source.upscaledFromClipId && !queueOnly" :to="`/?clip=${state.source.upscaledFromClipId}`" class="block text-xs text-amber-200 underline">Upscaled copy · Open original</NuxtLink>
|
||||
<div v-if="state?.job && !queueOnly" class="max-w-sm text-xs text-zinc-400" aria-live="polite">
|
||||
<span class="capitalize">Upscale {{ state.job.status }}</span>
|
||||
<span v-if="state.job.width"> · {{ state.job.width }} × {{ state.job.height }}</span>
|
||||
<span v-if="state.job.elapsedMs"> · {{ Math.round(state.job.elapsedMs / 1000) }}s</span>
|
||||
@@ -36,7 +36,7 @@
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { upscaleOptions, upscaleDimensions, upscaleName } from '~/shared/video-upscale.mjs'
|
||||
const props = defineProps<{ clipId: string; generationBusy?: boolean }>()
|
||||
const props = defineProps<{ clipId: string; generationBusy?: boolean; queueOnly?: boolean }>()
|
||||
const emit = defineEmits<{ complete: [] }>()
|
||||
const dialog = ref<HTMLDialogElement>(), dialogOpen = ref(false), state = ref<any>(null), error = ref(''), loading = ref(true), submitting = ref(false)
|
||||
const form = reactive(upscaleOptions())
|
||||
|
||||
Reference in New Issue
Block a user