window.onresize = screenWidth;

//screen width
var width = 0;
//number of divisions is slideshow
var divNumber = 2;
//divisions full width
var divTargetWidth = 924;
//current width of divison
var divCurrentWidth = 0;
//current x coordinate of division
var xposition = 0;
//division being manipulated
var curDiv = 1;
//position of half screen
var halfScreen = 0;
//used twice to check if position is correct
var check = "no";
//used to check if the screen has been reset before
var resetScreen = "no";
//controls speed of divslide
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() {
	
	//function call to get vertical scroller width
	var scrollWidth = getScrollerWidth();
	
	//gets screen width if IE
	if (navigator.appName == "Microsoft Internet Explorer") {
		width = document.documentElement.clientWidth;
	}
	//gets screen width for other browsers
	else {
		width = window.innerWidth-scrollWidth;
	}
	
	//gets center of the screen
	halfScreen = width / 2;	
	
	//checks if the slide just started or if the screen has been resized
	if(resetScreen == "yes"){
		
		//if division width is wider than the screen it sets defaults for screen width
		if(divTargetWidth > width){
			xposition = 1000;
			halfScreen = 500;
		}
			
		//makes sure the division is put back in place when screen is resized
		$("slidediv" + curDiv).style.left = halfScreen - $("slidediv" + curDiv).offsetWidth / 2 + "px";
		xposition = $("slidediv" + curDiv).offsetLeft;
	}
	
	//sets current division very right of screen
	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
	
	//checks if the division is at target width
	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";
		}
		
		//widens the divison from the right to avoid horizontal scrolling
		$("slidediv" + curDiv).style.width = divCurrentWidth + "px";
		//moves the divison left while it widens from the right
		$("slidediv" + curDiv).style.left = xposition + "px";
		//adds speed variable to width for the next iteration
		divCurrentWidth+=speed;
		//subtract speed variable to xposition for the next iteration
		xposition-=speed;
		
		//checks if the divison is >= the target width
		if(divCurrentWidth >= divTargetWidth){
			//if divison is wider this sets it to the proper width
			$("slidediv" + curDiv).style.width = divTargetWidth + "px";
			//This is here so the movement is not disterbed while the divison is repositions
			//if this is not here the movement will jump once it hits this point
			$("slidediv" + curDiv).style.left = xposition + "px";
			$("slidediv" + curDiv + "mod").style.display = "block";
			//resets check for the next use
			check = "no";
		}
		//restarts slideDiv to either do this portion again or to start the next step
		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){
		//subtracts speed variable from xposition so it will continue to move to from left to right
		xposition-=speed;
		//apply's new xposition to the division
		$("slidediv" + curDiv).style.left = xposition + "px";
		
		//checks if the xposition is centered and pauses the divisions movement for X seconds
		if(xposition <= halfScreen - $("slidediv" + curDiv).offsetWidth / 2 && check == "no"){
			//positions the division in the exact center
			$("slidediv" + curDiv).style.left = halfScreen - $("slidediv" + curDiv).offsetWidth / 2 + "px";
			//pauses the division for x seconds
			setTimeout('slideDiv()',8000);
			check = "yes";	
		}
		
		//checks to see if divison has made it off the screen to the left
		else if(xposition <= 0 - $("slidediv" + curDiv).offsetWidth){
			//sets division to hidden
			$("slidediv" + curDiv + "mod").style.display = "none";
			//sets width of division to zero for the next time it is called
			$("slidediv" + curDiv).style.width = 0 + "px";
			//checks if all the divisions have been cycled through
			//if so resets to the first division
			//if not increments to the next division
			if(curDiv >= divNumber){
				curDiv = 1;
			}
			else{
				curDiv++;
			}
			//resets all variables for the next division
			check = "no";
			divCurrentWidth = 0;
			xposition = 0;
			$("slidediv" + curDiv).style.left = width + "px";
			xposition = $("slidediv" + curDiv).offsetLeft;
			//recalls the function to start over
			slideDiv();
			
		}
		//recalls function if the division is still on the screen
		else 
			setTimeout('slideDiv()',1);
	}
	
}

//gets the width of the vertical scrollbar
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);
}

