
var displayCarousel=function(){

	/* author: Simon Willisons - http://simonwillison.net/2004/May/26/addLoadEvent/ */
	function addLoadEvent(f){
		var o=window.onload;
			if(typeof window.onload!='function'){window.onload=f;
				}else{window.onload=function(){if(o){o();
			}f();
		};
		}}

	var ulID,liWidth,lbID,lbSrc,rbID,rbSrc,items,maxLeft;

	function doMove(endPoint,step){
		var ul=document.getElementById(ulID);
		ul.style.left = ((ul.style.left.replace('px','')*1)+step)+'px';
		if (ul.style.left!=endPoint+"px"){
			var L=ul.style.left.replace('px','')*1;
			if (L<=0){
				if (L>=maxLeft){
					setTimeout('displayCarousel.doMove('+endPoint+','+step+')',20);
				}else{
					clearTimeout(t);
					ul.style.left=maxLeft+"px";
				}
			}else{
					clearTimeout(t);
					ul.style.left="0px";
			}
		}
	}

	function setup(ul,li,lb,lbS,rb,rbS){
		addLoadEvent(function(){

			// set encapsulated 'global' variables from parameters
			ulID=ul;
			liWidth=li;
			lbID=lb;
			lbSrc=lbS;
			rbID=rb;
			rbSrc=rbS;

			// test all id's exist
			if (document.getElementById(ulID)&&document.getElementById(lbID)&&document.getElementById(rbID)){

				// number of carousel items
				items=document.getElementById(ulID).getElementsByTagName('li').length;
				
				// set ul width
				document.getElementById(ulID).style.width=(items*liWidth)+"px";

				
				maxLeft=0-(items*(liWidth/7))+((liWidth/7)*6);  //furthest right position for ul
				
				
				// left button
				var leftButton=document.getElementById(lbID);
				leftButton.innerHTML='<img src="'+lbSrc+'" alt="scroll left" />';
				leftButton.onclick=function(){
					var ul=document.getElementById(ulID);
					var L=ul.style.left.replace('px','')*1 + liWidth;
					if (L<=0){
						doMove(L,25);
					}else{
						clearTimeout(t);
						ul.style.left="0px";
					}
				};

				// right button
				var rightButton=document.getElementById(rbID);
				rightButton.innerHTML='<img src="'+rbSrc+'" alt="scroll right" />';
				rightButton.onclick=function(){
					var ul=document.getElementById(ulID);
					var L=ul.style.left.replace('px','')*1 - liWidth;
					if (L>=maxLeft){
						doMove(L,-25);
					}else{
						clearTimeout(t);
						ul.style.left=maxLeft+"px";
					}
				};
			}

		});
	}

	return{
		init:setup,
		doMove:doMove
	};

}();

/* Parameters:
		carousel ul id,
		li width (pixel width of carousel li. Must be a multiple of 5.)
		left button div id,
		left button image location,
		right button div id,
		right button image location.
*/
displayCarousel.init('carouselList',900,'leftButton','http://www.three-mobile-phones.com/images/body/left-arrow.png','rightButton','http://www.three-mobile-phones.com/images/body/right-arrow.png');
