var verticalScroller = (function() {
var api=[]; // make object to attach methods to

/* Ideally this should use the headlines from the 'stories' table of Woolmer's 
   mySQL db instead of hardcoded array, only there wasn't time to do it. Maybe next time...

*/
var vertScrollerTimer;
var next_headline;
var counter = 0;
var p_in;
var headlines = [
				 
 "New product launch... Hockey multi-use rebound boards", 
 "Special Offer - Men's Hockey Shirts", 
 "New Cricket Wicket Installed"
				 
				 ];


api.load = function(){
p_in = document.getElementById("p_in");
makeHeadline();
animateOut();
};


api.killTimer = function(){
clearTimeout(vertScrollerTimer);	
}

function animateIn(){
	
	$(p_in).animate({"top": 4}, 300, "swing", animateOut);
}


function animateOut(){
	vertScrollerTimer = setTimeout(function(){
	write_log("Next Vert scroller");					
	$(p_in).animate({"top": 25}, "slow", "swing", readyNextIn);
	
	}, 6000)
}

function readyNextIn(){
	
	counter = (counter < headlines.length-1)? counter +1 : 0;
	
	deleteprior(p_in);
	
	makeHeadline();
		
	$(p_in).css("top" , -25); // move it back to start position for next animation

	animateIn();					
	
}



function makeHeadline(){
var a = document.createElement("a");
a.key = counter;
a.onclick = function(){loadStory(this.key+1); return false;};
a.href="#";
var text = document.createTextNode(headlines[counter]);
a.appendChild(text);
p_in.appendChild(a);
var triangle = document.createElement("img");
triangle.style.cssText = "vertical-align: middle;";
triangle.src = "images/vert_scroller_triangle.png";
a.appendChild(triangle);
}


function deleteprior(div){
	if(!div) return;
	while (div.firstChild){
    div.removeChild(div.firstChild);
 	}
	}
	
function displayMessage(message){
document.getElementById("logDiv").innerHTML = message;	
}



return api;
	  
}());