☰

Instagram Video Controls

Adds video player controls to Instagram videos

Versión del día 04/10/2023. Echa un vistazo a la versión más reciente.

// ==UserScript==
// @name         Instagram Video Controls
// @namespace    https://fxzfun.com/
// @version      1.0.0
// @description  Adds video player controls to Instagram videos
// @author       FXZFun
// @match        https://www.instagram.com/
// @match        https://www.instagram.com/*
// @icon         https://www.google.com/s2/favicons?sz=64&domain=instagram.com
// @grant        GM_addStyle
// @license      GNU GPL v3
// ==/UserScript==

(function() {
    'use strict';
    let isMuted = JSON.parse(localStorage.getItem("ivc-mute")) ?? true;

    setInterval(() => {
        document.querySelectorAll("video").forEach(el => {
            const muteBtn = [...document.querySelectorAll("[aria-label='Toggle audio']")].filter(_ => checkVisible(_))[0];
            muteBtn.style.top = "-100px";
            muteBtn.style.zIndex = "999999";
            muteBtn.addEventListener("click", () => {
                isMuted = !el.muted;
                localStorage.setItem("ivc-mute", isMuted);
            });

            if (!el.controls) el.controls="controls";
            if (checkVisible(el) && el.muted && !isMuted) muteBtn.click();

            if (!document.head.innerHTML.includes("::-webkit-media-controls")) {
                GM_addStyle('::-webkit-media-controls { z-index: 999998; position: relative; } /*video::-webkit-media-controls-volume-slider {display:none;}*/ video::-webkit-media-controls-mute-button {display:none;}');
            }
        });
    }, 500);

    function checkVisible(elm) {
        const rect = elm.getBoundingClientRect();
        const viewHeight = Math.max(document.documentElement.clientHeight, window.innerHeight);
        return !(rect.bottom < 0 || rect.top - viewHeight >= 0);
    }
})();