$(function(){
  //preload images
  var image = new Image();
  image.src = '/layout/images/description_bg.png';
  $(window).load(function(){
  	  $('#accordion-loading').hide();
	  $("#accordion-holder .content-images").each( function(i){
	    myId = this.id;
	    idArray = myId.split("-");
	    myIdNo = idArray[idArray.length - 1];
	    myTimeout = 3000;
	  	$(this).cycle({
	  		timeout: myTimeout,
	  		fx: 'scrollHorz',
	  		prev: '#image-nav-previous-' + myIdNo,
	  		next:'#image-nav-next-' + myIdNo,
	  		nowrap:false,
	  		autostop: true,
	  		autostopCount: 4,
	  		manualTrump:false, // causes manual transition to stop an active transition instead of being ignored
	  		//pause:true, // true to enable "pause on hover"  (not working because of elements sitting on top of slide)
	  		prevNextClick: function(isNext, zeroBasedSlideIndex, slideElement){
	  		    myId = slideElement.parentNode.id;
	  		    idArray = myId.split("-");
	  		    myIdNo = idArray[idArray.length - 1];
	  		    // Hide Description
	  		    $('.project-description', '#content-overlay-'+myIdNo).slideUp("fast");
	  		    $('#content-images-'+myIdNo).cycle('pause');
	  		},
	  		after: function(curr, next, opts){
				var zeroBasedSlideIndex = opts.currSlide;
				myId = curr.parentNode.id;
	  		    idArray = myId.split("-");
	  		    myIdNo = idArray[idArray.length - 1];
	  		    // Hide/Show Arrows
	  			if(zeroBasedSlideIndex == 0){
	  				//First Slide
	  				$('#image-nav-previous-'+myIdNo).fadeOut();
	  			}else{
	  				//Not First Slide
	  				$('#image-nav-previous-'+myIdNo).fadeIn();
	  			}
				if(zeroBasedSlideIndex == 2){ //This will need to be changed if there are more than 3 photos
					//Last Slide
					$('#image-nav-next-'+myIdNo).fadeOut();
				}else{
					//Nost Last Slide
					$('#image-nav-next-'+myIdNo).fadeIn();
				}
				// Return to beginning if at the end and autoscrolling...
				if(zeroBasedSlideIndex == 2){
				   // Start Auto Scrolling Again
				}
	  		},
	  		end: function(options){

	  		}
	  	});
	  	if( i > 0 ){
	      $(this).cycle('pause'); //Only start the first cycle
	    }
	  	$('a.header-project-link', '#header-'+myIdNo).click(function(event){
	  		myId = this.parentNode.id;
	  		idArray = myId.split("-");
	  		myIdNo = idArray[idArray.length - 1];
	  		$('.project-description', '#content-overlay-'+myIdNo).slideToggle("fast");
	  	});
	  });
	  $('#accordion-holder').accordion({
	  	header: 'div.header',
	  	clearStyle: true,
	  	changestart: function(event, ui) {
			$('.project-description', ui.oldContent).each(function(i){$(this).slideUp("fast");});
			$('.image-nav', ui.oldContent).each(function(i){$(this).hide();});
	    	$($(ui.oldContent)[0]).cycle('pause');
	    	$($(ui.oldContent)[0]).cycle(0);
	    },
	    change: function(event, ui) {
	    	$('.image-nav.next', ui.newContent).each(function(i){$(this).fadeIn('slow');});
//	    	$($(ui.newContent)[0]).cycle('resume');
	    }
	  });
	  
	  $('#accordion-holder').hide().css('visibility', 'visible');
	  $('#accordion-holder').fadeIn();
  });
});