From 1c058c17745939bb9a10fd7fa85558c550c2c994 Mon Sep 17 00:00:00 2001 From: mtvpls Date: Tue, 2 Dec 2025 20:33:31 +0800 Subject: [PATCH] =?UTF-8?q?=E5=BC=B9=E5=B9=95=E8=AE=BE=E7=BD=AE=E6=8C=81?= =?UTF-8?q?=E4=B9=85=E5=8C=96?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .claude/settings.local.json | 5 +- src/app/play/page.tsx | 166 +++++++++++++----------------------- 2 files changed, 61 insertions(+), 110 deletions(-) diff --git a/.claude/settings.local.json b/.claude/settings.local.json index 47e13a1..8c169d7 100644 --- a/.claude/settings.local.json +++ b/.claude/settings.local.json @@ -3,7 +3,10 @@ "allow": [ "WebSearch", "Bash(curl:*)", - "Bash(find:*)" + "Bash(find:*)", + "WebFetch(domain:artplayer.org)", + "WebFetch(domain:github.com)", + "WebFetch(domain:www.artplayer.org)" ], "deny": [], "ask": [] diff --git a/src/app/play/page.tsx b/src/app/play/page.tsx index ba3e301..ff7df1d 100644 --- a/src/app/play/page.tsx +++ b/src/app/play/page.tsx @@ -594,6 +594,24 @@ function PlayPageClient() { const cleanupPlayer = () => { if (artPlayerRef.current) { try { + // 在销毁前从弹幕插件读取最新配置并保存 + if (danmakuPluginRef.current?.option && artPlayerRef.current.storage) { + const currentSettings = { + ...danmakuSettingsRef.current, + opacity: danmakuPluginRef.current.option.opacity || danmakuSettingsRef.current.opacity, + fontSize: danmakuPluginRef.current.option.fontSize || danmakuSettingsRef.current.fontSize, + speed: danmakuPluginRef.current.option.speed || danmakuSettingsRef.current.speed, + marginTop: (danmakuPluginRef.current.option.margin && danmakuPluginRef.current.option.margin[0]) ?? danmakuSettingsRef.current.marginTop, + marginBottom: (danmakuPluginRef.current.option.margin && danmakuPluginRef.current.option.margin[1]) ?? danmakuSettingsRef.current.marginBottom, + }; + + // 保存到 localStorage 和 art.storage + saveDanmakuSettings(currentSettings); + artPlayerRef.current.storage.set('danmaku_settings', currentSettings); + + console.log('播放器销毁前保存弹幕设置:', currentSettings); + } + // 销毁 HLS 实例 if (artPlayerRef.current.video && artPlayerRef.current.video.hls) { artPlayerRef.current.video.hls.destroy(); @@ -2046,6 +2064,8 @@ function PlayPageClient() { antiOverlap: true, synchronousPlayback: danmakuSettingsRef.current.synchronousPlayback, emitter: false, + // 主题 + theme: 'dark', filter: (danmu: any) => { // 应用过滤规则 if (danmakuSettingsRef.current.filterRules.length > 0) { @@ -2094,115 +2114,6 @@ function PlayPageClient() { return newVal ? '当前开启' : '当前关闭'; }, }, - // 弹幕开关 - { - name: '弹幕开关', - html: '弹幕开关', - icon: '弹', - switch: danmakuSettingsRef.current.enabled, - onSwitch: function (item: any) { - const newSettings = { - ...danmakuSettingsRef.current, - enabled: !item.switch, - }; - setDanmakuSettings(newSettings); - saveDanmakuSettings(newSettings); - - // 切换弹幕显示/隐藏 - if (danmakuPluginRef.current) { - if (newSettings.enabled) { - danmakuPluginRef.current.show(); - } else { - danmakuPluginRef.current.hide(); - } - } - - return !item.switch; - }, - }, - // 弹幕不透明度 - { - name: '弹幕不透明度', - html: '弹幕不透明度', - selector: [ - { html: '10%', value: '0.1' }, - { html: '25%', value: '0.25' }, - { html: '50%', value: '0.5' }, - { html: '75%', value: '0.75', default: true }, - { html: '100%', value: '1.0' }, - ], - onSelect: function (item: any) { - const opacity = parseFloat(item.value); - const newSettings = { - ...danmakuSettingsRef.current, - opacity, - }; - setDanmakuSettings(newSettings); - saveDanmakuSettings(newSettings); - - // 更新弹幕插件配置 - if (danmakuPluginRef.current) { - danmakuPluginRef.current.config({ opacity }); - } - - return item.html; - }, - }, - // 弹幕字体大小 - { - name: '弹幕字体大小', - html: '弹幕字体大小', - selector: [ - { html: '小', value: '20' }, - { html: '中', value: '25', default: true }, - { html: '大', value: '30' }, - { html: '特大', value: '35' }, - ], - onSelect: function (item: any) { - const fontSize = parseInt(item.value); - const newSettings = { - ...danmakuSettingsRef.current, - fontSize, - }; - setDanmakuSettings(newSettings); - saveDanmakuSettings(newSettings); - - // 更新弹幕插件配置 - if (danmakuPluginRef.current) { - danmakuPluginRef.current.config({ fontSize }); - } - - return item.html; - }, - }, - // 弹幕速度 - { - name: '弹幕速度', - html: '弹幕速度', - selector: [ - { html: '很慢', value: '3' }, - { html: '慢', value: '5', default: true }, - { html: '正常', value: '7' }, - { html: '快', value: '10' }, - { html: '很快', value: '15' }, - ], - onSelect: function (item: any) { - const speed = parseInt(item.value); - const newSettings = { - ...danmakuSettingsRef.current, - speed, - }; - setDanmakuSettings(newSettings); - saveDanmakuSettings(newSettings); - - // 更新弹幕插件配置 - if (danmakuPluginRef.current) { - danmakuPluginRef.current.config({ speed }); - } - - return item.html; - }, - }, ...(webGPUSupported ? [ { name: 'Anime4K超分', @@ -2373,10 +2284,47 @@ function PlayPageClient() { artPlayerRef.current.on('ready', async () => { setError(null); + // 从 art.storage 读取弹幕设置并应用 + if (artPlayerRef.current) { + const storedDanmakuSettings = artPlayerRef.current.storage.get('danmaku_settings'); + if (storedDanmakuSettings) { + // 合并存储的设置到当前设置 + const mergedSettings = { + ...danmakuSettingsRef.current, + ...storedDanmakuSettings, + }; + setDanmakuSettings(mergedSettings); + saveDanmakuSettings(mergedSettings); + } + } + // 保存弹幕插件引用 if (artPlayerRef.current?.plugins?.artplayerPluginDanmuku) { danmakuPluginRef.current = artPlayerRef.current.plugins.artplayerPluginDanmuku; + // 监听弹幕配置变化事件 + artPlayerRef.current.on('artplayerPluginDanmuku:config', () => { + if (danmakuPluginRef.current?.option) { + const newSettings = { + ...danmakuSettingsRef.current, + opacity: danmakuPluginRef.current.option.opacity || danmakuSettingsRef.current.opacity, + fontSize: danmakuPluginRef.current.option.fontSize || danmakuSettingsRef.current.fontSize, + speed: danmakuPluginRef.current.option.speed || danmakuSettingsRef.current.speed, + marginTop: (danmakuPluginRef.current.option.margin && danmakuPluginRef.current.option.margin[0]) ?? danmakuSettingsRef.current.marginTop, + marginBottom: (danmakuPluginRef.current.option.margin && danmakuPluginRef.current.option.margin[1]) ?? danmakuSettingsRef.current.marginBottom, + }; + + // 保存到 localStorage 和 art.storage + setDanmakuSettings(newSettings); + saveDanmakuSettings(newSettings); + if (artPlayerRef.current?.storage) { + artPlayerRef.current.storage.set('danmaku_settings', newSettings); + } + + console.log('弹幕设置已更新并保存:', newSettings); + } + }); + // 根据设置显示或隐藏弹幕 if (danmakuSettingsRef.current.enabled) { danmakuPluginRef.current.show();