NOW PLAYING
等待识别当前课件
课程播放器已就绪
待机
00:00
00:00
提示：首次自动播放可能受浏览器权限限制。若被拦截，请手动播放一次。
COURSE CONTENTS
课件队列
点击条目可切换到对应课件
LOCAL RECORDS
本地学习记录
仅保存在当前浏览器，不会向课程平台伪造数据
ACTIVITY LOG
运行日志
播放、切换与异常信息
PREFERENCES
播放设置
设置会自动保存在当前浏览器
高倍速可能不被网站播放器支持，也可能影响页面自身的进度判定。设置仅控制本地播放器行为。
`;
document.body.appendChild(panel);
const dock = document.createElement('button');
dock.id = DOCK_ID;
dock.type = 'button';
dock.textContent = 'CP';
dock.title = '打开课程播放器';
document.body.appendChild(dock);
panel.addEventListener('click', event => {
const tabButton = event.target.closest('[data-tab]');
if (tabButton) setTab(tabButton.dataset.tab);
});
$('#cp-collapse', panel).addEventListener('click', () => {
state.collapsed = !state.collapsed;
panel.classList.toggle('collapsed', state.collapsed);
$('#cp-collapse', panel).textContent = state.collapsed ? '+' : '−';
});
$('#cp-hide', panel).addEventListener('click', () => {
state.hidden = true;
panel.style.display = 'none';
dock.style.display = 'block';
});
dock.addEventListener('click', () => {
state.hidden = false;
panel.style.display = 'block';
dock.style.display = 'none';
});
$('#cp-play', panel).addEventListener('click', togglePlayback);
$('#cp-prev', panel).addEventListener('click', () => navigateRow(-1));
$('#cp-next', panel).addEventListener('click', () => navigateRow(1));
$('#cp-speed-select', panel).addEventListener('change', event => setSpeed(Number(event.target.value)));
$('#cp-auto', panel).addEventListener('click', toggleAutoContinue);
$('#cp-list', panel).addEventListener('click', () => setTab('queue'));
$('#cp-seek', panel).addEventListener('input', onSeekInput);
$('#cp-seek', panel).addEventListener('change', onSeekChange);
$('#cp-timer-toggle', panel).addEventListener('click', toggleTimer);
$('#cp-mark', panel).addEventListener('click', markCurrentComplete);
$('#cp-clear-logs', panel).addEventListener('click', () => { state.logs = []; renderLogs(); });
$('#cp-reset', panel).addEventListener('click', resetSettings);
renderSettings();
renderPanel();
makeDraggable(panel, $('#cp-drag', panel));
}
function makeDraggable(panel, handle) {
let dragging = false;
let startX = 0, startY = 0, startLeft = 0, startTop = 0;
handle.addEventListener('pointerdown', event => {
if (event.target.closest('button')) return;
const rect = panel.getBoundingClientRect();
dragging = true;
startX = event.clientX; startY = event.clientY;
startLeft = rect.left; startTop = rect.top;
handle.setPointerCapture?.(event.pointerId);
});
handle.addEventListener('pointermove', event => {
if (!dragging) return;
const left = Math.max(0, Math.min(window.innerWidth - panel.offsetWidth, startLeft + event.clientX - startX));
const top = Math.max(0, Math.min(window.innerHeight - 45, startTop + event.clientY - startY));
panel.style.left = `${left}px`; panel.style.top = `${top}px`; panel.style.right = 'auto';
});
const stop = () => { dragging = false; };
handle.addEventListener('pointerup', stop);
handle.addEventListener('pointercancel', stop);
}
function setTab(tab) {
state.tab = tab;
$$('.cp-tab', $('#' + PANEL_ID)).forEach(button => button.classList.toggle('active', button.dataset.tab === tab));
$$('.cp-pane', $('#' + PANEL_ID)).forEach(pane => pane.classList.toggle('active', pane.dataset.pane === tab));
if (tab === 'queue') renderQueue();
if (tab === 'records') renderRecords();
if (tab === 'logs') renderLogs();
}
function getRows() {
let rows = $$('.courseware-row').filter(row => row.querySelector('.courseware-name'));
if (!rows.length) rows = $$('.third-level-box');
if (!rows.length) rows = $$('#chapters-list li').filter(row => /item\s+ref_\d+/.test(row.className));
return [...new Set(rows)].filter(row => !row.closest(`#${PANEL_ID}`));
}
function getRowName(row) {
return row?.querySelector('.courseware-name, .file-name, .title, .name')?.textContent?.trim()
|| row?.getAttribute('title')?.trim()
|| row?.textContent?.trim().replace(/\s+/g, ' ').slice(0, 100)
|| '未命名课件';
}
function getRowType(row) {
const icon = row?.querySelector('.file-icon, [class*="icon"], [class*="type"]');
const value = `${icon?.textContent || ''} ${icon?.className || ''} ${row?.className || ''}`.trim();
if (/video|视频|mp4/i.test(value)) return '视频';
if (/ppt|pdf|文档|图书|图片|课件/i.test(value)) return '课件';
if (/测验|考试|作业|讨论/i.test(getRowName(row))) return '测验/作业';
return '课程内容';
}
function getRowKey(row) {
return `${state.rows.indexOf(row)}:${getRowName(row)}`;
}
function getActiveRow() {
const rows = state.rows.length ? state.rows : getRows();
return rows.find(row => row.classList.contains('active') || row.classList.contains('current') || row.classList.contains('is-active') || row.getAttribute('aria-current') === 'true') || null;
}
function getVideoElement() {
return $('video');
}
function getVideoSource(video) {
if (!video) return '';
return video.currentSrc || video.src || $('source', video)?.src || '';
}
function setNotice(message) {
const notice = $('#cp-notice');
if (notice) notice.textContent = message;
}
function getVisiblePlayButton() {
const selectors = [
'.video-overlay .play-btn',
'.dplayer-play-icon',
'.dplayer-video-wrap .dplayer-play-icon',
'.xgplayer-start',
'.xgplayer-icon-play',
'button[aria-label*="播放"]',
'button[title*="播放"]'
];
for (const selector of selectors) {
const button = $(selector);
if (!button || button.closest(`#${PANEL_ID}`)) continue;
const style = getComputedStyle(button);
const rect = button.getBoundingClientRect();
if (style.display !== 'none' && style.visibility !== 'hidden' && rect.width > 2 && rect.height > 2) return button;
}
return null;
}
function attachVideo(video) {
if (video === state.video) return;
if (state.video) {
state.video.removeEventListener('timeupdate', onVideoUpdate);
state.video.removeEventListener('durationchange', onVideoUpdate);
state.video.removeEventListener('loadedmetadata', onVideoReady);
state.video.removeEventListener('canplay', onVideoReady);
state.video.removeEventListener('play', onVideoUpdate);
state.video.removeEventListener('pause', onVideoUpdate);
state.video.removeEventListener('ended', onVideoEnded);
}
if (state.pauseRecoveryTimer) clearInterval(state.pauseRecoveryTimer);
state.pauseRecoveryTimer = null;
state.video = video || null;
state.activeMediaSource = getVideoSource(video);
if (state.video) {
try { state.video.playbackRate = state.settings.speed; } catch (_) {}
state.video.addEventListener('timeupdate', onVideoUpdate);
state.video.addEventListener('durationchange', onVideoUpdate);
state.video.addEventListener('loadedmetadata', onVideoReady);
state.video.addEventListener('canplay', onVideoReady);
state.video.addEventListener('play', onVideoUpdate);
state.video.addEventListener('pause', onVideoUpdate);
state.video.addEventListener('ended', onVideoEnded);
if (state.settings.pauseRecovery) startPauseRecovery();
}
renderVideo();
}
function onVideoUpdate() { renderVideo(); }
function onVideoReady() {
try { if (state.video) state.video.playbackRate = state.settings.speed; } catch (_) {}
renderVideo();
}
function startPauseRecovery() {
if (state.pauseRecoveryTimer) clearInterval(state.pauseRecoveryTimer);
state.pauseRecoveryTimer = setInterval(() => {
const video = state.video;
if (!state.settings.pauseRecovery || !state.settings.autoContinue || !video || video.ended || !video.paused) return;
if (video.readyState >= 2) video.play().catch(() => {});
}, 2500);
}
function markRowComplete(row, method = 'video-ended') {
if (!row || !state.record) return;
const key = getRowKey(row);
state.record.completed[key] = { name: getRowName(row), at: Date.now(), method };
state.record.lastItem = getRowName(row);
saveRecord();
renderRecords();
renderQueue();
}
function onVideoEnded() {
const row = state.activeRow || getActiveRow();
log('success', `视频播放结束：${row ? getRowName(row) : '当前视频'}`);
if (row) markRowComplete(row, 'video-ended');
if (state.settings.autoContinue) advanceToNextVideo();
}
async function startCurrentVideo(fromUserAction = false) {
const token = ++state.playAttemptToken;
let video = getVideoElement();
if (!video) {
setNotice('当前课件未检测到可控制的视频');
return false;
}
attachVideo(video);
try { video.playbackRate = state.settings.speed; } catch (_) {}
if (!video.paused && !video.ended) {
setNotice(`正在播放 · ${state.settings.speed}×`);
return true;
}
if (video.ended) {
try { video.currentTime = 0; } catch (_) {}
}
if (video.readyState < 2) {
await new Promise(resolve => {
let finished = false;
const done = () => {
if (finished) return;
finished = true;
video.removeEventListener('canplay', done);
video.removeEventListener('loadeddata', done);
resolve();
};
video.addEventListener('canplay', done, { once: true });
video.addEventListener('loadeddata', done, { once: true });
setTimeout(done, 6000);
});
}
if (token !== state.playAttemptToken) return false;
try {
video.playbackRate = state.settings.speed;
await video.play();
if (!video.paused) {
setNotice(`播放中 · ${state.settings.speed}×`);
log('success', `已启动视频，倍速 ${state.settings.speed}×`);
renderVideo();
return true;
}
} catch (error) {
// 若站点播放器必须通过自己的封面按钮启动，只尝试点击一次，避免双击后反向暂停。
const playButton = getVisiblePlayButton();
if (playButton) {
try {
playButton.click();
await wait(700);
video = getVideoElement() || video;
attachVideo(video);
if (!video.paused) {
try { video.playbackRate = state.settings.speed; } catch (_) {}
setNotice(`已通过网页播放器启动 · ${state.settings.speed}×`);
log('success', '已通过网页播放器启动视频');
return true;
}
} catch (_) {}
}
const reason = error?.name === 'NotAllowedError'
? '浏览器阻止了自动播放，请先手动点击网页播放器一次'
: error?.name === 'NotSupportedError'
? '视频资源暂不可播放，等待页面加载后重试'
: '播放器未能启动，请检查网页播放器状态';
setNotice(reason);
if (!fromUserAction) log('warn', reason);
else log('warn', `播放失败：${reason}`);
return false;
}
setNotice('播放器没有确认开始播放');
return false;
}
async function togglePlayback() {
const video = getVideoElement();
if (!video) { setNotice('当前页面没有检测到视频'); return; }
attachVideo(video);
if (video.paused || video.ended) await startCurrentVideo(true);
else {
video.pause();
setNotice('已暂停');
log('info', '用户暂停播放');
}
renderVideo();
}
function setSpeed(speed) {
if (!SPEEDS.includes(speed)) return;
state.settings.speed = speed;
if (state.settings.rememberSpeed) saveSettings();
const video = getVideoElement();
if (video) {
try { video.playbackRate = speed; } catch (_) {}
}
const select = $('#cp-speed-select');
if (select) select.value = String(speed);
setNotice(video ? `播放倍速已设为 ${speed}×` : `已保存 ${speed}×，下个视频加载后应用`);
log('info', `播放倍速设置为 ${speed}×`);
}
async function toggleAutoContinue() {
state.settings.autoContinue = !state.settings.autoContinue;
saveSettings();
renderAutoState();
if (state.settings.autoContinue) {
log('info', '自动连播已开启');
setNotice('自动连播已开启，尝试启动当前视频');
const ok = await startCurrentVideo(true);
if (!ok) setNotice('自动连播已开启；如浏览器拦截，请手动播放当前视频一次');
} else {
state.advanceToken++;
log('info', '自动连播已关闭');
setNotice('自动连播已关闭');
}
}
function renderAutoState() {
const button = $('#cp-auto');
if (!button) return;
button.classList.toggle('active', state.settings.autoContinue);
button.setAttribute('aria-pressed', String(state.settings.autoContinue));
button.textContent = `自动连播：${state.settings.autoContinue ? '开' : '关'}`;
}
function isAssessmentRow(row) {
return /测验|作业|考试|讨论|章节测试|随堂测验/.test(`${getRowName(row)} ${getRowType(row)}`);
}
function isLikelyNonVideo(row) {
const text = `${getRowName(row)} ${getRowType(row)} ${row?.className || ''}`;
return /ppt|pdf|文档|图书|阅读|图片|附件|课件/.test(text) && !/视频|video|mp4/i.test(text);
}
async function waitForTargetVideo(targetRow, previousVideo, previousSource, token, timeout = 14000) {
const start = Date.now();
let stableReadyAt = 0;
while (Date.now() - start < timeout) {
if (!state.settings.autoContinue || token !== state.advanceToken) return null;
await wait(250);
const active = getActiveRow();
const activeOk = !active || active === targetRow;
const video = getVideoElement();
const source = getVideoSource(video);
const changed = !!video && (video !== previousVideo || (!!source && source !== previousSource));
const ready = !!video && video.readyState >= 2 && (!Number.isFinite(video.duration) || video.duration > 0);
if (activeOk && ready && (changed || Date.now() - start > 1800)) {
if (!stableReadyAt) stableReadyAt = Date.now();
if (Date.now() - stableReadyAt > 500) return video;
} else stableReadyAt = 0;
}
return null;
}
async function advanceToNextVideo() {
if (!state.settings.autoContinue || state.advancing) return;
state.advancing = true;
const token = ++state.advanceToken;
try {
state.rows = getRows();
const rows = state.rows;
const current = getActiveRow() || state.activeRow;
const currentIndex = rows.indexOf(current);
const previousVideo = getVideoElement();
const previousSource = getVideoSource(previousVideo);
for (let index = Math.max(-1, currentIndex) + 1; index < rows.length; index++) {
if (!state.settings.autoContinue || token !== state.advanceToken) return;
const row = rows[index];
if (state.settings.skipAssessments && isAssessmentRow(row)) {
log('info', `未自动进入测验/作业：${getRowName(row)}`);
continue;
}
if (state.settings.skipNonVideo && isLikelyNonVideo(row)) {
log('info', `连播略过非视频课件：${getRowName(row)}`);
continue;
}
setNotice(`正在切换：${getRowName(row)}`);
log('info', `切换到下一项：${getRowName(row)}`);
row.scrollIntoView({ behavior: 'smooth', block: 'center' });
row.click();
const candidate = await waitForTargetVideo(row, previousVideo, previousSource, token, 12000);
if (!state.settings.autoContinue || token !== state.advanceToken) return;
if (!candidate) {
log('warn', `该项未检测到可播放视频，继续查找：${getRowName(row)}`);
continue;
}
state.rows = getRows();
state.activeRow = getActiveRow() || row;
attachVideo(candidate);
renderPanel();
// 只调用一次启动流程；启动失败时不伪报成功，也不重复点击播放按钮。
const started = await startCurrentVideo(false);
if (started) {
setNotice(`已切换并开始播放：${getRowName(state.activeRow)}`);
log('success', `已开始下一节：${getRowName(state.activeRow)}`);
} else {
setNotice(`已切换到「${getRowName(state.activeRow)}」，但浏览器未允许自动播放`);
}
return;
}
if (state.settings.autoContinue && token === state.advanceToken) {
setNotice('后面没有检测到可自动连播的视频');
log('info', '当前目录中没有更多可连播的视频');
}
} finally {
state.advancing = false;
}
}
async function selectRow(row, autoPlay = true) {
if (!row) return;
row.scrollIntoView({ behavior: 'smooth', block: 'center' });
row.click();
state.activeRow = row;
renderQueue();
setNotice(`已选择：${getRowName(row)}`);
await wait(700);
refreshPageData();
if (autoPlay && state.settings.autoContinue && state.settings.autoPlayOnSwitch) {
await wait(500);
const ok = await startCurrentVideo(false);
if (!ok) setNotice('课件已切换；播放器尚未就绪或自动播放被拦截');
}
}
async function navigateRow(offset) {
state.rows = getRows();
const index = state.rows.indexOf(state.activeRow || getActiveRow());
const next = Math.max(0, Math.min(state.rows.length - 1, (index < 0 ? (offset > 0 ? -1 : state.rows.length) : index) + offset));
const row = state.rows[next];
if (!row) { setNotice('没有可切换的课件'); return; }
await selectRow(row, true);
}
function renderQueue() {
const container = $('#cp-queue');
if (!container) return;
state.rows = getRows();
if (!state.rows.length) {
container.innerHTML = '