// trailer functions that must be run after the page has completely loaded
// mainly created for making the pages readable on mobile devices
function setFontSize() { 
    resizeImages();
    // create arrays with sizes in pixels
    // 'sizes' used for tag 'p', 'h1', 'footer' and 'div'
    var texts = new Array('12', '20', '30', '40', '50');
    // 'sizes' used for tag 'p', 'h1', 'footer' and 'div'
    var sizes = new Array('10', '12', '16', '20', '24');
    // 'headerSizes' currently used for tag 'h3'
    var headerSizes = new Array('13', '16', '20', '24', '28');
    // 'margin' used for lowering left/right margin on smaller screens
    var margin = new Array('0', '15', '30', '50', '60');
    // var browserWidth = getBrowserSize('width');
    var browserWidth = $(window).width();
    if (browserWidth < 400) {
	// mobile devices or browser window set to the size of a stamp
        	setFontByTag('p',sizes[0]+'px');
        	setFontByTag('h1',sizes[0]+'px')
			setFontByTag('div',sizes[0]+'px');
        	setFontByTag('h3',headerSizes[0] +'px');
        	setFontByTag('h2',sizes[0] +'px');
        	setFontByTag('input',sizes[0] +'px');
			setMarginByTag('p',margin[0]+'px');
   } else if (browserWidth >= 400 && browserWidth < 900) {
	// mobile devices or older displays
			setFontByTag('p',sizes[1]+'px');
			setFontByTag('h1',sizes[1]+'px');
			setFontByTag('div',sizes[1]+'px');
        	setFontByTag('h3',headerSizes[1] +'px');
        	setFontByTag('h2',headerSizes[1] +'px');
        	setFontByTag('input',sizes[1] +'px');
			setMarginByTag('p',margin[1]+'px');
    } else if (browserWidth >= 900 && browserWidth < 1450) {
	// standard medium display sizes
			setFontByTag('p',sizes[2]+'px');
			setFontByTag('h1',sizes[2]+'px')
			setFontByTag('div',sizes[2]+'px');
        	setFontByTag('h3',headerSizes[2] +'px');
        	setFontByTag('h2',headerSizes[2] +'px');
        	setFontByTag('input',sizes[2] +'px');
			setMarginByTag('p',margin[2]+'px');
   } else if (browserWidth >= 1450 && browserWidth < 1930) {
	// larger displays or HD devices
			setFontByTag('p',sizes[3]+'px');
			setFontByTag('h1',sizes[3]+'px');
			setFontByTag('div',sizes[3]+'px');
        	setFontByTag('h3',headerSizes[3] +'px');
        	setFontByTag('h2',headerSizes[3] +'px');
        	setFontByTag('input',sizes[3] +'px');
			setMarginByTag('p',margin[3]+'px');
    } else {
	// high performance devices with resolutions higher than HD
			setFontByTag('p',sizes[4]+'px');
			setFontByTag('h1',sizes[4]+'px');
			setFontByTag('div',sizes[4]+'px');
        	setFontByTag('h3',headerSizes[4] + 'px');
        	setFontByTag('h2',headerSizes[4] +'px');
        	setFontByTag('input',sizes[4] +'px');
			setMarginByTag('p',margin[4]+'px');
    }
}	

// This functions sets the font of any given HTML tag "tagName" to the size specified in value "newValue"
function setFontByTag(tagName, newValue) {
    var elements = document.getElementsByTagName(tagName);
    for(var i = 0; i < elements.length; i++) {
		elements.item(i).style['fontSize'] = newValue;
    }
}

// This functions sets left and right margin for the HTML tag "tagName" to the size
// specified in value "newValue" - this is important for small screen sizes
function setMarginByTag(tagName, newValue) {
    var elements = document.getElementsByTagName(tagName);
    for(var i = 0; i < elements.length; i++) {
		elements.item(i).style['margin'] = newValue;
    }
}	

function resizeImage(Image) {
    var InnerWidth = window.innerWidth;
    var InnerHeight = window.innerHeight;
    var ImgHeight, ImgWidth, ImgTitle;
    var ratio, needResizing;

    ImgHeight = Image.height;
    ImgWidth = Image.width;
    ImgTitle = Image.title;

    if ( Image.hasAttribute && Image.hasAttribute("usemap") ) return; //usemap: images that contain clickable areas
    //calculate ratio if need resizing
    ratio = 1;
    if( ImgWidth <= InnerWidth && ImgHeight <= InnerHeight ){
        //image smaller than viewport; don't resize
    }else if( ImgWidth/InnerWidth > ImgHeight/InnerHeight ){ //image is wider than viewport in ratio
        if( (ImgHeight/InnerHeight) / (ImgWidth/InnerWidth) > resize_limit ){
            ratio = (InnerWidth-padding) / ImgWidth;
        }else{
            ratio =  (InnerHeight*resize_limit) / ImgHeight;
        }
    }else{ // image is narrower than viewport in ratio
        if( (ImgWidth/InnerWidth) / (ImgHeight/InnerHeight) > resize_limit ){
            ratio = (InnerHeight-padding) / ImgHeight;
        }else{
            ratio = (InnerWidth*resize_limit) / ImgWidth;
        }
    }

    //resize if needed
    if( ratio < 1 ){
        if ( ImgTitle != "") ImgTitle += " / ";

        Image.setAttribute('title', ImgTitle + "Original Resolution - " + ImgWidth + "x" + ImgHeight + "px");
        Image.setAttribute('width', ImgWidth * ratio);
        Image.setAttribute('height', ImgHeight * ratio);

        if ( add_border ) Image.setAttribute('style',BorderStyle);

        if ( new_window ){
            Image.addEventListener("click",function(){window.open(this.getAttribute('src'),'newwin');},false);
            Image.style.cursor = 'pointer';
        }
    }
}

// Resize images after page loads
var _resize_after_load = true;
// Both sides of image will not be resized to samller than corresponding side of viewable area * (Resize Limit)
var _resize_limit = 0.1;    // default = 0.5
// Padding between image and border of viewable area
var _padding = 40;          // default = 50
// Add border to resized images
var _add_border = true;     // default = true
// Auto resize when browser resolution changes
var _auto_resize = true;    // default = true
// Click to open resized image in a new window
var _new_window = false;     // default = true
// load settings
var lang = 'en';
var resize_after_load = _resize_after_load;
var resize_limit = _resize_limit;
var padding = _padding
var add_border = _add_border;
var auto_resize = _auto_resize;
var new_window = _new_window;
var is = new Is();
if (is.iex==true) {
	var LinkColor = 'black';
} else {
	var LinkColor = window.getComputedStyle(document.getElementsByTagName('a')[0], null)['color'];
}
var BorderStyle = "border: 0.25em groove " + LinkColor + ";";
var resized = false;

function resizeImages() {
if (is.iex==true) {
	window.attachEvent("DOMNodeInserted", autoResize, false);
	if( auto_resize ) window.attachEvent("resize", autoResize, false);
	if( resize_after_load ) window.attachEvent("load", resizeImages, false);
} else {
	window.addEventListener("DOMNodeInserted", autoResize, false);
	if( auto_resize ) window.addEventListener("resize", autoResize, false);
	if( resize_after_load ) window.addEventListener("load", resizeImages, false);
}
    if( resized==true ) unresize();
    
    var i;
    var Images = document.getElementsByTagName('img');

    for(i in Images){
        resizeImage(Images[i]);
    }
    i = 0;    
    var Images = document.getElementsByTagName('video');
    
        for(i in Images){
        resizeImage(Images[i]);
    }
    i = 0;    
    var Images = document.getElementsByTagName('map');
    
        for(i in Images){
        resizeImage(Images[i]);
    }
    i = 0;    
    var Images = document.getElementsByTagName('content');
    
        for(i in Images){
        resizeImage(Images[i]);
    }
    resized = true;
}	

function resizeImage(Image) {
    var InnerWidth = $(window).width();
    var InnerHeight = $(window).height();
    var ImgHeight, ImgWidth, ImgTitle;
    var ratio, needResizing;

    ImgHeight = Image.height;
    ImgWidth = Image.width;
    ImgTitle = Image.title;

    if ( Image.hasAttribute && Image.hasAttribute("usemap") ) return; //usemap: images that contain clickable areas
    //calculate ratio if need resizing
    ratio = 1;
    if( ImgWidth <= InnerWidth && ImgHeight <= InnerHeight ){
        //image smaller than viewport; don't resize
    }else if( ImgWidth/InnerWidth > ImgHeight/InnerHeight ){ //image is wider than viewport in ratio
        if( (ImgHeight/InnerHeight) / (ImgWidth/InnerWidth) > resize_limit ){
            ratio = (InnerWidth-padding) / ImgWidth;
        }else{
            ratio =  (InnerHeight*resize_limit) / ImgHeight;
        }
    }else{ // image is narrower than viewport in ratio
        if( (ImgWidth/InnerWidth) / (ImgHeight/InnerHeight) > resize_limit ){
            ratio = (InnerHeight-padding) / ImgHeight;
        }else{
            ratio = (InnerWidth*resize_limit) / ImgWidth;
        }
    }

    //resize if needed
    if( ratio < 1 ){
        if ( ImgTitle != "") ImgTitle += " / ";

        Image.setAttribute('title', ImgTitle + "Original Resolution - " + ImgWidth + "x" + ImgHeight + "px");
        Image.setAttribute('width', ImgWidth * ratio);
        Image.setAttribute('height', ImgHeight * ratio);

        if ( add_border ) Image.setAttribute('style',BorderStyle);

        if ( new_window ){
        		if (is.iex==true) {
        			Image.attachEvent("click",function(){window.open(this.getAttribute('src'),'newwin');},false)
        		} else {
            	Image.addEventListener("click",function(){window.open(this.getAttribute('src'),'newwin');},false);
            }
            Image.style.cursor = 'pointer';
        }
    }
}

function unresize() {
    if( resized==false ) return;
    
    var Images = document.getElementsByTagName('img');
    var ImgTitle;
    var RegEx = /Original Resolution - (\d+)x(\d+)px/;
    var i;

    for(i in Images){
        ImgTitle = Images[i].title;

        if ( ImgTitle && ImgTitle.indexOf("Original Resolution - ") != -1 ){
            RegEx.exec(ImgTitle);
            Images[i].setAttribute('width', RegExp.$1);
            Images[i].setAttribute('height', RegExp.$2);
            Images[i].title = ImgTitle.substr(0,ImgTitle.indexOf(" / Original") );
            if ( add_border ) Images[i].setAttribute('style', "" );
        }
    } 
    i = 0;
    Images = document.getElementsByTagName('video');
    for(i in Images){
        ImgTitle = Images[i].title;

        if ( ImgTitle && ImgTitle.indexOf("Original Resolution - ") != -1 ){
            RegEx.exec(ImgTitle);
            Images[i].setAttribute('width', RegExp.$1);
            Images[i].setAttribute('height', RegExp.$2);
            Images[i].title = ImgTitle.substr(0,ImgTitle.indexOf(" / Original") );
            if ( add_border ) Images[i].setAttribute('style', "" );
        }
    }
    i = 0;
    Images = document.getElementsByTagName('map');
    for(i in Images){
        ImgTitle = Images[i].title;

        if ( ImgTitle && ImgTitle.indexOf("Original Resolution - ") != -1 ){
            RegEx.exec(ImgTitle);
            Images[i].setAttribute('width', RegExp.$1);
            Images[i].setAttribute('height', RegExp.$2);
            Images[i].title = ImgTitle.substr(0,ImgTitle.indexOf(" / Original") );
            if ( add_border ) Images[i].setAttribute('style', "" );
        }
    }       
    resized = false;
}

function autoResize() {
    if( resized==true ) resizeImages();
}

function Is () {
   var agt=navigator.userAgent.toLowerCase();
	this.major = parseInt(navigator.appVersion);
	this.minor = parseFloat(navigator.appVersion);
	this.mozilla = ((agt.indexOf('mozilla')!=-1) && ((agt.indexOf('spoofer')==-1) && (agt.indexOf('compatible') == -1)));
	this.iex = (agt.indexOf("msie") != -1); 
}

