var tl;
function onLoad() {
	var eventSource = new Timeline.DefaultEventSource(0);
	
	var theme = Timeline.ClassicTheme.create();
	theme.event.bubble.width = 250;
	theme.event.bubble.height = 150;

	var d = Timeline.DateTime.setIso8601Date(new Date(), "2008");
	var bandInfos = [
		Timeline.createHotZoneBandInfo({
			zones: [
				{   start:    "Nov 01 2006 00:00:00 GMT+0100",
					end:      "Jan 01 2007 00:00:00 GMT+0100",
					magnify:  2,
					unit:     Timeline.DateTime.MONTH
				},
				{   start:    "May 01 2005 00:00:00 GMT+0100",
					end:      "Jul 01 2005 00:00:00 GMT+0100",
					magnify:  3,
					unit:     Timeline.DateTime.WEEK
				},
				{   start:    "Nov 1 2006 00:00:00 GMT+0100",
					end:      "Dec 31 2006 00:00:00 GMT+0100",
					magnify:  3,
					unit:     Timeline.DateTime.WEEK
				}
			],
			timeZone:       -5,
			width:          "75%", 
			intervalUnit:   Timeline.DateTime.MONTH, 
			intervalPixels: 75,
			eventSource:    eventSource,
			date:           d,
			theme:          theme
		}),
		Timeline.createBandInfo({
			showEventText:  false,
			trackHeight:    2,
			trackGap:       0.5,				
			width:          "10%", 
			intervalUnit:   Timeline.DateTime.YEAR, 
			intervalPixels: 200,
			eventSource:    eventSource,
			date:           d,
			theme:          theme
		}),
		Timeline.createBandInfo({
			showEventText:  false,
			trackHeight:    2,
			trackGap:       0.2,				
			width:          "15%", 
			intervalUnit:   Timeline.DateTime.DECADE, 
			intervalPixels: 200,
			eventSource:    eventSource,
			date:           d,
			theme:          theme
		})				
		
	];
	bandInfos[1].syncWith = 0;
	bandInfos[1].highlight = true;
	bandInfos[2].syncWith = 0;
	bandInfos[2].highlight = true;
	bandInfos[2].decorators = [
		new Timeline.SpanHighlightDecorator({
			startDate:  "2001",
			endDate:    "2009",
			color:      "#FFC080",
			opacity:    50,
			startLabel: "origine",
			endLabel:   "persistenza",
			theme:      theme
		})
	];		           
	tl = Timeline.create(document.getElementById("tl"), bandInfos, Timeline.HORIZONTAL);
	Timeline.loadJSON("/timelineData/MAddAI.js", function(json, url) {
		eventSource.loadJSON(json, url);
	});
}