From 16c462453ae4e99ca1d52014a8f4d23518ff5a24 Mon Sep 17 00:00:00 2001
From: QIU SHENGMING <Kero64@126.com>
Date: Tue, 30 Sep 2025 20:57:13 +0800
Subject: [PATCH] =?UTF-8?q?=E5=88=A0=E9=99=A4=E9=9F=B3=E4=B9=90=E6=92=AD?=
 =?UTF-8?q?=E6=94=BE=E5=99=A8=EF=BC=8C=E5=9B=A0=E4=B8=BABUG=E5=A4=AA?=
 =?UTF-8?q?=E5=A4=9A=E4=BA=86=EF=BC=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/widget/APlayer.svelte | 178 ---------------------------
 src/components/widget/Music.astro    |  66 ----------
 src/components/widget/SideBar.astro  |  31 ++---
 3 files changed, 13 insertions(+), 262 deletions(-)
 delete mode 100644 src/components/widget/APlayer.svelte
 delete mode 100644 src/components/widget/Music.astro

diff --git a/src/components/widget/APlayer.svelte b/src/components/widget/APlayer.svelte
deleted file mode 100644
index e41c72d..0000000
--- a/src/components/widget/APlayer.svelte
+++ /dev/null
@@ -1,178 +0,0 @@
-<script>
-  import { onMount, onDestroy } from 'svelte';
-  
-  let container;
-  let playerInstance = null;
-  
-  onMount(() => {
-    // 确保脚本加载完成后再初始化
-    loadScripts().then(() => {
-      initPlayer();
-    });
-  });
-  
-  onDestroy(() => {
-    destroyPlayer();
-  });
-  
-  function loadScripts() {
-    return new Promise((resolve) => {
-      // 检查是否已经加载了必要的脚本
-      if (window.APlayer && window.Meting) {
-        resolve();
-        return;
-      }
-      
-      let loadedCount = 0;
-      const totalScripts = 3;
-      
-      function checkLoaded() {
-        loadedCount++;
-        if (loadedCount === totalScripts) {
-          resolve();
-        }
-      }
-      
-      // 加载CSS
-      if (!document.querySelector('link[href*="aplayer"]')) {
-        const css = document.createElement('link');
-        css.rel = 'stylesheet';
-        css.href = 'https://cdn.jsdelivr.net/npm/aplayer/dist/APlayer.min.css';
-        css.onload = checkLoaded;
-        document.head.appendChild(css);
-      } else {
-        checkLoaded();
-      }
-      
-      // 加载APlayer JS
-      if (!window.APlayer) {
-        const script1 = document.createElement('script');
-        script1.src = 'https://cdn.jsdelivr.net/npm/aplayer/dist/APlayer.min.js';
-        script1.onload = checkLoaded;
-        document.body.appendChild(script1);
-      } else {
-        checkLoaded();
-      }
-      
-      // 加载Meting JS
-      if (!window.Meting) {
-        const script2 = document.createElement('script');
-        script2.src = 'https://cdn.jsdelivr.net/npm/meting@2/dist/Meting.min.js';
-        script2.onload = checkLoaded;
-        document.body.appendChild(script2);
-      } else {
-        checkLoaded();
-      }
-    });
-  }
-  
-  function destroyPlayer() {
-    if (playerInstance) {
-      try {
-        playerInstance.destroy();
-        console.log('播放器实例已销毁');
-      } catch (e) {
-        console.log('销毁播放器时出错:', e);
-      }
-      playerInstance = null;
-    }
-    
-    // 清理全局实例引用
-    if (window.musicPlayerInstance === playerInstance) {
-      window.musicPlayerInstance = null;
-    }
-  }
-  
-  function initPlayer() {
-    if (!container) return;
-    
-    // 先销毁现有实例
-    destroyPlayer();
-    
-    // 清空容器
-    container.innerHTML = '';
-    
-    // 创建meting-js元素
-    const metingElement = document.createElement('meting-js');
-    metingElement.setAttribute('server', 'netease');
-    metingElement.setAttribute('type', 'playlist');
-    metingElement.setAttribute('id', '420944487');
-    metingElement.setAttribute('order', 'random');
-    metingElement.setAttribute('list-folded', 'true');
-    metingElement.setAttribute('list-max-height', '300px'); // 限制列表最大高度
-    metingElement.setAttribute('fixed', 'false');
-    metingElement.setAttribute('autoplay', 'false');
-    metingElement.setAttribute('preload', 'auto');
-    
-    container.appendChild(metingElement);
-    
-    // 等待Meting初始化完成
-    setTimeout(() => {
-      const aplayerElement = container.querySelector('.aplayer');
-      if (aplayerElement && aplayerElement.aplayer) {
-        playerInstance = aplayerElement.aplayer;
-        window.musicPlayerInstance = playerInstance;
-        
-        // 添加样式修复
-        if (aplayerElement) {
-          aplayerElement.style.boxShadow = 'none';
-          aplayerElement.style.margin = '0';
-          
-          // 确保列表滚动正常
-          const listElement = aplayerElement.querySelector('.aplayer-list');
-          if (listElement) {
-            listElement.style.maxHeight = '300px';
-            listElement.style.overflowY = 'auto';
-          }
-        }
-        
-        console.log('播放器初始化完成');
-      }
-    }, 100);
-  }
-</script>
-
-<!-- 播放器容器 -->
-<div bind:this={container} class="music-player-container"></div>
-
-<style>
-  .music-player-container {
-    width: 100%;
-    position: relative;
-  }
-  
-  /* 全局样式修复 */
-  :global(.aplayer) {
-    box-shadow: none !important;
-    border-radius: 8px;
-    overflow: hidden;
-  }
-  
-  :global(.aplayer-list) {
-    max-height: 300px !important;
-    overflow-y: auto !important;
-  }
-  
-  :global(.aplayer-list ol) {
-    max-height: none !important;
-  }
-  
-  /* 防止列表展开时影响页面布局 */
-  :global(.aplayer.aplayer-withlist .aplayer-list) {
-    position: relative !important;
-  }
-  
-  /* 确保滚动条样式 */
-  :global(.aplayer-list::-webkit-scrollbar) {
-    width: 4px;
-  }
-  
-  :global(.aplayer-list::-webkit-scrollbar-thumb) {
-    background: rgba(0, 0, 0, 0.3);
-    border-radius: 2px;
-  }
-  
-  :global(.aplayer-list::-webkit-scrollbar-track) {
-    background: transparent;
-  }
-</style>
\ No newline at end of file
diff --git a/src/components/widget/Music.astro b/src/components/widget/Music.astro
deleted file mode 100644
index b8b88f6..0000000
--- a/src/components/widget/Music.astro
+++ /dev/null
@@ -1,66 +0,0 @@
----
-import WidgetLayout from './WidgetLayout.astro'
-import APlayer from './APlayer.svelte'
-
-const COLLAPSED_HEIGHT = '7.5rem'
-
-interface Props {
-  class?: string
-  style?: string
-}
-const className = Astro.props.class
-const style = Astro.props.style
-
-const isCollapsed = false
----
-
-<WidgetLayout name="音乐" id="music" isCollapsed={isCollapsed} collapsedHeight={COLLAPSED_HEIGHT} class={className} style={style}>
-    <div class="flex flex-col gap-1 music-widget-container">
-        <APlayer client:only="svelte"/>
-    </div>
-</WidgetLayout>
-
-<script>
-// 页面切换时的清理工作
-function cleanupMusicPlayer() {
-  if (window.musicPlayerInstance) {
-    try {
-      window.musicPlayerInstance.destroy();
-      console.log('页面切换时清理播放器');
-    } catch (e) {
-      console.log('清理播放器时出错:', e);
-    }
-    window.musicPlayerInstance = null;
-  }
-}
-
-// Astro 页面切换事件
-document.addEventListener('astro:before-preparation', cleanupMusicPlayer);
-document.addEventListener('astro:before-swap', cleanupMusicPlayer);
-
-// 如果使用了 Swup
-if (typeof window !== 'undefined' && window.swup) {
-  window.swup.hooks.on('content:replace', cleanupMusicPlayer);
-}
-
-// 页面卸载时清理
-window.addEventListener('beforeunload', cleanupMusicPlayer);
-</script>
-
-<style>
-.music-widget-container {
-  overflow: hidden;
-  position: relative;
-}
-
-/* 防止音乐播放器影响整体布局 */
-.music-widget-container :global(.aplayer) {
-  width: 100% !important;
-  max-width: 100% !important;
-}
-
-.music-widget-container :global(.aplayer-list) {
-  position: relative !important;
-  z-index: 10;
-}
-</style>
\ No newline at end of file
diff --git a/src/components/widget/SideBar.astro b/src/components/widget/SideBar.astro
index d8cfa33..43fd117 100644
--- a/src/components/widget/SideBar.astro
+++ b/src/components/widget/SideBar.astro
@@ -3,31 +3,26 @@ import type { MarkdownHeading } from "astro";
 import Categories from "./Categories.astro";
 import Profile from "./Profile.astro";
 import Tag from "./Tags.astro";
-import Music from './Music.astro';
-import Series from './Series.astro';
+import Series from './Series.astro'
 
 interface Props {
-  class?: string;
-  headings?: MarkdownHeading[];
-  series?: string;
+	class?: string;
+	headings?: MarkdownHeading[];
+ series?: string
 }
 
 const className = Astro.props.class;
-const series = Astro.props.series;
+const series = Astro.props.series
 ---
-
 <div id="sidebar" class:list={[className, "w-full"]}>
-  <div class="flex flex-col w-full gap-4 mb-4">
-    <Profile />
-  </div>
-  <div id="sidebar-sticky" class="transition-all duration-700 flex flex-col w-full gap-4 top-4 sticky top-4">
+    <div class="flex flex-col w-full gap-4 mb-4">
+        <Profile></Profile>
+    </div>
+    <div id="sidebar-sticky" class="transition-all duration-700 flex flex-col w-full gap-4 top-4 sticky top-4">
     <div id="series" class="flex flex-col w-full gap-4">
-      {series && <Series series={series} />}
+            { series && <Series series={ series }></Series> }
+        </div>
+        <Categories class="onload-animation" style="animation-delay: 150ms"></Categories>
+        <Tag class="onload-animation" style="animation-delay: 200ms"></Tag>
     </div>
-    <Categories class="onload-animation" style="animation-delay: 150ms" />
-    <Tag class="onload-animation" style="animation-delay: 200ms" />
-    <div id="music" class="flex flex-col w-full gap-4">
-      <Music />
-    </div>
-  </div>
 </div>