/**
 * Slideshow plugin for jQuery
 *
 * v0.1
 *
 * Copyright (c) 2010 Agile Tomato Software Ldt.
 *
 * Dual licensed under the MIT and GPL licenses:
 *	 http://www.opensource.org/licenses/mit-license.php
 *	 http://www.gnu.org/licenses/gpl.html
 */

(function($){

	//This plugin needs the data-pictures and data-index html5 attributes
	
	$.fn.slideshow = function(options) {
		var options = $.extend($.fn.slideshow.defaults, options);

		return this.each(function() {
			var previous_data;
			
			var get_image_src = function (index) {
			  var img = image_urls[index];
			  
			  return typeof(img) == "string" ? img : img[0];  
			}
			
			var load_picture = function(load_index) {
				if (loaded_images[load_index] == undefined) {
					var image = new Image();
					image.src = get_image_src(load_index);
					loaded_images[load_index] = image;
				}
			}
			var display_picture = function(index) {
				load_picture(index);
				
				$this.children('img').replaceWith(loaded_images[index]);
				$this.children('img').click(next_picture);
				
				counter.html(index + 1);
				options.callback(image_urls[index], previous_data);
				previous_data = image_urls[index];				
			};
			var next_picture = function() {
				if (image_urls.length > 1) { //prevent a mysterious bug
					index = (index + 1) % image_urls.length;
					display_picture(index);
				}
			};
			var previous_picture = function() {
				if (image_urls.length > 1) { //prevent a mysterious bug
					index = (index - 1 + image_urls.length) % image_urls.length;
					display_picture(index);
				}
			};
			
			var $this = $(this);
			var previous_button, next_button, counter;
			//Get images URL list and start index

			var json = this.getAttribute('data-pictures');
			var image_urls = $.parseJSON(json, true);
			var index = +this.getAttribute('data-index');
			var loaded_images = [];
			
			//get buttons and counter
			next_button = $this.children(options['next_button']);
			if (next_button.length == 0)
				next_button = $(options['next_button']);
			previous_button = $this.children(options['previous_button']);
			if (previous_button.length == 0)
				previous_button = $(options['previous_button']);
			counter = $this.children(options['counter']);
			if (counter.length == 0)
				counter = $(options['counter']);
			
			//connnect events
			next_button.click(function (e) {next_picture(); return false});
			previous_button.click(function (e) {previous_picture(); return false});
			$('html').keydown(function(e) {
				if (e.keyCode == 37)
					previous_button.click()
				else if (e.keyCode == 39)
					next_button.click();
			});
			
			//load current picture if not already there
			if ($this.children('img').length == 0) {
				var image = new Image();
				image.src = get_image_src(index);
				this.loaded_images[index] = image;
				//display it
				display_picture(index);
			} else {
				loaded_images[index] = $this.children('img')[0];
				$this.children('img').click(next_picture);
			}
			
			//load next and previous pictures. Nearest's first.
			index_down = index_up = index;
			while ((image_urls[index_up] != undefined ) || (image_urls[index_down] != undefined)) {
				index_up++;
				if (image_urls[index_up] != undefined)
					load_picture(index_up);
				index_down--;
				if (image_urls[index_down] != undefined)
					load_picture(index_down);
			}

		});
		
		
	};
	

//	slideshow.play = function() {};
//	slideshow.pause = function() {};
//	slideshow.delay = 2000 //milliseconds
	
	$.fn.slideshow.defaults = {
		next_button: '.next_button',
		previous_button: '.previous_button',
		counter: '.counter',
		callback: function() {}
	};
	
})(jQuery);