Video Full Screen In Tab

让所有视频网页全屏 Maximize all video players

Устаревшая версия за 22.09.2014. Перейдите к последней версии.

Чтобы установить этот скрипт, вы сначала должны установить расширение браузера, например Tampermonkey, Greasemonkey или Violentmonkey.

Для установки этого скрипта вам необходимо установить расширение, такое как Tampermonkey.

Чтобы установить этот скрипт, вы сначала должны установить расширение браузера, например Tampermonkey или Violentmonkey.

Чтобы установить этот скрипт, вы сначала должны установить расширение браузера, например Tampermonkey или Userscripts.

Чтобы установить этот скрипт, сначала вы должны установить расширение браузера, например Tampermonkey.

Чтобы установить этот скрипт, вы должны установить расширение — менеджер скриптов.

(у меня уже есть менеджер скриптов, дайте мне установить скрипт!)

Чтобы установить этот стиль, сначала вы должны установить расширение браузера, например Stylus.

Чтобы установить этот стиль, сначала вы должны установить расширение браузера, например Stylus.

Чтобы установить этот стиль, сначала вы должны установить расширение браузера, например Stylus.

Чтобы установить этот стиль, сначала вы должны установить расширение — менеджер стилей.

Чтобы установить этот стиль, сначала вы должны установить расширение — менеджер стилей.

Чтобы установить этот стиль, сначала вы должны установить расширение — менеджер стилей.

(у меня уже есть менеджер стилей, дайте мне установить скрипт!)

// ==UserScript==
// @name        Video Full Screen In Tab
// @namespace   http://www.icycat.com
// @description 让所有视频网页全屏 Maximize all video players
// @author      冻猫
// @include     *
// @version     2.5
// @grant       none
// @run-at      document-end
// ==/UserScript==

(function() {

	var fullStatus = false,
		parentArray = new Array(),
		parentStyle = new Array(),
		btnText, player, parent, backStyle, controlBtn, leftBtn, rightBtn, observer;

	var language = navigator.language;
	if (navigator.language == 'zh-CN') {
		btnText = {
			out: '网页全屏',
			inner: '内层全屏'
		};
	} else {
		btnText = {
			out: 'Maximize',
			inner: 'Maximize'
		};
	}

	createButton();
	createFullButton();

	observer = new MutationObserver(function(mutation) {
		if (fullStatus) {
			observer.disconnect();
			if (parent.style.width != '100%') {
				backStyle.parentWidth = parent.style.width;
			}
			if (parent.style.height != '100%') {
				backStyle.parentHeight = parent.style.height;
			}
			resizeHandle();
			observer.observe(parent, {
				attributes: true
			});
		} else {
			if (player.offsetWidth == document.body.scrollWidth && player.offsetHeight == document.body.scrollHeight) {
				observer.disconnect();
				controlBtn.style.opacity = '';
				controlBtn.style.visibility = '';
			}
		}
	});

	document.addEventListener('mouseover', getPlayer, false);

	function getPlayer(e) {
		if (fullStatus) return;
		var target = e.target;
		var nodeName = target.nodeName;
		switch (nodeName) {
			case 'OBJECT':
			case 'EMBED':
				if (target.type == 'application/x-shockwave-flash' && target.offsetWidth > 99 && target.offsetHeight > 99) {
					player = target;
					parent = player.parentNode;
					if (parent.nodeName == 'OBJECT') {
						parent = parent.parentNode;
					}
					buttonHandle();
				}
				break;
			case 'IFRAME':
			case 'VIDEO':
				if (target.offsetWidth > 99 && target.offsetHeight > 99) {
					player = target;
					parent = player.parentNode;
					buttonHandle();
				}
				break;
		}
	}

	function createButton() {
		addStyle('#playerControlBtn {visibility:hidden;opacity:0;transition: all 0.5s ease;cursor: pointer;font: 12px "微软雅黑";padding: 2px 2px 3px 2px;margin:0;width:60px;height:16px;text-align: center;position: absolute;z-index:2147483646;background-color: #27A9D8;color: #FFF;} #playerControlBtn:hover {visibility:visible;opacity:1;}');
		var btn = document.createElement('tbdiv');
		btn.id = 'playerControlBtn';
		btn.onclick = function() {
			playerControl();
		};
		document.body.appendChild(btn);
		controlBtn = document.getElementById('playerControlBtn');
	}

	function createFullButton() {
		var leftButton = document.createElement('tbdiv');
		leftButton.id = 'leftFullStackButton';
		leftButton.onclick = function() {
			playerControl();
		};
		document.body.appendChild(leftButton);
		addStyle('#leftFullStackButton{display:none;position:fixed;width:1px;height:100%;top:0;left:0;z-index:2147483646;}');
		var rightButton = document.createElement('tbdiv');
		rightButton.id = 'rightFullStackButton';
		rightButton.onclick = function() {
			playerControl();
		};
		document.body.appendChild(rightButton);
		addStyle('#rightFullStackButton{display:none;position:fixed;width:1px;height:100%;top:0;right:0;z-index:2147483646;}');
		leftBtn = document.getElementById('leftFullStackButton');
		rightBtn = document.getElementById('rightFullStackButton');
	}

	function buttonHandle() {
		if (player.offsetWidth == document.body.scrollWidth && player.offsetHeight == document.body.scrollHeight) {
			return;
		}
		observer.observe(parent, {
			attributes: true
		});
		player.addEventListener('mouseleave', hideHandle, false);
		controlBtn.style.visibility = 'visible';
		controlBtn.style.opacity = '0.5';
		buttonRect();
	}

	function buttonRect() {
		var playerRect = getRect(player);
		if (playerRect.pageY < 21) {
			playerRect.pageY = playerRect.pageY + 26;
			playerRect.pageX = playerRect.pageX - 5;
			if (navigator.userAgent.match(/Firefox/i)) {
				controlBtn.style.opacity = '1';
			}
			controlBtn.innerHTML = btnText.inner;
		} else {
			controlBtn.innerHTML = btnText.out;
		}
		controlBtn.style.top = playerRect.pageY - 21 + 'px';
		controlBtn.style.left = playerRect.pageX - 64 + player.offsetWidth + 'px';
	}

	function hideHandle() {
		controlBtn.style.opacity = '';
		controlBtn.style.visibility = '';
		observer.disconnect();
		player.removeEventListener('mouseleave', hideHandle, false);
	}

	function getRect(element) {
		var rect = element.getBoundingClientRect();
		var scrollLeft = document.documentElement.scrollLeft || document.body.scrollLeft;
		var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
		return {
			pageX: rect.left + scrollLeft,
			pageY: rect.top + scrollTop,
			screenX: rect.left,
			screenY: rect.top
		};
	}

	function addStyle(css) {
		var style = document.createElement('style');
		style.type = 'text/css';
		var node = document.createTextNode(css);
		style.appendChild(node);
		document.head.appendChild(style);
	}

	function playerControl() {
		checkPlayer();
		if (!fullStatus) {
			fullWin();
			observer.observe(parent, {
				attributes: true
			});
		} else {
			observer.disconnect();
			smallWin();
		}
	}

	function checkPlayer() {
		parentArray = [];
		var full = parent;
		while (full = full.parentNode) {
			if (full.getAttribute) {
				parentArray.push(full);
			}
			if (full.nodeName == 'HTML') break;
		}
	}

	function resizeHandle() {
		if (parent.style.width != '100%' || parent.style.height != '100%') {
			fullWin();
		}
	}

	function fullWin() {
		if (!fullStatus) {
			document.removeEventListener('mouseover', getPlayer, false);
			window.addEventListener('resize', resizeHandle, false);
			backStyle = {
				html: document.body.parentNode.style.overflow,
				body: document.body.style.overflow,
				parent: parent.style.cssText,
				parentWidth: parent.style.width,
				parentHeight: parent.style.height,
				player: player.style.cssText
			};
			leftBtn.style.display = 'block';
			rightBtn.style.display = 'block';
			controlBtn.style.display = 'none';
			controlBtn.style.visibility = '';
			if (player.nodeName == 'VIDEO') {
				backStyle.controls = player.controls;
				player.controls = true;
			}
		}
		document.body.parentNode.style.overflow = 'hidden';
		document.body.style.overflow = 'hidden';
		for (var i = 0; i < parentArray.length; i++) {
			if (!fullStatus) {
				parentStyle[i] = {
					zIndex: parentArray[i].style.zIndex
				};
			}
			parentArray[i].style.setProperty('z-index', 'auto', 'important');
		}
		parent.style.cssText = 'width:100%;height:100%;margin:0px !important;padding:0px !important;top:0px !important;left:0px !important;z-index:2147483645 !important;overflow:hidden !important;position:fixed !important;background:#000 !important;border:none !important;display:block !important;';
		player.style.cssText = 'display:' + getComputedStyle(player).display + ' !important;visibility:' + getComputedStyle(player).visibility + ' !important;width:calc(100% - 2px) !important;height:100% !important;z-index:2147483645 !important;position:relative !important;border:none !important;';
		var rect = player.getBoundingClientRect();
		player.style.left = (1 - rect.left) + 'px';
		player.style.top = (0 - rect.top) + 'px';
		fullStatus = true;
	}

	function smallWin() {
		window.removeEventListener('resize', resizeHandle, false);
		document.body.parentNode.style.overflow = backStyle.html;
		document.body.style.overflow = backStyle.body;
		for (var i = 0; i < parentArray.length; i++) {
			parentArray[i].style.zIndex = parentStyle[i].zIndex;
		}
		parent.style.cssText = backStyle.parent;
		parent.style.width = backStyle.parentWidth;
		parent.style.height = backStyle.parentHeight;
		player.style.cssText = backStyle.player;
		if (player.nodeName == 'VIDEO') {
			player.controls = backStyle.controls;
		}
		leftBtn.style.display = 'none';
		rightBtn.style.display = 'none';
		controlBtn.style.display = 'block';
		document.addEventListener('mouseover', getPlayer, false);
		fullStatus = false;
	}

})();