feat(wasm-output): options for outputType, attachCover

This commit is contained in:
lainio24 2025-10-04 11:09:16 +08:00
parent 794d38a4bc
commit cf3d9fd956
No known key found for this signature in database
GPG Key ID: B333508B1D79D277
3 changed files with 50 additions and 14 deletions

View File

@ -1,39 +1,68 @@
<template>
<div v-if="shouldShow" class="download-video-config-item" style="flex-wrap: wrap">
<div class="download-video-config-title">写入元数据</div>
<SwitchBox v-model="muxWithMetadata" @change="saveOptions" />
<div class="download-video-config-description" style="width: 100%">
仅支持元数据类型ffmetadata
<div class="wasm-output-config">
<div class="download-video-config-item" style="flex-wrap: wrap">
<div class="download-video-config-title">输出格式</div>
<VDropdown v-model="outputType" :items="outputTypes" @change="saveOptions">
<template #item="{ item }">
{{ item }}
</template>
</VDropdown>
<div class="download-video-config-description" style="width: 100%">
非特殊需求请保持自动<br />
指定 MP4 格式若包含无损音频会将 FLAC 格式的音轨重新编码为 ALAC 格式
</div>
</div>
<div v-if="hasMetadata" class="download-video-config-item" style="flex-wrap: wrap">
<div class="download-video-config-title">写入元数据</div>
<SwitchBox v-model="muxWithMetadata" @change="saveOptions" />
<div class="download-video-config-description" style="width: 100%">
支持元数据类型ffmetadata
</div>
</div>
<div v-if="hasCover" class="download-video-config-item" style="flex-wrap: wrap">
<div class="download-video-config-title">附加封面</div>
<SwitchBox v-model="attachCover" @change="saveOptions" />
<div v-if="hasMetadata" class="download-video-config-description" style="width: 100%">
附加封面至 MP4 格式会导致元数据自定义字段失效
</div>
</div>
</div>
</template>
<script lang="ts">
import { SwitchBox } from '@/ui'
import { SwitchBox, VDropdown } from '@/ui'
import { Options } from './types'
import { isComponentEnabled, getComponentSettings } from '@/core/settings'
interface Options {
muxWithMetadata: boolean
}
const defaultOptions: Options = {
muxWithMetadata: false,
attachCover: false,
outputType: 'auto',
}
const { options: storedOptions } = getComponentSettings('downloadVideo')
const options: Options = { ...defaultOptions, ...storedOptions }
export default Vue.extend({
components: {
SwitchBox,
VDropdown,
},
data() {
const shouldShow = isComponentEnabled('saveVideoMetadata')
const hasMetadata = isComponentEnabled('saveVideoMetadata')
const hasCover = isComponentEnabled('viewCover')
return {
shouldShow,
muxWithMetadata: shouldShow && options.muxWithMetadata,
hasMetadata,
hasCover,
muxWithMetadata: hasMetadata && options.muxWithMetadata,
attachCover: hasCover && options.attachCover,
outputType: options.outputType,
outputTypes: ['auto', 'mp4', 'matroska'],
}
},
methods: {
saveOptions() {
options.muxWithMetadata = this.muxWithMetadata
options.attachCover = this.attachCover
options.outputType = this.outputType
Object.assign(storedOptions, options)
},
},

View File

@ -2,6 +2,7 @@ import { Toast } from '@/core/toast'
import { PluginMetadata } from '@/plugins/plugin'
import { DownloadVideoOutput } from '../../../../components/video/download/types'
import { run } from './handler'
import { Options } from './types'
export const title = 'WASM 混流输出'
const desc = '使用 WASM 在浏览器中下载并合并音视频, 支持批量下载'
@ -20,9 +21,9 @@ export const plugin: PluginMetadata = {
name: 'wasm',
displayName: 'WASM',
description: `${desc}。运行过程中请勿关闭页面,初次使用或清除缓存后需要加载约 30 MB 的 WASM 文件。由于浏览器限制,仅支持合并 2GB 以内的音视频。`,
runAction: async (action, instance) => {
runAction: async (action, instance: Options) => {
try {
await run(action, 'auto', instance.muxWithMetadata, true) // TODO add options: outputType, attachCover
await run(action, instance.outputType, instance.muxWithMetadata, instance.attachCover)
} catch (error) {
Toast.error(String(error), title)
}

View File

@ -11,3 +11,9 @@ export interface Format {
export type OutputFormats = {
[x in Exclude<OutputType, Auto>]: Format
}
export interface Options {
muxWithMetadata: boolean
attachCover: boolean
outputType: OutputType
}