// ==UserScript==
// @name Youtube Hide Paused Gradient by Sapioit
// @namespace Sapioit
// @copyright Sapioit, 2020 - Present
// @author sapioitgmail.com
// @license GPL-2.0-only; http://www.gnu.org/licenses/gpl-2.0.txt
// @icon https://youtube.com/favicon.ico
// @match https://www.youtube.com/*
// @match http*://*.youtube.com/*
// @match http*://youtube.com/*
// @match https://youtu.be/*
// @match http*://*.youtu.be/*
// @description Removes the annoying gradients visible when pausing a video.
// @version 1.6.0.1
// @grant GM_addStyle
// @grant GM_registerMenuCommand
// @grant GM_setValue
// @grant GM_getValue
// @downloadURL none
// ==/UserScript==
localStorage.setItem('currentWatchMetadataValued', 0);
localStorage.setItem('consecutiveUnchangedCounted', 0);
const isFocused = () => typeof document.hidden !== undefined ? !document.hidden : null;
function title_changed (count = 3) {
console.info("%cYoutube Hide Paused Gradient by Sapioit: title_changed: %cChecking title.", "color: yellow; background-color: black;", "color: white");
// Check if the value of the title (the first "yt-formatted-string.style-scope.ytd-watch-metadata" element) has changed
let firstWatchMetadataElement = document.querySelector('h1 yt-formatted-string.style-scope.ytd-watch-metadata');
if ( firstWatchMetadataElement === null || (typeof firstWatchMetadataElement) === 'undefined') {
console.info("Youtube Hide Paused Gradient by Sapioit: title_changed: %cThe 'h1 yt-formatted-string.style-scope.ytd-watch-metadata' is either NULL or UNDEFINED.", "color: red");
console.info("%cYoutube Hide Paused Gradient by Sapioit: title_changed: %c", "color: red", "color: default", firstWatchMetadataElement , (typeof firstWatchMetadataElement));
return false;
}
console.info("%cYoutube Hide Paused Gradient by Sapioit: title_changed:", "color: cyan", (firstWatchMetadataElement.textContent.trim()) );
console.info("%cYoutube Hide Paused Gradient by Sapioit: title_changed:", "color: cyan", (firstWatchMetadataElement.textContent.trim() !== '') , ' ' , (firstWatchMetadataElement) );
if ( firstWatchMetadataElement.textContent.trim() !== '') {
// Get the current value of the title
let currentWatchMetadataValue = firstWatchMetadataElement.textContent.trim();
console.info("%cYoutube Hide Paused Gradient by Sapioit: title_changed: %cTitle found.", "color: yellow; background-color: black;", "color: white");
// Get the consecutive unchanged count from localStorage, or set it to 0 if it's not available
let consecutiveUnchangedCount = parseInt(localStorage.getItem('consecutiveUnchangedCounted')) || 0;
// Increment the consecutiveUnchangedCount if the value is the same
consecutiveUnchangedCount++;
// Update the stored value and consecutiveUnchangedCount in localStorage
localStorage.setItem('currentWatchMetadataValued', currentWatchMetadataValue);
localStorage.setItem('consecutiveUnchangedCounted', consecutiveUnchangedCount.toString());
console.log("Youtube Hide Paused Gradient by Sapioit: title_changed: Try nr #" + (1+consecutiveUnchangedCount) );
// Check if the current value is the same as the previous one stored in localStorage
if (localStorage.getItem('currentWatchMetadataValued') === currentWatchMetadataValue) {
// Stop the function if the title value hasn't changed for the last three checks (consecutiveUnchangedCount is less than 4)
if ( consecutiveUnchangedCount < (count+1) ) {
console.log("Youtube Hide Paused Gradient by Sapioit: title_changed: First 'yt-formatted-string.style-scope.ytd-watch-metadata' element has not changed for the last three checks. Stopping check.");
return false; // Return that the title has not changed.
} else {
// Reset the consecutiveUnchangedCount if the value has changed
consecutiveUnchangedCount = 0;
// Update the stored value and consecutiveUnchangedCount in localStorage
localStorage.setItem('currentWatchMetadataValued', currentWatchMetadataValue);
localStorage.setItem('consecutiveUnchangedCounted', consecutiveUnchangedCount.toString());
return true; // Return that the title has changed.
}
} else {
// Reset the consecutiveUnchangedCount if the value has changed
consecutiveUnchangedCount = 0;
// Update the stored value and consecutiveUnchangedCount in localStorage
localStorage.setItem('currentWatchMetadataValued', currentWatchMetadataValue);
localStorage.setItem('consecutiveUnchangedCounted', consecutiveUnchangedCount.toString());
return true; // Return that the title has changed.
}
} else {
console.log("Youtube Hide Paused Gradient by Sapioit: title_changed: Checking title FAILED.");
}
return false; // Return that the title has changed.
// Usage example:
if ( title_changed() ){
return;
}
if ( title_changed(8) ){
return;
}
}
function swapButtonsSaveShare(){
if ( !isFocused() || title_changed(8) ){
return;
}
console.log("Youtube Hide Paused Gradient by Sapioit: swapButtons:: Checking if 'Save' button is inside the top-level-buttons-computed element.");
let isSaveButtonInside = document.querySelector('div#top-level-buttons-computed.top-level-buttons.style-scope.ytd-menu-renderer button[aria-label="Save to playlist"]');
console.info('%cYoutube Hide Paused Gradient by Sapioit: swapButtons: %c', "color: cyan", isSaveButtonInside, (typeof isSaveButtonInside));
if (isSaveButtonInside) {
console.log("Youtube Hide Paused Gradient by Sapioit: swapButtons: 'Save' button is inside the top-level-buttons-computed element.");
console.log("Youtube Hide Paused Gradient by Sapioit: swapButtons:: " + JSON.stringify(isSaveButtonInside));
//GM_addStyle('div#top-level-buttons-computed.top-level-buttons.style-scope.ytd-menu-renderer button[aria-label="Save to playlist"] { background-color: red;}');
return;
}
console.log("Youtube Hide Paused Gradient by Sapioit: swapButtons: 'Save' button is NOT inside the top-level-buttons-computed element.");
let saveButton = document.querySelector('ytd-button-renderer[button-renderer][button-next] button[aria-label="Save to playlist"]');
let shareButton = document.querySelector('ytd-button-renderer[button-renderer][button-next] button[aria-label="Share"]');
if (saveButton && shareButton) {
let saveButtonParent = saveButton.parentElement;
let shareButtonParent = shareButton.parentElement;
// Create placeholder elements to hold the buttons temporarily
const placeholder1 = document.createElement('div');
const placeholder2 = document.createElement('div');
// Move the buttons to their respective placeholder positions
saveButtonParent.insertBefore(placeholder1, saveButton);
shareButtonParent.insertBefore(placeholder2, shareButton);
shareButtonParent.insertBefore(saveButton, placeholder2);
saveButtonParent.insertBefore(shareButton, placeholder1);
// Remove the placeholders
saveButtonParent.removeChild(placeholder1);
shareButtonParent.removeChild(placeholder2);
// Swap Save2 with a new Share2
let save2Button = document.querySelector('tp-yt-paper-item[aria-disabled="false"] yt-formatted-string[role="option"][class="style-scope ytd-menu-service-item-renderer"]');
if (save2Button) {
let saveButtonParent = saveButton.parentElement;
// Swap the positions of saveButton and shareButton in their respective parents
saveButtonParent.insertBefore(shareButton, saveButton.nextSibling);
// Create new HTML for the modified share2Button
let newShare2ButtonHTML = 'Share';
// Create a new DOM element from the HTML string
const parser = new DOMParser();
const newShare2Button = parser.parseFromString(newShare2ButtonHTML, "text/html").body.firstChild;
// Add the newShare2Button after the saveButton
saveButtonParent.insertBefore(newShare2Button, saveButton.nextSibling);
}
/*let newShareButton = '';
let newSaveButton = '';
function createTrustedHTML(inputString) {
const parser = new DOMParser();
const doc = parser.parseFromString(inputString, "text/html");
const fragment = doc.body;
return fragment.outerHTML;
}
function escapeHTML(inputString) {
return inputString.replace(/&/g, "&").replace(//g, ">");
}
newShareButton = createTrustedHTML(newShareButton);
newSaveButton = createTrustedHTML(newSaveButton);
shareButton.outerHTML = newSaveButton;
saveButton.outerHTML = newShareButton;*/
// To remove the old "Save" and "Share" buttons, uncomment the lines below:
// saveButtonParent.removeChild(saveButton);
// shareButtonParent.removeChild(shareButton);
}
console.info("%cYoutube Hide Paused Gradient by Sapioit: swapButtons: Finishing swapping.", "color: cyan");
}
function add_hover_tooltips() {
/*var video_titles = document.getElementsByTagName("h3").getElementsByClassName("ytd-compact-video-renderer").getElementsByTagName("span");*/
/*var video_titles = document.querySelector("span.ytd-compact-video-renderer");*/
//var video_titles = document.getElementsByTagName("span").getElementsByClassName("ytd-compact-video-renderer");
/*var video_titles = document.querySelectorAll("span.ytd-compact-video-renderer");*/
var video_titles = document.querySelectorAll("span.ytd-compact-video-renderer, #video-title");
for(var i=0; i span { padding: 3px; background: rgba(0, 0, 0, 0.5); }');
//GM_addStyle('.ytd-thumbnail-overlay-time-status-renderen { transition-duration: 0s; }');
window.onload = function(){setTimeout(function () {
GM_addStyle('button div.ytp-autonav-toggle-button-container { display: none !important;}');
GM_addStyle('[data-tooltip-target-id="ytp-autonav-toggle-button"] { display: none !important;}');
GM_addStyle('--ytd-engagement-panel-section-list-rendere { display: none !important;}');
GM_addStyle('#video-title.ytd-compact-video-renderer { overflow: none !important;}');
GM_addStyle('ytd-button-renderer > yt-button-shape > button[aria-label="Thanks"] { display: none !important; }');
//GM_addStyle('ytd-button-renderer > yt-button-shape > button[aria-label="Save to playlist"] { display: inline-block !important; }');
add_hover_tooltips();
swapButtonsSaveShare();
setTimeout(function () {
swapButtonsSaveShare();
}, 5*1000) //loads after 5 seconds
//GM_addStyle('.ytd-thumbnail-overlay-time-status-renderen { transition-duration: 0s; }');
}, 5*1000)}; //loads after 5 seconds
function repeaterFunction(){
if ( title_changed(8) ){
return;
}
GM_addStyle('button div.ytp-autonav-toggle-button-container { display: none !important;}');
GM_addStyle('[data-tooltip-target-id="ytp-autonav-toggle-button"] { display: none !important;}');
GM_addStyle('--ytd-engagement-panel-section-list-rendere { display: none !important;}');
add_hover_tooltips();
swapButtonsSaveShare();
setTimeout(repeaterFunction, 30*1000); //loads every 30 seconds
}
repeaterFunction();
GM_addStyle("span[data-tooltip]:before { z-index:301; content: attr(data-tooltip); position: absolute; opacity: 0; padding: 10px; background: black; color: white;} span[data-tooltip]:hover:before { opacity: 1;} ");
GM_addStyle(".yt-simple-endpoint[title]:before { z-index:301; content: attr(title); position: absolute; opacity: 0; padding: 10px; background: black; color: white;} .yt-simple-endpoint[title]:hover:before { opacity: 1 !important;} ");
// GM_addStyle(a);