让所有视频网页全屏
目前為
// ==UserScript==
// @name Video Full Screen In Tab
// @namespace http://www.icycat.com
// @description 让所有视频网页全屏
// @author 冻猫
// @include *
// @version 2.1
// @grant none
// @run-at document-end
// ==/UserScript==
(function() {
var isOver = false,
fullStatus = false,
parentArray = new Array(),
parentStyle = new Array(),
player, parent, backStyle, controlBtn, leftBtn, rightBtn, observer;
createButton();
createFullButton();
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 > 299 && target.offsetHeight > 199) {
player = target;
buttonRect();
}
break;
case 'IFRAME':
case 'VIDEO':
if (target.offsetWidth > 299 && target.offsetHeight > 199) {
player = target;
buttonRect();
}
break;
default:
if (isOver) return;
controlBtn.style.opacity = '0';
controlBtn.style.visibility = 'hidden';
return;
}
}
function createButton() {
addStyle('#playerControlBtn {visibility:hidden;opacity:0;cursor: pointer;font: 12px "微软雅黑";padding: 2px 2px 3px 2px;margin:0;width:60px;height:16px;text-align: center;transition: all 0.5s ease-out;position: absolute;z-index:2147483646;background-color: #27A9D8;color: #FFF;}');
var btn = document.createElement('tbdiv');
btn.id = 'playerControlBtn';
btn.onclick = function() {
playerControl();
};
btn.onmouseover = function() {
isOver = true;
controlBtn.style.visibility = 'visible';
controlBtn.style.opacity = '1';
};
btn.onmouseout = function() {
isOver = false;
}
btn.appendChild(document.createTextNode('网页全屏'));
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 buttonRect() {
var rect = player.getBoundingClientRect();
var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
var scrollLeft = document.documentElement.scrollLeft || document.body.scrollLeft;
var top = rect.top + scrollTop;
var left = rect.left + scrollLeft;
controlBtn.style.top = (top - 21) + 'px';
controlBtn.style.left = (left + player.offsetWidth - 64) + 'px';
controlBtn.style.visibility = 'visible';
controlBtn.style.opacity = '0.5';
}
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();
if (!observer) {
observer = new MutationObserver(function(mutation) {
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
});
});
}
observer.observe(parent, {
'attributes': true
});
} else {
observer.disconnect();
smallWin();
}
}
function checkPlayer() {
parentArray = [];
parent = null;
var full = player;
while (full = full.parentNode) {
if (full.getAttribute && full.nodeName != 'OBJECT') {
if (!parent) {
parent = full;
} else {
parentArray.push(full);
}
}
if (full.nodeName == 'HTML') break;
}
}
function resizeHandle() {
if (parent.style.width != '100%' || parent.style.height != '100%') {
fullWin();
}
}
function fullWin() {
if (!fullStatus) {
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 = 'hidden';
}
document.body.parentNode.style.overflow = 'hidden';
document.body.style.overflow = 'hidden';
for (var i = 0; i < parentArray.length; i++) {
if (!fullStatus) {
parentStyle[i] = {
position: parentArray[i].style.position
};
}
parentArray[i].style.setProperty('position', 'static', '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:inline !important;';
player.style.cssText = 'width:calc(100% - 2px) !important;height:100% !important;z-index:2147483645 !important;position:relative !important;visibility:visible !important;display:inline !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.position = parentStyle[i].position;
}
parent.style.cssText = backStyle.parent;
parent.style.width = backStyle.parentWidth;
parent.style.height = backStyle.parentHeight;
player.style.cssText = backStyle.player;
leftBtn.style.display = 'none';
rightBtn.style.display = 'none';
controlBtn.style.display = 'block';
fullStatus = false;
}
})();