jQuery.timer = function (interval, callback)
 {
 /**
  *
  * timer() provides a cleaner way to handle intervals  
  *
  *	@usage
  * $.timer(interval, callback);
  *
  *
  * @example
  * $.timer(1000, function (timer) {
  * 	alert("hello");
  * 	timer.stop();
  * });
  * @desc Show an alert box after 1 second and stop
  * 
  * @example
  * var second = false;
  *	$.timer(1000, function (timer) {
  *		if (!second) {
  *			alert('First time!');
  *			second = true;
  *			timer.reset(3000);
  *		}
  *		else {
  *			alert('Second time');
  *			timer.stop();
  *		}
  *	});
  * @desc Show an alert box after 1 second and show another after 3 seconds
  *
  * 
  */

	var interval = interval || 100;

	if (!callback)
		return false;
	
	_timer = function (interval, callback) {
		this.stop = function () {
			clearInterval(self.id);
		};
		
		this.internalCallback = function () {
			callback(self);
		};
		
		this.reset = function (val) {
			if (self.id)
				clearInterval(self.id);
			
			var val = val || 100;
			this.id = setInterval(this.internalCallback, val);
		};
		
		this.interval = interval;
		this.id = setInterval(this.internalCallback, this.interval);
		
		var self = this;
	};
	
	return new _timer(interval, callback);
 };
 
 
 
 
	var seconds = 0;
	var slideShowTimer;
	var photoIndex;
	var photoObj;
	var preload = new Image();
	preload.onload = function () {
		
		$('.imagesCell:eq(0)').css({'height':$('.imagesCell:eq(1)').height(),'z-index':2});
		$('.imagesCell:eq(1)').css({'height':this.height,'z-index':1});
		
		$('#slideshow #image1 img').attr('src',$('#slideshow #image2 img').attr('src'));
		$('#slideshow #image1').show();
	
		$('#slideshow #image2 img').attr('src',this.src);
		
		$('#caption').html(photoObj[photoIndex].title);
		
		$('#slideshow #image1').fadeOut('normal');
		
		$('#slideshow #image1').css({'z-index':2});
		$('#slideshow #image2').css({'z-index':1});
		$('#slideshow #image1 img').css({'z-index':2});
		$('#slideshow #image2 img').css({'z-index':1});

		
    };

	var nextImage = new Image();

	function selectImage(i) {

		seconds = 0;
		photoIndex = i;
		nextImage.src = '';

		preload.src = photoObj[i].medium;
		
		$('#slideshow p').html(photoObj[i].title);
		
		var photoNum = (photoIndex + 1);
		
		$('#photoIndex').html(photoNum + ' of ' + photoObj.length);
		
	}
	
	function startSlideShow() {
		seconds = 0;
		slideShowTimer.reset(1000);

	}
	
	function stopSlideShow() {
		seconds = 0;
		slideShowTimer.stop();

	}

	$(document).ready(function () {

			$.ajax({
			url: "/flickr/scrapbook.php?photosetID=" + $photosetID,
			dataType: "json",
			cache: false,
			success: function(json) {
			
				photoIndex = 0;
				
				photoObj = json;
				
				preload.src = photoObj[0].medium;
				
				$('#thumbnails').html('<ul></ul>');
				
				$('#photoIndex').html('1 of ' + photoObj.length);
				
				
				for(var i in json) {
					//alert(json[i].thumbnail);
					$('#thumbnails ul').append('<li><a href="javascript:selectImage('+i+')"><img src="' + json[i].thumbnail + '" alt="' + json[i].title + '" /></a></li>');
				}
				
				$("#thumbnails").jCarouselLite({
					btnNext: ".next",
					btnPrev: ".prev",
					visible: 6,
					scroll: 6
				});
				
				if(photoObj.length < 6) {
					
					$('.next').remove();
					$('.prev').remove();
				}
				
				slideShowTimer = $.timer(1000, function (timer) {
						seconds++;
				
						if(nextImage.src != photoObj[(photoIndex + 1) % photoObj.length].medium)
							nextImage.src = photoObj[(photoIndex + 1) % photoObj.length].medium;
						
						if(seconds == 5) {
							photoIndex = (photoIndex + 1) % photoObj.length;
							selectImage(photoIndex);
							seconds = 0;
						}
				});
			}
		});

	});