[BETA VERSION] Youtube - Right Side Description

Moves the video description to the right of the video (like it used to be 2009 and earlier) and makes a few 2009ish style tweaks to the video page.
Ajankohdalta 30.8.2017. Katso uusin versio.
Asenna tämä skripti ?
Ask a question, post a review, or report the script.
Wrap lines
// ==UserScript==
// @id             5a3ebe9b-d73f-4397-a5c3-7a382723c39e
// @name           [BETA VERSION] Youtube - Right Side Description 
// @namespace      Takato
// @author         Takato
// @copyright      2010+, Takato (https://greasyfork.dpdns.org/users/1158/)
// @licence        Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International - Additional conditions apply; https://greasyfork.dpdns.org/scripts/976/
// @description    Moves the video description to the right of the video (like it used to be 2009 and earlier) and makes a few 2009ish style tweaks to the video page.
// @icon           https://i.imgur.com/RAHw2kQ.png https://i.imgur.com/qlQhuaa.png
// @icon64         https://i.imgur.com/qlQhuaa.png
// @resource       icon https://i.imgur.com/RAHw2kQ.png
// @resource       icon64 https://i.imgur.com/RAHw2kQ.png
// @version        2017.08.30
// @require        https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js
// @website        https://greasyfork.dpdns.org/scripts/976/
// @noframes
// @grant          GM_getValue
// @grant          GM_setValue
// @grant          GM_deleteValue
// @grant          GM_addStyle
// @grant          GM_getResourceURL
// @run-at		   document-start
// @include        *//www.youtube.com/*
// ==/UserScript==
// This script is licenced under Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International (https://creativecommons.org/licenses/by-nc-sa/4.0/) with additional conditions. 
// See https://greasyfork.dpdns.org/scripts/976/ for full details of the licence and conditions.
var script = {};
script.version = "2017.08.30";

// SETTINGS -----------------------------

// Main settings: Available by clicking "More" below the video.
// - Toggle 'retro style'

// --------------------------------------



// Everything below this line shouldn't be edited unless you are a coder. All settings are listed above.

// Defining static script properties
script.name = "Right Side Description [BETA]"; // Previously known as Better Watch Page
script.shortname = "RSD Beta";
script.website = "https://greasyfork.dpdns.org/scripts/976/";
script.discussion = "https://greasyfork.dpdns.org/scripts/976/feedback";
script.icon = GM_getResourceURL("icon");
script.icon64 = GM_getResourceURL("icon64");
script.mainCSS = " ytd-masthead:not(:hover) #bwp-retrostyle-toggle {display:none;}  /* Title */  	ytd-watch:not([theater]) #top.ytd-watch {margin-top:10px;}  	ytd-watch:not([theater]) #bwp-title {margin-bottom:5px;}  	ytd-watch[theater] #bwp-title, ytd-watch:not([theater]) ytd-video-primary-info-renderer h1.title {display:none;}          /* Sidebar */  	#related > #meta {width:auto; padding-right:0; order:0;}  	ytd-video-secondary-info-renderer {max-height:390px; overflow:auto; width:auto; padding-top:0; padding-bottom:0; margin-right: 0 !important; background-color:var(--yt-playlist-background-item); padding:8px; border-bottom-width:0px;}  	@media screen and (min-width: 1000px) {  		ytd-video-secondary-info-renderer {margin-left:-14px;}  	}  	ytd-video-secondary-info-renderer ytd-expander.description.ytd-video-secondary-info-renderer {margin-left:0; max-width:100%; font-size:1.3rem; line-height:normal;}  	ytd-video-secondary-info-renderer #less {display:none;}    	ytd-video-secondary-info-renderer #title.ytd-metadata-row-renderer {width:auto; font-size:1.1rem; line-height:normal;}  	ytd-video-secondary-info-renderer .content.ytd-metadata-row-renderer {width:auto; font-size:1.1rem; line-height:normal; white-space:normal;}  	  	#playlist.ytd-watch {margin-bottom:16px;}  	  	    /* Below Video */  	ytd-video-primary-info-renderer #count yt-view-count-renderer {float:right;}  	#bwp-likes {position:relative;}  	#bwp-likes #sentiment {bottom:0; width:100%;}  	  	ytd-video-primary-info-renderer #info #menu-container {order:1;}  	ytd-video-primary-info-renderer #info #flex {order:2;}  	ytd-video-primary-info-renderer #info #count {order:3;}  	  	  	  	"; 
script.retroCSS = "   	  	/*Retro CSS*/  	  	  	  	body:not([dark]) :not([style-scope]):not(.style-scope) {--yt-main-app-background: white;}  	  	body, input, textarea, select {font-family:arial,sans-serif;}    	#masthead-container.ytd-app::after {display:none;}  	#masthead {border-bottom: 1px solid var(--yt-swatch-primary-darker);}  	#container.ytd-masthead {height:49px;}  	  	  	/*#logo-icon.ytd-topbar-logo-renderer {background:url(https://s.ytimg.com/yt/img/master.png) 0px -641px; }  	#logo-icon.ytd-topbar-logo-renderer svg  {visibility:hidden;}  	#logo-icon.ytd-topbar-logo-renderer {width:99px; height:42px;}*/  	ytd-topbar-logo-renderer #country-code {display:none;}    	  	  	#page-manager.ytd-app {margin-top: 49px;}  	  	ytd-watch:not([theater]) #top.ytd-watch {margin-top:6px;}    	#bwp-title h1 {font-size:19px; font-weight:bold;}  	  	@media screen and (min-width: 1000px) {  		ytd-watch:not([theater]) #playlist.ytd-watch {margin-top:-30px; margin-bottom:40px;}  		  		ytd-watch:not([theater]) #meta {margin-top:-30px;}  	}  	ytd-video-secondary-info-renderer {background:#EEEEEE;  border:1px solid #CCCCCC; font-size:12px; padding:6px; margin-bottom:8px;}  	body[dark] ytd-video-secondary-info-renderer {background:var(--yt-playlist-background-item); border-color:var(--yt-border-color);}  	ytd-video-secondary-info-renderer a.yt-simple-endpoint:not(.ytd-button-renderer), ytd-video-secondary-info-renderer a.yt-simple-endpoint:not(.ytd-button-renderer):hover {color:#0033CC;}  	body[dark] ytd-video-secondary-info-renderer a.yt-simple-endpoint:not(.ytd-button-renderer), body[dark] ytd-video-secondary-info-renderer a.yt-simple-endpoint:not(.ytd-button-renderer):hover {color:var(--yt-endpoint-color);}  	ytd-video-secondary-info-renderer #top-row.ytd-video-secondary-info-renderer {margin-bottom:2px; }  	ytd-video-secondary-info-renderer #avatar.ytd-video-owner-renderer {border-radius:0; border:1px solid white; outline:1px solid #999999; margin:1px; margin-right:7px;}  	body[dark] ytd-video-secondary-info-renderer #avatar.ytd-video-owner-renderer  {outline-color:#1b1b1b; border-color:var(--yt-border-color);}  	ytd-video-secondary-info-renderer #upload-info.ytd-video-owner-renderer {justify-content:flex-start;}  	ytd-video-secondary-info-renderer #upload-info.ytd-video-owner-renderer > * {height:18px;}  	ytd-video-secondary-info-renderer #owner-name.ytd-video-owner-renderer {font-weight:bold; font-size:1em;}  	ytd-video-secondary-info-renderer #upload-info.ytd-video-owner-renderer .date.ytd-video-secondary-info-renderer { font-size:1em; color:var(--yt-primary-text-color);	}    	ytd-video-secondary-info-renderer ytd-expander.description.ytd-video-secondary-info-renderer {font-size:1em; line-height:normal;}  	  	ytd-video-secondary-info-renderer ytd-metadata-row-container-renderer {border-top:1px solid #CCCCCC; padding-top:2px; margin-top:8px;}  	body[dark] ytd-video-secondary-info-renderer ytd-metadata-row-container-renderer {border-color:var(--yt-border-color);}  	ytd-video-secondary-info-renderer ytd-metadata-row-renderer {margin:0; margin-top:2px; }  	ytd-video-secondary-info-renderer #title.ytd-metadata-row-renderer {width:auto; font-size:0.9em; line-height:normal;}  	ytd-video-secondary-info-renderer .content.ytd-metadata-row-renderer {width:auto; font-size:0.9em; line-height:normal; white-space:normal;}          	  	      #player.ytd-watch {margin-bottom:30px;}  	ytd-watch[theater] #player.ytd-watch {margin-bottom:46px;}  	#player-container {padding-bottom:30px; overflow:hidden;}  	#movie_player:not(.ytp-fullscreen) {overflow:visible; contain: layout style size;}  	#movie_player:not(.ytp-fullscreen) .ytp-player-content, #movie_player:not(.ytp-fullscreen) .ytp-settings-menu {bottom:8px;}  	#movie_player:not(.ytp-fullscreen) .ytp-player-content.html5-endscreen {bottom:39px; top:28px;}  	#movie_player:not(.ytp-fullscreen) .ytp-bottom {bottom:14px; top:auto !important;}  	#movie_player:not(.ytp-fullscreen) .ytp-gradient-bottom {display:none;}  	#movie_player:not(.ytp-fullscreen) .ytp-chrome-bottom {  background-color:#ccc; color:#000; text-shadow:none; border:0px solid #ccc; border-width: 0px 12px 0 12px; left:0 !important; opacity:1; bottom:-30px; height:27px;}       	#movie_player:not(.ytp-fullscreen) .ytp-progress-bar-container {bottom:27px;}  	#movie_player:not(.ytp-fullscreen) .ytp-progress-list {transform-origin:center bottom !important; background-color:#444; margin-left:-12px; }  	#movie_player:not(.ytp-fullscreen) .ytp-progress-bar-container:not(:hover) .ytp-progress-list {width:calc(100% + 24px) !important; }  	#movie_player:not(.ytp-fullscreen) .ytp-progress-bar-container:hover .ytp-progress-list {border:0px solid transparent; border-width:0px 12px 0px 12px; margin-right:-12px;}      	#movie_player:not(.ytp-fullscreen) .ytp-chrome-controls {padding-left:0; padding-right:0; margin-left:-12px; margin-right:-12px; height:27px; line-height:27px;}  	#movie_player:not(.ytp-fullscreen) .ytp-time-display {height:34px; margin-top:-3px; font-size:95%; line-height:34px;}  	#movie_player:not(.ytp-fullscreen) .ytp-time-separator, #movie_player:not(.ytp-fullscreen) .ytp-time-duration {color:#666;}  	#movie_player:not(.ytp-fullscreen) .ytp-chrome-controls .ytp-button, #movie_player:not(.ytp-fullscreen) .ytp-chrome-controls .ytp-volume-panel {color:#4d4d4d; opacity:1; height:34px; margin-top:-3px;}  	#movie_player:not(.ytp-fullscreen) .ytp-chrome-controls .ytp-volume-panel .ytp-volume-slider-handle:before, #movie_player:not(.ytp-fullscreen) .ytp-chrome-controls .ytp-volume-panel .ytp-volume-slider-handle, #movie_player:not(.ytp-fullscreen) .ytp-chrome-controls .ytp-volume-panel .ytp-volume-slider-handle:after {background-color:#4d4d4d;}  	#movie_player:not(.ytp-fullscreen) .ytp-chrome-controls .ytp-volume-panel .ytp-volume-slider-handle:after {opacity:0.35;}  	#movie_player:not(.ytp-fullscreen) .ytp-chrome-controls .ytp-button:hover {color:#3d3d3d;}  	#movie_player:not(.ytp-fullscreen) .ytp-chrome-controls .ytp-button .ytp-svg-fill, #movie_player:not(.ytp-fullscreen) .ytp-chrome-controls .ytp-button path[fill='#fff'] {fill:currentColor;}  	#movie_player:not(.ytp-fullscreen) .ytp-chrome-controls .ytp-button .ytp-svg-shadow {stroke:none;}    	  	body[dark] #movie_player:not(.ytp-fullscreen) .ytp-chrome-bottom {background-color:#1b1b1b; color:#fff; border-color:#1b1b1b;}      body[dark]  #movie_player:not(.ytp-fullscreen) .ytp-time-separator, body[dark]  #movie_player:not(.ytp-fullscreen) .ytp-time-duration {color:#999;}  body[dark]  #movie_player:not(.ytp-fullscreen) .ytp-chrome-controls .ytp-button, body[dark]  #movie_player:not(.ytp-fullscreen) .ytp-chrome-controls .ytp-volume-panel {color:#8E8E8E; }  body[dark]  #movie_player:not(.ytp-fullscreen) .ytp-chrome-controls .ytp-volume-panel .ytp-volume-slider-handle:before, body[dark] #movie_player:not(.ytp-fullscreen) .ytp-chrome-controls .ytp-volume-panel .ytp-volume-slider-handle, body[dark] #movie_player:not(.ytp-fullscreen) .ytp-chrome-controls .ytp-volume-panel .ytp-volume-slider-handle:after {background-color:#8E8E8E;}  body[dark] #movie_player:not(.ytp-fullscreen) .ytp-chrome-controls .ytp-button:hover {color:#EBEBEB;}   ";


// Defining dynamic script properties
script.cssMainLoaded = null;
script.cssRetroLoaded = null;
script.forceControlsTimer = null;
script.forceControlsListener = null;
script.watchSetupDone = false;

// Experimental settings may be removed. Changing these will likely disable automatic update checks in your script manager
script.applyStyleEverywhere = false; // - Apply style to all pages instead of just 'watch' pages. (default is false)


function pageSetup() {
	//console.log("pageFirstRun");
	
	$(document.createElement("div"))
		.attr("id", "bwp-retrostyle-toggle")
		.attr("class", "style-scope ytd-menu-renderer style-default")
		.attr("is-icon-button", "")
		.attr("button-renderer","")
		.attr("hidden","hidden")
		.html("<a is='yt-endpoint' tabindex='-1' class='style-scope ytd-button-renderer'><paper-icon-button src='"+script.icon+"'\" alt='Toggle Retro Style' title='Toggle Retro Style'></paper-icon-button><paper-tooltip>Toggle Retro Style</paper-tooltip></a>")
		.click(function() {
			GM_setValue("retrostyle", !GM_getValue("retrostyle", true));
			unloadCSS();
			loadCSS();
		})
		//.appendTo($("#top-level-buttons", buttons));
		.prependTo("ytd-masthead #end");
	
	if (script.applyStyleEverywhere) {
		loadCSS();
	}
	
	typeChange();
	$("ytd-app").on("yt-page-type-changed", typeChange);
}

function typeChange() {
	//console.log("typeChange");
	if ($("#page-manager ytd-watch:not([hidden]), #page-manager ytd-watch.loading").length > 0) {
		if (!script.watchSetupDone) {
			watchSetup();
		} 
		watchApply();
	} else {
		if (script.watchSetupDone) {
			watchCleanup();
		}
	}
}

function watchSetup() {
	//console.log("watchSetup");
	script.watchSetupDone = true;
	
	// Move description & channel details to the right-side column
	$("#main > #meta").insertBefore("#player-ads").addClass("rsd-description");
	
	// Title container
	$(document.createElement("div"))
		.attr("id", "bwp-title")
		.prependTo("#top");
	
	
	
	dataRun();
	$("ytd-app").on("yt-update-title", dataRun);
	//yt-page-data-updated ?
	
}

function watchApply() {
	//console.log("watchApply");
	if (!script.applyStyleEverywhere) {
		loadCSS();
		$("#bwp-retrostyle-toggle").removeAttr("hidden");
	}
	applyRetroPlayer(GM_getValue("retrostyle", true));
	
}
function watchCleanup() {
	//console.log("watchCleanup");
	if (!script.applyStyleEverywhere) {
		unloadCSS();
		$("#bwp-retrostyle-toggle").attr("hidden","hidden");
	}
	applyRetroPlayer(false);
}


function dataRun() {
	//console.log("dataRun");
	
	setTimeout(function() { // These don't generate until after yt-update-title, need to find another event to listen to
		//console.log("dataRun - delayed section");
		// Expand description
		$("#meta.rsd-description ytd-expander #more").click();
				
		// Video title
		$("#bwp-title").empty(); // Remove any existing
		//console.log($("ytd-video-primary-info-renderer #container h1"));
		$("ytd-video-primary-info-renderer #container h1").clone().appendTo("#bwp-title");
		
		// Arrange views, likes, buttons
		var belowvid = $("ytd-watch #top ytd-video-primary-info-renderer > #container > #info");
		var flex = $("> #flex", belowvid);
		var buttons = $("> #menu-container", belowvid);
		var views = $("> #count", belowvid);
		//buttons.insertBefore(flex);
		//views.insertAfter(flex);
		$(document.createElement("div"))
			.attr("id", "bwp-likes")
			.appendTo(views);
		//$("> #menu #top-level-buttons ytd-toggle-button-renderer, > ytd-sentiment-bar-renderer", buttons).appendTo("#bwp-likes");
		//$(" > ytd-sentiment-bar-renderer", buttons).appendTo("#bwp-likes");
		//$("> #menu #top-level-buttons ytd-toggle-button-renderer", buttons).appendTo("#bwp-likes");
		
		
		
	}, 1);

}

$(document).one("yt-navigate-finish", pageSetup);


// possible script points
// yt-update-title on ytd-app - seems to run when data changes?
// yt-page-type-changed on ytd-app - for detecting if they've move away from video or back
// yt-page-data-updated on body - may run after all data changed?
// yt-navigate-finish on document - same as above?

function loadCSS() {
	if (!script.cssMainLoaded) {
		script.cssMainLoaded = GM_addStyle(script.mainCSS);
		$("html").addClass("bwpScript").addClass("rsd_style");
	}
	if (!script.cssRetroLoaded && GM_getValue("retrostyle", true)) {
		script.cssRetroLoaded = GM_addStyle(script.retroCSS);
		$("html").addClass("bwpRetro").addClass("rsd_retro_style");
		applyRetroPlayer(true);
	}
}
function unloadCSS() {
	if (script.cssMainLoaded) {
		$(script.cssMainLoaded).remove();
		script.cssMainLoaded = null;
		$("html").removeClass("bwpScript").removeClass("rsd_style");
	}
	if (script.cssRetroLoaded) {
		$(script.cssRetroLoaded).remove();
		script.cssRetroLoaded = null;
		$("html").removeClass("bwpRetro").removeClass("rsd_retro_style");
		applyRetroPlayer(false);
	}
}

function applyRetroPlayer(activate) {
	if (activate) {
		if (!script.forceControlsTimer) {
			var mouseMoveEvent = new Event('mousemove');
			script.forceControlsTimer = setInterval(function() {
				if (!document.hidden) {
					$("#movie_player.playing-mode:not(.ytp-fullscreen)")[0].dispatchEvent(mouseMoveEvent);
				}
			}, 1000);
		}
		if (!script.forceControlsListener) {
			script.forceControlsListener = function() {
				if (!document.hidden) {
					var mouseMoveEvent = new Event('mousemove');
					$("#movie_player.playing-mode:not(.ytp-fullscreen)")[0].dispatchEvent(mouseMoveEvent);
				}
			}
			$(document).on("visibilitychange", script.forceControlsListener);
		}
	} else {
		if (script.forceControlsTimer) {
			clearInterval(script.forceControlsTimer);
			script.forceControlsTimer = null;
		}
		if (script.forceControlsListener) {
			$(document).off("visibilitychange", script.forceControlsListener);
			script.forceControlsListener = null;
		}		
	}
}




/* unfinished/unsupported 
var supportsDeep = false;
if (Boolean(Element.prototype.createShadowRoot) && !window.ShadowDOMPolyfill) {
	supportsDeep = true;
}
function t$(template, selector) {
	if (supportsDeep) {
		return $("body /deep/ "+template + " " + selector);
	} else {
		return $("dom-module#"+template + " template " + selector);
	}
}*/




// End of script
Greasy Fork镜像

[BETA VERSION] Youtube - Right Side Description

赞助商

广告
