Escapist video section cleaner

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'});