window.addEvent('domready', function(){
	var slideTimer = 8000;  //time between slides (1 second = 1000), a.k.a. the interval duration  
	var transitionTime = 500; //transition time (1 second = 1000)  
	var items = $$('.slide_item');  //Get array of elements for sliding  
	var scroll_height = 320;
	var categories = $$('ul.category_nav li');  //Get array of elements for sliding 
	
	items.each(function(element, index) {
		element.setStyle('position', 'absolute');
		if(index == 0){  
			element.removeClass('first_item');  
			element.setStyle('top', "0");			
		} else {
			element.setStyle('top', scroll_height*index);
			element.setStyle('opacity', "0"); 
		}
	});
	
	var start_height = items[0].getStyle('height').toInt()+20;
	$('items_container').setStyle('height',start_height);
	
	var cats = $$('ul.category_nav li');
	cats.each(function(e,i){
		if(i == 0){
			cats[i].removeClass('current_category');
			cats[0].addClass('current_category');
		}
	});
	
var numItems = cats.length;  //get number of slider items  
var itemNum = 0;  //initialize a variable to hold the current slide index
var catNum = 0;
var catTotal = cats.length;

var box = $('items_container');
var pp = $$('.playpause span');
var slideFunction = new function() {
      
    var slideIt = function(slideTo,slideIndex){
		
		// Set PausePlay span to Playing if not already set
		if(pp.get('text') != 'Playing'){
			pp.set('text','Playing');
			pp.set('tween', {duration: '500'});
			pp.highlight('#000','#24394E');
		}
		
        //get item to slide out
		var curItem = items[itemNum];
		
		if(itemNum <= 0){
			curItem = items[0];
		}
		
		// Loop through Categories
		cats.each(function(e,i){
			
			cats[i].removeClass('current_category');
			
			var newCat; 
			//change index  
			if(!slideIndex){
				if(itemNum < (numItems - 1)){
					catNum++;
					cats[itemNum+1].addClass('current_category');
				} else {
					catNum = 0;
					cats[0].addClass('current_category');
				}
			} else {
				catNum = slideIndex;
				cats[slideIndex].addClass('current_category');
			}
		});
		
        var newItem; 
        //change index  
        if(!slideIndex){
			if(itemNum < (numItems - 1)){  
				itemNum++;
				newItem = items[itemNum];
			} else {
				itemNum = 0;
				newItem = items[itemNum];
			}
		} else {
			itemNum = slideIndex;
			newItem = items[slideIndex];
		}
		
		if(slideIndex == 0){
			itemNum = 0;
			newItem = items[0];
			cats.each(function(e,i){
				cats[i].removeClass('current_category');
			});
			cats[0].addClass('current_category');
		}
		
		// Smooth ReSize
		var new_height = newItem.getStyle('height');
		box.set('morph', {duration: 500,wait:false});
		box.morph({height: new_height});

        //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.Quad.easeInOut,   
                 wait:false  
        });  

        var item_out = new Fx.Morph(curItem, {  
                 duration: transitionTime,   
                 transition: Fx.Transitions.Quad.easeInOut,   
                 wait:false  
        });

        //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({  
        'top': [scroll_height, 0],  
        'opacity':[0,1]  
        });  
          
        //no beginning values needed, since we always want to push the old item out to the left  
        item_out.start({  
        'top': '-'+scroll_height,  
        'opacity':[0]  
        });
    };
	
	cats.each(function(e, i) {
		e.addEvent('click',function(){
			if(!this.hasClass('current_category')){
				e.getChildren('a').addClass('current_category');
				this.getChildren('a').addClass('current_category');
				var slideTo = items[i];
				var slideIndex = i;
				$clear(theTimer);
				slideIt(slideTo,slideIndex);
				theTimer = slideIt.periodical(slideTimer, this);
			}
		});
	});

    //call the function, periodically
	var theTimer = slideIt.periodical(slideTimer, this);
	
	box.addEvent('mouseenter',function(){
		$clear(theTimer);
		if(pp.get('text') != 'Paused'){
			pp.set('text','Paused');
			pp.highlight('#000','#24394E');
		}
	}).addEvent('mouseleave',function(){
		slideIt();
		theTimer = slideIt.periodical(slideTimer, this);
	});
}  

});