var tl;
function onLoad() {
	
	var eventSource  = new Timeline.DefaultEventSource();
	var eventSource2 = new Timeline.DefaultEventSource();
	var eventSource3 = new Timeline.DefaultEventSource();  

	var theme = Timeline.ClassicTheme.create();
	theme.event.bubble.width = 350;
	theme.event.bubble.height = 250;
	theme.ether.backgroundColors[1] = theme.ether.backgroundColors[0];

  var bandInfos = [
		Timeline.createBandInfo({
			eventSource:    eventSource,
			width:          "40%",
			intervalUnit:   Timeline.DateTime.YEAR,
			intervalPixels: 75,
			showEventText:  true,
			trackHeight:    1.4,
			trackGap:       0.2,
			theme:          theme
		}),
		Timeline.createBandInfo({
			eventSource:    eventSource2,
			width:          "30%",
			intervalUnit:   Timeline.DateTime.YEAR,
			intervalPixels: 75,
			showEventText:  true,
			trackHeight:    1.4,
			trackGap:       0.2,
			theme:          theme
		}),
		Timeline.createBandInfo({
			eventSource:    eventSource3,
			width:          "30%",
			intervalUnit:   Timeline.DateTime.YEAR,
			intervalPixels: 75,
			showEventText:  true,
			trackHeight:    1.4,
			trackGap:       0.2,
			theme:          theme
		})
  ];

	bandInfos[0].decorators = [
	new Timeline.SpanHighlightDecorator({
		startDate:  "Dec 01 2011 00:00:00 GMT",
		endDate:    "Jan 01 2012 23:59:59 GMT",
		startLabel: "Planetary Science",
		endLabel:   "",
		color:      "#FFC080",
		opacity:    50,
		theme:      theme
	})
	];

	bandInfos[1].decorators = [
	new Timeline.SpanHighlightDecorator({
		startDate:  "Dec 01 2011 00:00:00 GMT",
		endDate:    "Jan 01 2012 23:59:59 GMT",
		startLabel: "Astrophysics",
		endLabel:   "",
		color:      "#FFC080",
		opacity:    50,
		theme:      theme
	})
	];

	bandInfos[2].decorators = [
	new Timeline.SpanHighlightDecorator({
		startDate:  "Dec 01 2011 00:00:00 GMT",
		endDate:    "Jan 01 2012 23:59:59 GMT",
		startLabel: "Heliophysics",
		endLabel:   "",
		color:      "#FFC080",
		opacity:    50,
		theme:      theme
	})
	];

  tl = Timeline.create(document.getElementById("my-timeline"), bandInfos);
  Timeline.loadXML("http://spacespin.org/timeline/planetaryscience.xml", function(xml, url) { eventSource.loadXML(xml, url); });
  Timeline.loadXML("http://spacespin.org/timeline/astrophysics.xml", function(xml, url) { eventSource2.loadXML(xml, url); });
  Timeline.loadXML("http://spacespin.org/timeline/heliophysics.xml", function(xml, url) { eventSource3.loadXML(xml, url); });
}

var resizeTimerID = null;
function onResize() {
    if (resizeTimerID == null) {
        resizeTimerID = window.setTimeout(function() {
            resizeTimerID = null;
            tl.layout();
        }, 500);
    }
}