Resizes a video on the Escapist's video section, centers it and autoplays it
- // ==UserScript==
- // @name Escapist video section cleaner
- // @version 0.04
- // @description Resizes a video on the Escapist's video section, centers it and autoplays it
- // @include /^http://www\.escapistmagazine\.com/videos/view/.*/.*$/
- // @grant none
- // @author iceman94
- // @copyright 2014+, iceman94
- // @namespace 8f39a87d8081774a9cbd024879f09787
- // ==/UserScript==
- //=======================================================================================================
- // Cross-browsers load function
- // Accepts a JS Object containing optional parameters:
- // |-mode: 'auto'|'jqload'|'jqready'|'atchevt'|'evtlist'|'timeout' (default: 'auto')
- // |-verbose: true|false (default: false)
- // |-timeoutval: integer in milliseconds USED ONLY by the timeout mode (default: 5000)
- //
- // Script loading modes are tested in this order :
- // |-support for jQuery API
- // |--uses $(window).load method if available
- // |--uses $(window).ready method if available
- // |-support for DOMContentLoaded event (compatible only with the following browsers :
- // Chrome >= 0.2; Firefox >= 1.0; IE >= 9.0; Opera >= 9.0; Safari >= 3.1)
- // |-support for document.attachEvent
- // |-uses setTimeout w/ custom delay
- //
- // Usage: XBLoad(function_to_call_wo_parenthesis, {mode: 'MODE', verbose: true|false, timeoutval:7500})
- //=======================================================================================================
- function XBLoad(func, options)
- {
- var options = options || new Object();
- var verbose = (typeof options.verbose !== 'undefined') ? options.verbose : false;
- var mode = (typeof options.mode !== 'undefined') ? options.mode : 'auto';
- var timeoutval = (typeof options.timeoutval !== 'undefined') ? options.timeoutval : 5000;
- switch(mode)
- {
- case 'auto':
- if (window.jQuery)
- {
- if ($(window).load)
- {
- if (verbose == true) { console.log('Javascript loaded using $(window).load mode through option', mode); };
- return $(window).load(function() { func(); });
- }
- else if ($(window).ready)
- {
- if (verbose == true) { console.log('Javascript loaded using $(window).ready mode through option', mode); };
- return $(window).ready(function() { func(); });
- };
- }
- else if (document.addEventListener)
- {
- if (verbose == true) { console.log('Javascript loaded using document.addEventListener mode through option', mode); };
- document.addEventListener('DOMContentLoaded', function(event)
- {
- return func();
- });
- }
- else if (document.attachEvent)
- {
- if (verbose == true) { console.log('Javascript loaded using document.attachEvent mode through option', mode); };
- document.attachEvent('load', function()
- {
- return func();
- });
- }
- else
- {
- if (verbose == true) { console.log('Javascript loaded using setTimeout method through option', mode, 'and timeout value of', timeoutval); };
- return setTimeout(function() { func(); }, timeoutval);
- };
- break;
- case 'jqload':
- if (verbose == true) { console.log('Javascript loaded using $(window).load mode through option', mode); };
- return $(window).load(function() { func(); });
- break;
- case 'jqready':
- if (verbose == true) { console.log('Javascript loaded using $(window).ready mode through option', mode); };
- return $(window).ready(function() { func(); });
- break;
- case 'evtlist':
- if (verbose == true) { console.log('Javascript loaded using document.addEventListener mode through option', mode); };
- document.addEventListener('DOMContentLoaded', function(event)
- {
- return func();
- });
- break;
- case 'atchevt':
- if (verbose == true) { console.log('Javascript loaded using document.attachEvent mode through option', mode); };
- document.attachEvent('load', function()
- {
- return func();
- });
- break;
- case 'timeout':
- if (verbose == true) { console.log('Javascript loaded using setTimeout mode through option', mode, 'and timeout value of', timeoutval); };
- return setTimeout(function() { func(); }, timeoutval);
- break;
- default:
- console.log('[XBLoad] Wrong script loading mode [', mode, '] passed to function. Please investigate.');
- break;
- };
- };
- // Locates video player DOM node
- function locateVideo()
- {
- return document.getElementsByTagName('video')[0];
- }
- // Deletes a DOM node based of its type (id, tag or class)
- function delElement(elmt_type, elmt_name)
- {
- switch (elmt_type)
- {
- case 'id':
- var tgt = document.getElementById(elmt_name);
- break;
- case 'tag':
- var tgt = document.getElementsByTagName(elmt_name)[0];
- break;
- case 'class':
- var tgt = document.getElementsByClassName(elmt_name)[0];
- break;
- default:
- console.log("delElement syntax error\nUsage:\n delElement(<[id|tag|class]>, <elmt_name>)");
- return -1;
- }
- tgt.parentNode.removeChild(tgt);
- }
- // Sets video player size attributes w/ reserved width and height percentages
- function setVideoAttr(browserWidth, browserHeight, reservedWidth, reservedHeight)
- {
- var obj = {};
- var videoWidth = reservedWidth * browserWidth / 100;
- obj.width = browserWidth - videoWidth;
- var videoHeight = reservedHeight * browserWidth / 100;
- obj.height = browserHeight - videoHeight;
- return obj;
- }
- // Wraps all previous code for... showtime !
- function showtime()
- {
- // Delete page top navigation bar to make some head room
- delElement('id', 'site_menu');
- // Object containing reserved browser's width and height values in percentage
- var reservedSpace = {};
- reservedSpace.widthInPct = 8;
- reservedSpace.heightInPct = 8;
- // Sets video player attributes
- var browserSize = setVideoAttr(window.screen.availWidth, window.screen.availHeight, reservedSpace.widthInPct, reservedSpace.heightInPct);
- // Locates video player and its parent element
- var videoElmt = locateVideo();
- var videoElmtParent = videoElmt.parentElement;
- // Sets video player style
- videoElmtParent.setAttribute('style', ('width:' + browserSize.width + 'px;' + 'height:' + browserSize.height + 'px'));
- // Sets video's parent's parent element style
- videoElmtParent.parentElement.setAttribute('style', ('position: absolute; left: -17%; top: -22%'));
- // Bug: If the video player "loading spinner" stays visible after modifying the page, we remove it
- if(document.getElementsByClassName('vjs-loading-spinner'))
- {
- delElement ("class", "vjs-loading-spinner");
- }
- // Autoplays the video
- videoElmt.play()
- }
- //=======================================================================================================
- // Showtime !
- //=======================================================================================================
- XBLoad(showtime, {mode:'timeout', timeoutval:'2500'});