/**
 * class AD_Portfolio author Paul Kruijt
 */
var AD_Portfolio = new Class(
{
	/**
	 * initialize
	 * @return void
	 */
	initialize: function()
	{
		// nodes
		this.filter_page_node	= $('filter_page');
		this.loader_node		= $('loader');
		this.main_node			= $('main');
		this.details_node		= $('work_detail');
		this.main_img_node		= $('content');
		this.main_txt_node		= $('photo_text');
		
		this.thumbnails_node			= $('thumbnails');
		this.thumbnails_handler_node	= $('thumbnails_handler');
		
		// classes
		this.active_class	= 'active';
		this.hide_class		= 'hide';
		
		// strings
		this.thumbnail_item_prefix = 'thumbnail_item_';
		
		// settings
		this.alpha_duration = 400;
	},
	
	/**
	 * start
	 * @return void
	 */
	start: function()
	{
		if (this.details_node)
		{
			// set events
			this.setEvents();
			
			// set active thumbnail node
			var thumbnails_node			= $('thumbnails');
			this.active_thumbnail_node	= thumbnails_node.getElement('.item');
			
			// get total items
			var total_item_nodes = this.getTotalThumbnails();
			
			var active_id	= this.getUrlId('active_id');
			var photo_id	= this.getUrlId('photo_id');
			
			if (active_id)
			{
				this.getActivePhoto(active_id, photo_id);
			}
			else
			{
				this.getActivePhoto(1, 1);
			}
			
			this.project_id = this.getUrlId('project_id');
		}
	},
	
	/**
	 * get id from url
	 * @return integer active_id
	 */
	getUrlId: function(variable)
	{
		var query	= window.location.search.substring(1);
		var vars	= query.split('&');
		
		for (var i=0; i<vars.length; i++)
		{
			var pair = vars[i].split('=');
			
			if (pair[0] == variable)
			{
				return pair[1];
			}
		}
		
		return false;
	},

	/**
	 * get active photo
	 * @param	integer	photo_id
	 * @return	void
	 */
	getActivePhoto: function(active_id, photo_id)
	{
		// set object as var
		var _this						= this;
		var current_thumbnail_node		= $('thumbnail_item_' + active_id);
		var current_thumbnail_node_id	= current_thumbnail_node.get('id');
		
		$$('#'+current_thumbnail_node_id+' a').set('class', 'active');
		
		// set active class for thumbnail
		var thumbnail_item_node				= $('thumbnail_item_' + active_id);
		var current_thumbnail_anchor_node	= thumbnail_item_node.getElement('a');
		var active_thumbnail_anchor_node	= this.active_thumbnail_node.getElementsByTagName('a')[0];
		
		// if active_id in the url is not the first item
		if (current_thumbnail_node && current_thumbnail_node != this.active_thumbnail_node)
		{
			current_thumbnail_anchor_node.className	= this.active_class;
			active_thumbnail_anchor_node.className	= '';
		}
		
		// show page filter
		this.filter_page_node.className	= '';
		this.loader_node.className		= '';
		
		// start alpha effect
		var alpha_effect = new Fx.Morph(this.main_img_node,
		{
			duration	: this.alpha_duration,
			transition	: Fx.Transitions.Quad.easeOut
		});
		
		alpha_effect.start(
		{
			'opacity': 0
		})
		.chain(function()
		{
			// empty content text
			_this.main_img_node.empty();
			
			// alert(active_id);
			var http_url		= '/http/photo.php?project_id='+_this.project_id+ '&photo_id='+photo_id;
			var http_request	= new Request(
			{
				url			: http_url,
				method		: 'get',
				onSuccess	: function(data)
				{
					alpha_effect.start({'opacity': 1});
					
					// hide page filter and
					// loader
					_this.filter_page_node.className	= _this.hide_class;
					_this.loader_node.className			= _this.hide_class;
					
					// set active thumbnail node
					_this.active_thumbnail_node = current_thumbnail_node;
					
					// decode JSON string and
					// Hash it (nerd) :-P
					var json_data = new Hash(JSON.decode(data));
					
					// set image
					if (json_data.has('img'))
					{
						var img_tag = json_data.get('img');
						
						// set content html
						_this.main_img_node.innerHTML = img_tag;
					}
					
					// set text
					if (json_data.has('txt'))
					{
						var str_text = json_data.get('txt');
						
						str_text = str_text.replace(/\\'/g, "'");
						str_text = str_text.replace(/\\"/g, '"');
						
						// set content html
						_this.main_txt_node.innerHTML = str_text;
					}
					
					// reset events
					_this.setEvents();
				}
			});
			
			http_request.send();
		});
	},

	/**
	 * get next photo
	 * @return void
	 */
	getNextPhoto: function()
	{
		// get item nodes
		var item_nodes			= $$('#thumbnails .item');
		var total_item_nodes	= item_nodes.length;
		
		if (total_item_nodes > 0)
		{
			// set vars
			var next_node		= 0;
			var first_photo_id	= 0;
			
			var i = 1;
			
			for (var a=0; a<total_item_nodes; a++)
			{
				var item_node			= item_nodes[a];
				var item_node_id		= item_node.id;
				var arr_item_node_id	= item_node_id.split(this.thumbnail_item_prefix);
				var active_id			= arr_item_node_id[1];
				
				// first thumbnail
				if (i == 1)
				{
					first_photo_id = active_id;
				}
				
				var thumbnail_item_node	= $('thumbnail_item_'+active_id);
				var item_anchor_node	= thumbnail_item_node.getElement('a');
				var photo_id			= item_anchor_node.getAttribute('id');
				
				if (item_anchor_node)
				{
					if (next_node == 1)
					{
						this.getActivePhoto(active_id, photo_id);
						break;
					}
					
					if (item_anchor_node.className == this.active_class)
					{
						next_node = 1;
					}
				}
				
				i++;
			}
			
			var thumbnail_item_node	= $('thumbnail_item_1');
			var item_anchor_node	= thumbnail_item_node.getElement('a');
			var photo_id			= item_anchor_node.getAttribute('id');
			
			// goto first item
			if (i == (total_item_nodes + 1))
			{
				this.getActivePhoto(first_photo_id, photo_id);
			}
		}
	},
	
	/**
	 * get total thumbnails
	 * @return integer total_item_nodes
	 */
	getTotalThumbnails: function() {
		// get item nodes
		var item_nodes			= $$('#thumbnails .item');
		var total_item_nodes	= item_nodes.length;
		
		return total_item_nodes;
	},
	
	/**
	 * set events
	 * @return void
	 */
	setEvents: function() {
		// set object as var
		var _this = this;
		
		// main image
		var main_image_root_node	= $('content');
		var main_image_node			= main_image_root_node.getElement('img');
		
		if (main_image_node)
		{
			main_image_node.onclick = function()
			{
				// get next photo
//				_this.getNextPhoto();
			}
		}
	}
});