☰

Aby kontynuować zaloguj lub zarejestruj się.

Instagram Video Controls

Adds video player controls to Instagram videos

  1. // ==UserScript==
  2. // @name         Instagram Video Controls
  3. // @namespace    https://fxzfun.com/
  4. // @version      1.0.3
  5. // @description  Adds video player controls to Instagram videos
  6. // @author       FXZFun
  7. // @match        https://www.instagram.com/
  8. // @match        https://www.instagram.com/*
  9. // @icon         https://www.google.com/s2/favicons?sz=64&domain=instagram.com
  10. // @grant        GM_addStyle
  11. // @license      GNU GPL v3
  12. // ==/UserScript==
  13.  
  14. (function() {
  15.     'use strict';
  16.     let isMuted = JSON.parse(localStorage.getItem("ivc-mute")) ?? true;
  17.     let controlsShowing = false;
  18.  
  19.     function runMainPage() {
  20.         setInterval(addControls, 500);
  21.     }
  22.  
  23.     function addControls() {
  24.         document.querySelectorAll("video").forEach(vid => {
  25.                 vid.controls = "controls";
  26.                 vid.volume = parseFloat(localStorage.getItem("ivc-volume")) || 0.8;
  27.                 vid.addEventListener('volumechange', () => localStorage.setItem("ivc-volume", JSON.stringify(vid.muted ? 0 : vid.volume)));
  28.                 vid.addEventListener('play', () => setTimeout(() => vid.muted = false, 10));
  29.  
  30.                 let vidSibling = vid.nextElementSibling.firstChild;
  31.                 vidSibling.style = "transition: 0.5s; pointer-events: none";
  32.                 vidSibling.addEventListener('mouseover', () => {
  33.                     vidSibling.classList.add("ivcControls");
  34.                     if (controlsShowing) {
  35.                         vidSibling.classList.remove("ivcControls");
  36.                         controlsShowing = false;
  37.                     }
  38.                 });
  39.                 vidSibling.addEventListener('mouseout', () => {
  40.                     vidSibling.classList.remove("ivcControls");
  41.                     controlsShowing = false;
  42.                 });
  43.                 vid.addEventListener('mouseover', () => {
  44.                     vidSibling.classList.add("ivcControls");
  45.                     controlsShowing = true;
  46.                 });
  47.                 vid.addEventListener('mouseout', () => {
  48.                     vidSibling.classList.remove("ivcControls");
  49.                     controlsShowing = false;
  50.                 });
  51.             });
  52.     }
  53.  
  54.     let currentURL = "";
  55.     setInterval(() => {
  56.         if (location.href !== currentURL) {
  57.             if (!document.head.innerHTML.includes("::-webkit-media-controls")) GM_addStyle('::-webkit-media-controls-panel { z-index: 999998; position: relative; } .ivcControls { margin-top: -80px; } button[aria-label="Toggle audio"] { display: none; }');
  58.  
  59.             if (location.host === "www.instagram.com" && location.pathname === "/") runMainPage();
  60.  
  61.             console.log("IVC: new video available");
  62.             addControls();
  63.  
  64.             currentURL = location.href;
  65.         }
  66.     }, 500);
  67.  
  68.     console.log("IVC: loading...");
  69. })();