var tl;
var Timeline;
//var document;
//var window;
function onLoad() {
//    var theme = Timeline.ClassicTheme.create();
var theme = Timeline.rbTheme.create();
            theme.event.label.width = 150; // px

var today  = new Date();
var ontem = new Date();
ontem.setDate(today.getDate()-2);
var amanha = new Date();
amanha.setDate(today.getDate()+1);
var duasHoras = new Date();
duasHoras.setHours(today.getHours()-1);
var maisDozeHoras = new Date();
maisDozeHoras.setHours(today.getHours()+12);
var hotStart = new Date();
var hotEnd = new Date();
hotStart.setHours(12);
hotStart.setMinutes(00);
hotEnd.setHours(18);
hotEnd.setMinutes(00);

  var eventSource = new Timeline.DefaultEventSource();
  var bandInfos = [
	Timeline.createBandInfo({
	eventSource:    eventSource,
        date:           today.toUTCString(),
        width:          "90%",
        trackHeight:    1.35,
        trackGap:       1.0, 
	intervalUnit:   Timeline.DateTime.HOUR,
        intervalPixels: 75,
        color:      "#eee",
	theme:		theme
    }),

    Timeline.createBandInfo({
        showEventText:  false,
        trackHeight:   2.0,
        trackGap:       0.1, 
	    eventSource:    eventSource,
        date:           today.toUTCString(),
        width:          "6%",
        intervalUnit:   Timeline.DateTime.DAY,
        intervalPixels: 150,
        color:      "#eee",
        theme:          theme
    }),


   Timeline.createBandInfo({
        showEventText:  false,
        trackHeight:   2.0,
        trackGap:       0.1,
            eventSource:    eventSource,
        date:           today.toUTCString(),
        width:          "4%",
        intervalUnit:   Timeline.DateTime.WEEK,
        intervalPixels: 300,
        color:      "#ccc",
        theme:          theme
    })
  ];



  bandInfos[1].syncWith = 0;
  bandInfos[1].highlight = true;
  bandInfos[2].syncWith = 0;
  bandInfos[2].highlight = true;

            bandInfos[0].eventPainter = new Timeline.ThumbnailEventPainter({
                theme:              theme,
                trackHeight:        40,
                trackOffset:        20,
                labelWidth:         300,
                thumbnailWidth:     80,
                thumbnailHeight:    80
            }); 


  var tl = Timeline.create(
    document.getElementById("my-timeline"),
    bandInfos);

  Timeline.loadXML("http://domelhor.net/time/timeline.php?" +
      Math.random(), function(xml, url) {
         eventSource.loadXML(xml, url);
      });
}

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