// ==UserScript==
// @name         点击静音
// @namespace    http://tampermonkey.net/
// @version      0.8
// @description  网页静音、点击静音、视频静音，且不影响其他页面
// @match        https://*/*
// @grant        GM_setValue
// @grant        GM_getValue
// @license      MIT
// @downloadURL none
// ==/UserScript==

(function() {
    'use strict';

    const savedPosition = {
        top: GM_getValue('buttonTop', '10px'),
        left: GM_getValue('buttonLeft', '10px')
    };

    const button = document.createElement('button');
    button.innerText = "点击静音";
    button.style.position = "fixed";
    button.style.top = savedPosition.top;
    button.style.left = savedPosition.left;
    button.style.width = "120px";
    button.style.height = "40px";
    button.style.backgroundColor = "#f44336";
    button.style.color = "white";
    button.style.border = "none";
    button.style.borderRadius = "50px";
    button.style.fontSize = "16px";
    button.style.fontWeight = "bold";
    button.style.cursor = "pointer";
    button.style.zIndex = "9999";
    button.style.transition = "all 0.3s ease";
    button.style.boxShadow = "0 4px 8px rgba(0, 0, 0, 0.2)";
    button.style.display = "flex";
    button.style.alignItems = "center";
    button.style.justifyContent = "center";
    document.body.appendChild(button);

    function updateButtonState() {
        const video = document.querySelector('video');
        if (video && video.muted) {
            button.innerText = "点击恢复";
        } else {
            button.innerText = "点击静音";
        }
    }

    button.addEventListener('click', function() {
        const videoElements = document.querySelectorAll('video');
        if (videoElements.length > 0) {
            const isMuted = videoElements[0].muted;
            videoElements.forEach(video => video.muted = !isMuted);
            updateButtonState();
        }
    });

    updateButtonState();

    let offsetX, offsetY;

    button.onmousedown = function(e) {
        offsetX = e.clientX - button.getBoundingClientRect().left;
        offsetY = e.clientY - button.getBoundingClientRect().top;
        button.style.transition = 'none';
    };

    document.onmousemove = function(e) {
        if (e.buttons === 1) {
            button.style.left = `${e.clientX - offsetX}px`;
            button.style.top = `${e.clientY - offsetY}px`;
        }
    };

    document.onmouseup = function() {
        GM_setValue('buttonTop', button.style.top);
        GM_setValue('buttonLeft', button.style.left);
        button.style.transition = 'all 0.3s ease';
    };

})();