视频倍速器Video speed up button(iOS26 UI)

Greasy Fork is available in English.
视频倍速器Video speed up button(iOS26 UI)

1x, 1.25x, 2x, 8x 四档切换，液态玻璃 UI，支持拖拽和自动隐藏
换行
// ==UserScript==
// @name         视频倍速器Video speed up button(iOS26 UI)
// @namespace    http://tampermonkey.net/
// @version      2.6
// @description  1x, 1.25x, 2x, 8x 四档切换，液态玻璃 UI，支持拖拽和自动隐藏
// @author       忘山
// @match        *://*/*
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    function createUI() {
        if (document.getElementById('ios-glass-speed-bar')) return;

        const container = document.createElement('div');
        container.id = 'ios-glass-speed-bar';

        // 样式：悬浮式液态玻璃
        Object.assign(container.style, {
            position: 'fixed',
            bottom: '12%',
            left: '50%',
            transform: 'translateX(-50%)',
            display: 'flex',
            gap: '10px',
            padding: '10px 18px',
            borderRadius: '22px',
            background: 'rgba(255, 255, 255, 0.35)',
            backdropFilter: 'blur(25px) saturate(200%) brightness(1.1)',
            webkitBackdropFilter: 'blur(25px) saturate(200%) brightness(1.1)',
            border: '1px solid rgba(255, 255, 255, 0.5)',
            boxShadow: '0 12px 40px rgba(0, 0, 0, 0.12), inset 0 0 12px rgba(255, 255, 255, 0.3)',
            zIndex: '2147483647',
            transition: 'opacity 0.4s cubic-bezier(0.4, 0, 0.2, 1), transform 0.4s',
            userSelect: 'none'
        });

        // 按钮配置：加入 1x
        const speeds = [1, 1.25, 2, 8];

        speeds.forEach(speed => {
            const btn = document.createElement('button');
            btn.innerText = speed === 1 ? '1.0x' : speed + 'x';

            Object.assign(btn.style, {
                padding: '8px 16px',
                border: 'none',
                borderRadius: '14px',
                background: 'rgba(255, 255, 255, 0.2)',
                color: '#1d1d1f',
                fontSize: '13px',
                fontWeight: '700',
                cursor: 'pointer',
                transition: 'all 0.3s cubic-bezier(0.2, 0.8, 0.2, 1)',
                boxShadow: 'inset 0 1px 1px rgba(255, 255, 255, 0.4)',
                backdropFilter: 'blur(5px)',
                letterSpacing: '-0.5px'
            });

            // 悬浮特效
            btn.onmouseenter = () => {
                btn.style.background = 'rgba(255, 255, 255, 0.6)';
                btn.style.transform = 'scale(1.1) translateY(-2px)';
            };
            btn.onmouseleave = () => {
                btn.style.background = 'rgba(255, 255, 255, 0.2)';
                btn.style.transform = 'scale(1) translateY(0)';
            };

            btn.onclick = (e) => {
                e.stopPropagation();
                const videos = document.querySelectorAll('video');
                if (videos.length > 0) {
                    videos.forEach(v => {
                        v.playbackRate = speed;
                        // 额外处理：防止某些播放器（如B站）内部逻辑覆盖速度
                        v.defaultPlaybackRate = speed;
                    });

                    // 点击后的液体闪烁反馈
                    btn.style.background = '#ffffff';
                    btn.style.boxShadow = '0 0 15px rgba(255,255,255,0.8)';
                    setTimeout(() => {
                        btn.style.background = 'rgba(255, 255, 255, 0.6)';
                        btn.style.boxShadow = 'inset 0 1px 1px rgba(255, 255, 255, 0.4)';
                    }, 300);
                }
            };
            container.appendChild(btn);
        });

        document.body.appendChild(container);

        // 智能显隐：鼠标静止 3 秒后变淡
        let timer;
        const hide = () => { container.style.opacity = '0.15'; };
        const show = () => {
            container.style.opacity = '1';
            clearTimeout(timer);
            timer = setTimeout(hide, 3000);
        };

        document.addEventListener('mousemove', show);
        show();
    }

    // 初始化：多重保险确保在异步加载的网站也能出来
    if (document.readyState === 'complete') {
        createUI();
    } else {
        window.addEventListener('load', createUI);
    }

    // 适配 SPA（单页应用）切换视频
    let lastUrl = location.href;
    setInterval(() => {
        if (location.href !== lastUrl) {
            lastUrl = location.href;
            setTimeout(createUI, 800);
        }
    }, 1000);

})();