/**
 * class	CS_Slideshow
 * author	Paul Kruijt
 */
var CS_Slideshow = new Class({
	
	/**
	 * initialize
	 * @param	string	main_wrapper_node_id
	 * @param	string	thumbs_wrapper_node_id
	 * @param	object	effect_settings
	 * @param	object	thumbs_settings
	 * @return	void
	 */
	initialize: function(main_wrapper_node_id, thumbs_wrapper_node_id, effect_settings, thumbs_settings)
	{
		// nodes
		this.filter_page_node		= $('filter_page');
		this.main_wrapper_node		= $(main_wrapper_node_id);
		this.thumbs_wrapper_node	= $(thumbs_wrapper_node_id);
		this.active_image_node		= 0;
		
		// settings
		this.effect_type		= !effect_settings['effect_type'] ? 1 : effect_settings['effect_type']; /* default: swap */
		this.effect_duration	= !effect_settings['effect_duration'] ? 1000 : effect_settings['effect_duration']; /* default: 1 second */
		this.effect_pause		= !effect_settings['effect_pause'] ? 5000 : effect_settings['effect_pause']; /* default: 5 seconds */
		this.auto_play			= !effect_settings['auto_play'] ? 0 : effect_settings['auto_play']; /* default: no autoplay */
		
		this.thumbs_settings	= thumbs_settings;
		
		// classes
		this.active_class	= 'cs_active';
		this.show_class		= 'show';
		this.hide_class		= 'hide';
	},
	
	/**
	 * start
	 * @return void
	 */
	start: function()
	{
		if (this.main_wrapper_node && this.thumbs_wrapper_node)
		{
			this.loadImages();
		}
	},
	
	/**
	 * load images
	 * @return void
	 */
	loadImages: function()
	{
		var image_nodes			= this.main_wrapper_node.getElements('img');
		var total_images_nodes	= image_nodes.length;
		
		if (total_images_nodes > 0)
		{
			var i=0;
			for (var a=0; a<total_images_nodes; a++)
			{
				var image_node	= image_nodes[a];
				var img_src		= image_node.src;
				
				// show first image
				if (i == 0) image_node.setStyle('display', 'block');
				
				if (total_images_nodes > 1)
				{
					this.createThumbnail(img_src, i);
				}
				
				i++;
			}
		}
	},
	
	/**
	 * create thumbnail
	 * @param	string	img_src
	 * @param	integer	index
	 * @return	void
	 */
	createThumbnail: function(img_src, index)
	{
		// set vars
		var _this = this;
		
		// create anchor
		var anchor_node	= new Element('a');
		anchor_node.setProperty('href', '#');
		
		if (index == 0) anchor_node.setProperty('class', this.active_class);
		
		// create image
		var image_node	= new Element('img');
		image_node.setProperty('src', img_src);
		
		// inject nodes
		image_node.injectInside(anchor_node);
		anchor_node.injectInside(this.thumbs_wrapper_node);
		
		// set event
		anchor_node.addEvent('click', function()
		{
			// show image
			_this.showImage(index);
			
			return false;
		});
	},
	
	/**
	 * show image
	 * @param	integer	index
	 * @return	void
	 */
	showImage: function(index)
	{
		// set vars
		var _this			= this;
		var image_nodes		= this.main_wrapper_node.getElements('img');
		var anchor_nodes	= this.thumbs_wrapper_node.getElements('a');
		
		var active_image_node	= image_nodes[this.active_image_node];
		var current_image_node	= image_nodes[index];
		
		var active_anchor_node	= anchor_nodes[this.active_image_node];
		var current_anchor_node	= anchor_nodes[index];
		
		if (active_image_node && current_image_node && active_image_node != current_image_node)
		{
			// switch effect
			switch (this.effect_type)
			{
				//*******
				// swap *
				//*******
				case 1:
				
					// set style current image
					current_image_node.setStyles({
						'display' : 'block',
						'z-index' : 2
					});
					
					// set style active image
					active_image_node.setStyles({
						'display' : 'none',
						'z-index' : 1
					});
					
					// de-activate active thumbnail
					active_anchor_node.setProperty('class', '');
					
					// activate current thumbnail
					current_anchor_node.setProperty('class', this.active_class);
					
					// set active image
					this.active_image_node = index;
					
				break;
				
				//**************
				// fade in/out *
				//**************
				case 2:
					
					// show filter
					this.filter_page_node.setProperty('class', this.show_class);
					
					// set style current image
					current_image_node.setStyles({
						'opacity' : 0,
						'display' : 'block',
						'z-index' : 2
					});
					
					// set style active image
					active_image_node.setStyles({
						'z-index' : 1
					});
					
					// de-activate active thumbnail
					active_anchor_node.setProperty('class', '');
					
					// activate current thumbnail
					current_anchor_node.setProperty('class', _this.active_class);
						
					// start effect
					var slideshow_effect = new Fx.Morph(current_image_node, {duration: this.effect_duration, transition: Fx.Transitions.Quad.easeOut});
					
					slideshow_effect.start({
						'opacity': 1
					}).chain(function(){
						
						// set style active image
						active_image_node.setStyles({
							'display' : 'none'
						});
						
						// hide filter
						_this.filter_page_node.setProperty('class', _this.hide_class);
						
						// set active image
						_this.active_image_node = index;
						
					});
					
				break;
			}
		}
	}
	
});