window.addEvent('domready', function(){
  
  /******************************************************
  the scrolling carousel functionality
  ******************************************************/
  
  // reference some elements
  var prevBtn = $('prev');
	var nextBtn = $('next');
	
	var inner = $('slides-outer');
	inner.setStyle('overflow', 'hidden');
	
	// get a list of all carousel items
	var carouselItems = $$('#slides li.slide-detail');
	
	// define how many carousel items are in each set
	var itemsPerSet = 1;
	
	// set the currently displayed set of items
	var currItem = 1;
	
	// set the max that currItem can be
	var currItemMax = carouselItems.length-itemsPerSet;
	
	var changeProgress = function(newNum) {
		// change text for progress div id
		$('progress').setHTML(newNum + ' of ' + carouselItems.length);
		
		// determine which btns to hide/show (prev/next)
	    if(newNum == 1){
	        prevBtn.setStyle('display', 'none');
	    } else if(newNum > 1 && newNum <= currItemMax){
	        prevBtn.setStyle('display', 'block');
	        nextBtn.setStyle('display', 'block');
	    } else if(newNum > currItemMax){
	        nextBtn.setStyle('display', 'none');
	    }
	};
   
	// create the scroll effect object
	var scroll = new Fx.Scroll('slides-outer', {
		wait: false,
		duration: 500,
		offset: {'x': 0, 'y': 0},
		transition: Fx.Transitions.Quad.easeOut
	});
	
	// set default displays
	changeProgress(currItem);

	// tell the next button what to do
	nextBtn.addEvent('click', function(e){
		// console.log('GO NEXT');
		e = new Event(e).stop();
		// if it's not the last item set, scroll it!
		if(currItem <= currItemMax) {
			currItem = currItem+itemsPerSet;
			scroll.toElement(carouselItems[currItem-1]);
			// change display
			changeProgress(currItem);
		}
	});
	
	// tell the prev button what to do
	prevBtn.addEvent('click', function(e){
		// console.log('GO PREVIOUS');
		e = new Event(e).stop();
		// if it's not the first item set, scroll it!
		if(currItem > 1) {
			currItem = currItem-itemsPerSet;
			scroll.toElement(carouselItems[currItem-1]);
			// change display
			changeProgress(currItem);
		}
	});
	
	// // initialize shadowbox with options
	//   Shadowbox.init();
});

