// ==UserScript==
// @name         雨课堂课件定时翻页
// @namespace    https://www.yuketang.cn/
// @version      1.0.0
// @description  在雨课堂课件页显示控制面板，按自定义时间自动上一页或下一页。
// @author       You
// @match        https://www.yuketang.cn/v2/web/studentCards/*/ppt*
// @match        https://www.yuketang.cn/v2/web/studentCards/*/ppt/*
// @grant        GM_getValue
// @grant        GM_setValue
// @run-at       document-idle
// @license MIT
// ==/UserScript==

(function () {
  'use strict';

  const STORAGE_KEY = 'yuketang-auto-page-settings-v1';
  const DEFAULTS = { interval: 3, action: 'next' };
  let timer = null;
  let count = 0;

  const readSettings = () => {
    try {
      return { ...DEFAULTS, ...GM_getValue(STORAGE_KEY, {}) };
    } catch (_) {
      return DEFAULTS;
    }
  };

  const saveSettings = (settings) => {
    try { GM_setValue(STORAGE_KEY, settings); } catch (_) { /* 油猴不可用时忽略保存 */ }
  };

  const settings = readSettings();
  const host = document.createElement('div');
  host.id = 'yt-auto-page-panel-host';
  const shadow = host.attachShadow({ mode: 'open' });
  document.documentElement.appendChild(host);

  shadow.innerHTML = `
    <style>
      :host { all: initial; }
      .panel { position: fixed; z-index: 2147483647; right: 22px; bottom: 22px; width: 250px; box-sizing: border-box; padding: 16px; border: 1px solid rgba(255,255,255,.22); border-radius: 14px; background: rgba(18, 24, 39, .96); box-shadow: 0 12px 36px rgba(0,0,0,.28); color: #eef4ff; font: 14px/1.4 -apple-system, BlinkMacSystemFont, "Microsoft YaHei", sans-serif; }
      .title { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; font-weight: 700; font-size: 15px; }
      .dot { width: 8px; height: 8px; border-radius: 50%; background: #8b95a7; }
      .dot.running { background: #35d07f; box-shadow: 0 0 0 4px rgba(53,208,127,.16); }
      label { display: block; margin: 10px 0 5px; color: #bdc8da; font-size: 12px; }
      input, select, button { box-sizing: border-box; font: inherit; }
      input, select { width: 100%; height: 34px; padding: 0 9px; border: 1px solid #46546e; border-radius: 7px; outline: none; background: #27334a; color: #fff; }
      input:focus, select:focus { border-color: #5b9cff; }
      .buttons { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 16px; }
      button { height: 35px; border: 0; border-radius: 7px; cursor: pointer; font-weight: 650; }
      #start { background: #4b8df8; color: #fff; }
      #start:hover { background: #3d7ee9; }
      #test { background: #34435d; color: #e7effe; }
      #test:hover { background: #40516e; }
      .status { min-height: 18px; margin-top: 11px; color: #b8c5da; font-size: 12px; }
      .hint { margin-top: 4px; color: #8190a9; font-size: 11px; }
    </style>
    <section class="panel" aria-label="雨课堂定时翻页控制面板">
      <div class="title"><span>雨课堂定时翻页</span><i id="dot" class="dot"></i></div>
      <label for="interval">翻页间隔（秒）</label>
      <input id="interval" type="number" min="1" max="3600" step="0.5" value="${settings.interval}">
      <label for="action">翻页动作</label>
      <select id="action">
        <option value="next" ${settings.action === 'next' ? 'selected' : ''}>下一页（→）</option>
        <option value="prev" ${settings.action === 'prev' ? 'selected' : ''}>上一页（←）</option>
      </select>
      <div class="buttons"><button id="start" type="button">开始</button><button id="test" type="button">测试翻页</button></div>
      <div id="status" class="status">尚未开始</div>
      <div class="hint">开始后将在每个间隔结束时翻一页。</div>
    </section>`;

  const $ = (selector) => shadow.querySelector(selector);
  const intervalInput = $('#interval');
  const actionSelect = $('#action');
  const startButton = $('#start');
  const testButton = $('#test');
  const status = $('#status');
  const dot = $('#dot');

  function currentSettings() {
    const interval = Number(intervalInput.value);
    return {
      interval: Number.isFinite(interval) && interval >= 1 ? interval : DEFAULTS.interval,
      action: actionSelect.value === 'prev' ? 'prev' : 'next',
    };
  }

  function sendKey(key) {
    // 雨课堂会监听 document 的方向键；同时发送 keydown/keyup 以兼容不同播放器版本。
    for (const type of ['keydown', 'keyup']) {
      document.dispatchEvent(new KeyboardEvent(type, {
        key,
        code: key === 'ArrowRight' ? 'ArrowRight' : 'ArrowLeft',
        keyCode: key === 'ArrowRight' ? 39 : 37,
        which: key === 'ArrowRight' ? 39 : 37,
        bubbles: true,
        cancelable: true,
      }));
    }
  }

  function turnPage() {
    const { action } = currentSettings();
    const selector = action === 'next' ? '.pswp__button--arrow--right' : '.pswp__button--arrow--left';
    const nativeButton = document.querySelector(selector);
    // 若图片播放器的原生按钮实际可见，优先点击；否则用方向键切换普通课件。
    if (nativeButton && nativeButton.getBoundingClientRect().width > 0) nativeButton.click();
    else sendKey(action === 'next' ? 'ArrowRight' : 'ArrowLeft');
    count += 1;
    status.textContent = `已执行 ${count} 次：${action === 'next' ? '下一页' : '上一页'}`;
  }

  function stop() {
    if (timer !== null) clearInterval(timer);
    timer = null;
    startButton.textContent = '开始';
    dot.classList.remove('running');
  }

  function start() {
    const config = currentSettings();
    intervalInput.value = config.interval;
    saveSettings(config);
    stop();
    count = 0;
    timer = setInterval(turnPage, config.interval * 1000);
    startButton.textContent = '停止';
    dot.classList.add('running');
    status.textContent = `运行中：每 ${config.interval} 秒${config.action === 'next' ? '下一页' : '上一页'}`;
  }

  startButton.addEventListener('click', () => timer === null ? start() : (stop(), status.textContent = '已停止'));
  testButton.addEventListener('click', () => { saveSettings(currentSettings()); turnPage(); });
  intervalInput.addEventListener('change', () => saveSettings(currentSettings()));
  actionSelect.addEventListener('change', () => saveSettings(currentSettings()));
  window.addEventListener('beforeunload', stop, { once: true });
})();