tweaks redgifs embed/iframe video
As of
// ==UserScript==
// @name Redgifs Embed Tweaks
// @namespace https://greasyfork.org/pt-BR/users/821661
// @match https://www.redgifs.com/ifr/*
// @grant GM_registerMenuCommand
// @grant GM_addStyle
// @grant GM_setValue
// @grant GM_getValue
// @version 0.2.3
// @author hdyzen
// @description tweaks redgifs embed/iframe video
// @license MIT
// ==/UserScript==
(function () {
'use strict';
// Autoplay state
const autoplay = GM_getValue('autoplay', true);
// Open state
const openLink = GM_getValue('openlink', false);
// Autopause state
const autoPause = GM_getValue('autoPause', true);
// Muted state
const muted = GM_getValue('muted', false);
// Bloat state
const bloat = GM_getValue('bloat', false);
// Quality state
const quality = GM_getValue('quality', true);
// Title
const title = 'Click for toggle';
// Toggle item and reload page
function toggle(key, value) {
GM_setValue(key, value);
location.reload();
}
// Autoplay toggle
function autoplayToggle() {
toggle('autoplay', !autoplay);
}
// Open link when click on video
function openLinkToggle() {
toggle('openlink', !openLink);
}
// Pause when video less than 80% visible
function pauseVideoToggle() {
toggle('autoPause', !autoPause);
}
// Muted default
function mutedToggle() {
toggle('muted', !muted);
}
// Open link when click on video
function bloatToggle() {
toggle('bloat', !bloat);
}
// Quality default
function qualityToggle() {
toggle('quality', !quality);
}
// Prevent opening video link
if (!openLink) {
document.addEventListener('click', (e) => {
if (!e.target.closest('.videoLink')) return;
e.preventDefault();
});
}
// Remove bloat
if (bloat) GM_addStyle(`.userInfo,.logo,#shareButton{display:none!important}`);
// Intersection observer video
function observerVideo(target) {
const observer = new IntersectionObserver(
(entries) => {
for (const entry of entries) {
if (!entry.isIntersecting && !entry.target.paused) entry.target.pause();
}
},
{
threshold: 0.8,
},
);
observer.observe(target);
}
// Menu commands
(function menuCommands() {
// Autoplay
const commandAutoplay = GM_registerMenuCommand('Autoplay: ON', autoplayToggle, {
title: title,
});
if (!autoplay) {
GM_registerMenuCommand('Autoplay: OFF', autoplayToggle, {
title: title,
id: commandAutoplay,
});
}
// Open link
const commandLink = GM_registerMenuCommand('Open link when click: OFF', openLinkToggle, {
title: title,
});
if (openLink) {
GM_registerMenuCommand('Open link when click: ON', openLinkToggle, {
title: title,
id: commandLink,
});
}
// Pause video
const commandPause = GM_registerMenuCommand('Autopause: ON', pauseVideoToggle, {
title: title,
});
if (!autoPause) {
GM_registerMenuCommand('Autopause: OFF', pauseVideoToggle, {
title: title,
id: commandPause,
});
}
// Muted
const commandMuted = GM_registerMenuCommand('Muted: ON', mutedToggle, {
title: title,
});
if (!muted) {
GM_registerMenuCommand('Muted: OFF', mutedToggle, {
title: title,
id: commandMuted,
});
}
// Bloat
const commandBloat = GM_registerMenuCommand('Hide Bloat: OFF', bloatToggle, {
title: title,
});
if (bloat) {
GM_registerMenuCommand('Hide Bloat: ON', bloatToggle, {
title: title,
id: commandBloat,
});
}
// Quality
const commandQuality = GM_registerMenuCommand('Default Quality: HD', qualityToggle, {
title: title,
});
if (!quality) {
GM_registerMenuCommand('Default Quality: SD', qualityToggle, {
title: title,
id: commandQuality,
});
}
})();
// Return element
function el(e) {
return document.querySelector(e);
}
// Click event
const click = new MouseEvent('click', {
bubbles: true,
cancelable: true,
});
// Mutation observer for pause video
const observer = new MutationObserver((mutations) => {
mutations.forEach((mutation) => {
if (mutation.type === 'childList' && mutation.target.querySelector('video')) {
const video = el('video');
const hQ = el('[d^="M1.16712"]');
const sQ = el('[d^="M1 12C1"]');
const muteButton = el('.soundOff');
if (video && !autoplay) {
video.removeAttribute('autoplay');
}
if (video && autoPause) {
observerVideo(video);
}
if (video && !muted) {
muteButton.dispatchEvent(click);
}
if (video && ((!quality && hQ) || (quality && sQ))) {
(quality ? sQ : hQ).closest('.button').dispatchEvent(click);
}
observer.disconnect();
}
});
});
observer.observe(document.body, {
childList: true,
subtree: true,
});
})();