媒体元素播放结束设为不可见

Vinlic · Nov 13, 2023 · 5529372 · 5529372
1 parent 22410e1
commit 5529372
Show file tree

Hide file tree

Showing 5 changed files with 19 additions and 6 deletions.
diff --git a/core/CaptureContext.js b/core/CaptureContext.js
@@ -569,9 +569,9 @@ export default class CaptureContext {
             // 视频格式
             format: e.getAttribute("format") || undefined,
             // 视频宽度
-            width: parseInt(e.style.width) || e.getNumberAttribute("width") || e.width,
+            width: e.getNumberAttribute("width") || e.width,
             // 视频高度
-            height: parseInt(e.style.height) || e.getNumberAttribute("height") || e.height,
+            height: e.getNumberAttribute("height") || e.height,
             // 视频开始时间点（毫秒）
             startTime: e.getNumberAttribute("start-time") || e.getNumberAttribute("startTime") || this.currentTime,
             // 视频结束时间点（毫秒）
@@ -630,9 +630,9 @@ export default class CaptureContext {
             // 图像格式
             format: e.getAttribute("format") || undefined,
             // 图像宽度
-            width: parseInt(e.style.width) || e.getNumberAttribute("width") || e.width,
+            width: e.getNumberAttribute("width") || e.width,
             // 图像高度
-            height: parseInt(e.style.height) || e.getNumberAttribute("height") || e.height,
+            height: e.getNumberAttribute("height") || e.height,
             // 图像播放开始时间点（毫秒）
             startTime: e.getNumberAttribute("start-time") || e.getNumberAttribute("startTime") || this.currentTime,
             // 图像播放结束时间点（毫秒）

diff --git a/core/Synthesizer.js b/core/Synthesizer.js
@@ -484,18 +484,19 @@ export default class Synthesizer extends EventEmitter {
         const aencoder = ffmpeg();
         // 指定音频码率
         audioBitrate && aencoder.audioBitrate(audioBitrate);
+        const outputDuration = this.getOutputDuration();
         aencoder
             .addInput(_swapFilePath)
             .videoCodec("copy")
-            .setDuration(this.getOutputDuration() / 1000)
+            .setDuration(outputDuration / 1000)
             .audioCodec(audioEncoder)
             .outputOption("-movflags +faststart")
             .toFormat(format)
             .addOutput(outputPath);
         // 生成音频时间轴的复合过滤器参数
         let outputs = "";
         const complexFilter = audios.reduce((result, audio, index) => {
-            const { path, url, loop, startTime, endTime, duration, volume, seekStart, seekEnd, fadeInDuration, fadeOutDuration } = audio;
+            const { path, url, loop, startTime, endTime = outputDuration, duration, volume, seekStart, seekEnd, fadeInDuration, fadeOutDuration } = audio;
             if (seekEnd && seekEnd - seekStart > duration)
                 return result;
             // 添加音频输入

diff --git a/media/DynamicImage.js b/media/DynamicImage.js
@@ -198,6 +198,12 @@ export default class DynamicImage {
         if (!result.image) return;
         const frame = result.image;
         const { displayWidth, displayHeight } = frame;
+        // 画布宽度为0时使用解码宽度初始化
+        if(this.canvas.width === 0)
+            this.canvas.width = config.codedWidth;
+        // 画布高度为0时使用解码高度初始化
+        if(this.canvas.height === 0)
+            this.canvas.height = config.codedHeight;
         // 清除上一帧画面
         this.canvasCtx.clearRect(0, 0, this.canvas.width, this.canvas.height);
         // 绘制当前帧
@@ -281,6 +287,8 @@ export default class DynamicImage {
         // 重置图像
         this.reset();
         this.repetitionIndex = 0;
+        if(this.canvas)
+            this.canvas.style.display = "none";
         this.canvas = null;
         this.canvasCtx = null;
         // 设置已销毁

diff --git a/media/LottieCanvas.js b/media/LottieCanvas.js
@@ -184,6 +184,8 @@ export default class LottieCanvas {
         this.animation = null;
         // 重置动画
         this.reset();
+        if(this.canvas)
+            this.canvas.style.display = "none";
         this.canvas = null;
         this.canvasCtx = null;
         // 设置已销毁

diff --git a/media/VideoCanvas.js b/media/VideoCanvas.js
@@ -326,6 +326,8 @@ export default class VideoCanvas {
         this.maskBuffer = null;
         this.frameIndex = null;
         this.currentTime = 0;
+        if(this.canvas)
+            this.canvas.style.display = "none";
         this.canvas = null;
         this.canvasCtx = null;
         this.offscreenCanvas = null;