window.addEvent('domready', function() {
	if ($('abSlideOuter')) {
		/* ----------Config Vars----------- */
		var slideTimer = 5000; //time between slides (1 second = 1000), a.k.a. the interval duration
		var transitionTime = 1500; //transition time (1 second = 1000)
		var items = $$('.abSlideItem'); //Get array of elements for sliding
		var numItems = items.length; //get number of slider items
		var numNav = new Array(); //create an array to hold our dynamically created number navigation
		var prevBtn = $('abSlidePrev');
		var playBtn = $('abSlidePlay');
		var nextBtn = $('abSlideNext');
		var itemNum = 0; //initialize a variable to hold the current slide index
		var isPaused = 0;
		var isSliding = 0;
		var numNavHolder = $('abSlideNum');
		/* -------- end config vars -------- */
		
		
		//--------- setup stuff ---------//
		$('abSlideNum').empty();
		items.each(function(element, index){
		
			//since the viewer obviously has javascript on, we can remove the 'first_item' class
			if (index == 0) {
				element.removeClass('first_item');
				element.setStyle('left', "9");
			}
			else {
				element.setStyle('left', "792");
			}
			
			//create numbered navigation boxes, and insert into the 'num_nav' ul)
			var numItem = new Element('span', {
				id: 'num' + index
			});
			var numLink = new Element('a', {
				'class': 'numbtn',
				'html': (index + 1)
			});
			
			numItem.adopt(numLink);
			numNavHolder.adopt(numItem);
			numNav.push(numLink);
		});
		
		
		//highlight initial slide's number box
		var initNum = numNav[itemNum];
		origColor = initNum.getStyle('color');
		
		initNum.setStyles({
			'color': '#dc5d02'
		});
		//--------- end setup stuff ---------//
		
		
		
		//---------------------------------------------------------------------------------------------------------
		//	function: slideMove
		//	description: moves the appropriate slides in/out of view
		//	parameters:
		//		int direction - specifies type of movement (0=back, 1=forward, 2=jump to frame
		//		int passedID (optional) - index value to jump to when direction = 2
		//---------------------------------------------------------------------------------------------------------
		var slideMove = function(direction, passedID){
		
			//get item to slide out
			var curItem = items[itemNum];
			var curNumItem = numNav[itemNum];
			
			var leftDirection = '-';
			var rightDirection = '';
			
			//change index based on value of 'direction' parameter
			if (direction == 1) {
				if (itemNum < (numItems - 1)) {
					itemNum++;
				}
				else {
					itemNum = 0;
				}
			}
			else 
				if (direction == 0) {
					if (itemNum > 0) {
						itemNum--;
					}
					else {
						itemNum = (numItems - 1);
					}
					leftDirection = '';
					rightDirection = '-';
				}
				else {
					if (itemNum < passedID) {
						leftDirection = '-';
						rightDirection = '';
					}
					else
					{
						leftDirection = '';
						rightDirection = '-';
					}
					
					if (itemNum != passedID) {
						itemNum = passedID;
					}
				}
			
			//now get item to slide in using new index
			var newItem = items[itemNum];
			var newNumItem = numNav[itemNum];
			
			
			//set up our animation stylings for out and in motions (note:  Fx.Styles does NOT exist in moo 1.2, so we must use Fx.Morph or Fx.Tween)
			var item_in = new Fx.Morph(newItem, {
				duration: transitionTime,
				transition: Fx.Transitions.Expo.easeInOut,
				link: 'ignore',
				
				//click prevention functions
				onStart: function(){
					isSliding = 1; //prevents extra clicks
				},
				
				onComplete: function(){
					isSliding = 0; //allow clicks again
				}
			});
			
			var item_out = new Fx.Morph(curItem, {
				duration: transitionTime,
				transition: Fx.Transitions.Back.easeInOut,
				link: 'ignore'
			});
			
			var num_in = new Fx.Morph(newNumItem, {
				duration: 100,
				transition: Fx.Transitions.linear,
				link: 'ignore'
			});
			
			var num_out = new Fx.Morph(curNumItem, {
				duration: 100,
				transition: Fx.Transitions.linear,
				link: 'ignore'
			});
			
			//we will set a beginning value here
			//this is so that it gives the illusion of continuous motion from one direction, even after the first cycle of items
			item_in.start({
				'left': [leftDirection + 792, 9]
			});
			
			//no beginning values needed, since we always want to push the old item out to the left
			item_out.start({
				'left': rightDirection + 792
			});
			
			num_in.start({
				'color': '#dc5d02'
			});
			
			num_out.start({
				'color': origColor
			});
			
		};
		//--------------- end slideMove ---------------------
		
		
		//call the slider function periodically
		var theTimer = slideMove.periodical(slideTimer, this, 1);
		
		
		/* control buttons */
		nextBtn.addEvent('click', function(){
			if (isSliding == 0) {
				if (isPaused == 0) {
					$clear(theTimer);
					theTimer = slideMove.periodical(slideTimer, this, 1);
				}
				slideMove(1);
			}
		});
		
		prevBtn.addEvent('click', function(){
			if (isSliding == 0) {
				if (isPaused == 0) {
					$clear(theTimer);
					
					// note: you could change the third parameter to 0 if you wanted to switch the direction here
					theTimer = slideMove.periodical(slideTimer, this, 1);
				}
				slideMove(0);
			}
		});
		
		playBtn.addEvent('click', function(){
			if (isSliding == 0) {
				if (isPaused == 0) {
					isPaused = 1;
					$clear(theTimer);
					//this.getElement('a').set('html', 'play');
					this.getElement('a').set('html', '&nbsp;');
					this.getElement('a').addClass('play');
					this.getElement('a').removeClass('pause');
				}
				else {
					isPaused = 0;
					slideMove(1);
					theTimer = slideMove.periodical(slideTimer, this, 1);
					//this.getElement('a').set('html', 'pause');
					this.getElement('a').set('html', '&nbsp;');
					this.getElement('a').addClass('pause');
					this.getElement('a').removeClass('play');
				}
			}
		});
		/*  end control buttons */
		
		
		/*  num_nav buttons */
		numNav.each(function(element, index){
			var origColor = element.getStyle('color');
			
			element.addEvents({
				'click': function(){
					
					if (isSliding == 0 && itemNum != index) {
						if (isPaused == 0) {
							$clear(theTimer);
							theTimer = slideMove.periodical(slideTimer, this, 1);
						}
						//alert("index: " + index + '  ' +itemNum);
						slideMove(2, index);
					}
				},
				'mouseenter': function(){
					this.setStyle('cursor', 'pointer');
				}
			});
			
		});
		/*  end num_nav buttons */
	}
});
