ExtendYouPorn

Remove ads, enlarges video, stops autoplay keeping buffering, fixes the overhaul style & block pop-ups

As of 2015-07-31. See the latest version.

// ==UserScript==
// @author			Jack_mustang
// @version			3.13.1
// @name			ExtendYouPorn
// @description		Remove ads, enlarges video, stops autoplay keeping buffering, fixes the overhaul style & block pop-ups
// @date			2015 July 31
// @include			*youporn.com/*
// @include			*youporngay.com/*
// @run-at			document-start
// @grant			none
// @license			Public Domain
// @icon			https://gmgmla.dm2301.livefilestore.com/y2pYluU8jK3EnLV1U8D92pYCC9wU5O04Il4j64Ft_pjKGpUG_I5L0fUHrsLpUB4oDCLIJdWp9Bwmr0RPMdhJhl5Bo362RwjatCFUpNjEdMosGA/EYP-logo.jpg
// @namespace		14fac5d83892686b90beea51d35d1d7dbcfe49b6
// ==/UserScript==
var ExtendYP = function ExtendYouPorn(){
	// Pop-up killer, we trick YP to think we are old Presto Opera, this kills the pop-ups
	if (!window.opera)
		window.opera = true

	addStyle()

	window.addEventListener('DOMContentLoaded', function(){
		// Remove ads functions
		function removeQuery(query) {
			var ifr = document.querySelectorAll(query)
			if(ifr.length > 0)
				for(var i=0; i < ifr.length; i++)
					ifr[i].parentNode.removeChild(ifr[i])
		}
		// Advertisements
		removeQuery(".advertisement")
		// Remove right banners in video page
		removeQuery(".adSpace")
		// Remove footer ad in video page
		removeQuery(".advertisement_watchFooter")
		// Remove video bottom ad
		removeQuery(".ad-bottom")
		// Remove iframes because they are ads
		removeQuery("iframe")

		// Set tooltips for the titles
		var titles = document.getElementsByClassName('videoTitle')
		if(titles.length > 0)
			for(i=0; i < titles.length; i++)
				titles[i].setAttribute('title', titles[i].innerHTML)

		/* Video page */
		if(document.getElementById('videoContainer')) {
			var rightColumn = document.querySelector('.right-column'),
				videoWrapper = document.getElementById('videoWrapper')
			rightColumn.setAttribute('class', 'right-column large')
			videoWrapper.setAttribute('class', 'large')

			// Delete duplicate video element
			var video = document.querySelectorAll('video')
			if (video !== null) {
				for (var i = video.length - 1; i >= 1; i--)
					video[i].parentNode.removeChild(video[i])
				if (navigator.userAgent.search("Firefox/") === -1) {
					video[0].setAttribute("onclick", "var vid = event.target;if(vid.paused)vid.play();else vid.pause()")
					video[0].setAttribute("onmouseover", "event.target.controls = true")
					video[0].setAttribute("onmouseout", "event.target.controls = false")
				}
			}

			// Change player
			var player = document.getElementById('videoContainer'),
				vidId = parseInt(videoJason.video_id),
			newflashvars = document.createElement("script")
			newflashvars.setAttribute("type", "text/javascript")
			newflashvars.id = "EYP-newflashvars"
			newflashvars.innerHTML =
			'flashvars['+vidId+'].autoplay = false;'+
			'flashvars['+vidId+'].autoload = true;'+
			'flashvars['+vidId+'].disablePauseroll = true;'
			player.insertBefore(newflashvars, player.childNodes[0])

			// Scroll video to middle of page
			function scrollthere() {
				var player = document.getElementById('videoContainer'),
					vh = (document.getElementById('videoWrapper').getAttribute('class') == 'large')? 640 : player.offsetHeight,
					vd = (player.parentNode.offsetTop == 0)? ((document.querySelector('#studioCanvas'))? document.querySelector('.grid_8.alpha').offsetTop : document.querySelector('.watchWrapper').offsetTop+document.querySelector('#videoCanvas').offsetTop ) : player.parentNode.offsetTop,
					fh = window.innerHeight;
					sc = vd-((fh-vh)/2)
				scrollTo(0, sc)
				console.info("** ExtendYouPorn **\ntop: "+vd+", height: "+vh+", scrolled: "+sc+", window: "+fh)
			}
			// Inject this function to page
			var script = document.createElement("script")
			script.setAttribute("type", "text/javascript")
			script.innerHTML = scrollthere.toString() + "scrollthere();"
			script.id = "EYP-scrollVid"
			document.body.appendChild(script)

			// Include button in right corner to center video on screen
			var node = document.createElement("div")
			node.setAttribute("style","position: fixed; bottom: 0; right: 0; cursor: pointer; border-top-left-radius: 10px; color: #fff; text-shadow: 1px 1px 1px #292929; font-weight: 700; background: url('http://cdn1.static.youporn.phncdn.com/cb/bundles/manwinyoupornwebfront/images/sprite-watch-bg.png?v=1358797378') 0px -42px repeat-x transparent; text-align: center; font-size: 1.2em; padding: 7px;z-index: 999999;")
			node.setAttribute("onclick", "scrollthere();")
			node.innerHTML = "Center video"
			node.id = "EYP-scroll"
			document.body.appendChild(node)
		}
	},false)

	function addStyle() {
		// While <head> is not loaded we keep trying
		if (!document.querySelector("head"))
			return setTimeout(addStyle, 50)

		// We create an object and start including its content to include in DOM at the end
		var eypcss =
		// Hide ads while we can't remove them
		".advertisement, .adSpace, .advertisement_watchFooter, .ad-bottom, #videoCanvas .grid_5, #adblock_1 {\n\
			display: none !important;\n\
		}\n" +
		// Fix ::selection
		"::selection {\n\
			background: #FFACC0;\n\
			color: #fff;\n\
		}\n\
		::moz-selection {\n\
			background: #FFACC0;\n\
			color: #fff;\n\
		}\n" +
		// Videos Being Watched Right Now in one line
		".videoList.vbwn ul {\n\
			margin: 0 !important;\n\
			width: 100% !important;\n\
		}\n\
		.videoList.count-6 ul li.videoBox.grid_3 {\n\
			margin: 0 10px 10px 0 !important;\n\
		}\n\
		.vbwn .omega {\n\
			display: none !important;\n\
		}\n\
		.videoList.count-6 ul .videoBox.grid_3:nth-child(5) {\n\
			margin-right: 0 !important;\n\
		}\n\
		.videoList.count-6.vbwn ul li.videoBox.grid_3:nth-child(4n) {\n\
			clear: none !important;\n\
		}\n\
		@media only screen and (max-width: 9999px) {\n\
			.videoList.count-6 ul li.videoBox.grid_3, [data-current-action='dashboard'] .videoList ul li.videoBox.grid_3 {\n\
				margin: 0 1% 1% 0 !important;\n\
			}\n\
		}\n\
		@media only screen and (max-width: 1699px) and (min-width: 1280px) {\n\
			.videoList.count-6 ul li.videoBox.grid_3, [data-current-action='dashboard'] .videoList ul li.videoBox.grid_3 {\n\
				width: 23.9% !important;\n\
			}\n\
			.videoList.count-6 ul li.videoBox.grid_3:nth-child(4n), [data-current-action='dashboard'] .videoList ul li.videoBox.grid_3:nth-child(4n) {\n\
				margin-right: 0 !important;\n\
			}\n\
			.videoList ul li.videoBox.subscription.grid_3:last-child {\n\
				display: none;\n\
			}\n\
		}\n\
		@media only screen and (min-width: 1700px) {\n\
			.videoList.count-6 ul li.videoBox.grid_3, [data-current-action='dashboard'] .videoList ul li.videoBox.grid_3 {\n\
				width: 18.9% !important;\n\
			}\n\
			[data-current-action='dashboard'] .videoList ul li.videoBox.grid_3:nth-child(5n) {\n\
				margin-right: 0 !important;\n\
			}\n\
		}\n" +
		// Video page
		"video {\n\
			position: absolute;\n\
		}\n\
		#no_flash_player_message {\n\
			display: block !important;\n\
		}\n" +
		// User pages - Dashboard
		".wrapTitle.grid_9 {\n\
			width: 100% !important;\n\
		}\n" +
		// Fix last element non-clickable on festive skins
		"#watchBottom {\n\
			position: relative;\n\
			z-index: 1;\n\
		}\n" +
		/* Channel pages */
		"#channelCanvas .grid_3 {\n\
			width: 25% !important;\n\
		}\n"

		// Inject created CSS
		var eypnode = document.createElement("style")
			eypnode.type = "text/css"
			eypnode.id = "EYP-style"
			eypnode.appendChild(document.createTextNode(eypcss))
		document.head.appendChild(eypnode)
	}
}();