$(document).ready(function() {

	var holders = jQuery('.page-holder'),
		topOp = 0.8;

	jQuery('body').append('<div id="tooltip"></div>');
	jQuery('#tooltip').hide();
/*
	$(document).mousemove(function(e){
		jQuery('#tooltip').css({
			left: e.pageX,
			top: e.pageY
		});
	});
*/
	holders.each(function() {
		var holder = jQuery(this),
			W = holder.width(),
			sliders = jQuery('> .page-slider', this);

		sliders.each(function() {
			var slider = jQuery(this),
				els = jQuery('> li', this),
				m = 0;

			els.each(function(i) {
				
				var el = jQuery(this),
					w = el.outerWidth(),
					fader = jQuery('<div class="fade" />').appendTo(this);
				
				fader.css({
					position: 'absolute',
					top: 0,
					left: 0,
					bottom: 0,
					right: 14,
					opacity: topOp,
					display: 'none',
					zIndex: 1000
				})
				
				this.leftPos = m;
				m += w;
			})

			els.find('> .fade').show().css({
				opacity: topOp
			})
			els.removeClass('in-viev');

			jQuery(inViev(W, - parseInt(slider.css('margin-left'), 10), els)).addClass('in-viev').find('> .fade').css({
				opacity: 0
			}).hide();

			els.click(function() {
				var thisBox = jQuery(this);
				if(!thisBox.hasClass('in-viev')) {
					toAnimate(thisBox, W, m);
					return false;
				}
			})

			tooltips(slider);
			//slider.hover(function(){ showTooltip(this) }, function(){ hideTooltip(this) });
		})
	})
	
	function inViev(holdW, paneM, elem) {
		var elems = [];
		
		elem.each(function() {
			var el = jQuery(this),
				elW = el.outerWidth();
			
			if(this.leftPos >= paneM && this.leftPos < paneM + holdW && this.leftPos + elW - 15 < paneM + holdW) elems.push(this);
		})
		
		return elems;
	}
	
	function toAnimate(obj, holdW, maxM) {
		var pane = obj.parent(),
			elem = pane.children(),
			marginLeft = - obj[0].leftPos;
		
		if(- marginLeft + holdW + 14 > maxM) {
			marginLeft = - (maxM - holdW - 14);
		}
		
		var inVievEl = jQuery(inViev(holdW, - marginLeft, elem));
		elem.not(inVievEl).removeClass('in-viev').find('> .fade').show().animate({
			opacity: topOp
		})
		
		inVievEl.addClass('in-viev').find('> .fade').animate({
			opacity: 0
		}, {
			complete: function() {
				jQuery(this).hide();
			}
		});
		
		pane.animate({
			marginLeft: marginLeft
		}, {
			complete: function() {
				tooltips(jQuery(this));
			}
		})
	}

	function tooltips(slider)
	{
		var holder = slider.parents('.page-holder');

		var els = jQuery('> li', slider);
		els.each(function(i) {
			jQuery(this).unbind('mouseenter');
		
			// Define if element is left or right of the holder
			if ( jQuery(this).offset().left < holder.offset().left )
			{
				jQuery(this).addClass('left-of');
				// todo : translate
				jQuery(this).mouseenter(function(){ jQuery('#tooltip').html("Previous") });
			}
			else if ( jQuery(this).offset().left > holder.offset().left + holder.width() )
			{
				jQuery(this).addClass('right-of');
				// todo : translate
				jQuery(this).mouseenter(function(){ jQuery('#tooltip').html("Next") });
			}
			else
			{
				jQuery(this).removeClass('left-of right-of');
				jQuery(this).mouseenter(function(){ jQuery('#tooltip').html("") });
			}
		});
	}

	function showTooltip(holder)
	{
		if ( jQuery('#tooltip').html() )
		{
			jQuery('#tooltip').show().animate({
				opacity: 100
			});
		}
	}

	function hideTooltip(elem)
	{
		jQuery('#tooltip').animate({
			opacity: 0
		}, {
			complete: function() {
				jQuery(this).hide();
			}
		});
	}
	// Jump to anchor contained in the URL
/*
	if ( window.location.hash )
	{
		$(window.location.hash).click();
	}
*/

	// Parse main_menu anchor links
	$('#menu_main_menu a.menu_item').each(function() {
		if ( matches = $(this).attr('href').match(/(#[a-z0-9-_]+)/i) )
		{
			$(this).data('anchor', matches[1]);
			$(this).click(function(e) {
				e.preventDefault();
				$($(this).data('anchor')).click();
			});
		}
	});
});