// ==UserScript==
// @name Redgifs Embed Tweaks
// @namespace https://greasyfork.org/pt-BR/users/821661
// @match https://www.redgifs.com/ifr/*
// @grant GM_registerMenuCommand
// @grant GM_addElement
// @grant GM_addStyle
// @grant GM_setValue
// @grant GM_getValue
// @version 0.2.5
// @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);
// Middle click state
const middleClick = GM_getValue('middleClick', true);
let midClick = false;
// Background color state
let bgkColor = GM_getValue('bgkColor', false);
let style = GM_addStyle(`body,.App{background:${bgkColor}}`);
// 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);
}
// Middle click
function midClickToggle() {
toggle('middleClick', !middleClick);
}
function openPickColor() {
document.querySelector('#pick-color').dispatchEvent(click);
}
// Prevent opening video link
if (!openLink) {
document.addEventListener('click', (e) => {
if (!e.target.closest('.videoLink')) return;
e.preventDefault();
});
}
// Middle click open link
if (!middleClick) {
document.addEventListener('mousedown', (e) => {
if (!e.target.closest('.videoLink')) return;
midClick = true;
});
document.addEventListener('mouseup', (e) => {
if (midClick) {
const videoLink = e.target.parentElement;
videoLink.href = videoLink.href.replace('/watch/', '/ifr/');
midClick = false;
}
});
}
// 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,
});
}
// Middle click
const commandMidClick = GM_registerMenuCommand('Middle click: open watch page', midClickToggle, {
title: title,
});
if (!middleClick) {
GM_registerMenuCommand('Middle click: open ifr page', midClickToggle, {
title: title,
id: commandMidClick,
});
}
// Background color
const commandBgkColor = GM_registerMenuCommand('Background color: Default', openPickColor, {
title: title,
});
if (bgkColor !== false) {
GM_registerMenuCommand(`Background color: ${bgkColor}`, openPickColor, {
title: title,
id: commandBgkColor,
});
}
})();
// Pick color background
let pickColor = GM_addElement(document.body, 'input', {
type: 'color',
id: 'pick-color',
style: 'position:absolute;top:0;left:0;visibility:hidden',
});
// Pick color background input event
pickColor.oninput = (e) => {
let color = e.target.value;
GM_setValue('bgkColor', color);
style = GM_addStyle(`body,.App{background:${color}}`);
};
// Return element
function el(e) {
return document.querySelector(e);
}
// Click event
const click = new MouseEvent('click', {
bubbles: true,
cancelable: true,
});
// Mutation observer
const observer = new MutationObserver((mutations) => {
mutations.forEach((mutation) => {
if (mutation.type === 'childList' && mutation.target.querySelector('video')) {
const video = el('video');
const qBtn = quality ? el('[d^="M1 12C1"]') : el('[d^="M1.16712"]');
const muteButton = el('.soundOff');
if (video && !autoplay) {
video.removeAttribute('autoplay');
}
if (video && autoPause) {
observerVideo(video);
}
if (video && !muted) {
muteButton.dispatchEvent(click);
}
if (video && qBtn) {
qBtn.closest('.button').dispatchEvent(click);
}
observer.disconnect();
}
});
});
// Installing observer
observer.observe(document.body, {
childList: true,
subtree: true,
});
})();
