Enhance YouTube by improving layout, adding shortcuts, customizing controls, and toggling dark mode
// ==UserScript==
// @name Enhanced YouTube
// @namespace https://discord.gg/rPbnXvFf
// @version 1.2
// @description Enhance YouTube by improving layout, adding shortcuts, customizing controls, and toggling dark mode
// @author Pixel.pilot
// @match https://www.youtube.com/*
// @grant none
// @license All Rights Reserved
// ==/UserScript==
(function() {
'use strict';
/**
* Function to remove ads from the YouTube page.
*/
function removeAds() {
const adSelectors = ['#player-ads', '.video-ads', '.ytp-ad-module'];
adSelectors.forEach(selector => {
document.querySelectorAll(selector).forEach(ad => ad.remove());
});
}
/**
* Function to enhance the layout for both PC and mobile.
* - Sets the video player width to 100% on PC.
* - Ensures proper viewport settings on mobile.
*/
function enhanceLayout() {
// Wide video player on PC
const player = document.getElementById('player-container');
if (player) {
player.style.width = '100%';
}
// Mobile optimizations
const metaViewport = document.querySelector('meta[name="viewport"]') || document.createElement('meta');
metaViewport.name = "viewport";
metaViewport.content = "width=device-width, initial-scale=1";
document.head.appendChild(metaViewport);
}
/**
* Function to customize the video player controls.
* - Changes the background color and border radius of the controls.
*/
function customizeControls() {
const controls = document.querySelector('.ytp-chrome-bottom');
if (controls) {
controls.style.backgroundColor = 'rgba(0, 0, 0, 0.5)';
controls.style.borderRadius = '10px';
}
}
/**
* Function to toggle dark mode on the page.
* - Applies dark mode styling to the page and changes link colors.
*/
function toggleDarkMode() {
const body = document.body;
body.classList.toggle('dark-mode');
if (body.classList.contains('dark-mode')) {
body.style.backgroundColor = '#181818';
document.querySelectorAll('a').forEach(a => a.style.color = '#1e90ff');
} else {
body.style.backgroundColor = '';
document.querySelectorAll('a').forEach(a => a.style.color = '');
}
}
/**
* Function to add keyboard shortcuts for various actions.
* - 'f': Toggle fullscreen mode
* - 'm': Mute/unmute video
* - 'd': Toggle dark mode
*/
function addShortcuts() {
document.addEventListener('keydown', (e) => {
switch (e.key) {
case 'f':
document.querySelector('.ytp-fullscreen-button')?.click();
break;
case 'm':
document.querySelector('.ytp-mute-button')?.click();
break;
case 'd':
toggleDarkMode();
break;
}
});
}
/**
* Run all enhancements.
* Includes ad removal, layout enhancement, control customization, and shortcut addition.
*/
function runEnhancements() {
try {
removeAds();
enhanceLayout();
customizeControls();
addShortcuts();
} catch (error) {
console.error('Error running enhancements:', error);
}
}
// Wait for the YouTube page to fully load
window.addEventListener('load', runEnhancements);
// Handle dynamic content load with MutationObserver
const observer = new MutationObserver(runEnhancements);
observer.observe(document.body, { childList: true, subtree: true });
console.log('Enhanced YouTube script loaded');
})();