@yuuichi/openlist-assets 4.2.6-ym.3 → 4.2.6-ym.4

package/dist/brand/bgm/js/bgm-dock.js

@@ -0,0 +1,876 @@
+/* 统一背景音乐 Dock：本地 / 网易云 / QQ音乐 / Spotify 多源切换
+   双端统一：左下角圆形按钮，点击展开面板（移动端=底部全宽，桌面端=按钮上方浮层） */
+(function () {
+  var STORE_POS = 'bgm-dock-pos-v2'
+  var STORE_SRC = 'bgm-dock-source'
+  var STORE_SIZE = 'bgm-dock-size'
+  var DRAG_THRESHOLD = 6
+  var MIN_W = 260
+  var MAX_W = 560
+  var MIN_H = 180
+  var MAX_H = 760
+  var MOBILE_MAX = 768
+
+  var root = document.getElementById('bgm-dock')
+  if (!root) return
+
+  var cfg
+  try {
+    cfg = JSON.parse(root.getAttribute('data-bgm') || '{}')
+  } catch (e) {
+    cfg = {}
+  }
+
+  var sources = Array.isArray(cfg.sources) ? cfg.sources : []
+  if (!sources.length) return
+
+  // 资源基址：blog 本地为同源根路径；welcome 页经 /__blog/ 代理。
+  // 优先读取配置中的 assetBase，其次从脚本自身地址推导（…/js/bgm-dock.js -> 前缀）。
+  function detectAssetBase() {
+    if (cfg.assetBase) return cfg.assetBase.replace(/\/$/, '')
+    try {
+      var me = document.currentScript && document.currentScript.src
+      if (!me) {
+        var s = document.querySelector('script[src*="bgm-dock.js"]')
+        me = s && s.src
+      }
+      if (me) {
+        // welcome 页：…/__blog/js/bgm-dock.js -> 前缀为 '/__blog'
+        var wp = me.match(/^(https?:\/\/[^/]+)\/__blog\/js\/bgm-dock\.js(?:[?#].*)?$/)
+        if (wp) return '/__blog'
+        // 博客同源：…/js/bgm-dock.js -> 空前缀
+        var same = me.match(/^https?:\/\/[^/]+\/js\/bgm-dock\.js(?:[?#].*)?$/)
+        if (same) return ''
+      }
+    } catch (e) {
+      // ignore
+    }
+    return ''
+  }
+  var ASSET_BASE = detectAssetBase()
+  var ASSET_V = (typeof window.__ASSET_VERSION__ === 'string' && window.__ASSET_VERSION__) || ''
+  function assetUrl(p) {
+    return ASSET_BASE + p + (ASSET_V ? (p.indexOf('?') >= 0 ? '&' : '?') + 'v=' + ASSET_V : '')
+  }
+
+  function loadStyleOnce(href) {
+    var existing = document.querySelector('link[data-bgm-asset="' + href + '"]')
+    if (existing) return Promise.resolve()
+    return new Promise(function (resolve, reject) {
+      var link = document.createElement('link')
+      link.rel = 'stylesheet'
+      link.href = href
+      link.dataset.bgmAsset = href
+      link.onload = function () { link.dataset.loaded = '1'; resolve() }
+      link.onerror = function () { reject(new Error('css load fail: ' + href)) }
+      document.head.appendChild(link)
+    })
+  }
+
+  function loadScriptOnce(src, isReady) {
+    var existing = document.querySelector('script[data-bgm-asset="' + src + '"]')
+    if (existing) {
+      if (existing.dataset.loaded === '1' || (isReady && isReady())) return Promise.resolve()
+      return new Promise(function (resolve) {
+        function check() {
+          if (!isReady || isReady()) {
+            existing.dataset.loaded = '1'
+            resolve()
+          } else {
+            setTimeout(check, 60)
+          }
+        }
+        check()
+      })
+    }
+    return new Promise(function (resolve, reject) {
+      var s = document.createElement('script')
+      s.src = src
+      s.defer = true
+      s.dataset.bgmAsset = src
+      s.onload = function () { s.dataset.loaded = '1'; resolve() }
+      s.onerror = function () { reject(new Error('script load fail: ' + src)) }
+      document.body.appendChild(s)
+    })
+  }
+
+  var dockCssLoaded = null
+  function loadDockCss() {
+    if (dockCssLoaded) return dockCssLoaded
+    if (document.getElementById('bgm-dock-full-css')) return Promise.resolve()
+    var href = assetUrl('/css/bgm-dock.css')
+    dockCssLoaded = loadStyleOnce(href).then(function () {
+      var l = document.querySelector('link[data-bgm-asset="' + href + '"]')
+      if (l) l.id = 'bgm-dock-full-css'
+    })
+    return dockCssLoaded
+  }
+
+  var aplayerLoading = null
+  function loadAPlayer() {
+    if (window.APlayer) return Promise.resolve()
+    if (aplayerLoading) return aplayerLoading
+    aplayerLoading = Promise.all([
+      loadStyleOnce(assetUrl('/js/lib/aplayer/APlayer.min.css')),
+      loadScriptOnce(assetUrl('/js/lib/aplayer/APlayer.min.js'), function () { return !!window.APlayer }),
+    ]).then(function () {
+      if (!window.APlayer) throw new Error('aplayer missing after load')
+    })
+    return aplayerLoading
+  }
+
+  var built = {}
+  var instances = []
+  var current = null
+  var pending = null
+  var dragging = false
+  var suppressClick = false
+  var opened = false
+  var mounted = false
+  var pendingKey = null
+  var peekRevealed = false
+  var swallowPeekClick = false
+
+  // 暴露 Dock 内的 APlayer 实例，便于倍速控制与 PJAX 检测
+  window.__bgmDock = { instances: instances }
+
+  /* ---------- 构建外壳 ---------- */
+  root.innerHTML =
+    '<button type="button" class="bgm-dock__fab" aria-label="背景音乐">' +
+      '<svg viewBox="0 0 24 24" aria-hidden="true"><path d="M12 3v10.55A4 4 0 1 0 14 17V7h4V3h-6z"/></svg>' +
+      '<span class="bgm-dock__fab-bar"></span>' +
+    '</button>' +
+    '<div class="bgm-dock__panel">' +
+      '<div class="bgm-dock__head">' +
+        '<div class="bgm-dock__handle"><svg viewBox="0 0 16 16" aria-hidden="true"><path d="M6 13c0 1.105-1.12 2-2.5 2S1 14.105 1 13s1.12-2 2.5-2 2.5.9 2.5 2zm9-2c0 1.105-1.12 2-2.5 2s-2.5-.9-2.5-2 1.12-2 2.5-2 2.5.9 2.5 2z"/><path fill-rule="evenodd" d="M14 11V2h1v9h-1zM6 3v10H5V3h1z"/><path d="M5 2.905a1 1 0 0 1 .9-.995l9-1a1 1 0 0 1 1.096.995V3L6 4v-1.095z"/></svg><span class="bgm-dock__title">背景音乐</span></div>' +
+        '<div class="bgm-dock__tabs"></div>' +
+        '<button type="button" class="bgm-dock__toggle" aria-label="折叠">−</button>' +
+      '</div>' +
+      '<div class="bgm-dock__body"></div>' +
+      '<div class="bgm-dock__resize" title="拖动缩放，双击还原"></div>' +
+    '</div>'
+
+  var headEl = root.querySelector('.bgm-dock__head')
+  var handleEl = root.querySelector('.bgm-dock__handle')
+  var tabsEl = root.querySelector('.bgm-dock__tabs')
+  var toggleEl = root.querySelector('.bgm-dock__toggle')
+  var bodyEl = root.querySelector('.bgm-dock__body')
+  var resizeEl = root.querySelector('.bgm-dock__resize')
+  var fabEl = root.querySelector('.bgm-dock__fab')
+  var panelEl = root.querySelector('.bgm-dock__panel')
+
+  /* ---------- 响应式 ---------- */
+  var mobileMQ = window.matchMedia
+    ? window.matchMedia('(max-width:' + MOBILE_MAX + 'px)')
+    : { matches: false }
+
+  function isMobile() {
+    return mobileMQ.matches
+  }
+
+  function clamp(v, min, max) {
+    return Math.min(Math.max(v, min), max)
+  }
+
+  /* ---------- 拖拽时的全屏覆盖层（防 iframe/页面吞事件） ---------- */
+  var overlay = document.createElement('div')
+  overlay.className = 'bgm-dock__overlay'
+
+  /* ---------- 圆形按钮定位（双端共用，左下角默认） ---------- */
+  // root 本身不占布局尺寸：FAB 与展开面板都是相对它的绝对定位子元素，
+  // 因此拖拽边界必须按“当前可见子元素相对 root 的外接盒”计算，
+  // 不能直接用 root.offsetWidth/Height（展开时为 0，会导致面板拖不下去）。
+  function visibleBounds() {
+    var boxes = []
+    var children = [fabEl, panelEl]
+    for (var i = 0; i < children.length; i++) {
+      var c = children[i]
+      if (!c || c.offsetParent === null) continue
+      var st = c.ownerDocument.defaultView.getComputedStyle(c)
+      if (st.display === 'none' || st.visibility === 'hidden') continue
+      var rect = c.getBoundingClientRect()
+      if (rect.width === 0 && rect.height === 0) continue
+      // 用 offset 位置，得到相对 root 的坐标
+      boxes.push({
+        left: c.offsetLeft,
+        top: c.offsetTop,
+        right: c.offsetLeft + rect.width,
+        bottom: c.offsetTop + rect.height,
+      })
+    }
+    if (!boxes.length) {
+      return { left: 0, top: 0, width: fabEl.offsetWidth || 52, height: fabEl.offsetHeight || 52 }
+    }
+    var minL = Infinity, minT = Infinity, maxR = -Infinity, maxB = -Infinity
+    boxes.forEach(function (b) {
+      minL = Math.min(minL, b.left)
+      minT = Math.min(minT, b.top)
+      maxR = Math.max(maxR, b.right)
+      maxB = Math.max(maxB, b.bottom)
+    })
+    return { left: minL, top: minT, width: maxR - minL, height: maxB - minT }
+  }
+
+  function placeFab(left, top) {
+    // 入参为 root 的视口坐标。展开时面板相对 root 为负偏移（root 高度为 0），
+    // 故先换算成“可见外接盒”视口位置做边界约束，再还原成 root 的定位坐标。
+    var b = visibleBounds()
+    var w = b.width || fabEl.offsetWidth || 52
+    var h = b.height || fabEl.offsetHeight || 52
+    var visLeft = clamp(left + b.left, 0, Math.max(0, window.innerWidth - w))
+    var visTop = clamp(top + b.top, 0, Math.max(0, window.innerHeight - h))
+    var rootLeft = visLeft - b.left
+    var rootTop = visTop - b.top
+    root.style.left = rootLeft + 'px'
+    root.style.right = 'auto'
+    root.style.top = rootTop + 'px'
+    root.style.bottom = 'auto'
+    root.style.margin = '0'
+    return { left: rootLeft, top: rootTop }
+  }
+
+  function applySavedPosition() {
+    try {
+      var s = JSON.parse(localStorage.getItem(STORE_POS) || 'null')
+      if (s && typeof s.left === 'number') {
+        placeFab(s.left, s.top)
+        return
+      }
+    } catch (e) {
+      // ignore
+    }
+    // 默认左下角
+    placeFab(16, window.innerHeight - 68)
+  }
+
+  /* ---------- 收起态半吸附边缘 ---------- */
+  // 收起时半吸附到屏幕左/右边缘，只露出一小截；桌面靠 hover、触摸靠首次点按
+  // 让整个按钮滑回屏幕内（滑入动画/可点区域由 music-player.js 内联 CSS 保证），
+  // 因此圆心即使部分在视口外，鼠标仍可在露出的半圆上 hover/点击。
+  function canPeek() {
+    return true
+  }
+  function snapToEdge() {
+    if (opened) return
+    var fabSize = fabEl.offsetWidth || 52
+    var rect = root.getBoundingClientRect()
+    var center = rect.left + fabSize / 2
+    var toLeft = center < window.innerWidth / 2
+    var top = clamp(rect.top, 0, Math.max(0, window.innerHeight - fabSize))
+    var left = toLeft ? 0 : window.innerWidth - fabSize
+    placeFab(left, top)
+    try {
+      localStorage.setItem(STORE_POS, JSON.stringify({ left: left, top: top }))
+    } catch (e) {
+      // ignore
+    }
+    fabEl.classList.toggle('is-peek-left', toLeft)
+    fabEl.classList.toggle('is-peek-right', !toLeft)
+    return toLeft
+  }
+
+  function revealFab() {
+    peekRevealed = true
+    fabEl.classList.add('is-revealed')
+  }
+
+  function peekFab() {
+    peekRevealed = false
+    fabEl.classList.remove('is-revealed')
+  }
+
+  function fabDragStart(e) {
+    if (opened) return // 展开状态下不让 FAB 拖（桌面拖面板标题栏；移动端面板固定）
+    if (e.pointerType === 'mouse' && e.button !== 0) return
+    // 触屏（或笔）首次点按仅全露（不展开），并吞掉这次 click；已全露后再点才展开。
+    // 鼠标悬停即全露，点击直接展开。
+    swallowPeekClick = e.pointerType !== 'mouse' && !peekRevealed
+    if (!peekRevealed) revealFab()
+    fabDrag = { id: e.pointerId, x0: e.clientX, y0: e.clientY, moved: false }
+    try { fabEl.setPointerCapture(e.pointerId) } catch (err) {
+      // ignore
+    }
+  }
+
+  function fabDragMove(e) {
+    if (!fabDrag || e.pointerId !== fabDrag.id) return
+    if (!fabDrag.moved) {
+      if (Math.hypot(e.clientX - fabDrag.x0, e.clientY - fabDrag.y0) < DRAG_THRESHOLD) return
+      fabDrag.moved = true
+      suppressClick = true
+      dragging = true
+      fabEl.classList.add('is-dragging')
+      document.body.appendChild(overlay)
+    }
+    var rect = root.getBoundingClientRect()
+    placeFab(rect.left + (e.clientX - fabDrag.x0), rect.top + (e.clientY - fabDrag.y0))
+    fabDrag.x0 = e.clientX
+    fabDrag.y0 = e.clientY
+  }
+
+  function fabDragEnd(e) {
+    if (!fabDrag || (e && e.pointerId !== fabDrag.id)) return
+    if (fabDrag.moved) {
+      swallowPeekClick = false
+      snapToEdge()
+      setTimeout(function () {
+        suppressClick = false
+        if (overlay.parentNode) overlay.parentNode.removeChild(overlay)
+      }, 50)
+    }
+    fabEl.classList.remove('is-dragging')
+    dragging = false
+    fabDrag = null
+  }
+
+  var fabDrag = null
+  fabEl.addEventListener('pointerdown', fabDragStart)
+  fabEl.addEventListener('pointermove', fabDragMove)
+  fabEl.addEventListener('pointerup', fabDragEnd)
+  fabEl.addEventListener('pointercancel', fabDragEnd)
+
+  /* ---------- 展开 / 收起 ---------- */
+  function renderState() {
+    root.classList.toggle('is-mobile', isMobile())
+    root.classList.toggle('is-open', opened)
+    root.classList.toggle('is-collapsed', !opened)
+    toggleEl.textContent = opened ? '−' : '+'
+  }
+
+  var sizeRestored = false
+  function openDock() {
+    opened = true
+    peekRevealed = true
+    fabEl.classList.remove('is-peek-left', 'is-peek-right', 'is-revealed')
+    renderState()
+    loadDockCss()
+      .then(function () {
+        if (sizeRestored) return
+        sizeRestored = true
+        // 强制布局后再读取面板位置，避免 display:none 时 rect 为 0
+        void panelEl.offsetHeight
+        restoreSize()
+      })
+      .catch(function () {
+        sizeRestored = true
+      })
+    ensurePlayerMounted()
+  }
+
+  function closeDock() {
+    opened = false
+    renderState()
+    peekFab()
+    snapToEdge()
+  }
+
+  fabEl.addEventListener('click', function (e) {
+    e.stopPropagation()
+    if (suppressClick) return
+    if (swallowPeekClick) {
+      swallowPeekClick = false
+      return
+    }
+    openDock()
+  })
+
+  // 鼠标靠近全露出，离开恢复半吸附（展开态不处理）
+  fabEl.addEventListener('mouseenter', function () {
+    if (!opened) revealFab()
+  })
+  fabEl.addEventListener('mouseleave', function () {
+    if (!opened) peekFab()
+  })
+
+  // 触屏/鼠标点到按钮以外区域：恢复半吸附
+  document.addEventListener('pointerdown', function (e) {
+    if (opened || peekRevealed === false) return
+    if (root.contains(e.target)) return
+    peekFab()
+  })
+
+  toggleEl.addEventListener('click', function () {
+    if (suppressClick) return
+    closeDock()
+  })
+
+  if (mobileMQ.addEventListener) {
+    mobileMQ.addEventListener('change', renderState)
+  } else if (mobileMQ.addListener) {
+    mobileMQ.addListener(renderState)
+  }
+
+  /* ---------- 桌面端面板标题栏拖拽 ---------- */
+  handleEl.addEventListener('pointerdown', function (e) {
+    if (e.button !== undefined && e.button !== 0) return
+    if (isMobile()) return // 移动端面板固定底部
+    if (!opened) return
+    var rect = root.getBoundingClientRect()
+    pending = { x0: e.clientX, y0: e.clientY, dx: e.clientX - rect.left, dy: e.clientY - rect.top }
+    e.preventDefault()
+  })
+
+  document.addEventListener('pointermove', function (e) {
+    if (!pending) return
+    if (!dragging) {
+      var moved = Math.hypot(e.clientX - pending.x0, e.clientY - pending.y0)
+      if (moved < DRAG_THRESHOLD) return
+      dragging = true
+      suppressClick = true
+      document.body.appendChild(overlay)
+    }
+    // 直接移动 root（FAB 与绝对定位面板一起走）
+    placeFab(e.clientX - pending.dx, e.clientY - pending.dy)
+  })
+
+  document.addEventListener('pointerup', function () {
+    if (!pending) return
+    if (dragging) {
+      var rect = root.getBoundingClientRect()
+      try {
+        localStorage.setItem(STORE_POS, JSON.stringify({ left: rect.left, top: rect.top }))
+      } catch (e) {
+        // ignore
+      }
+      setTimeout(function () {
+        suppressClick = false
+        if (overlay.parentNode) overlay.parentNode.removeChild(overlay)
+      }, 50)
+    }
+    pending = null
+    dragging = false
+  })
+
+  /* ---------- 缩放（右下角拖柄，仅桌面端展开面板）
+     关键：开始缩放时把面板的顶边钉在当前视口位置（top 锚定），
+     因此向下拖也能长高，而不是被 bottom:64px 顶得只能向上长。 ---------- */
+  function anchorPanel(viewportTop) {
+    // panel 为相对 #bgm-dock 的绝对定位，需换算成相对其父容器的偏移
+    var rootRect = root.getBoundingClientRect()
+    panelEl.style.top = (viewportTop - rootRect.top) + 'px'
+    panelEl.style.bottom = 'auto'
+  }
+
+  function pinPanelTop() {
+    var rect = panelEl.getBoundingClientRect()
+    anchorPanel(clamp(rect.top, 0, Math.max(0, window.innerHeight - MIN_H)))
+  }
+
+  function unpinPanelTop() {
+    panelEl.style.top = ''
+    panelEl.style.bottom = ''
+  }
+
+  function applySize(w, h, persist) {
+    w = clamp(Math.round(w), MIN_W, Math.min(MAX_W, window.innerWidth - 16))
+    var curTop = panelEl.getBoundingClientRect().top
+    var maxH = Math.min(MAX_H, window.innerHeight - curTop - 8)
+    h = clamp(Math.round(h), MIN_H, Math.max(MIN_H, maxH))
+    panelEl.style.width = w + 'px'
+    panelEl.style.height = h + 'px'
+    root.classList.add('is-sized')
+    if (persist) {
+      try {
+        localStorage.setItem(STORE_SIZE, JSON.stringify({ w: w, h: h, top: Math.round(curTop) }))
+      } catch (e) {}
+    }
+  }
+
+  function resetSize() {
+    panelEl.style.width = ''
+    panelEl.style.height = ''
+    unpinPanelTop()
+    root.classList.remove('is-sized')
+    try { localStorage.removeItem(STORE_SIZE) } catch (e) {}
+  }
+
+  function restoreSize() {
+    if (isMobile()) return
+    try {
+      var s = JSON.parse(localStorage.getItem(STORE_SIZE) || 'null')
+      if (s && typeof s.w === 'number' && typeof s.h === 'number') {
+        var top = typeof s.top === 'number' ? s.top : panelEl.getBoundingClientRect().top
+        top = clamp(top, 0, Math.max(0, window.innerHeight - MIN_H))
+        anchorPanel(top)
+        applySize(s.w, s.h, false)
+      }
+    } catch (e) {}
+  }
+
+  var resizing = false
+  var rStart = null
+  var rMoved = false
+  var lastTap = 0
+  resizeEl.addEventListener('pointerdown', function (e) {
+    if (e.button !== undefined && e.button !== 0) return
+    if (isMobile()) return
+    resizing = true
+    rMoved = false
+    if (!panelEl.style.top) pinPanelTop()
+    rStart = { x: e.clientX, y: e.clientY, w: panelEl.offsetWidth, h: panelEl.offsetHeight }
+    document.body.appendChild(overlay)
+    overlay.style.cursor = 'nwse-resize'
+    e.preventDefault()
+    e.stopPropagation()
+  })
+
+  document.addEventListener('pointermove', function (e) {
+    if (!resizing) return
+    if (Math.abs(e.clientX - rStart.x) > 3 || Math.abs(e.clientY - rStart.y) > 3) rMoved = true
+    applySize(rStart.w + (e.clientX - rStart.x), rStart.h + (e.clientY - rStart.y), false)
+  })
+
+  document.addEventListener('pointerup', function () {
+    if (!resizing) return
+    resizing = false
+    overlay.style.cursor = ''
+    setTimeout(function () {
+      if (overlay.parentNode && !dragging) overlay.parentNode.removeChild(overlay)
+    }, 50)
+    if (rMoved) {
+      try {
+        var s = JSON.parse(localStorage.getItem(STORE_SIZE) || 'null') || {}
+        s.w = panelEl.offsetWidth
+        s.h = panelEl.offsetHeight
+        s.top = Math.round(panelEl.getBoundingClientRect().top)
+        localStorage.setItem(STORE_SIZE, JSON.stringify(s))
+      } catch (e) {}
+    } else {
+      var now = Date.now()
+      if (now - lastTap < 350) {
+        resetSize()
+        lastTap = 0
+      } else {
+        lastTap = now
+      }
+    }
+  })
+
+  var SPEEDS = [0.75, 1, 1.25, 1.5, 2]
+
+  function addSpeedControl(ap, holder) {
+    var time = holder.querySelector('.aplayer-time')
+    var audio = ap.audio
+    if (!time || !audio || time.querySelector('.bgm-speed')) return
+
+    var btn = document.createElement('span')
+    btn.className = 'aplayer-icon bgm-speed'
+    btn.title = '播放倍速'
+    btn.textContent = '1x'
+
+    var menu = document.createElement('div')
+    menu.className = 'bgm-speed__menu'
+    SPEEDS.forEach(function (rate) {
+      var item = document.createElement('button')
+      item.type = 'button'
+      item.className = 'bgm-speed__item'
+      item.dataset.rate = String(rate)
+      item.textContent = rate === 1 ? '正常' : rate + 'x'
+      item.addEventListener('click', function (e) {
+        e.stopPropagation()
+        audio.playbackRate = rate
+        btn.textContent = rate === 1 ? '1x' : rate + 'x'
+        menu.classList.remove('is-open')
+        menu.querySelectorAll('.bgm-speed__item').forEach(function (it) {
+          it.classList.toggle('is-active', Number(it.dataset.rate) === rate)
+        })
+      })
+      if (rate === 1) item.classList.add('is-active')
+      menu.appendChild(item)
+    })
+
+    btn.addEventListener('click', function (e) {
+      e.stopPropagation()
+      menu.classList.toggle('is-open')
+    })
+    document.addEventListener('click', function (e) {
+      if (!btn.contains(e.target) && !menu.contains(e.target)) menu.classList.remove('is-open')
+    })
+
+    time.insertBefore(menu, time.querySelector('.aplayer-volume-wrap'))
+    time.insertBefore(btn, menu)
+  }
+
+  /* ---------- 各平台播放器构建 ---------- */
+  function showLoading(holder) {
+    holder.classList.add('is-loading')
+    holder.textContent = '播放器加载中…'
+  }
+  function clearLoading(holder) {
+    holder.classList.remove('is-loading')
+    holder.textContent = ''
+  }
+
+  function attachAutoSkip(ap) {
+    if (!ap || ap.__ymAutoSkip) return
+    ap.__ymAutoSkip = true
+    var tried = 0
+    var skip = function () {
+      // 会员/版权歌曲网易云会 302 到 /404，APlayer 报 audio error 且不会自动跳。
+      // 这里在连续错误时自动切到下一首；遍历一遍仍全失败则停止，避免死循环。
+      var list = ap.list
+      var total = (list && list.audios && list.audios.length) || 0
+      tried += 1
+      if (!total || tried > total) return
+      try {
+        if (typeof ap.skip === 'function') ap.skip()
+        else if (list && typeof list.switch === 'function') list.switch((list.index || 0) + 1)
+        setTimeout(function () { try { ap.play() } catch (e) {} }, 250)
+      } catch (e) {
+        // ignore
+      }
+    }
+    try {
+      ap.on('error', skip)
+      // 兜底：部分 APlayer 版本 audio error 不冒泡到实例事件，直接监听媒体元素
+      var bindMedia = function () {
+        var audios = ap.container ? ap.container.querySelectorAll('audio') : []
+        Array.prototype.forEach.call(audios, function (au) {
+          if (au.__ymErrBound) return
+          au.__ymErrBound = true
+          au.addEventListener('error', function () {
+            // 真正无可用音源（404/会员限制）才跳，排除中断切换时的瞬时错误
+            var code = au.error && au.error.code
+            if (code === 4) skip()
+          })
+        })
+      }
+      ap.on('loadeddata', bindMedia)
+      setTimeout(bindMedia, 0)
+      setInterval(bindMedia, 1500)
+    } catch (e) {
+      // ignore
+    }
+  }
+
+  function buildLocal(src) {
+    var holder = document.createElement('div')
+    holder.className = 'bgm-dock__player bgm-dock__player--aplayer'
+    showLoading(holder)
+    bodyEl.appendChild(holder)
+
+    loadAPlayer()
+      .then(function () {
+        if (!holder.isConnected) return
+        clearLoading(holder)
+        // eslint-disable-next-line no-new, no-undef
+        var ap = new APlayer({
+          container: holder,
+          fixed: false,
+          theme: cfg.theme || '#0078e7',
+          autoplay: cfg.autoplay === true,
+          loop: 'all',
+          order: cfg.order === 'random' ? 'random' : 'list',
+          preload: 'auto',
+          volume: typeof cfg.volume === 'number' ? cfg.volume : 0.6,
+          listFolded: false,
+          audio: (src.songs || []).map(function (s) {
+            return { name: s.name, artist: s.artist, url: s.url, cover: s.cover }
+          }),
+        })
+        instances.push({ type: 'local', ap: ap, holder: holder })
+        addSpeedControl(ap, holder)
+        if (holder.classList.contains('is-active')) {
+          try { ap.play() } catch (e) {
+            // 自动播放可能被浏览器拦截
+          }
+        }
+        try {
+          ap.on('play', function () { root.classList.add('is-playing') })
+          ap.on('pause', function () { root.classList.remove('is-playing') })
+        } catch (e) {
+          // ignore
+        }
+        attachAutoSkip(ap)
+      })
+      .catch(function () {
+        holder.textContent = '播放器加载失败'
+      })
+
+    return holder
+  }
+
+  var metingLoading = null
+  function loadMeting() {
+    if (window.Meting || customElements.get('meting-js')) return Promise.resolve()
+    if (metingLoading) return metingLoading
+    metingLoading = loadAPlayer()
+      .then(function () { return loadScriptOnce(assetUrl('/js/lib/aplayer/Meting.min.js')) })
+      .then(function () {
+        if (!customElements.get('meting-js') && !window.Meting) throw new Error('meting missing')
+      })
+      .catch(function (e) {
+        metingLoading = null
+        throw e
+      })
+    return metingLoading
+  }
+
+  function buildMeting(src) {
+    var holder = document.createElement('div')
+    holder.className = 'bgm-dock__player bgm-dock__player--meting'
+    showLoading(holder)
+    bodyEl.appendChild(holder)
+
+    function createEl() {
+      if (holder.querySelector('meting-js')) return
+      clearLoading(holder)
+      var el = document.createElement('meting-js')
+      el.setAttribute('server', src.type === 'tencent' ? 'tencent' : 'netease')
+      el.setAttribute('type', src.resourceType || 'playlist')
+      el.setAttribute('id', src.id)
+      el.setAttribute('api', cfg.metingApi)
+      el.setAttribute('fixed', 'false')
+      el.setAttribute('theme', cfg.theme || '#0078e7')
+      el.setAttribute('autoplay', cfg.autoplay === true ? 'true' : 'false')
+      el.setAttribute('loop', 'all')
+      el.setAttribute('order', cfg.order === 'random' ? 'random' : 'list')
+      el.setAttribute('list-folded', 'false')
+      el.setAttribute('volume', String(typeof cfg.volume === 'number' ? cfg.volume : 0.6))
+      holder.appendChild(el)
+
+      setTimeout(function () {
+        var ap = holder.querySelector('.aplayer') && el.aplayer
+        if (ap) {
+          instances.push({ type: 'meting', ap: ap, holder: holder })
+          try {
+            ap.on('play', function () { root.classList.add('is-playing') })
+            ap.on('pause', function () { root.classList.remove('is-playing') })
+          } catch (e) {
+            // ignore
+          }
+          attachAutoSkip(ap)
+        }
+      }, 1500)
+    }
+
+    loadMeting().then(createEl).catch(function () {
+      holder.textContent = '播放器加载失败'
+    })
+    return holder
+  }
+
+  function buildSpotify(src) {
+    var holder = document.createElement('div')
+    holder.className = 'bgm-dock__player bgm-dock__player--spotify'
+    if (src.resourceType === 'song') holder.classList.add('is-song')
+    bodyEl.appendChild(holder)
+
+    var kind = src.resourceType === 'album' ? 'album' : src.resourceType === 'song' ? 'track' : 'playlist'
+    var iframe = document.createElement('iframe')
+    iframe.dataset.src = 'https://open.spotify.com/embed/' + kind + '/' + src.id
+    iframe.setAttribute('frameborder', '0')
+    iframe.setAttribute('allowtransparency', 'true')
+    iframe.setAttribute('allow', 'encrypted-media')
+    iframe.loading = 'lazy'
+    holder.appendChild(iframe)
+    return holder
+  }
+
+  function buildSource(src) {
+    if (src.type === 'local') return buildLocal(src)
+    if (src.type === 'spotify') return buildSpotify(src)
+    return buildMeting(src)
+  }
+
+  /* ---------- 源切换 ---------- */
+  function select(key) {
+    var src = sources.find(function (s) { return s.key === key })
+    if (!src) return
+
+    if (!built[key]) {
+      built[key] = buildSource(src)
+    }
+
+    Object.keys(built).forEach(function (k) {
+      built[k].classList.toggle('is-active', k === key)
+    })
+
+    instances.forEach(function (rec) {
+      if (!rec.holder.classList.contains('is-active') && rec.ap && typeof rec.ap.pause === 'function') {
+        try { rec.ap.pause() } catch (e) {
+          // ignore
+        }
+      }
+    })
+
+    bodyEl.querySelectorAll('.bgm-dock__player--spotify').forEach(function (holder) {
+      var iframe = holder.querySelector('iframe')
+      if (!iframe || !iframe.dataset.src) return
+      if (holder.classList.contains('is-active')) {
+        if (iframe.src !== iframe.dataset.src) iframe.src = iframe.dataset.src
+      } else if (iframe.src === iframe.dataset.src) {
+        iframe.src = 'about:blank'
+      }
+    })
+
+    tabsEl.querySelectorAll('.bgm-dock__tab').forEach(function (tab) {
+      tab.classList.toggle('is-active', tab.getAttribute('data-key') === key)
+    })
+
+    current = key
+    try {
+      localStorage.setItem(STORE_SRC, key)
+    } catch (e) {
+      // ignore
+    }
+  }
+
+  /* ---------- 标签 ---------- */
+  sources.forEach(function (src) {
+    var tab = document.createElement('button')
+    tab.type = 'button'
+    tab.className = 'bgm-dock__tab'
+    tab.setAttribute('data-key', src.key)
+    tab.textContent = src.name
+    tab.addEventListener('click', function () {
+      if (suppressClick) return
+      ensurePlayerMounted()
+      select(src.key)
+    })
+    tabsEl.appendChild(tab)
+  })
+
+  function hasNonSpotify() {
+    return sources.some(function (s) { return s.type !== 'spotify' })
+  }
+
+  /* ---------- 懒挂载：首次展开才创建播放器（双端一致） ---------- */
+  function ensurePlayerMounted() {
+    if (mounted) {
+      if (pendingKey) { var kk = pendingKey; pendingKey = null; select(kk) }
+      return
+    }
+    mounted = true
+    root.classList.add('is-mounted')
+    var k = pendingKey || initialSource.key
+    pendingKey = null
+    select(k)
+  }
+
+  /* ---------- 初始位置 / 初始源 ---------- */
+  applySavedPosition()
+  snapToEdge()
+
+  var savedKey = localStorage.getItem(STORE_SRC)
+  var initialSource =
+    sources.find(function (s) { return s.key === savedKey }) ||
+    sources.find(function (s) { return s.default }) ||
+    sources[0]
+
+  tabsEl.querySelectorAll('.bgm-dock__tab').forEach(function (tab) {
+    tab.classList.toggle('is-active', tab.getAttribute('data-key') === initialSource.key)
+  })
+  pendingKey = initialSource.key
+  current = initialSource.key
+
+  renderState()
+
+  window.addEventListener('resize', function () {
+    var rect = root.getBoundingClientRect()
+    placeFab(rect.left, rect.top)
+    if (!opened) snapToEdge()
+  })
+})()
+
+