bachir
/
performance-art.fr


			
				
					
						
						
							1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798
							<!--
http://code.google.com/apis/gdata/samples/cal_sample.html
-->

<html>
  <head>
    <title>Timeline demo</title>

    <style>
      body {font: 10pt arial;}
    </style>

    <script type="text/javascript" src="http://www.google.com/jsapi"></script>
    <script type="text/javascript" src="../timeline.js"></script>
    <link rel="stylesheet" type="text/css" href="../timeline.css">
    
    <script type="text/javascript">
      var cal;
    
      // load the google calendar feed
      function insertAgenda(calendar) {
        cal = calendar;
      }
    </script>
    
    <script type="text/javascript" src="http://www.google.com/calendar/feeds/developer-calendar@google.com/public/full?alt=json-in-script&callback=insertAgenda&orderby=starttime&max-results=20&singleevents=true&sortorder=ascending&futureevents=true"></script>
    
    <script type="text/javascript">
      var timeline;
      
      google.load("visualization", "1");
      
      // Set callback to run when API is loaded
      google.setOnLoadCallback(drawVisualization); 

      /**
       * Parse a date like "2010-10-07T17:00:00.000-07:00" or "2010-10-07"
       * @param {string} googledate
       * @return {Date}
       */      
      function parseGoogleDate(googledate) {
        var year = parseInt(googledate.substr(0,4), 10);
        var month = parseInt(googledate.substr(5,2), 10) - 1;
        var date = parseInt(googledate.substr(8,2), 10);
        
        if (googledate.length <= 10) {
          var date = new Date(year, month, date);
        } else {
          var hour = parseInt(googledate.substr(11,2), 10) - parseInt(googledate.substr(25,2), 10);
          var minute = parseInt(googledate.substr(14,2), 10) - parseInt(googledate.substr(28,2), 10);
          var second = parseInt(googledate.substr(17,2), 10);

          var date = new Date(year, month, date, hour, minute, second);
          date.setMinutes(date.getMinutes() - date.getTimezoneOffset());
        }
        return date;
      }

      // Called when the Visualization API is loaded.
      function drawVisualization() {
        // Create and populate a data table.
        var data = new google.visualization.DataTable();
        data.addColumn('datetime', 'start');
        data.addColumn('datetime', 'end');
        data.addColumn('string', 'content');

        for (i = 0; i < cal.feed.entry.length; i++) {
          var start   = parseGoogleDate(cal.feed.entry[i].gd$when[0].startTime);
          var end     = parseGoogleDate(cal.feed.entry[i].gd$when[0].endTime);
          var title   = cal.feed.entry[i].title.$t;
          var content = cal.feed.entry[i].content.$t;
          var href    = cal.feed.entry[i].link[0].href;

          var eventcontent = "<a href='" + href + "'>" + title + "</a>";    
          data.addRow([start, undefined, eventcontent]);
        }

        // specify options
        var options = {
          'width':  "100%", 
          'height': "auto", 
          'style': "dot"
        };

        // Instantiate our timeline object.
        timeline = new links.Timeline(document.getElementById('mytimeline'));
        
        // Draw our timeline with the created data and options 
        timeline.draw(data, options);
      }
   </script>
  </head>

  <body>
    <h1>Google upcoming events</h1>
    <div id="mytimeline"></div>
  </body>
</html>