

(function($)
{

	var PKportfolio = function()
	{
		var self = this;
		self.conf = {
			currentZoom: null,
			currentGroup: 'all',
			currentOrder: null,
			originalOrder: null,
			zoomElements: null,
			columns: 0,
			container: null
		};
		self.init = function(elements, zooms, container)
		{
			container.data('PKportfolio', {height: container.height(), height_zoom: container.height() + 495});
			container.css({width: container.width(), height: container.height()});

			$('body').css({minWidth: $('body').width()});
			var counter = 0;
			var topE = elements.eq(0).position().top;
			elements.each(function(i,e){
				var pos = $(e).position();
				if (pos.top == topE) counter++;
				$(e).css({left: pos.left, top: pos.top});
				$(e).data('PKportfolio', $.extend(pos, self.extractAction($(this).children('a').attr('href')), {rel: $(this).children('a').attr('rel')}));
			});
			elements.css('position', 'absolute');

			self.conf.columns = counter;
			self.conf.container = container;
			self.conf.currentOrder = self.conf.originalOrder = elements;
			self.conf.zoomElements = zooms;
		};
		
		self.zoomOut = function()
		{
			var item = self.conf.currentZoom;
			var index = self.conf.zoomElements.index($('#zoom_'+item));
			item = self.conf.zoomElements.eq(index);
			item.fadeOut(300);
			self.conf.container.animate({height: self.conf.container.data('PKportfolio').height});
			self.conf.currentOrder.each(function(i,e){
				var x = (i % self.conf.columns) * 230 + 50;
				var y = Math.floor(i / self.conf.columns) * 165 + 302;
				$(e).animate({left: x, top: y});
			});
			self.conf.currentZoom = false;
			self.conf.originalOrder.find('.selected').removeClass('selected');
		};

		self.zoomIn = function(url)
		{
			var action = self.extractAction(url);
			if (!action.zoom.length) {
				if (self.conf.currentZoom) self.zoomOut();
				return;
			}
			self.conf.zoomElements.hide();
			self.conf.originalOrder.find('.selected').removeClass('selected');
			var item = self.conf.currentZoom = action.zoom;
			var index = self.conf.zoomElements.index($('#zoom_'+item));
			self.conf.originalOrder.eq(index).children('a').addClass('selected');
			item = self.conf.zoomElements.eq(index);
			index = self.conf.currentOrder.index(self.conf.originalOrder.eq(index));

			self.loadImages(item);

			self.conf.container.animate({height: self.conf.container.data('PKportfolio').height_zoom});
			var zoomX = (index % self.conf.columns) + 1;
			var zoomY = Math.floor(index / self.conf.columns);
			if (self.conf.columns - zoomX < 4) {
				zoomY++;
				zoomX = self.conf.columns - 4;
			}
			if (self.conf.columns > 4 && self.conf.zoomElements.length - index <= self.conf.columns
				&& Math.floor((self.conf.zoomElements.length - 1) / self.conf.columns) < zoomY) {
				zoomY--;
			}
			item.animate({left: zoomX * 230 + 50, top: zoomY * 165 + 302});
			var destIndex = 0;
			self.conf.currentOrder.each(function(i,e){
				var x = destIndex % self.conf.columns;
				var y = Math.floor(destIndex / self.conf.columns);
				while (x >= zoomX && x < zoomX + 4 && y >= zoomY && y < zoomY + 3) {
					destIndex += 4;
					x = destIndex % self.conf.columns;
					y = Math.floor(destIndex / self.conf.columns);
				}
				$(e).animate({left: x * 230 + 50, top: y * 165 + 302});
				destIndex++;
			});
			item.fadeIn(300);
		};
		self.loadImages = function(item)
		{
			item.find('.items').children('div').each(function(i,e){
				var address = $(e).find('a').attr('href');
				if (address && address.length) {
					var img = new Image();
					$(img).load(function(){
						$(e).find('a').replaceWith('<img src="'+address+'" alt="" style="width:'+$(e).find('a').attr('rel')+'px;height:400px;" />');
					});
					img.src = address;
				}
			});
		};
		self.group = function(url)
		{
			var action = self.extractAction(url);
			if (self.conf.currentZoom) {
				self.zoomOut();
			}
			if (action.group.length && action.group != self.conf.currentGroup) {
				var newOrder = [];
				self.conf.originalOrder.each(function(i,e){
					if ($(e).data('PKportfolio').rel.indexOf('|'+action.group+'|') >= 0) {
						newOrder.push(e);
						$(e).animate({opacity: 1});
					}
				});
				self.conf.originalOrder.each(function(i,e){
					if ($(e).data('PKportfolio').rel.indexOf('|'+action.group+'|') == -1) {
						newOrder.push(e);
						$(e).animate({opacity: 0.5});
					}
				});
				self.conf.currentGroup = action.group;
				self.conf.currentOrder = $(newOrder);
				self.conf.currentOrder.each(function(i,e){
					var x = (i % self.conf.columns) * 230 + 50;
					var y = Math.floor(i / self.conf.columns) * 165 + 302;
					$(e).animate({left: x, top: y});
					$(e).children('a').attr('href', $(e).children('a').attr('href').replace(/\#.*?\+/,'#'+action.group+'+'));
				});
			}
		};
		self.extractAction = function(url)
		{
			var group = url.lastIndexOf('#'), zoom;
			var result = {
				group: '',
				zoom: ''
			};
			if (group >= 0 && group < url.length-1) {
				result.group = group = url.substr(group+1);
				zoom = group.indexOf('+');
				if (zoom >= 0) {
					result.zoom = group.substr(zoom+1);
					result.group = group.substr(0, zoom);
				}
			}
			return result;
		};
	};

	$.PKportfolio = new PKportfolio();

	$.fn.initPortfolio = function(zooms, container)
	{
		$.PKportfolio.init(this, zooms, container);
		zooms.each(function(i,e){
			$(e).find('.close').click(function(){$.PKportfolio.zoomOut();});
		});
		return this.each(function() {
			$(this).find('img').removeClass('img');
			$(this).bind({
				mouseenter: function() {
					$(this).find('img').fadeOut(300);
				},
				mouseleave: function() {
					$(this).find('img').fadeIn(300);
				}
			});
			$(this).children('a').click(function() {
				$.PKportfolio.zoomIn(this.href);
			});
		});
	};

	$.fn.toggleGroup = function()
	{
		var groupLinks = this;
		return this.each(function() {
			$(this).bind({
				click: function() {
					$.PKportfolio.group(this.href);
					groupLinks.removeClass('selected');
					$(this).addClass('selected');
				}
			});
		});
	};
	
})(jQuery);


