/*
* FlickrGallery - A jQuery plugin for the Flickr API
*/
$.fn.fetchFlickGallery = function(options){
		// Default options:
		options = $.extend({
			width:500,
			height:500,
			maxFetch:50,
			captions:false,
			autoAdvance:false,
			advancePeriod:5000
		},options);
		
		  var flickrContainer = this;
		  var photosetid = "";
		  var total = 0;
		  var currentPos = 1;
		  var flickrkey = "";
		  if (flickrContainer.attr('data-flickrkey') != undefined) {
		    flickrkey = escape(flickrContainer.attr('data-flickrkey'));
		  }
		
		if(options.photosetID==undefined){
			  if (flickrContainer.attr('data-photosetid') != undefined) {
			    photosetid = escape(flickrContainer.attr('data-photosetid'));
			  }
			  else{
			  	return false;
			  }
		}
		else{
			photosetid = options.photosetID;
		}
	
	  if (flickrContainer.attr('data-total') != undefined) {
	    total = escape(flickrContainer.attr('data-total'));
	  }

		  var flickrSlider = $('<div id="flickrSlider">').addClass('flickrSliderHolder').appendTo(flickrContainer);
			
			flickrContainer.children('span.total,span.counter,span.caption,span.progress').remove();
			var caption= $('<span class="caption">').css('width',options.width).appendTo(flickrContainer);
			var counterspan = $('<span class="counter">').appendTo(flickrContainer);
			var progressdiv = $('<div class="progress">').appendTo(flickrContainer);
			var numberspan = $('<span class="number">').appendTo(counterspan);
			
			
			var totalspan = $('<span class="total">').appendTo(counterspan);
		
		 // num = elem.attr('class').split(' ').slice(-1);
		  var url = "http://api.flickr.com/services/rest/?format=json&api_key="+ flickrkey +"&method=flickr.photosets.getPhotos&photoset_id=" + photosetid + "&per_page=" + total + "&extras=url_m&page=1&jsoncallback=?";
		
		  var htmlString = "";
		  $.getJSON(url, displayImages);
		
		  function displayImages(data) {
				    if(total==0){
					    total = data.photoset.total;
				    }
		    		totalspan.html(total);
		
					var ul = $('<ul>').css('width',options.width * total);
					
					$.each(data.photoset.photo,function(key, value){
						// Creating a new LI element with the photo as its
						// centered background image:
						
						var img = $('<img width="' + options.width + '" height="'+ options.height + '">').attr('src',value.url_m);
						var li = $('<li>');
//						img.appendTo(li)
						li.appendTo(ul).append(img);
						if(key==total){
							return false;	
						}
					});
					
					ul.appendTo(flickrSlider);
					
					  	// Binding a custom "slide" event.
			// You can then flickrSlider.trigger("slide",2)
			// to go to the second slide:
			flickrSlider.bind('slide',function(e,slide){

				if(slide < 1 || slide > total || ul.is(':animated')){
					return false;
				}

				ul.animate({
					left:-(slide-1)*options.width
				},{
					easing: 'easeInOutCirc',
					duration: 0
				});
				numberspan.html(slide + '/');
				if(options.captions){
					
					// Animating the transition between
					// the captions (if enabled):
					
					caption.fadeOut(0,function(){
//						var captionHtml = '<a href="http://' + data.photoset.photo[slide-1].title + '" target="_blank">' + data.photoset.photo[slide-1].title + '</a>';
						var captionHtml = data.photoset.photo[slide-1].title;
						caption.html(captionHtml);
						
					}).fadeIn(0);
				}
				
				currentPos = slide;
			});
			
			// Creating the previous / next arrows, and
			// binding event listeners for the click events:
			var arrowPrev;
			if(flickrContainer.children('a.previous').length==0){
				arrowPrev = $('<a class="previous" href="#">').appendTo(flickrContainer);
			}
			else{
				arrowPrev = flickrContainer.children('a.previous');			
			}
			
			arrowPrev.bind("click", function(){
						var toShow = currentPos - 1;
						if(toShow < 1){
							toShow = total;
						}
						
						flickrSlider.trigger('slide',[toShow]);
						return false;
				});
			

			var arrowNext; 
			if(flickrContainer.children('a.next').length==0){
				arrowNext = $('<a class="next" href="#">').appendTo(flickrContainer);
			}
			else{
				arrowNext = flickrContainer.children('a.next');
			}
			
			arrowNext.bind("click", function(){
						var toShow = currentPos + 1;
						if(toShow > total){
							toShow = 1;
						}
						flickrSlider.trigger('slide',[toShow]);
						return false;
				});

			
			flickrSlider.trigger('slide',[1]);

					
		
		  }
		  return (false);

}