window.onresize = screenWidth;

var width = 0;
var divNumber = 2;
var divTargetWidth = 924;
var divCurrentWidth = 0;
var xposition = 0;
var curDiv = 1;
var halfScreen = 0;
var check = "no";
var resetScreen = "no";
var speed = 50;

//Begins slideshow: Gets screen width and window width,
//Calculates what half the screen size is
//If screen was resized it will run the if statment
//If First time the else will run and will start the slideshow
function screenWidth() {
	
	var scrollWidth = getScrollerWidth();
	
	if (navigator.appName == "Microsoft Internet Explorer") {
		width = document.documentElement.clientWidth;
	}
	else {
		width = window.innerWidth-scrollWidth;
	}
	
	halfScreen = width / 2;	
	
	if(resetScreen == "yes"){
		if(divTargetWidth > width){
			xposition = 1000;
			halfScreen = 500;
		}
			$("slidediv" + curDiv).style.left = halfScreen - $("slidediv" + curDiv).offsetWidth / 2 + "px";
			xposition = $("slidediv" + curDiv).offsetLeft;
	}
	
	else{
		$("slidediv" + curDiv).style.left = width + "px";
		xposition = $("slidediv" + curDiv).offsetLeft;
		setTimeout('slideDiv()', 500);
		resetScreen = "yes";
	}
	
}

//Controls the movement of the divisions
function slideDiv() {	
	
	//The divisions start with a width of 0 to avoid horizontal scrolling
	//This section widens the division to original width
	//If it is the original width it will fix the width of the div and make the text visible
	//Then restarts the slidDiv function
	
	if(divCurrentWidth <= divTargetWidth){
		
		//If window is less than division size this set the xposition to how wide the site is
		//and halfScreen to 500 so the slide will stop at the center of the 1000 no matter what
		if(divTargetWidth > width && check == "no"){
			xposition = 1000;
			halfScreen = 500;
			check = "yes";
		}
		
		$("slidediv" + curDiv).style.width = divCurrentWidth + "px";
		$("slidediv" + curDiv).style.left = xposition + "px";
		divCurrentWidth+=speed;
		xposition-=speed;
		if(divCurrentWidth >= divTargetWidth){
			$("slidediv" + curDiv).style.width = divTargetWidth + "px";
			//This is here so the movement is not disterbed
			$("slidediv" + curDiv).style.left = xposition + "px";
			$("slidediv" + curDiv + "mod").style.display = "block";
			check = "no";
		}
		setTimeout('slideDiv()',1);
	}
	
	//This will run after the width of the div is at fullsize
	//Will move the div to the center and stop for X amount of time
	//Then will move off the left of the screen
	//A check is done to see if it has reached the end of the divs and if so 
	//will set it to 0 if not will increment
	//Then reset of all positions, widths, visibility and recalls the function
	else if(divCurrentWidth >= divTargetWidth){
		xposition-=speed;
		$("slidediv" + curDiv).style.left = xposition + "px";
		
		if(xposition <= halfScreen - $("slidediv" + curDiv).offsetWidth / 2 && check == "no"){
			$("slidediv" + curDiv).style.left = halfScreen - $("slidediv" + curDiv).offsetWidth / 2 + "px";
			setTimeout('slideDiv()',8000);
			check = "yes";	
		}
		else if(xposition <= 0 - $("slidediv" + curDiv).offsetWidth){
			$("slidediv" + curDiv + "mod").style.display = "none";
			if(curDiv >= divNumber){
				$("slidediv" + curDiv).style.width = 0 + "px";
				curDiv = 1;
			}
			else{
				$("slidediv" + curDiv).style.width = 0 + "px";
				curDiv++;
			}
			check = "no";
			divCurrentWidth = 0;
			xposition = 0;
			$("slidediv" + curDiv).style.left = width + "px";
			xposition = $("slidediv" + curDiv).offsetLeft;
			slideDiv();
			
		}
		else 
			setTimeout('slideDiv()',1);
	}
	
}

function rewind(){
	
}

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 scrollbar
    wScroll = inn.offsetWidth;

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

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