/* 
Project: Smultron.pl
Author: hello@piotrekwojciechowski.pl
Version: 2011-11-20
*/

$(document).ready(function() {
	// DOM Ready
	$(function() {
		var $el, leftPos, newWidth;
		/*
			EXAMPLE ONE
		*/
		
		/* Add Magic Line markup via JavaScript, because it ain't gonna work without */
		$("#navigation").append("<li id='magic-line'></li>");
		
		/* Cache it */
		var $magicLine = $("#magic-line");
		
		$magicLine
			.width($(".current_page_item").width())
			.css("left", $(".current_page_item a").position().left)
			.data("origLeft", $magicLine.position().left)
			.data("origWidth", $magicLine.width());
			
		$("#navigation li").find("a").hover(function() {
			$el = $(this);
			leftPos = $el.position().left;
			newWidth = $el.parent().width();
			
			$magicLine.stop().animate({
				left: leftPos,
				width: newWidth
			});
		}, function() {
			$magicLine.stop().animate({
				left: $magicLine.data("origLeft"),
				width: $magicLine.data("origWidth")
			});    
		});
		
	});

});