/***
	gallery
 ***/

(function(){
 

 /***
  @param templateContainerID      Container for all components of the gallery widget
  @param widgetName               Unique name of widget
  @param images                  Additional options that are not required
  ***/

 gallery = function(containerID, instanceName)
 {
	if(!instanceName) {
		instanceName = containerID;
	}
  	this.init(instanceName);	

  	this.initContainer(containerID);
  	  	
	this.initImages();
	return this;
 }
 

 jQuery.extend(gallery.prototype,{
	/***
	 * Widget specific options
 	 ***/
 	widget: {name: 'wgallery'},

	 images: {}, 
	 
	 /***
	  * Widget Container ID
	  ***/
	 containerID: null,
	 

	/***
	 * Local options
	 ***/
	local:{

	},

	/***
	 * Internal options
	 ***/
	internal: {
		container : null,
	 	left: null,
	 	right: null,
	 	images: null,
	 	meta  : null,
	 	thumb:null,
	 	desc : null,
	 	position : 0
	},

	/***
	 * Object Constants
	 * 	This constants are used to render content from a template.
	 * 	They represent class name suffixes used in html.
	 ***/
	constants: {
	},

	/***
	 * Widget Templates
	 ***/
	templates: {
		gallery:null		
	},
	/***
	 * Basic init 
	 ***/
	init: function(name, images) {
		this.widget.name = name;
		this.images      = images;
		this.internal = {
			container : null,
	 		left: null,
	 		right: null,
	 		images: null,
	 		meta  : null,
	 		thumb:null,
	 		desc : null,
	 		position : 0
		};
	},

	/***
	 * Template init
	 ***/
	initContainer: function(containerID) {
		
		this.containerID = containerID;
		
		
		var container = new jQuery('#'+this.containerID);
		this.internal.container = container;
		
		this.initImages();

		//init meta		
		var meta  	      = container.find("#meta");
		this.internal.meta = meta;
		meta.hide();
		//end of init meta
		
		
		this.internal.left  = container.find('.goLeft');
		this.internal.right = container.find('.goRight');
		this.initControls();
		
		//start listeners
		var that = this;
		
		
			jQuery(document).ready(function(){
			
			jQuery('#' + that.containerID + ' .goLeft')
				.click(function(event){
						that.changeImage.call(that,jQuery(event.target),'prev');
						event.stopPropagation();
						event.preventDefault();
						return false;
				});
			
			jQuery('#' + that.containerID + ' .goRight')
			.click(function(event){
					that.changeImage.call(that,jQuery(event.target),'next');
					event.stopPropagation();
					event.preventDefault();
					return false;
			});
			
			
		});
	},

	initImages : function(images) {
		container = this.internal.container;
		if(this.internal.images == null) {
			this.internal.images = container.find('#meta img');
			
		}
	},
	
	changeImage: function(target,direction)  {

		if(this.internal.images == null || this.internal.images.length == 1) {
			return;
		}	
		
		if(direction === null) {
			direction = 'next';
		}
		
		var step = 1;
		
		if(direction == 'prev') {
			step = step * -1;
		}
		
		
		var position  =  this.internal.position + step;
		if(position >= 0 && position < this.internal.images.length) {
			this.loadImage(position);
			this.internal.position = position; 
		} 
		 
		this.initControls(position);
		
	} ,
	
	loadImage:function(position) {
	
		container = this.internal.container;
		if(this.internal.thumb == null ) {
			this.internal.thumb = container.find('.thumb'); 
		}
		
		if(this.internal.desc == null ) {
			this.internal.desc = container.find('.picture em:first'); 
		}
		var thumb     =   this.internal.thumb;
		var images    =   this.internal.images;
		var desc	  =   this.internal.desc;
		
		thumb.hide();
		thumb.attr('src',images[position].src);
		desc.html(images[position].parentNode.nextSibling.textContent);
		thumb.fadeIn();		
	},
	
	initControls:function(position) {
	
		if(position == null) {
			position = 0;
		}
		var images = this.internal.images;
		
		if(images.length == 1) {
			this.internal.left.hide();
			this.internal.right.hide();
		}
		
		if(images == null) return;
		//show or hide controls
		if(position == 0) {
			this.internal.left.hide();
		} else {
			this.internal.left.show();
		}
		
		if( position == (images.length -1) ) {
			this.internal.right.hide();
		} else {
			this.internal.right.show();
		}
	}
	
 })
 })() //run code in function scope and not in global scope

