{% extends "base.html" %}
{% block extra_headers %}
<!-- Row Highlight Javascript -->
<script type="text/javascript">
	window.onload=function(){
	var tfrow = document.getElementById('tfhover').rows.length;
	var tbRow=[];
	for (var i=1;i<tfrow;i++) {
		tbRow[i]=document.getElementById('tfhover').rows[i];
		tbRow[i].onmouseover = function(){
		  this.style.backgroundColor = '#ffffff';
		};
		tbRow[i].onmouseout = function() {
		  this.style.backgroundColor = '#cdcdcd';
		};
	}
};
</script>

<style type="text/css">
table.tftable {font-size:12px;color:#333333;width:100%;border-width: 1px;border-color: #a9a9a9;border-collapse: collapse;}
table.tftable th {font-size:13px;background-color:#b8b8b8;border-width: 1px;padding: 8px;border-style: solid;border-color: #a9a9a9;text-align:left;}
table.tftable th.d {font-size:18px;background-color:#757575;border-width: 1px;padding: 8px;border-style: solid;border-color: #a9a9a9;text-align:left;}
table.tftable tr {background-color:#cdcdcd;}
table.tftable td {font-size:12px;border-width: 1px;padding: 8px;border-style: solid;border-color: #a9a9a9;}
</style>
{% endblock %}

{% block content %}
{% for day, timeslots in days_and_timeslots %}
<table id="tfhover" class="tftable" border="1">
	<tr><th class="d">{{ day.date|date:"N d, Y" }}</th></tr>
	{% if timeslots|length > 0 %}
	<tr>
		{% for timeslot in timeslots %}
		<th>{{ timeslot.name }} | {{ timeslot.start_time|time:"h:i A" }} - {{ timeslot.end_time|time:"h:i A" }}</th>
		<tr>
		{% for session in sessions %}
			{% if session.time == timeslot and session.day == day %}
			{% for speaker in session.speakers.all %}
			<td>{{ speaker }} - <em>{{ speaker.paper_title }}</em></td>
			{% endfor %}
			{% endif %}
		{% endfor %}
		</tr>
		{% endfor %}
	</tr>
{% else %}
<tr><td><em>No talks scheduled</em></td></tr>
{% endif %}
</table>
<br/>
{% endfor %}
<br/>
{% endblock %}