var dark = true;

function initialFormatting() {
	$("#playlistTable").css({"border" : "none"});
	
	$("#playlistTable tr:even" ).children().css(
			{"background-color" : "#353535",
			 "border"           : "1px solid black"});
	$("#playlistTable tr:odd"  ).children().css(
			{"background-color" : "#454545",
			 "border"           : "1px solid black"});
	$("#playlistTable tr:first").children().css(
			{"background-color" : "#202020",
			 "border"           : "1px solid black"});
}

function updatePlaylist() {
	var playlistTable  = document     .getElementById      ('playlist').getElementsByTagName('table').item(0);
	var firstItem      = playlistTable.getElementsByTagName('tbody'   ).item(0);
	var firstItemTime  = firstItem    .getElementsByTagName('td'      ).item(0).innerHTML;
	var firstItemTitle = firstItem    .getElementsByTagName('td'      ).item(1).innerHTML;
	var lastItem       = playlistTable.getElementsByTagName('tbody'   ).item(9);
	//console.log('firstItemTime:' + firstItemTime);
	//console.log('firstItemTitle:' + firstItemTitle);
	
	// get the playlist info
	$.ajax( {
		url:      'data/currentlyplaying.php',
		data:     'for=interactive',
		type:     'GET', 
		dataType: 'text',
		success: function(data, success) {
			// process transport.responseText into array based on line breaks
			//console.log(transport.responseText);
			var plItemArray = data.split('\n');
			
			var time   = plItemArray[0];
			var title  = plItemArray[1];
			var artist = plItemArray[2];
			var album  = plItemArray[3];
			//console.log(time);
			//console.log(title);
			//console.log(artist);
			//console.log(album);
			
			// text to insert
			var toInsert = "<tr><td>"+time+"</td><td>"+title+"</td><td>"+artist+"</td><td>"+album+"</td></tr>";
			//console.log(toInsert);
			
			// check if the times match, if not:continue add
			if (firstItemTime != time && firstItemTitle != title) {
				//console.log("they dont match!");
				//console.log('firstItemTime:' + firstItemTime);
				//console.log('time from request:' + time);
				//console.log('firstItemTitle:' + firstItemTitle);
				//console.log('title from request:' + title);
			
				// insert into page at top and remove last item
				if (dark)
					var color = "#353535";
				else 
					var color = "#454545";
				dark = !dark;
				
				$("#playlistTable tr:first").after(toInsert).next()
				.children()//.hide()
				.css(
						{"background-color" : color,
						 "border"           : "1px solid black"});
				
				//$("#playlistTable tr:first").next().children().slideDown("2000",
					//function() { $("#playlistTable tr:last" ).children().slideUp("2000",
							//function() { 
								$("#playlistTable tr:last" ).remove(); 
							//}
						//);
					//});
				
				
			}
		}
	});
	
	// pause
	setTimeout("updatePlaylist()", 5000);
}
initialFormatting();
updatePlaylist();

