// ==UserScript== // @name 文理文理 // @namespace http://tampermonkey.net/ // @version 3.1 // @description 紧凑型赛博机械风格的可拖动视频控制面板，支持自定义倍速、自动跳转和可缩小功能 // @author YourName // @match *://*.ytccr.com/* // @grant GM_addStyle // @grant GM_setValue // @grant GM_getValue // @grant GM_registerMenuCommand // @require https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/js/all.min.js // @resource cyberFont https://fonts.googleapis.com/css2?family=Orbitron:wght@400;500;700&family=Rajdhani:wght@400;500;700&display=swap // ==/UserScript== (function() { 'use strict'; // 添加谷歌字体 const fontLink = document.createElement('link'); fontLink.rel = 'stylesheet'; fontLink.href = 'https://fonts.googleapis.com/css2?family=Orbitron:wght@400;500;700&family=Rajdhani:wght@400;500;700&display=swap'; document.head.appendChild(fontLink); // 添加 CSS 样式 GM_addStyle(` .cyber-control-panel { position: fixed; top: 120px; right: 20px; background: linear-gradient(145deg, rgba(15, 20, 40, 0.95), rgba(10, 15, 35, 0.95)); border-radius: 12px; padding: 15px; box-shadow: 0 0 15px rgba(0, 150, 255, 0.6), inset 0 0 10px rgba(0, 100, 255, 0.4); z-index: 10000; width: 280px; border: 1px solid rgba(0, 200, 255, 0.5); transition: all 0.3s ease; cursor: move; user-select: none; font-family: 'Orbitron', 'Rajdhani', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; } .cyber-control-panel.minimized { width: 45px; height: 45px; padding: 0; overflow: hidden; } .cyber-border { position: absolute; pointer-events: none; } .cyber-border-top { top: 0; left: 8px; right: 8px; height: 2px; background: linear-gradient(90deg, transparent, #00ccff, transparent); box-shadow: 0 0 8px #00ccff; } .cyber-border-bottom { bottom: 0; left: 8px; right: 8px; height: 2px; background: linear-gradient(90deg, transparent, #00ccff, transparent); box-shadow: 0 0 8px #00ccff; } .cyber-border-left { left: 0; top: 8px; bottom: 8px; width: 2px; background: linear-gradient(transparent, #00ccff, transparent); box-shadow: 0 0 8px #00ccff; } .cyber-border-right { right: 0; top: 8px; bottom: 8px; width: 2px; background: linear-gradient(transparent, #00ccff, transparent); box-shadow: 0 0 8px #00ccff; } .corner { position: absolute; width: 12px; height: 12px; border: 2px solid #00ccff; box-shadow: 0 0 6px #00ccff; pointer-events: none; } .corner-tl { top: 0; left: 0; border-right: none; border-bottom: none; border-top-left-radius: 4px; } .corner-tr { top: 0; right: 0; border-left: none; border-bottom: none; border-top-right-radius: 4px; } .corner-bl { bottom: 0; left: 0; border-right: none; border-top: none; border-bottom-left-radius: 4px; } .corner-br { bottom: 0; right: 0; border-left: none; border-top: none; border-bottom-right-radius: 4px; } .panel-title { font-size: 1.2rem; margin-bottom: 12px; color: #00ccff; text-align: center; display: flex; align-items: center; justify-content: center; gap: 8px; text-shadow: 0 0 6px rgba(0, 200, 255, 0.5); padding: 8px; background: rgba(0, 30, 60, 0.4); border-radius: 6px; border: 1px solid rgba(0, 150, 255, 0.3); } .status-indicator { display: flex; align-items: center; justify-content: center; margin-bottom: 15px; padding: 6px; background: rgba(0, 20, 40, 0.5); border-radius: 6px; border: 1px solid rgba(0, 150, 255, 0.3); } .status-light { width: 12px; height: 12px; border-radius: 50%; background: #ff4b4b; margin-right: 8px; box-shadow: 0 0 8px #ff4b4b; } .status-light.active { background: #00ff95; box-shadow: 0 0 8px #00ff95; } .status-text { font-size: 0.95rem; font-weight: 500; color: #a0f0ff; } .action-buttons { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-bottom: 12px; } .cyber-btn { padding: 10px 15px; font-size: 0.9rem; border: none; border-radius: 6px; cursor: pointer; transition: all 0.3s ease; background: linear-gradient(145deg, rgba(0, 100, 255, 0.7), rgba(0, 150, 255, 0.7)); color: #ffffff; font-weight: bold; box-shadow: 0 3px 8px rgba(0, 50, 150, 0.4); display: flex; align-items: center; justify-content: center; gap: 6px; flex: 1; min-width: 100px; font-family: 'Rajdhani', sans-serif; letter-spacing: 0.5px; position: relative; overflow: hidden; border: 1px solid rgba(0, 200, 255, 0.4); } .cyber-btn::before { content: ''; position: absolute; top: 0; left: -100%; width: 100%; height: 100%; background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent); transition: 0.5s; } .cyber-btn:hover::before { left: 100%; } .cyber-btn:hover { transform: translateY(-3px); box-shadow: 0 5px 12px rgba(0, 100, 255, 0.6); background: linear-gradient(145deg, rgba(0, 120, 255, 0.8), rgba(0, 180, 255, 0.8)); } .cyber-btn:active { transform: translateY(1px); } .btn-stop { background: linear-gradient(145deg, rgba(255, 50, 100, 0.7), rgba(255, 80, 80, 0.7)); } .btn-stop:hover { background: linear-gradient(145deg, rgba(255, 70, 120, 0.8), rgba(255, 100, 100, 0.8)); } .btn-auto-jump { background: linear-gradient(145deg, rgba(0, 200, 150, 0.7), rgba(0, 220, 180, 0.7)); } .btn-auto-jump:hover { background: linear-gradient(145deg, rgba(0, 220, 170, 0.8), rgba(0, 240, 200, 0.8)); } .speed-control, .auto-jump-control { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; padding: 8px; background: rgba(0, 20, 40, 0.5); border-radius: 6px; border: 1px solid rgba(0, 150, 255, 0.3); } .cyber-input { flex: 1; padding: 8px; border-radius: 4px; border: 1px solid #00aaff; background: rgba(0, 10, 30, 0.7); color: #00ffcc; text-align: center; font-size: 0.95rem; font-weight: bold; box-shadow: inset 0 0 8px rgba(0, 50, 100, 0.5); } .cyber-input:focus { outline: none; border-color: #00ffff; box-shadow: 0 0 8px rgba(0, 200, 255, 0.5); } .speed-label, .auto-jump-label { color: #00ccff; font-weight: bold; min-width: 70px; font-size: 0.95rem; text-shadow: 0 0 4px rgba(0, 200, 255, 0.5); } .minimize-btn { position: absolute; top: 6px; right: 6px; width: 26px; height: 26px; border-radius: 50%; background: linear-gradient(145deg, rgba(0, 100, 255, 0.7), rgba(0, 150, 255, 0.7)); color: #ffffff; display: flex; align-items: center; justify-content: center; font-size: 16px; font-weight: bold; cursor: pointer; z-index: 1001; border: 1px solid rgba(0, 200, 255, 0.5); box-shadow: 0 0 6px rgba(0, 100, 255, 0.5); transition: all 0.3s ease; } .minimize-btn:hover { background: linear-gradient(145deg, rgba(0, 150, 255, 0.8), rgba(0, 200, 255, 0.8)); transform: scale(1.1); box-shadow: 0 0 10px rgba(0, 150, 255, 0.7); } .minimized-icon { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-size: 1.5rem; color: #00ccff; text-shadow: 0 0 8px rgba(0, 200, 255, 0.7); } .drag-handle { cursor: move; } `); // 创建控制面板 HTML const controlPanelHTML = `

佛山顺德贤成教育

运行中

播放速度:

自动跳转:

`; // 插入到页面 document.body.insertAdjacentHTML('afterbegin', controlPanelHTML); // 存储当前状态 let isSpeedUpEnabled = false; let isAutoJumpEnabled = false; let isMinimized = false; let targetSpeed = GM_getValue('targetSpeed', 2.0); let autoJumpInterval = GM_getValue('autoJumpInterval', 30); let autoJumpTimer = null; let isDragging = false; let dragStartX, dragStartY, panelStartX, panelStartY; // 初始化输入框值 document.getElementById('speed-input').value = targetSpeed; document.getElementById('auto-jump-input').value = autoJumpInterval; // 获取所有视频元素 function getAllVideos() { return document.querySelectorAll('video'); } // 应用速度到所有视频 function applySpeedToVideos(speed) { const videos = getAllVideos(); videos.forEach(video => { try { video.playbackRate = speed; } catch (e) { console.log('设置播放速度失败:', e); } }); } // 跳至视频结尾 function jumpToEnd() { const videos = getAllVideos(); videos.forEach(video => { if (!isNaN(video.duration)) { video.currentTime = video.duration - 0.5; } }); } // 开始/停止自动跳转 function toggleAutoJump(enable) { if (enable) { // 停止现有定时器 if (autoJumpTimer) clearInterval(autoJumpTimer); // 设置新定时器 autoJumpTimer = setInterval(() => { jumpToEnd(); console.log(`自动跳转至结尾 (间隔: ${autoJumpInterval}秒)`); }, autoJumpInterval * 1000); // 立即执行一次 jumpToEnd(); // 更新UI document.getElementById('toggle-auto-jump').textContent = '关闭'; document.getElementById('toggle-auto-jump').classList.add('btn-stop'); document.getElementById('toggle-auto-jump').classList.remove('btn-auto-jump'); } else { // 停止定时器 if (autoJumpTimer) clearInterval(autoJumpTimer); autoJumpTimer = null; // 更新UI document.getElementById('toggle-auto-jump').textContent = '开启'; document.getElementById('toggle-auto-jump').classList.add('btn-auto-jump'); document.getElementById('toggle-auto-jump').classList.remove('btn-stop'); } } // 切换面板大小 function toggleMinimize() { const panel = document.querySelector('.cyber-control-panel'); const minimizeBtn = document.getElementById('minimize-btn'); isMinimized = !isMinimized; if (isMinimized) { panel.classList.add('minimized'); minimizeBtn.textContent = "+"; minimizeBtn.title = "展开面板"; } else { panel.classList.remove('minimized'); minimizeBtn.textContent = "−"; minimizeBtn.title = "缩小面板"; } } // 面板拖动功能 const panelHeader = document.getElementById('panel-header'); const controlPanel = document.querySelector('.cyber-control-panel'); panelHeader.addEventListener('mousedown', startDrag); function startDrag(e) { if (isMinimized) return; isDragging = true; dragStartX = e.clientX; dragStartY = e.clientY; const panelRect = controlPanel.getBoundingClientRect(); panelStartX = panelRect.left; panelStartY = panelRect.top; controlPanel.style.zIndex = '10001'; document.addEventListener('mousemove', dragPanel); document.addEventListener('mouseup', stopDrag); } function dragPanel(e) { if (!isDragging) return; const deltaX = e.clientX - dragStartX; const deltaY = e.clientY - dragStartY; const newX = panelStartX + deltaX; const newY = panelStartY + deltaY; // 限制在视窗范围内 const maxX = window.innerWidth - controlPanel.offsetWidth; const maxY = window.innerHeight - controlPanel.offsetHeight; controlPanel.style.left = `${Math.max(0, Math.min(maxX, newX))}px`; controlPanel.style.top = `${Math.max(0, Math.min(maxY, newY))}px`; controlPanel.style.right = 'auto'; } function stopDrag() { isDragging = false; document.removeEventListener('mousemove', dragPanel); document.removeEventListener('mouseup', stopDrag); } // 监听DOM变化（动态加载的视频） const observer = new MutationObserver((mutations) => { mutations.forEach(mutation => { if (mutation.addedNodes.length) { if (isSpeedUpEnabled) { applySpeedToVideos(targetSpeed); } } }); }); // 开始监听整个文档 observer.observe(document, { childList: true, subtree: true }); // 应用自定义速度 document.getElementById('apply-speed').addEventListener('click', () => { const newSpeed = parseFloat(document.getElementById('speed-input').value); if (!isNaN(newSpeed)) { targetSpeed = Math.max(0.1, Math.min(16, newSpeed)); document.getElementById('speed-input').value = targetSpeed.toFixed(1); GM_setValue('targetSpeed', targetSpeed); if (isSpeedUpEnabled) { applySpeedToVideos(targetSpeed); } alert(`已设置播放速度为 ${targetSpeed}x`); } else { alert('请输入有效的数字'); } }); // 切换自动跳转 document.getElementById('toggle-auto-jump').addEventListener('click', () => { const newInterval = parseInt(document.getElementById('auto-jump-input').value); if (!isNaN(newInterval) && newInterval >= 5 && newInterval <= 300) { autoJumpInterval = newInterval; GM_setValue('autoJumpInterval', autoJumpInterval); isAutoJumpEnabled = !isAutoJumpEnabled; toggleAutoJump(isAutoJumpEnabled); alert(isAutoJumpEnabled ? `已开启自动跳转 (每 ${autoJumpInterval} 秒)` : '已关闭自动跳转'); } else { alert('请输入5-300之间的整数'); } }); // 加速按钮 document.getElementById('speed-up').addEventListener('click', () => { isSpeedUpEnabled = true; applySpeedToVideos(targetSpeed); document.querySelector('.status-light').classList.add('active'); document.querySelector('.status-text').textContent = '加速中'; alert(`已加速至 ${targetSpeed}x`); }); // 正常速度按钮 document.getElementById('normal-speed').addEventListener('click', () => { isSpeedUpEnabled = false; applySpeedToVideos(1.0); document.querySelector('.status-light').classList.remove('active'); document.querySelector('.status-text').textContent = '运行中'; alert('已恢复正常速度'); }); // 跳至视频结尾 document.getElementById('jump-to-end').addEventListener('click', () => { jumpToEnd(); alert('已跳至视频结尾！'); }); // 停止播放 document.getElementById('stop-video').addEventListener('click', () => { const videos = getAllVideos(); videos.forEach(video => { video.pause(); }); alert('已停止播放！'); }); // 缩小/展开面板 document.getElementById('minimize-btn').addEventListener('click', toggleMinimize); // 输入框回车事件 document.getElementById('speed-input').addEventListener('keypress', (e) => { if (e.key === 'Enter') { document.getElementById('apply-speed').click(); } }); document.getElementById('auto-jump-input').addEventListener('keypress', (e) => { if (e.key === 'Enter') { document.getElementById('toggle-auto-jump').click(); } }); // 添加Tampermonkey菜单命令 GM_registerMenuCommand("打开控制面板", function() { const panel = document.querySelector('.cyber-control-panel'); if (panel.classList.contains('minimized')) { toggleMinimize(); } }); GM_registerMenuCommand("关闭控制面板", function() { const panel = document.querySelector('.cyber-control-panel'); if (!panel.classList.contains('minimized')) { toggleMinimize(); } }); GM_registerMenuCommand("重置面板位置", function() { const panel = document.querySelector('.cyber-control-panel'); panel.style.top = '120px'; panel.style.right = '20px'; panel.style.left = 'auto'; }); })();