//***************************
// ImageSwapper Constructor *
//***************************
function ImageSwapper(swap_type, handler_wrapper, handler_tag, clone_wrapper, listener_wrapper)
{
	// swap types
	// 1: dynamic handlers
	// 2: previous / next buttons
	this.swap_type = swap_type;
	
	// get id's
	this.handler_wrapper	= document.getElementById(handler_wrapper);
	this.clone_wrapper		= document.getElementById(clone_wrapper);
	this.listener_wrapper	= document.getElementById(listener_wrapper);
	this.listener_images	= this.listener_wrapper.getElementsByTagName('img');
	this.current_image		= 0;
	
	// set vars
	this.handler_tag		= handler_tag;
	this.handler_prefix		= 'image_swap_handler_';
	this.active_class		= 'active';
	
	// previous / next
	if (this.swap_type == 2)
	{ 
		this.previous_next				= document.getElementById('previous_next');
		this.previous_class				= 'previous';
		this.previous_disabled_class	= 'previous_disabled';
		this.next_class					= 'next';
		this.next_disabled_class		= 'next_disabled';
	}
}

//************************************
// Function initialize image swapper *
//************************************
ImageSwapper.prototype.init = function()
{
	// read listener node and get images
	if (this.listener_images.length > 1)
	{
		for (var a=0; a<this.listener_images.length; a++)
		{
			this.listener_image	= this.listener_images[a];
			this.listener_text	= this.listener_image.alt;
			
			// hide image
			this.listener_image.style.display = 'none';
			
			// create dynamic handlers
			if (this.swap_type == 1)
			{
				this.handler_nodes	= this.clone_wrapper.getElementsByTagName(this.handler_tag);
				this.handler_node	= this.handler_nodes[0];
				
				// set text
				if (this.listener_text)
				{
					//this.handler_node.innerHTML	= this.listener_text;
				}
				else
				{
					this.handler_node.innerHTML	= '';
				}
				
				// set id
				this.handler_node.id = this.handler_prefix + a;
				
				// set handlers with cloned node
				this.handler_wrapper.innerHTML += this.clone_wrapper.innerHTML;
			}
		}
		
		// previous next
		if (this.swap_type == 2)
		{
			this.previousNext();
		}
		
		// set events
		this.events();
		
		// show first image
		this.listener_images[0].style.display = 'block';
		
		// activate first handler
		if (this.swap_type == 1)
		{
			this.handler_nodes[0].className = this.active_class;
		}
	}
	
	else
	{
		// hide previous next buttons
		if (this.swap_type == 2)
		{
			this.previous_next.style.visibility = 'hidden';
		}
	}
}

//**********************
// Function set events *
//**********************
ImageSwapper.prototype.previousNext = function()
{
	this.handler_nodes		= this.handler_wrapper.getElementsByTagName(this.handler_tag);
	this.handler_previous	= this.handler_nodes[0];
	this.handler_next		= this.handler_nodes[1];
	
	this.handler_previous.className	= this.current_image == 0 ? this.previous_disabled_class : this.previous_class;
	this.handler_next.className		= this.current_image == (this.listener_images.length - 1) ? this.next_disabled_class : this.next_class;
	
	this.handler_previous.id	= this.current_image == 0 ? this.handler_prefix + 0 : this.handler_prefix + parseInt(this.current_image - 1);
	this.handler_next.id 		= this.current_image == (this.listener_images.length - 1) ?  this.handler_prefix + (this.listener_images.length - 1) : this.handler_prefix + parseInt(this.current_image + 1);
}

//**********************
// Function set events *
//**********************
ImageSwapper.prototype.events = function()
{
	// set object as var
	var _this	= this;
	
	// get handler nodes
	this.handler_nodes	= this.handler_wrapper.getElementsByTagName(this.handler_tag);
	
	for (var a=0; a<this.handler_nodes.length; a++)
	{
		this.handler_node = this.handler_nodes[a];
		
		this.handler_node.onclick = function()
		{
			_this.set(this);
			
			return false;
		}
		
		this.handler_node.onfocus = function()
		{
			this.blur();
		}
	}
}

//***********************
// Function set swapper *
//***********************
ImageSwapper.prototype.set = function(obj)
{
	// hide image current image
	this.listener_images[this.current_image].style.display	= 'none';
	
	// dynamic handlers
	if (this.swap_type == 1)
	{
		this.handler_nodes[this.current_image].className = '';
	}
	
	// get the right key
	var keyArr	= obj.id.split(this.handler_prefix);
	
	// set new current image
	this.current_image	= parseInt(keyArr[1]);
	
	// dynamic handlers
	if (this.swap_type == 1)
	{
		this.handler_nodes[keyArr[1]].className	= 'active';
	}
	
	else if (this.swap_type == 2)
	{
		this.previousNext();
	}
	
	// show image
	this.listener_images[keyArr[1]].style.display	= 'block';
}