Youtube New UI Fix

Fixes the new UI to one that resembles old one

Versione datata 08/08/2015. Vedi la nuova versione l'ultima versione.

Dovrai installare un'estensione come Tampermonkey, Greasemonkey o Violentmonkey per installare questo script.

You will need to install an extension such as Tampermonkey to install this script.

Dovrai installare un'estensione come Tampermonkey o Violentmonkey per installare questo script.

Dovrai installare un'estensione come Tampermonkey o Userscripts per installare questo script.

Dovrai installare un'estensione come ad esempio Tampermonkey per installare questo script.

Dovrai installare un gestore di script utente per installare questo script.

(Ho già un gestore di script utente, lasciamelo installare!)

Dovrai installare un'estensione come ad esempio Stylus per installare questo stile.

Dovrai installare un'estensione come ad esempio Stylus per installare questo stile.

Dovrai installare un'estensione come ad esempio Stylus per installare questo stile.

Dovrai installare un'estensione per la gestione degli stili utente per installare questo stile.

Dovrai installare un'estensione per la gestione degli stili utente per installare questo stile.

Dovrai installare un'estensione per la gestione degli stili utente per installare questo stile.

(Ho già un gestore di stile utente, lasciamelo installare!)

// ==UserScript==
// @name        Youtube New UI Fix
// @namespace   YtNewUIFix
// @description Fixes the new UI to one that resembles old one
// @author      Roy Scheerens
// @include     https://www.youtube.com/*
// @version     1.4.3
// @grant       none
// ==/UserScript==

(function() {
	var addWatchLater = true;
	var watchLaterAdded = false;
	
	//mouse over the controls to update them (this seems to also work with 2000ms instead of 1000ms)
	var evObj = document.createEvent('Events');
	evObj.initEvent("mousemove", true, false);
	var moviePlayer = document.getElementById("movie_player");
	setInterval(function() 
	{
		if (!moviePlayer)
		{
			moviePlayer = document.getElementById("movie_player");
		}
		else if (!moviePlayer.classList.contains("seeking-mode"))
		{
			moviePlayer.dispatchEvent(evObj); 
		}
		
		if (addWatchLater && !watchLaterAdded && moviePlayer)
		{
			var watchLater = document.getElementsByClassName("ytp-watch-later-button")[0];
			if (watchLater)
			{
				var qaulitybutton = document.getElementsByClassName("ytp-subtitles-button")[0] || document.getElementsByClassName("ytp-settings-button")[0];
				console.log(qaulitybutton);
				if (qaulitybutton)
				{
					qaulitybutton.parentNode.insertBefore(watchLater, qaulitybutton.nextSibling);
					watchLaterAdded = true;
				}
			}
		}
	}, 1000);

	//the css: 
	var css = document.createElement('style');
	css.type = "text/css";
	css.textContent = [
 			/* fixing the colors */
		"	.ytp-chrome-bottom { background-color: #1B1B1B!important; }", 
		"	.ytp-svg-fill { fill: #8E8E8E!important; }", 
		"	#movie_player { height: calc(100% + 35px)!important; }", 
		"	.html5-video-content { background-color: black!important; }", 
		"	.ytp-panelpopup { background: rgb(28, 28, 28) none repeat scroll 0% 0%!important; }	", 

			/* moving the content below down */
		"	#watch7-content, div.watch-stage-mode #watch7-sidebar { transform: translateY(35px)!important; }", 

			/* controls always visible */
		"	.ytp-chrome-bottom { opacity: 1!important; }", 

			/* move controls to the right place */
		"	#movie_player { height: calc(100% + 35px)!important; }", 
		"	.ytp-gradient-bottom, .ytp-gradient-top, .ytp-chrome-top { display: none!important; }", 
		"	.ytp-chrome-controls { width: calc(100% + 24px)!important; transform: translateX(-12px)!important; }", 

			/* Fix the theater black bars */
		"	.watch-stage-mode #theater-background::after { content: ''; height: 35px; bottom: -35px; left: 0px; position: absolute; background-color: black; width: 100%; }", 

			/* scale down the controls */
		"	.ytp-chrome-bottom { transform: translateY(5px)!important; }", 
		"	.ytp-chrome-bottom::before {content: ''; bottom: 0px; top: -1px; left: -12px; right: -12px; position: absolute; background-color: #1B1B1B; z-index: -1000; }", 
		"	.ytp-chrome-controls { height: 31px!important; line-height: 31px!important; font-size: 11px!important; }", 
		"	.ytp-chrome-controls .ytp-button:not(.ytp-play-button):not(.ytp-watch-later-button) { width: 32px!important; }", 
		"	.ytp-play-button { width: 41px!important; }", 
		"	.ytp-progress-bar-container:not(.ytp-pulling) { height: 5px!important; }", 

			/* scale down the controls big mode */
		"	.ytp-big-mode .ytp-chrome-bottom { transform: translateY(24px)!important; }", 
		"	.html5-video-container { height: 100%!important; }", 
		"	.html5-main-video { max-height: calc(100% - 35px)!important; }", 
		"	.ytp-big-mode .ytp-progress-bar-container { transform: translateY(-1px)!important; }", 

			/* Fix the quality badge (red HD rectangle) */
		"	.ytp-settings-button.ytp-hd-quality-badge::after,.ytp-settings-button.ytp-4k-quality-badge::after,.ytp-settings-button.ytp-5k-quality-badge::after,.ytp-settings-button.ytp-8k-quality-badge::after", 
		"	{", 
		"		content:''!important;", 
		"		position:absolute!important;", 
		"		top:6px!important;", 
		"		right:4px!important;", 
		"		height:9px!important;", 
		"		width:13px!important;", 
		"		background-color:#f12b24!important;", 
		"		border-radius:1px!important;", 
		"		line-height:normal!important;", 
		"		background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiB2aWV3Qm94PSIwIDAgMTMgOSIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj4NCiAgPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBmaWxsLW9wYWNpdHk9IjAuNjQ3MSIgZmlsbD0iIzAwMDAwMCIgZD0iTTUsNyBMNiw3IEw2LDggTDUsOCBMNSw3IFogTTEwLDMgTDEwLDQgTDgsNCBMOCwzIEwxMCwzIFogTTMsNiBMMyw1IEw1LDUgTDUsNiBMMyw2IFogTTIsNyBMMyw3IEwzLDggTDIsOCBMMiw3IFogTTcsNyBMMTAsNyBMMTAsOCBMNyw4IEw3LDcgWiBNMTAsNiBMMTEsNiBMMTEsNyBMMTAsNyBMMTAsNiBaIj48L3BhdGg+DQogIDxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgZmlsbD0iI0ZGRkZGRiIgZD0iTTUsNyBMNSw2IEw1LDUgTDMsNSBMMyw2IEwzLDcgTDIsNyBMMiwyIEwzLDIgTDMsNCBMNSw0IEw1LDIgTDYsMiBMNiw3IEw1LDcgWiBNMTEsNiBMMTAsNiBMMTAsNyBMNyw3IEw3LDIgTDEwLDIgTDEwLDMgTDExLDMgTDExLDYgWiBNMTAsNCBMMTAsMyBMOCwzIEw4LDQgTDgsNiBMMTAsNiBMMTAsNCBaIj48L3BhdGg+DQo8L3N2Zz4NCg==')!important;", 
		"		padding: 0!important;", 
		"	}", 

			/* Makes sure the captions/subtitles are at the correct height and don't move up and down */
		"	.ytp-player-content, .ytp-subtitles-player-content { bottom: 49px!important; } ",
	
		/* rules for the watch later button */
		"	.ytp-watch-later-button { width: 24px!important; float: right!important; }", 
		"	.ytp-tooltip-image-enabled { bottom: 49px!important; top: auto!important; }"
	].join("\n");
	document.head.appendChild(css);
})();