// JavaScript Document

Position.getWindowSize = function(w) {
	var array = [];

	w = w ? w : window;
	array.width = array[0] = w.innerWidth || (w.document.documentElement.clientWidth || w.document.body.clientWidth);
	array.height = array[1] = w.innerHeight || (w.document.documentElement.clientHeight || w.document.body.clientHeight);

	return array;
}

// Taken from
// http://www.fleegix.org/articles/2006-05-30-getting-the-scrollbar-width-in-pixels
function getScrollerWidth() {
    var scr = null;
    var inn = null;
    var wNoScroll = 0;
    var wScroll = 0;

    // Outer scrolling div
    scr = document.createElement('div');
    scr.style.position = 'absolute';
    scr.style.top = '-1000px';
    scr.style.left = '-1000px';
    scr.style.width = '100px';
    scr.style.height = '50px';
    // Start with no scrollbar
    scr.style.overflow = 'hidden';

    // Inner content div
    inn = document.createElement('div');
    inn.style.width = '100%';
    inn.style.height = '200px';

    // Put the inner div in the scrolling div
    scr.appendChild(inn);
    // Append the scrolling div to the doc
    document.body.appendChild(scr);

    // Width of the inner div sans scrollbar
    wNoScroll = inn.offsetWidth;
    // Add the scrollbar
    scr.style.overflow = 'auto';
    // Width of the inner div width scrollbarcontentHeight
    wScroll = inn.offsetWidth;

    // Remove the scrolling div from the doc
    document.body.removeChild(
        document.body.lastChild);

    // Pixel width of the scroller
    return (wNoScroll - wScroll);
}

var scrollerWidth;
var shownImageDim = new Array();
var shownImage;
var navHeight;
var contentHeight;

changeBackgroundSize = function() {
	
	var scrollLeftOffset = 0;
	var scrollTopOffset = 0;
	var heightSet = false;
	
	var minWidth = 500;

	if (minWidth < $('content').getWidth()) minWidth = $('content').getWidth();
	
	var backgroundImg = new Array();
	
	// Get Window size
	var windowSizes = Position.getWindowSize();	
		
	// Get the content height
	contentHeight = $('content').getHeight();
	
	// Update the content underlay, just incase text has wrapped and pushed the content height down
	//$('contentunderlay').setStyle({ height: contentHeight+'px', opacity: 0.5 });
	
	// Check if the page has scrollers
	var scrollWidth = window.scrollWidth || document.documentElement.scrollWidth || document.scrollWidth || 0;
	var scrollHeight = window.scrollHeight || document.documentElement.scrollHeight || document.scrollHeight || 0; 
		
	// Safari Fix
	if (scrollHeight < windowSizes[1]) scrollHeight += windowSizes[1];
		
	// Set the image background to the window size
	backgroundImg[0] = windowSizes[0];
	backgroundImg[1] = windowSizes[1];
	
	// If the content+nav height is bigger than the window height
	if (windowSizes[1] < (contentHeight+navHeight)) {
				
		// Get rid of the width scroller
		windowSizes[0] -= scrollerWidth;
		
		// Set the new background image size
		backgroundImg[0] = windowSizes[0];
		
		// Set the window height the same as the content height
		windowSizes[1] = contentHeight+navHeight; // 
		
		// Set the backgroundImage height the same as the scrollable area
		backgroundImg[1] = contentHeight+navHeight;
		
		$('wrapper').setStyle({ width: windowSizes[0]+'px' }); // overflow: 'hidden', 
		
		heightSet = true;
				
	}
	
	if (windowSizes[0] < minWidth) {
				
		if (heightSet == false) {
			// Get rid of the height scroller
			windowSizes[1] = windowSizes[1]-scrollerWidth;
			backgroundImg[1] = windowSizes[1];
		}
		
		// Set the window width to the min width
		windowSizes[0] = minWidth;
		
		backgroundImg[0] = minWidth;
				
	}
				
	//$('navwrapper').setStyle({ width: windowSizes[0]+'px' });

				
	// Set the wrapper size to the window width, and window height - nav height
	$('wrapper').setStyle({ width: windowSizes[0]+'px', height: windowSizes[1]-navHeight+'px' });
	
	$('backgroundimg').setStyle({ width: backgroundImg[0]+'px', height: backgroundImg[1]-navHeight+'px' });
		
	var imgContainer = new Array();
	imgContainer[0] = $('backgroundimg').getWidth();
	imgContainer[1] = $('backgroundimg').getHeight();
		
	if (true==false) {
		
	//if (shownImageDim[0] > imgContainer[0] && shownImageDim[1] > imgContainer[1]) {
		
		shownImage.width = shownImageDim[0];
		shownImage.height = shownImageDim[1];
				
	} else {
		
		// (Min width / image width) > (min height / image height)
		if ((imgContainer[0]/shownImageDim[0]) < (imgContainer[1]/shownImageDim[1])) {
			var scale = imgContainer[1]/shownImageDim[1];
		} else {
			var scale = imgContainer[0]/shownImageDim[0];
		}
		
		var newwidth = scale * shownImageDim[0];
		var newheight = scale * shownImageDim[1];
			
		shownImage.width = newwidth;
		shownImage.height = newheight;
	}
}

initBackground = function() {
	
	navHeight = 0;//$('copyright').getHeight();	
	scrollerWidth = getScrollerWidth();
							
	shownImage = $('backgroundimg').select('img')[0];
	shownImageDim[0] = shownImage.width;
	shownImageDim[1] = shownImage.height;
	shownImageDim[2] = shownImage.width / shownImage.height;
	
	if (shownImage.hasClassName('abottom'))
		shownImage.setStyle({ position: 'absolute', bottom: '0px' });
		
}