var isScrolling = false;
var wrapper_div = "#timeline_table_wrapper";
var THUMB_WIDTH = 50;
var THUMB_PADDING = 3;

$(document).ready(function(){
	
	$("#timeline_table").find("tr").hover(
		
		function(){
			$(this).addClass("hover_tr");
			
			var hasMedia = !isEmpty($(this).find(".event_middle_col").html());
			var isLeftCol = !isEmpty($(this).find(".event_left_col").html());
			
			$(this).find("td").each(function(){
				if( !isEmpty($(this).text()) ){
					$(this).addClass("event_hover");
					
					if(!hasMedia){
						$(this).addClass("event_closed_hover");
					}
				}
			});
			
			if(isLeftCol){
				$(this).find(".event_middle_col").addClass("event_left_col_hover");
			}else{
				$(this).find(".event_middle_col").addClass("event_right_col_hover");
			}
		
		}, function(){
			
			$(this).find("td").each(function(){
				$(this).removeClass("event_hover");
				$(this).removeClass("event_closed_hover");
				$(this).removeClass("event_left_col_hover");
				$(this).removeClass("event_right_col_hover");
			});
		
			
			$(this).removeClass("hover_tr");
		}
	);
	
	
	$("#timeline_table").find("img").click(function(){
		
	
		timeline_scroll_to($(this));
	
		
		
	});
	
	var tabletxt="";
	
	//initialize table preview
	//already initialized

	var img_arr = $("#timeline_table").find("tr.timeline_highlight");
	
	/*
	var thumbs_per_row = Math.floor($("#timeline_preview").width()/(THUMB_WIDTH+(THUMB_PADDING*2)))
	do_trace(thumbs_per_row);
	
	for(var i=0; i < img_arr.length; i++){
		
		if(i%thumbs_per_row==0){
			tabletxt +="<tr>";
		}
		 
		var i_img = $(img_arr[i]).find("img.timeline_highlight");
		
		var i_src = isEmpty((i_img).attr("data-alt-src")) ?  i_img.attr("src") : i_img.attr("data-alt-src");
		
		var td_class = $(img_arr[i]).hasClass("major_highlight") ? "major_highlight" : "";
		
		tabletxt += "<td class=\""+td_class+"\"><img data-number=\""+i+"\" class=\"timeline_preview_thumb\" src=\""+i_src+"\" alt=\""+i_img.attr("alt")+"\"/></td>";
		
		
		 if( (i+1)%thumbs_per_row==0 ){
			tabletxt += "</tr>";
		}
		
	}
	

	//$("#timeline_preview tbody").append(tabletxt);
	*/

	
	$(".timeline_preview_thumb").click(function(){
		timeline_scroll_to($(img_arr[parseInt($(this).attr("data-number"))]));
		
	})

	
	
	
	
	timeline_tooltip();
	
});

function timeline_scroll_to(item){
		
	if(!isScrolling){
		
		isScrolling = true;
		
		var p = item.position();
		var ptop = p["top"] - $(wrapper_div).position()["top"] - 10;
		var wp_scroll_top = $(wrapper_div).scrollTop();
	
		do_trace("ptop: " + ptop+ "wrapper scrolltop: " +  wp_scroll_top);

		$(wrapper_div).animate({scrollTop: wp_scroll_top + ptop}, 500, function(){
			isScrolling = false;
		});
		
		
		if($('html,body').scrollTop() <= 100 ){
			$('html,body').animate({scrollTop: $("#timeline_preview").position()["top"]  }, 400);
		}		
		
	}
	
	return false;
}

function isEmpty(val){
	return val==="" || val==null || val==undefined
}

function do_trace(val){
//	$("#trace").append("<p>"+val+"</p>")
}
/*
 * Tooltip script 
 * powered by jQuery (http://www.jquery.com)
 * 
 * written by Alen Grakalic (http://cssglobe.com)
 * 
 * for more info visit http://cssglobe.com/post/1695/easiest-tooltip-and-image-preview-using-jquery
 *
 */
 


this.timeline_tooltip = function(){	
	/* CONFIG */		
		xOffset = 10;
		yOffset = 20;		
		// these 2 variable determine popup's distance from the cursor
		// you might want to adjust to get the right result		
	/* END CONFIG */		
	$(".timeline_preview_thumb").hover(function(e){			
		
		
		$(this).addClass("hover_thumb");
										  
		this.t = $(this).attr("alt");
	//	this.attr("alt", "");									  
		$("body").append("<p id='tooltip'>"+ this.t +"</p>");
		$("#tooltip")
			.css("top",(e.pageY - xOffset) + "px")
			.css("left",(e.pageX + yOffset) + "px")
			.fadeIn("fast");		
    },
	function(){
		this.t = $(this).attr("alt");		
		$("#tooltip").remove();
		$(this).removeClass("hover_thumb");
		
    });	
	$(".timeline_preview_thumb").mousemove(function(e){
		$("#tooltip")
			.css("top",(e.pageY - xOffset) + "px")
			.css("left",(e.pageX + yOffset) + "px");
	});			
};