Resize the video player for various sites to the window size.
目前為
// ==UserScript==
// @name Resize Video To Window Size
// @description Resize the video player for various sites to the window size.
// @author Chris H (Zren / Shade)
// @namespace http://xshade.ca
// @version 20
// @include http://www.crunchyroll.com/*
// @include https://docs.google.com/file/*
// @include https://drive.google.com/drive/*
// @include https://drive.google.com/file/*
// @include https://vimeo.com/*
// @include http://onepieceofficial.com/videos.aspx*
// @include http://www.onepieceofficial.com/videos.aspx*
// @include http://eachvideo.com/watch*
// @include http://olympics.cbc.ca/video/live/*
// @include http://olympics.cbc.ca/video/vod/*
// @include http://www.dailymotion.com/video/*
// @include http://www.dailymotion.com/playlist/*
// @include https://www.dailymotion.com/video/*
// @include https://www.dailymotion.com/playlist/*
// @include http://www.globaltv.com/thelateshowwithstephencolbert/video/*
// @grant GM_addStyle
// ==/UserScript==
(function() {
var fixedOverlayPlayer = function(selector) {
var css = selector + "{";
css += "position: fixed;";
css += "top: 0;";
css += "left: 0;";
css += "right: 0;";
css += "bottom: 0;";
css += "}";
GM_addStyle(css);
};
var absoluteTopPlayer = function(selector, staticSelectors) {
var css = selector + "{";
css += "position: absolute;";
css += "top: 0;";
css += "left: 0;";
css += "width: 100vw;";
css += "height: 100vh;";
css += "padding: 0;";
css += "margin: 0;";
css += "}";
css += "body {";
css += "margin-top: 100vh;";
css += "margin-top: 100vh;";
css += "padding-top: 0;";
css += "}";
if (staticSelectors) {
css += staticSelectors + "{";
css += "position: static";
css += "}";
}
GM_addStyle(css);
};
var movedTopPlayer = function(videoBoxElement) {
console.log('document.body', document.body, document.body.firstChild)
console.log('videoBoxElement', videoBoxElement)
document.body.insertBefore(videoBoxElement, document.body.firstChild);
videoBoxElement.style.width = '100%';
videoBoxElement.style.height = '100%';
videoBoxElement.style.backgroundColor = '#000';
};
var urlMatch = function(regexStr) {
regexStr = regexStr.replace(/\//g, '\\/'); // Auto escape forward slashes to make url regexes more legible.
var regex = new RegExp(regexStr);
return regex.exec(window.location.href);
};
if (window.location.href.match(/^http:\/\/www\.crunchyroll\.(com|ca)\/.+\/.+-\d+\/?/)) {
var videoBoxElement = document.getElementById('showmedia_video_box') || document.getElementById('showmedia_video_box_wide');
if (!videoBoxElement) return;
movedTopPlayer(videoBoxElement);
var css = 'html, body { width: 100%; height: 100%; }';
css += '#showmedia_video_box, #showmedia_video_box_wide, #showmedia_video_player { width: 100%; height: calc(100vh + 32px) !important; }';
GM_addStyle(css);
} else if (document.location.href.startsWith('https://docs.google.com/file/')) {
fixedOverlayPlayer('#drive-viewer-video-player-object-0');
var css = 'body:not(:hover) .ytp-chrome-bottom { opacity: 0 !important; }';
css += 'body:not(:hover) .drive-viewer-toolstrip { opacity: 0 !important; }';
GM_addStyle(css);
} else if (document.location.href.startsWith('https://drive.google.com/')) {
fixedOverlayPlayer('.drive-viewer-video-player');
var css = '.drive-viewer-toolstrip { opacity: 0 !important; }';
css += '.drive-viewer-toolstrip:hover { opacity: 1 !important; }';
GM_addStyle(css);
} else if (document.location.href.startsWith('https://vimeo.com/')) {
if (! /\/\d+/.exec(document.location.pathname))
return;
var css = '.player_area-wrapper, .player_area, .player_container, .player, .video-wrapper, .video, .video * { width: 100vw !important; height: 100vh !important; max-height: 100vh !important; }';
css += '.clip_main > *:not(.player_area-wrapper) { margin-top: 70px; }';
css += '.VimeoBrand_ColorRibbon, .body_ribbon, .topnav_desktop, .topnav_mobile { position: absolute; top: 100vh; width: 100%; }';
css += '.topnav_desktop { top: calc(100vh + 5px); }';
GM_addStyle(css);
// autoplay
function tick() {
var e = document.querySelector('button.play[aria-label="Play"]');
if (e) {
e.click();
} else {
setTimeout(tick, 100);
}
}
setTimeout(tick, 100);
} else if (document.location.host.endsWith('onepieceofficial.com')) {
movedTopPlayer(document.querySelector('#FUNimationVideo'));
} else if (document.location.host.endsWith('eachvideo.com')) {
absoluteTopPlayer('.videoWrapper', '.navbar.navbar-default.navbar-fixed-top.bs-docs-nav, .col-md-8.row-border');
} else if (document.location.host == 'olympics.cbc.ca') {
if (document.querySelector('figure.cbc-video--thumb-wrapper.cbc-big[style="display: none;"]')) {
// Sports video
movedTopPlayer(document.querySelector('.cbc-video--player-wrapper'));
var css = 'body.asdf-16x9 .cbc-video--player-wrapper { width: 100vw !important; height: calc(27px + 100vh + 59px) !important; position: absolute; top: -27px; }';
css += 'body.asdf-16x9 .cbc-video--player-wrapper.cbc-live-or-full-evt:hover { top: calc(-27px - 59px); }';
css += 'body.asdf-16x9 { margin-top: 100vh; }';
//css += 'body.asdf-fill-height .cbc-video--player-wrapper { width: calc((100vh - 60px - 59px) * 1.777777777) !important; height: 100vh !important; margin: 0 auto; }';
//css += 'body.asdf-fill-width .cbc-video--player-wrapper { width: 100vw !important; height: calc(60px + 56.25vw + 59px) !important; }';
GM_addStyle(css);
function onResize() {
var height = 59 + window.innerWidth * 0.5625 + window.innerHeight * 0.06;
var ratio = window.innerWidth / window.innerHeight;
console.log('onResize', height, ratio)
if (1.7 <= ratio && ratio <= 1.8 ) { // 16:9 = 1.7777777...
document.body.classList.remove('asdf-fill-width');
document.body.classList.remove('asdf-fill-height');
document.body.classList.add('asdf-16x9');
} else if (height > window.innerHeight) {
document.body.classList.remove('asdf-fill-width');
document.body.classList.remove('asdf-16x9');
document.body.classList.add('asdf-fill-height');
var videoBoxElement = document.querySelector('.cbc-video--player-wrapper');
videoBoxElement.style.width = "calc((100vh - 27px - 59px) * 1.777777777)";
videoBoxElement.style.height = "100vh";
videoBoxElement.style.margin = '0 auto';
} else {
document.body.classList.remove('asdf-fill-height');
document.body.classList.remove('asdf-16x9');
document.body.classList.add('asdf-fill-width');
var videoBoxElement = document.querySelector('.cbc-video--player-wrapper');
videoBoxElement.style.width = "100vw";
videoBoxElement.style.height = "calc(27px + 56.25vw + 59px)";
}
}
window.addEventListener('resize', onResize);
window.addEventListener('click', function(){
setTimeout(onResize, 1000);
});
onResize();
} else {
// Regular video
movedTopPlayer(document.querySelector('.cbc-video'));
var css = 'figure.cbc-video--thumb-wrapper.cbc-big { height: 100%; margin: 0; }';
css += 'figure.cbc-video--thumb-wrapper.cbc-big picture { width: 100%; }';
css += 'figure.cbc-video--thumb-wrapper.cbc-big picture img { width: 100%; }';
GM_addStyle(css);
function onResize() {
var videoBoxElement = document.querySelector('.cbc-video--player-wrapper');
var height = 26 + window.innerWidth * 0.5625;
if (height > window.innerHeight) {
videoBoxElement.style.width = "calc((100vh - 26px) * 1.77777777)";
videoBoxElement.style.height = "100vh";
videoBoxElement.style.margin = '0 auto';
} else {
videoBoxElement.style.width = "100vw";
videoBoxElement.style.height = "calc(26px + 56.25vw)";
}
}
window.addEventListener('resize', onResize);
onResize();
}
} else if (document.location.host.endsWith('www.dailymotion.com')) {
var css = '#player:not(:hover) .dmp_will-transition.dmp_is-transitioned--fadeinslide { opacity: 0; }';
if (document.location.pathname.startsWith('/playlist')) {
css += '#player_container { height: 100vh!important; width: 100vw!important; }';
css += '#playerv5-iframe { width: 100% !important; height: 100% !important; }'; // playlists
movedTopPlayer(document.querySelector('#player_container'));
absoluteTopPlayer('#player_container');
} else { // startsWith('/video')
css +='.main-container-player { display: none; }';
css += '#player { height: 100vh!important; width: 100vw!important; }';
movedTopPlayer(document.querySelector('#player'));
}
GM_addStyle(css);
} else if (document.location.host.endsWith('www.globaltv.com')) {
movedTopPlayer(document.querySelector('#shawVideo_PlayerContainer'));
var css = "#shawVideo_PlayerContainer { padding-top: 0 !important; padding-bottom: 0 !important; width: 100vw !important; height: 100vh !important; }";
GM_addStyle(css);
}
GM_addStyle('html::-webkit-scrollbar { width: 0; height: 0; } body::-webkit-scrollbar { width: 0; height: 0; }');
})();