// ==UserScript==
// @name         哔哩哔哩-随机列表
// @namespace    http://tampermonkey.net/
// @version      1.0
// @description  为哔哩哔哩视频选集添加随机播放按钮，支持随机选择上一个/下一个视频
// @author       xujinkai
// @license      MIT
// @match        *://*.bilibili.com/video/*
// @icon         https://i0.hdslb.com/bfs/static/jinkela/long/images/favicon.ico
// @grant        none
// @downloadURL none
// ==/UserScript==

;(() => {
  //===========================================
  // 配置区域 - 可根据需要修改
  //===========================================

  // 键盘快捷键配置
  const KEY_CONFIG = {
    TOGGLE_RANDOM: "s", // 切换随机播放模式
    PLAY_RANDOM: "n", // 手动触发随机播放
    PREV_VIDEO: "[", // 上一个视频
    NEXT_VIDEO: "]", // 下一个视频
  }

  // 选择器配置
  const SELECTORS = {
    // 播放器相关
    VIDEO: [
      ".bilibili-player-video video", // 标准播放器
      ".bpx-player-video-wrap video", // 新版播放器
      "video", // 通用选择器
    ],
    // 控制区域
    CONTROL_AREAS: [".bilibili-player-video-control", ".bpx-player-control-wrap"],
    // 播放器区域
    PLAYER_AREAS: [".bilibili-player-video-wrap", ".bpx-player-video-area"],
    // 上一个/下一个按钮
    PREV_NEXT_BUTTONS: [
      // 旧版播放器
      ".bilibili-player-video-btn-prev",
      ".bilibili-player-video-btn-next",
      // 新版播放器
      ".bpx-player-ctrl-prev",
      ".bpx-player-ctrl-next",
    ],
    // 自动连播按钮
    AUTO_PLAY: ".auto-play",
    // 播放列表项
    PLAYLIST_ITEM: ".video-pod__item",
    // 活跃的播放列表项
    ACTIVE_PLAYLIST_ITEM: ".video-pod__item.active",
  }

  // 样式配置
  const STYLES = {
    BILIBILI_BLUE: "#00a1d6",
    BUTTON_MARGIN: "0 8px 0 0", // 按钮右侧间距
  }

  // 时间配置（毫秒）
  const TIMING = {
    BUTTON_CHECK_INTERVAL: 1000, // 按钮检查间隔
    INITIAL_DELAY: 1500, // 初始化延迟
    PLAY_RANDOM_DELAY: 500, // 随机播放延迟
    BUTTON_BIND_RETRY: 2000, // 按钮绑定重试延迟
  }

  //===========================================
  // 全局变量
  //===========================================

  let shuffleButtonAdded = false
  let buttonCheckInterval = null
  let isRandomPlayEnabled = false

  // 随机播放队列相关
  let originalPlaylist = [] // 原始播放列表
  let shuffledPlaylist = [] // 打乱后的播放列表
  let currentPlayIndex = -1 // 当前播放索引

  //===========================================
  // 主要功能实现
  //===========================================

  /**
   * 初始化脚本
   */
  function init() {
    // 添加键盘快捷键监听
    window.addEventListener("keydown", handleKeyDown)

    // 添加媒体按键监听
    setupMediaKeysListener()

    // 使用间隔检查按钮是否存在
    buttonCheckInterval = setInterval(checkAndAddButton, TIMING.BUTTON_CHECK_INTERVAL)

    // 初始尝试添加按钮
    setTimeout(checkAndAddButton, TIMING.INITIAL_DELAY)
  }

  /**
   * 检查并添加随机播放按钮
   */
  function checkAndAddButton() {
    // 检查是否已经添加了随机按钮，避免重复添加
    if (document.querySelector(".shuffle-btn")) {
      return
    }

    // 查找自动连播按钮容器
    const autoPlayContainer = document.querySelector(SELECTORS.AUTO_PLAY)
    if (autoPlayContainer) {
      createShuffleButton(autoPlayContainer)
      shuffleButtonAdded = true
      console.log("Bilibili Video Playlist Shuffler button added")

      // 成功添加按钮后清除检查间隔
      if (buttonCheckInterval) {
        clearInterval(buttonCheckInterval)
        buttonCheckInterval = null
      }

      // 设置视频播放结束监听
      setupVideoEndListener()

      // 设置上一个/下一个按钮监听
      setupPrevNextButtonsListener()

      // 初始化播放列表
      initializePlaylist()
    }
  }

  /**
   * 创建随机播放按钮
   * @param {HTMLElement} autoPlayContainer - 自动连播按钮容器
   */
  function createShuffleButton(autoPlayContainer) {
    // 克隆自动连播按钮作为模板
    const shuffleContainer = autoPlayContainer.cloneNode(true)
    shuffleContainer.className = "shuffle-btn auto-play" // 保持相同的样式类

    // 添加右侧间距
    shuffleContainer.style.margin = STYLES.BUTTON_MARGIN

    // 修改文本和图标
    const textElement = shuffleContainer.querySelector(".txt")
    if (textElement) {
      textElement.textContent = "随机播放"
    }

    // 替换图标为随机播放图标
    const iconElement = shuffleContainer.querySelector("svg")
    if (iconElement) {
      // 清除原有的路径
      while (iconElement.firstChild) {
        iconElement.removeChild(iconElement.firstChild)
      }

      // 添加随机图标的路径
      const iconPath = document.createElementNS("http://www.w3.org/2000/svg", "path")
      iconPath.setAttribute(
        "d",
        "M10.59 9.17L5.41 4 4 5.41l5.17 5.17 1.42-1.41zM14.5 4l2.04 2.04L4 18.59 5.41 20 17.96 7.46 20 9.5V4h-5.5zm0.33 9.41l-1.41 1.41 3.13 3.13L14.5 20H20v-5.5l-2.04 2.04-3.13-3.13z",
      )
      iconElement.appendChild(iconPath)
    }

    // 确保开关按钮的样式正确
    const switchElement = shuffleContainer.querySelector(".switch-btn")
    if (switchElement) {
      // 确保开关按钮初始状态为off
      switchElement.className = "switch-btn off"
    }

    // 移除原有的点击事件
    const newShuffleContainer = shuffleContainer.cloneNode(true)

    // 将随机按钮添加到自动连播按钮旁边
    const rightContainer = autoPlayContainer.closest(".right")
    if (rightContainer) {
      rightContainer.insertBefore(newShuffleContainer, autoPlayContainer)

      // 添加点击事件
      newShuffleContainer.addEventListener("click", toggleRandomPlay)
    }
  }

  /**
   * 初始化播放列表
   */
  function initializePlaylist() {
    // 获取所有播放列表项
    const playlistItems = Array.from(document.querySelectorAll(SELECTORS.PLAYLIST_ITEM))
    if (playlistItems.length <= 1) return

    // 保存原始播放列表
    originalPlaylist = playlistItems

    // 初始化打乱的播放列表（初始为空，会在开启随机播放时生成）
    shuffledPlaylist = []

    // 找到当前播放的视频索引
    const activeItem = document.querySelector(SELECTORS.ACTIVE_PLAYLIST_ITEM)
    currentPlayIndex = activeItem ? playlistItems.indexOf(activeItem) : 0

    console.log(`Playlist initialized with ${playlistItems.length} items, current index: ${currentPlayIndex}`)
  }

  /**
   * 生成随机播放队列
   */
  function generateShuffledPlaylist() {
    // 确保原始播放列表已初始化
    if (originalPlaylist.length === 0) {
      initializePlaylist()
      if (originalPlaylist.length === 0) return
    }

    // 创建索引数组
    const indices = Array.from({ length: originalPlaylist.length }, (_, i) => i)

    // 获取当前播放的视频索引
    const activeItem = document.querySelector(SELECTORS.ACTIVE_PLAYLIST_ITEM)
    const currentIndex = activeItem ? originalPlaylist.indexOf(activeItem) : -1

    // 从索引数组中移除当前播放的视频索引
    if (currentIndex !== -1) {
      indices.splice(indices.indexOf(currentIndex), 1)
    }

    // Fisher-Yates 洗牌算法打乱剩余索引
    for (let i = indices.length - 1; i > 0; i--) {
      const j = Math.floor(Math.random() * (i + 1))
      ;[indices[i], indices[j]] = [indices[j], indices[i]]
    }

    // 如果当前有播放的视频，将其放在队列最前面
    if (currentIndex !== -1) {
      indices.unshift(currentIndex)
    }

    // 保存打��后的播放列表
    shuffledPlaylist = indices.map((index) => originalPlaylist[index])
    currentPlayIndex = 0

    console.log("Shuffled playlist generated:", indices)
  }

  /**
   * 切换随机播放状态
   */
  function toggleRandomPlay() {
    isRandomPlayEnabled = !isRandomPlayEnabled

    // 更新按钮状态
    const shuffleBtn = document.querySelector(".shuffle-btn")
    if (shuffleBtn) {
      // 更新开关按钮的状态
      const switchElement = shuffleBtn.querySelector(".switch-btn")
      if (switchElement) {
        if (isRandomPlayEnabled) {
          switchElement.className = "switch-btn on"
          // 生成随机播放队列
          generateShuffledPlaylist()
        } else {
          switchElement.className = "switch-btn off"
          // 清空随机播放队列
          shuffledPlaylist = []
        }
      } else {
        // 如果没有开关元素，使用颜色来表示状态
        if (isRandomPlayEnabled) {
          shuffleBtn.style.color = STYLES.BILIBILI_BLUE
          // 生成随机播放队列
          generateShuffledPlaylist()
        } else {
          shuffleBtn.style.color = ""
          // 清空随机播放队列
          shuffledPlaylist = []
        }
      }
    }

    // 不再显示切换提示
    console.log(isRandomPlayEnabled ? "已开启随机播放模式" : "已关闭随机播放模式")
  }

  /**
   * 设置视频播放结束监听
   */
  function setupVideoEndListener() {
    // 监听视频元素变化
    const observer = new MutationObserver(() => {
      const video = findVideoElement()
      if (video && !video._hasEndedListener) {
        video._hasEndedListener = true

        // 监听视频结束事件
        video.addEventListener("ended", () => {
          console.log("Video ended, checking random play status")
          if (isRandomPlayEnabled) {
            setTimeout(playNextInQueue, TIMING.PLAY_RANDOM_DELAY)
          }
        })

        console.log("Video end listener added")
        observer.disconnect() // 找到并设置监听器后停止观察
      }
    })

    // 开始观察播放器区域
    const playerArea = findFirstElement(SELECTORS.PLAYER_AREAS) || document.body
    observer.observe(playerArea, { childList: true, subtree: true })
  }

  /**
   * 设置媒体按键监听
   */
  function setupMediaKeysListener() {
    // 尝试使用 MediaSession API
    if ("mediaSession" in navigator) {
      navigator.mediaSession.setActionHandler("previoustrack", () => {
        console.log("Media key: previous track")
        if (isRandomPlayEnabled) {
          playPrevInQueue()
          return
        }
      })

      navigator.mediaSession.setActionHandler("nexttrack", () => {
        console.log("Media key: next track")
        if (isRandomPlayEnabled) {
          playNextInQueue()
          return
        }
      })

      console.log("Media session handlers registered")
    }

    // 监听键盘媒体按键事件
    document.addEventListener(
      "keyup",
      (e) => {
        // 媒体按键通常会触发特殊的keyCode
        if (e.key === "MediaTrackPrevious" || e.key === "MediaTrackNext") {
          console.log(`Media key pressed: ${e.key}`)
          if (isRandomPlayEnabled) {
            e.preventDefault()
            e.stopPropagation()

            if (e.key === "MediaTrackPrevious") {
              playPrevInQueue()
            } else if (e.key === "MediaTrackNext") {
              playNextInQueue()
            }

            return false
          }
        }
      },
      true,
    ) // 使用捕获阶段
  }

  /**
   * 设置上一个/下一个按钮监听
   */
  function setupPrevNextButtonsListener() {
    // 监听按钮变化
    const observer = new MutationObserver(() => {
      // 遍历所有可能的按钮选择器
      SELECTORS.PREV_NEXT_BUTTONS.forEach((selector) => {
        const button = document.querySelector(selector)
        if (button && !button._hasRandomListener) {
          button._hasRandomListener = true

          // 保存原始的点击处理函数
          const originalClickHandler = button.onclick

          // 替换为我们的处理函数
          button.onclick = function (e) {
            if (isRandomPlayEnabled) {
              e.preventDefault()
              e.stopPropagation()

              // 根据按钮类型决定播放上一个还是下一个
              if (selector.includes("prev")) {
                playPrevInQueue()
              } else {
                playNextInQueue()
              }

              return false
            } else if (originalClickHandler) {
              return originalClickHandler.call(this, e)
            }
          }

          // 如果是div元素，还需要监听click事件
          if (button.tagName.toLowerCase() === "div") {
            button.addEventListener("click", (e) => {
              if (isRandomPlayEnabled) {
                e.preventDefault()
                e.stopPropagation()

                // 根据按钮类型决定播放上一个还是下一个
                if (selector.includes("prev")) {
                  playPrevInQueue()
                } else {
                  playNextInQueue()
                }

                return false
              }
            })
          }

          console.log(`Button listener added for ${selector}`)
        }
      })
    })

    // 观察播放器控制区域
    const controlAreas = findElements(SELECTORS.CONTROL_AREAS)

    controlAreas.forEach((area) => {
      if (area) observer.observe(area, { childList: true, subtree: true })
    })

    // 如果没有找到控制区域，观察整个播放器
    if (controlAreas.length === 0) {
      const playerArea = findFirstElement(SELECTORS.PLAYER_AREAS) || document.body
      observer.observe(playerArea, { childList: true, subtree: true })
    }

    // 直接尝试一次绑定
    setTimeout(() => {
      observer.disconnect()
      observer.observe(document.body, { childList: true, subtree: true })
    }, TIMING.BUTTON_BIND_RETRY)
  }

  /**
   * 播放队列中的下一个视频
   */
  function playNextInQueue() {
    if (!isRandomPlayEnabled || shuffledPlaylist.length === 0) {
      // 如果随机播放未启用或队列为空，则随机选择一个视频播放
      playRandomVideo()
      return
    }

    // 移动到下一个索引
    currentPlayIndex = (currentPlayIndex + 1) % shuffledPlaylist.length

    // 播放当前索引的视频
    const videoToPlay = shuffledPlaylist[currentPlayIndex]
    if (videoToPlay) {
      playVideo(videoToPlay)
    } else {
      // 如果出现问题，重新生成队列并播放
      generateShuffledPlaylist()
      playNextInQueue()
    }
  }

  /**
   * 播放队列中的上一个视频
   */
  function playPrevInQueue() {
    if (!isRandomPlayEnabled || shuffledPlaylist.length === 0) {
      // 如果随机播放未启用或队列为空，则随机选择一个视频播放
      playRandomVideo()
      return
    }

    // 移动到上一个索引
    currentPlayIndex = (currentPlayIndex - 1 + shuffledPlaylist.length) % shuffledPlaylist.length

    // 播放当前索引的视频
    const videoToPlay = shuffledPlaylist[currentPlayIndex]
    if (videoToPlay) {
      playVideo(videoToPlay)
    } else {
      // 如果出现问题，重新生成队列并播放
      generateShuffledPlaylist()
      playPrevInQueue()
    }
  }

  /**
   * 随机播放一个视频（不使用队列，完全随机）
   */
  function playRandomVideo() {
    const playlistItems = Array.from(document.querySelectorAll(SELECTORS.PLAYLIST_ITEM))
    if (playlistItems.length <= 1) return

    // 获取当前活跃的视频
    const activeItem = document.querySelector(SELECTORS.ACTIVE_PLAYLIST_ITEM)
    const currentIndex = activeItem ? playlistItems.indexOf(activeItem) : -1

    // 随机选择一个不同的索引
    let randomIndex
    do {
      randomIndex = Math.floor(Math.random() * playlistItems.length)
    } while (randomIndex === currentIndex && playlistItems.length > 1)

    console.log(`Playing random video: ${randomIndex + 1}/${playlistItems.length}`)

    // 播放随机选择的视频
    playVideo(playlistItems[randomIndex])
  }

  /**
   * 播放指定的视频
   * @param {HTMLElement} videoElement - 要播放的视频元素
   */
  function playVideo(videoElement) {
    if (!videoElement) return

    // 尝试获取链接并导航
    const link = videoElement.querySelector("a")
    if (link && link.href) {
      console.log(`Navigating to: ${link.href}`)
      window.location.href = link.href
    } else {
      // 如果无法获取链接，尝试模拟点击
      console.log("Simulating click on playlist item")
      videoElement.click()
    }
  }

  /**
   * 播放上一个视频（如果随机模式开启则使用队列）
   */
  function playPrevVideo() {
    if (isRandomPlayEnabled) {
      playPrevInQueue()
    } else {
      // 尝试点击上一个按钮
      const prevButton = findFirstElement(SELECTORS.PREV_NEXT_BUTTONS.filter((s) => s.includes("prev")))
      if (prevButton) {
        prevButton.click()
      }
    }
  }

  /**
   * 播放下一个视频（如果随机模式开启则使用队列）
   */
  function playNextVideo() {
    if (isRandomPlayEnabled) {
      playNextInQueue()
    } else {
      // 尝试点击下一个按钮
      const nextButton = findFirstElement(SELECTORS.PREV_NEXT_BUTTONS.filter((s) => s.includes("next")))
      if (nextButton) {
        nextButton.click()
      }
    }
  }

  /**
   * 处理键盘快捷键
   * @param {KeyboardEvent} event - 键盘事件
   */
  function handleKeyDown(event) {
    // 忽略带有修饰键的按键
    if (event.ctrlKey || event.altKey || event.metaKey) {
      return
    }

    const key = event.key.toLowerCase()

    // 根据按键执行相应操作
    switch (key) {
      case KEY_CONFIG.TOGGLE_RANDOM:
        // 切换随机播放模式
        const shuffleBtn = document.querySelector(".shuffle-btn")
        if (shuffleBtn) {
          shuffleBtn.click()
        }
        break

      case KEY_CONFIG.PLAY_RANDOM:
        // 手动触发随机播放
        if (isRandomPlayEnabled) {
          playNextInQueue()
        }
        break

      case KEY_CONFIG.PREV_VIDEO:
        // 播放上一个视频
        playPrevVideo()
        break

      case KEY_CONFIG.NEXT_VIDEO:
        // 播放下一个视频
        playNextVideo()
        break
    }
  }

  //===========================================
  // 辅助函数
  //===========================================

  /**
   * 查找视频元素
   * @returns {HTMLElement|null} 找到的视频元素或null
   */
  function findVideoElement() {
    return findFirstElement(SELECTORS.VIDEO)
  }

  /**
   * 从选择器数组中查找第一个匹配的元素
   * @param {string[]} selectors - 选择器数组
   * @returns {HTMLElement|null} 找到的元素或null
   */
  function findFirstElement(selectors) {
    for (const selector of selectors) {
      const element = document.querySelector(selector)
      if (element) return element
    }
    return null
  }

  /**
   * 从选择器数组中查找所有匹配的元素
   * @param {string[]} selectors - 选择器数组
   * @returns {HTMLElement[]} 找到的元素数组
   */
  function findElements(selectors) {
    const elements = []
    for (const selector of selectors) {
      const found = document.querySelector(selector)
      if (found) elements.push(found)
    }
    return elements
  }

  /**
   * 显示提示信息
   * @param {string} message - 要显示的消息
   */
  function showNotification(message) {
    // 检查是否已存在通知，如果存在则移除
    const existingNotification = document.querySelector(".shuffle-notification")
    if (existingNotification) {
      document.body.removeChild(existingNotification)
    }

    const notification = document.createElement("div")
    notification.className = "shuffle-notification"
    notification.textContent = message
    notification.style.position = "fixed"
    notification.style.top = "50%"
    notification.style.left = "50%"
    notification.style.transform = "translate(-50%, -50%)"
    notification.style.padding = "10px 20px"
    notification.style.backgroundColor = "rgba(0, 0, 0, 0.7)"
    notification.style.color = "white"
    notification.style.borderRadius = "4px"
    notification.style.zIndex = "9999"

    document.body.appendChild(notification)

    // 淡出动画
    setTimeout(() => {
      notification.style.transition = "opacity 1s ease"
      notification.style.opacity = "0"
      setTimeout(() => {
        if (document.body.contains(notification)) {
          document.body.removeChild(notification)
        }
      }, 1000)
    }, 1500)
  }

  //===========================================
  // 初始化
  //===========================================

  // 页面加载完成后初始化
  if (document.readyState === "complete") {
    init()
  } else {
    window.addEventListener("load", init)
  }
})()