/*
Heavily adapted from:
http://valums.com/vertical-scrolling-menu/

*/

(function($) {

$.hold = ({
	loading: '<div class="loading">Loading...</div>',
	callback: function(){return false;},
	target: false,
	interval: 100,
	timeout: 1000
});
$.fn.hold = (function(settings) {
	
	var o = $.extend({}, $.hold, settings);
	
	return $(this).each(function(i){
		var $this = $(this).hide(),
			$loading = $(o.loading).appendTo(o.target || $this.parent()),
			inter = setInterval(function(){
				var images = $this.find('img'),
					length = images.length,
					completed = 0;
				
				images.each(function(){
					if (this.complete) completed++;
				});
				
				if (completed == length){
					clearInterval(inter);
					setTimeout(function(){
						$loading.hide();
						o.callback.call($this, i);
					}, o.timeout);
				}
		}, o.interval);
	});
});

$.hoverscrollable = ({
	callback: (function(o){
		var scrollable = this,
			wrapper = this.parent();
		
		wrapper.css({overflow: 'hidden'});
		this.slideDown('slow', function(){
			// Cache for performance
			var wrapperWidth = wrapper.width();
			var wrapperHeight = wrapper.height();
			// Using outer height to include padding too
			var scrollableHeight = scrollable.outerHeight() + 2*o.inactiveMargin;
			// Do not cache wrapperOffset, because it can change when user resizes window
			// We could use onresize event, but it's just not worth doing that 
			// var wrapperOffset = wrapper.offset();
			
			// Create a invisible tooltip
			var tooltip = $('<div class="sc_menu_tooltip"></div>')
				.css('opacity', 0)
				.appendTo(wrapper);
		
			// Save menu titles
			scrollable.find('a').each(function(){
				$(this).data('tooltipText', this.title);
			});
			
			// Remove default tooltip
			scrollable.find('a').removeAttr('title');
			// Remove default tooltip in IE
			scrollable.find('img').removeAttr('alt');
			
			var lastTarget;
			//When user move mouse over menu
			wrapper.mousemove(function(e){
				// Save target
				lastTarget = e.target;

				var wrapperOffset = wrapper.offset();
			
				var tooltipLeft = e.pageX - wrapperOffset.left;
				// Do not let tooltip to move out of menu.
				// Because overflow is set to hidden, we will not be able too see it 
				tooltipLeft = Math.min(tooltipLeft, wrapperWidth - 75); //tooltip.outerWidth());
				
				var tooltipTop = e.pageY - wrapperOffset.top + wrapper.scrollTop() - 40;
				// Move tooltip under the mouse when we are in the higher part of the menu
				if (e.pageY - wrapperOffset.top < wrapperHeight/2){
					tooltipTop += 80;
				}
				tooltip.css({top: tooltipTop, left: tooltipLeft});
				
				// Scroll menu
				var top = (e.pageY -  wrapperOffset.top) * (scrollableHeight - wrapperHeight) / wrapperHeight - o.inactiveMargin;
				if (top < 0){
					top = 0;
				}
				wrapper.scrollTop(top);
			});
			
			// Setting interval helps solving perfomance problems in IE
			var interval = setInterval(function(){
				if (!lastTarget) return;
				
				var currentText = tooltip.text();
				
				if (lastTarget.nodeName == 'IMG'){
					// We've attached data to a link, not image
					var newText = $(lastTarget).parent().data('tooltipText');

					// Show tooltip with the new text
					if (currentText != newText) {
						tooltip
							.stop(true)
							.css('opacity', 0)
							.text(newText)
							.animate({opacity: 1}, 1000);
					}
				}
			}, 200);
			
			// Hide tooltip when leaving menu
			wrapper.mouseleave(function(){
				lastTarget = false;
				tooltip.stop(true).css('opacity', 0).text('');
			});
		});
	}),
	wrapper_class: 'sc_menu_wrapper',
	scrollable_class: 'sc_menu',
	inactiveMargin: 99
});
$.fn.hoverscrollable = (function(settings) {
	var o = $.extend({}, $.hoverscrollable, settings);
	
	return $(this).each(function(i){
		// Get jQuery elements
		var scrollable = $(this).addClass(o.scrollable_class),
			wrapper = scrollable.parent().addClass(o.wrapper_class);
		
		// Hide images until they are loaded
		scrollable.hold({
			callback: (function(){
				o.callback.call(scrollable, o)
			})
		});
	});
});

})(jQuery)