// JavaScript Document
window.onload=init;
var oldWidth
var preferedWidth = 750;
var	preferedWidthMenu = 150;
var	preferedWidthBody = 700;
var scrollBarWidth = 50
function init(){
	var windowWidth = getWindowWidth();
	var banner = document.getElementById("Banner");
	if(banner.width > windowWidth){
		banner.width = windowWidth - scrollBarWidth;
	}
	/*
	check to see if the window is expanding
	*/
	if(oldWidth < windowWidth){
		//check to see if the window is bigger than the preferedWidth
		banner.width = (windowWidth > preferedWidth?preferedWidth:windowWidth - scrollBarWidth)
	}
	oldWidth = windowWidth;
	
	//Position Menu on top or on the side if screen is big enough
	if(getWindowWidth() < preferedWidth){
		$("#Menu").css("width", preferedWidth);
		$("#Menu .MenuItem").css("float", "left");
		$("#Menu .MenuItem").css("width", preferedWidthMenu);
		$("#Body").css("width", preferedWidthBody);
	}else{
		$("#Menu").css("width", "15%");	
		$("#Menu .MenuItem").css("float", "");
		$("#Menu .MenuItem").css("width", "");
		$("#Body").css("width", "75%");		
	}
}

window.onresize = function(event) {
	init();
}

function getWindowWidth() {
  var myWidth = 0, myHeight = 0;
  if( typeof( window.innerWidth ) == 'number' ) {
    //Non-IE
    myWidth = window.innerWidth;
    myHeight = window.innerHeight;
  } else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
    //IE 6+ in 'standards compliant mode'
    myWidth = document.documentElement.clientWidth;
    myHeight = document.documentElement.clientHeight;
  } else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
    //IE 4 compatible
    myWidth = document.body.clientWidth;
    myHeight = document.body.clientHeight;
  }
  return myWidth;
}