// jQuery Timeline
// By Carlos D. Correa (C) 2008
// correac@vis.cs.ucdavis.edu

	var cats = new Array();
	var ids = new Array();
	var details = new Array();
	var curId = 0;
	var beginYr, endYr;
	var maxFreq = 0;

	function drawYear(year) {
		var n = 0;
		for (var i in cats) {
			if(i.substring(0,4)==year) {
				maxFreq = Math.max(maxFreq,cats[i]);
			}
		}
		var str = "";
		var width = 100/(endYr-beginYr+1);
		str+="<td class='year' style='width:"+width+"%'>";
		str+="<table style='height:"+maxFreq*10+"px' class='year'><tr>";
		for (var i in cats) {
			if(i.substring(0,4)==year) {
				var freq = cats[i];
				var category = i.substring(4);
				var gg = 192;
				var bb = (n+1)*40;
				var id = Math.min(ids[category],7);
				var key = ""+i;
				var classId = "cat"+id;

				str+="<td style='padding:0px;border:0px;'>";
				str+="<a href='#' onMouseOver='javascript:showDetail(\""+key+"\");' style='border:0px solid;'>";
				str+="<img id='"+category+ "' src='vis/plotC"+id+".jpg' style='width:8px;height:"+freq*10+"px' class="+classId+">";
				str+="</a>";
				str+="</td>";

				n++;
			}
		}
		str+="</tr></table>";
		str+="</td>";
		return str;
	}

	function labelYear(year) {
		var str="";
		str+="<td class='label'><a href='javascript:showYear("+year+");'>" + year + "</a></td>";
		return str;
	}

	function drawLegend() {
		var numyrs = endYr - beginYr +1;
		var str="";
		str+="</tr>";
		str+="<tr><td colspan="+(numyrs+2)+">"
		var n = 0;
		for (var i in ids) {
			var toggleId = "#toggle"+n;
			var id = Math.min(ids[i],7);
			str+="<a  href='#' id='toggle"+n+"' class='enabled'>";
			str+="<img  class='legend' src='vis/plotC"+id+".jpg' style='width:10px;height:10px'>";
			str+=" " + i + " " ;
			str+="</a>";

			n++;
		}
		str+="</td></tr>";
		return str;		
	}

	function addInfo(cat, year, info) {
		var key = ""+year+cat;
		if(typeof(ids[cat]) == 'undefined') {
			ids[cat] = curId++;
		}
		if(typeof(cats[key])== 'undefined') {
			cats[key] = 0;
		}
		cats[key]++;
		if(typeof(details[key])== 'undefined') {
			details[key] = "";
		}
		//item= originalText.substring(idx+offset-20, idx+offset+20);
		details[key]+="<li>"+info + "</li>";
	}
	
	String.prototype.trim = function() {
		return this.replace(/^\s+|\s+$/g,"");
	}

	function draw() {
		var numyrs = endYr-beginYr+1;
		var str="";

		str+="<table class='timeline'><tr>";
		str+="<td></td>";
		for(var yr = beginYr;yr<=endYr;yr++) {
			str+=drawYear(""+yr);
		}
		str+="<td></td>";
		str+="</tr>";
		str+"<tr>";
		str+="<td class='leftBtn'><a class='btn-left' href='\#'>&nbsp;</a></td>";
		for(var yr = beginYr;yr<=endYr;yr++) {
			str+=labelYear(""+yr);
		}
		str+="<td class='rightBtn'><a class='btn-right' href='\#'>&nbsp;</a></td>";
		str+=drawLegend();
		str+="<tr><td colspan="+(numyrs+2)+">"
		//str+="<div id='details' class='details'></div>";

		str+="</td></tr>";

		str+="</tr></table>";
		jQuery("#results").html(str);

		jQuery(".btn-left").click(function(){
			beginYr--;
			endYr--;
			draw();
		});
		jQuery(".btn-right").click(function(){
			beginYr++;
			endYr++;
			draw();
		});
		
		var n=0;
		for (var i in ids) {
			var toggleId = "#toggle"+n;
			jQuery(toggleId).click(function() {
				var cat = jQuery(this).text();
				var id = ids[cat.trim()];
				jQuery(".cat"+id).toggle();
			});
			jQuery(toggleId).toggle(function() {
				jQuery(this).addClass('disabled');
			}, function() {
				jQuery(this).removeClass('disabled');
			});
			n++;
		}
	}

    jQuery(document).ready(function() {
	jQuery(".btn-slide").click(function(){
	  jQuery("#results").slideToggle("slow");
	  var hideText = "Hide";
	  var showText = "Show";
	  var txt = (jQuery(".btn-slide").text() == hideText) ? showText : hideText;
	  jQuery(".btn-slide").text(txt);
	});

    });

    function openTimeline(file, yr1, yr2, initial) {
         $.get(file, function(xmlData){
				//jQuery("#results").append(xmlData);
				//jQuery("#results").append("Hello");

				var numItems = jQuery("item",xmlData).length;
				jQuery("#results").append("Num items = " + numItems);
				jQuery(xmlData).find('item').each(function(){
					var year = jQuery(this).find("year").text();
					var cat = jQuery(this).find("category").text();
					var info = jQuery(this).find("info").text();
					//jQuery("#results").append("<b> " + cat + " - " + year + "</b><br>"+info+"<br>");
					addInfo(cat, year, info);
				});
				beginYr = yr1;
				endYr = yr2;
				draw();
				showDetail(initial);
		});
	};
	function showDetail(key) {
		if(key.length<4) return;
		var year = key.substring(0,4);
		var cat = key.substring(4);
		var text = details[key];
		jQuery("#details").html("<b>"+cat+"</b><ul>"+text+"</ul>");
	}
	function showYear(year) {
		jQuery("#details").html("");
		for (var key in cats) {
			if(key.substring(0,4)==year) {
				var cat = key.substring(4);
				var text = details[key];
				jQuery("#details").append("<b>"+cat+"</b><ul>"+text+"</ul>");
			}
		}
	}