Video Speed Controller for phone

Add a video speed controller to webpages with videos.
当前为 2023-08-17 提交的版本，查看最新版本。
换行
// ==UserScript==
// @name         Video Speed Controller for phone
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  Add a video speed controller to webpages with videos.
// @author       Cool
// @match        *://*/*
// @license MIT
// @grant        GM_addStyle

// ==/UserScript==

(function() {
    'use strict';
    // Add a button to control video speed
    const speedButton = document.createElement('div');
    speedButton.id = 'videoSpeedButton';
    speedButton.innerHTML = '1.0x';
    speedButton.style.cssText = `
        position: fixed;
        top: 50%;
        right: 20px;
        background: rgba(0, 0, 0, 0.3);
        color: white;
        border-radius: 50%;
        width: 40px;
        height: 40px;
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        z-index: 99999;
        font-size: 12px;
    `;
    document.body.appendChild(speedButton);

    // Define video playback speeds
    const playbackSpeeds = [1.0, 1.25, 1.5, 2.0, 2.5, 3.0, 4.0];
    let currentSpeedIndex = 0;

    // Add click event listener to the speed button
    speedButton.addEventListener('click', () => {
        currentSpeedIndex = (currentSpeedIndex + 1) % playbackSpeeds.length;
        const newSpeed = playbackSpeeds[currentSpeedIndex];
        speedButton.textContent = newSpeed.toFixed(2) + 'x';

        // Apply the new speed to all video elements
        document.querySelectorAll('video').forEach(video => {
            video.playbackRate = newSpeed;
        });
    });

    // Add styles to the button
    GM_addStyle(`
        #videoSpeedButton:hover {
            background: rgba(0, 0, 0, 0.6);
        }
    `);
})();