// JavaScript Document

// Start function when DOM has completely loaded 
$(document).ready(function(){ 
	
	// Open the calendar.xml file
	$.get(calendar_file,{},function(xml){
      	
		// Initialize counter
		var event_counter = 0;
		
		// Build an HTML string
		myHTMLOutput = '';
		myHTMLOutput += '<table id="events_listing">';
		myHTMLOutput += '<th>Event</th><th>Date</th><th>Time</th>';
		
		// Run the function for each event in the XML file
		$('event',xml).each(function(i) {
			event_name = $(this).find("event_title").text();
			event_date = $(this).find("event_date").text();
			start_time = $(this).find("start_time").text();
			end_time = $(this).find("end_time").text();
			event_url = $(this).find("event_url").text(); 
			
			if(event_counter<=5) {
				// Build row HTML data and store in string
				mydata = BuildEventHTML(event_name, event_date, start_time, end_time, event_url);
				myHTMLOutput = myHTMLOutput + mydata;
			}
			event_counter++;
		});
		myHTMLOutput += '</table>';
			
		// Update the DIV called 'jquery_table' with the HTML string
		$("div#upcoming_events").append(myHTMLOutput);
	});
});
 
 
 
 function BuildEventHTML(event_title,event_date,start_time,end_time,event_url) {
	
	// Build HTML string and return
	output = '';
	output += '<tr>';
	output += '<td class="event"><a href="' + event_url + '" title="IUPUI Events Calendar: ' + event_title + '">' + event_title + '</a></td>';
	output += '<td class="date">'+ event_date +'</td>';
	output += '<td class="time"><span class="time_stamp">'+ start_time + '</span> - <span class="time_stamp">' + end_time + '</span></td>';
	output += '</tr>';
	return output;
}