//object definition
function BannerImage(filename,linkhref,buttontext,imgalt) {
	this.filename = filename;		//name of banner filename (without the .jpg)
	this.linkhref = linkhref;		//href that the link should point to
	this.buttontext = buttontext;	//text for the button (also the title attribute of the link)
	this.imgalt = imgalt;}			//alt text for the image - should match the text in the image

//array of bannerimage objects, the first one will be displayed on the page when loaded
var banners = [
//	new BannerImage(
//		'0808-latenight',												//filename
//		'/centers/centertainment/',										//link
//		'Nyctophiles Unite!',											//button text
//		'New. UWSP Late Night Programs. The fun starts after 11pm...'),	//img alt text - should include all text that is in the image
	
		new BannerImage(
		'0909-reactive', //don't ever delete this file because it's what shows up without scripting (see index.html)
		'/centers/sustainability/',
		'Learn More!',
		'Did you know... The University Store stocks many "green" items and recycled products such as re-usable bottles and glassware, organic cotton t-shirts and recycled notebooks and folders? re-active. reducing, reusing, recycling.'),
		new BannerImage(
		'awakeAlive2011', 
		'ticketDirect.htm',
		'Ticket Info!',
		'Awake Alive Tour Featuring Skillet - Friday November 4th!'),
		new BannerImage(
		'summerHours11',
		'/centers/dining/',
		'Visit Us!',
		'UC Dining Summer Hours!'),
		new BannerImage(
		'bikeToBarn11', 
		'/centers/dining/b2b2p.asp',
		'Click for Info!',
		'Bike to Barn to Plate!'),
		new BannerImage(
		'allenSummer11', 
		'/centers/healthwellness/',
		'Visit Us!',
		'Workout for Free at the Allen Center after 5pm on Thursdays and Fridays!'),	
	new BannerImage(
		'brewhausSummer11',
		'/centers/brewhaus/',
		'More Info!',
		'Join Us for the Fun!')
];

//this is bad, and if I had time I'd fix it...
//whole lotta global variables:

//initialized with a value
var waittime = 5000;					//time to wait on a banner
var moveinterval = 100;					//delay between frames during slide transition
var movepixels = 40;					//pixels to move each frame during transition
var currentbannernum = 0;				//starts with the first banner in the list
var totalwidth = 560;					//width of the banner
var oldside = 0;						//current banner's style.left or style.right is 0px
var newside = totalwidth;				//new banner is entirely out of the frame
var buttonbottomvisible = 3;			//button's style.bottom when visible
var buttonbottomhidden = -33;			//the same when hidden outside the frame
var buttonbottom = buttonbottomvisible;	//button is visible to start
var buttonmovepixels = 12;				//pixels to move animated button per frame
var curstate = 'play';					//banner starts in the 'play' state

//null initialization
var bannerdiv;							//the frame that contains the banners and animation
var curbanner;							//currently displayed banner
var bannerbutton;						//current banner's button
var rightbannernum;						//next banner number to the right
var rightbanner;						//next banner to the right
var leftbannernum;						//...to the the left
var leftbanner;							//...and this too
var playtimer;							//the setTimeout for the delay between switching banners
var scrolltimer;						//the setInterval for banner transition animation
var buttontimer;						//the setInterval to animate the button motion
var animating;							//which side is currently being transitioned to, if any
var pauseplaybutton;					//the pause/play button that changes when clicked

//on page load, sets up button events
function bannerinit() {
	bannerdiv = document.getElementById('banner');
	var leftbutton = document.getElementById('leftbutton');
		leftbutton.onmouseover = function() {leftbutton.src = 'images/bannernavlefthover.gif';}
		leftbutton.onmouseout = function() {leftbutton.src = 'images/bannernavleft.gif';}
		leftbutton.onclick = leftclick;
	pauseplaybutton = document.getElementById('pauseplaybutton');
		pauseplaybutton.onmouseover = function() {pauseplaybutton.src = 'images/bannernavpausehover.gif';}
		pauseplaybutton.onmouseout = function() {pauseplaybutton.src = 'images/bannernavpause.gif';}
		pauseplaybutton.onclick = pauseplayclick;
	var rightbutton = document.getElementById('rightbutton');
		rightbutton.onmouseover = function() {rightbutton.src = 'images/bannernavrighthover.gif';}
		rightbutton.onmouseout = function() {rightbutton.src = 'images/bannernavright.gif';}
		rightbutton.onclick = rightclick;
	curbanner = document.getElementById('currentbanner');
	//replace the banner on the page with the first one from this script
	var startbanner = preparebanner(0);
	bannerdiv.replaceChild(startbanner, curbanner);
	startbanner.setAttribute('id', 'currentbanner');
	curbanner = document.getElementById('currentbanner');
	bannerbutton = curbanner.getElementsByTagName('span')[0];
	bannerbutton.style.bottom = buttonbottom + 'px';
	preparenext();}

//button clicks
function leftclick() {
	if (animating == 'left') { //new banner is coming from the left
		//resetting the position will suffice because the scroll() function checks this and will stop animating
		newside = 0;}
	else if (animating == 'right') { //from the right
		curbanner.style.left = '0px';
		bannerdiv.removeChild(rightbanner);
		stopscroll();}
	else { //no banner is sliding
		clearTimeout(playtimer);
		newbanner('left');}}
function rightclick() {
	if (animating == 'right') {
		newside = 0;}
	else if (animating == 'left') {
		curbanner.style.right = '0px';
		bannerdiv.removeChild(leftbanner);
		stopscroll();}
	else {
		clearTimeout(playtimer);
		newbanner('right');}}
function pauseplayclick() {
	if (curstate == 'play') {
		clearTimeout(playtimer);
		curstate = 'pause';
		pauseplaybutton.src = 'images/bannernavplay.gif';
		pauseplaybutton.onmouseover = function() {pauseplaybutton.src = 'images/bannernavplayhover.gif';}
		pauseplaybutton.onmouseout = function() {pauseplaybutton.src = 'images/bannernavplay.gif';}}
	else {
		curstate = 'play'
		if (!animating) newbanner('right'); //start moving banner in from the right
		pauseplaybutton.src = 'images/bannernavpause.gif';
		pauseplaybutton.onmouseover = function() {pauseplaybutton.src = 'images/bannernavpausehover.gif';}
		pauseplaybutton.onmouseout = function() {pauseplaybutton.src = 'images/bannernavpause.gif';}}}

//prepare next banners, left and right
function preparenext() {
	curbanner = document.getElementById('currentbanner');
	curbanner.style.left = '';
	curbanner.style.right = '';
	//move button up into place if it is not
	bannerbutton = curbanner.getElementsByTagName('span')[0];
	if (buttonbottom < buttonbottomvisible) buttontimer = setInterval('movebutton("up");', moveinterval);
	rightbannernum = currentbannernum + 1;
	if (rightbannernum == banners.length) rightbannernum = 0;
	rightbanner = preparebanner(rightbannernum);
	rightbanner.style.left = totalwidth + 'px';
	leftbannernum = currentbannernum - 1;
	if (leftbannernum < 0) leftbannernum = banners.length - 1;
	leftbanner = preparebanner(leftbannernum);
	leftbanner.style.right = totalwidth + 'px';
	//if currently playing, set timeout for banner from the right
	if (curstate != 'pause') playtimer = setTimeout('newbanner("right");', waittime);}

//prepare a banner div
function preparebanner(num) {
	var newdiv = document.createElement('div');
		newdiv.setAttribute('id', 'animbanner');
		newdiv.title = banners[num].buttontext;
	var link = document.createElement('a');
		link.className = 'bannerlink';
		link.href = banners[num].linkhref;
		link.title = banners[num].buttontext;
		newdiv.appendChild(link);
	var image = document.createElement('img');
		image.src = 'banners/' + banners[num].filename + '.jpg';
		image.alt = banners[num].imgalt;
		link.appendChild(image);
	var button = document.createElement('span');
		button.className = 'bannerbutton';
		button.innerHTML = banners[num].buttontext;
		button.style.bottom = buttonbottomhidden + 'px';
		link.appendChild(button);
	return newdiv;}

//transition to next banner (all steps)
function newbanner(side) {
	animating = side;
	clearInterval(buttontimer);
	buttontimer = setInterval('movebutton("down");', moveinterval);}

//move the button
function movebutton(direction) {
	if (direction == 'down') {
		buttonbottom = buttonbottom - buttonmovepixels;
		if (buttonbottom < buttonbottomhidden) buttonbottom = buttonbottomhidden;
		bannerbutton.style.bottom = buttonbottom + 'px';
		if (buttonbottom == buttonbottomhidden) {
			clearInterval(buttontimer);
			slidenext();}}
	else {
		buttonbottom = buttonbottom + buttonmovepixels;
		if (buttonbottom > buttonbottomvisible) buttonbottom = buttonbottomvisible;
		bannerbutton.style.bottom = buttonbottom + 'px';
		if (buttonbottom == buttonbottomvisible) clearInterval(buttontimer);}}

//start slide to next banner
function slidenext() {
	if (animating == 'left') {
		bannerdiv.appendChild(leftbanner);
		scrolltimer = setInterval('scroll();', moveinterval);}
	else {
		bannerdiv.appendChild(rightbanner);
		scrolltimer = setInterval('scroll();', moveinterval);}}

//animated transition
function scroll() {
	newside = newside - movepixels; //position of the new banner
	oldside = newside - totalwidth; //position of the old banner
	if (newside < 0) { //banner would move past the edge this frame, so set position to zero
		oldside = 0 - totalwidth;
		newside = 0;}
	if (animating == 'left') {
		leftbanner.style.right = newside + 'px';
		curbanner.style.right = oldside + 'px';}
	else {
		rightbanner.style.left = newside + 'px';
		curbanner.style.left = oldside + 'px';}
	if (newside == 0) { //new banner has filled the frame
		clearInterval(scrolltimer); //stop scrolling
		oldside = 0; //reset positions
		newside = totalwidth;
		if (animating == 'left') {
			//left banner is the new current banner
			currentbannernum = leftbannernum;
			bannerdiv.replaceChild(leftbanner, curbanner);
			leftbanner.setAttribute('id', 'currentbanner');}
		else {
			currentbannernum = rightbannernum;
			bannerdiv.replaceChild(rightbanner, curbanner);
			rightbanner.setAttribute('id', 'currentbanner');}
		animating = '';
		preparenext();}}

//go back to previous banner
function stopscroll() {
	clearInterval(scrolltimer);
	oldside = 0;
	newside = totalwidth;
	animating = '';
	preparenext();}

//make sure a previous window.onload is not overwritten
if (window.onload) {
	var previnit = window.onload;
	window.onload = function() {
		previnit();
		bannerinit();}}
else window.onload = bannerinit;