Facebook Reels Enhancer

Greasy Fork is available in English.
Facebook Reels Enhancer

Enable controls on Facebook Reels videos and avoid pausing when switching tabs.
换行
// ==UserScript==
// @name         Facebook Reels Enhancer
// @namespace    UserScript
// @match        https://www.facebook.com/*
// @version      1.0
// @license      MIT
// @author       Pyrvox
// @description  Enable controls on Facebook Reels videos and avoid pausing when switching tabs.
// @icon         https://www.google.com/s2/favicons?sz=64&domain=facebook.com
// @run-at       document-start
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    // Habilitar controles en los videos de Reels
    document.addEventListener('play', (evt) => {
        const target = (evt || 0).target;

        if (target instanceof HTMLVideoElement && !target.hasAttribute('controls') && location.href.includes('reel')) {
            let buttonLayer = target.closest('div[class][role="button"][tabindex]');

            if (buttonLayer) {
                target.setAttribute('controls', '');

                setTimeout(() => {
                    Object.assign(target.style, {
                        'position': 'relative',
                        'zIndex': 999,
                        'pointerEvents': 'all'
                    });

                    [...buttonLayer.querySelectorAll('.x10l6tqk.x13vifvy:not(.x1m3v4wt)')].forEach(s => {
                        Object.assign(s.style, {
                            'pointerEvents': 'none',
                            'position': 'relative',
                            'zIndex': 1000
                        });
                    });
                }, 1);
            }
        }

        // Asegurarse de que el volumen esté habilitado
        if (target instanceof HTMLVideoElement && target.muted) {
            target.muted = false; // Desactivar el silencio
            target.volume = 1;   // Configurar el volumen al 100%
        }
    }, true);

    // Evitar la pausa de los videos al cambiar de pestaña
    document.addEventListener('visibilitychange', (e) => {
        // Forzar que el estado sea "visible"
        Object.defineProperty(document, 'visibilityState', {
            get: () => 'visible',
            configurable: true
        });

        Object.defineProperty(document, 'hidden', {
            get: () => false,
            configurable: true
        });
    });

    // Sobrescribir el método `pause` para evitar pausas automáticas
    const originalPause = HTMLMediaElement.prototype.pause;
    HTMLMediaElement.prototype.pause = function() {
        if (this.closest('[href*="reel"]')) {
            return; // Evitar que los Reels se pausen
        }
        return originalPause.apply(this, arguments); // Comportamiento normal para otros elementos
    };

})();