symposion_app/pinaxcon/templates/symposion/schedule/schedule_conference.html
2019-12-15 18:02:16 +10:00

121 lines
4.2 KiB
HTML

{% extends "site_base.html" %}
{% load i18n %}
{% load cache %}
{% load lca2018_tags %}
{% block head_title %}Conference Schedule{% endblock %}
{% block page_title %}Conference Schedule{% endblock %}
{% block content %}
<div class="float-right d-print-none">
<div class="dropdown">
<button class="btn btn-secondary dropdown-toggle" type="button" id="downloadMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Download
</button>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="downloadMenuButton">
<h6 class="dropdown-header">Format</h6>
<a class="dropdown-item" href="{% url "ical_feed" %}">iCal (ICS)</a>
<a class="dropdown-item" href="{% url "schedule_json" %}">JSON</a>
</div>
</div>
</div>
<div class="row d-print-none">
<div class="col">
<ul class="nav nav-pills flex-column flex-md-row" id="schedule-tabs" role="tablist">
{% for section in sections %}
{% for timetable in section.days %}
<li class="nav-item flex-md-fill text-md-center">
{% include "symposion/schedule/_schedule_nav_link.html" with active=forloop.first label=timetable.day.date|date:"l" %}
</li>
{% endfor %}
{% endfor %}
</ul>
</div>
</div>
<div class="tab-content d-print-block my-3" id="schedule-tabContent">
{% for section in sections %}
{% cache 600 "schedule-table" section.schedule.section %}
{% for timetable in section.days %}
<div class="row tab-pane fade {% if forloop.first %}show active{% endif %} d-print-block" id="{{ timetable.day.date|date:"l"|lower}}" role="tabpanel" aria-labelledby="schedule_day_{{ timetable.day.date|date:"l"|lower}}-tab">
<div class="col-12">
<h2 class="my-4">
{{ section.schedule.section.name }}
<span class="clearfix d-sm-block d-md-none"></span>
<small class="text-muted">{{ timetable.day.date|date:"l" }}, {{ timetable.day.date }}</small>
</h2>
<div class="table-responsive d-none d-md-block">
{% include "symposion/schedule/_grid.html" %}
</div>
<div class="mobile-schedule d-sm-block d-md-none">
{% include "symposion/schedule/_mobile.html" %}
</div>
</div>
</div>
{% endfor %}
{% endcache %}
{% endfor %}
</div>
{% endblock %}
{% block scripts_extra %}
<script type="text/javascript">
var fragment = window.location.hash.toLowerCase().substring(1);
if (fragment) {
var fragmentid = "#schedule_day_" + fragment + "-tab";
$(fragmentid).tab('show');
} else {
var OFFSET = -10 * (60 * 60 * 1000); // Gold Coast is 10 hours ahead of UTC in Jan.
var JAN = 0; // because January is 0, not 1
var fragments = [
{"day": "monday", "time": Date.UTC(2020, JAN, 13)},
{"day": "tuesday", "time": Date.UTC(2020, JAN, 14)},
{"day": "wednesday", "time": Date.UTC(2020, JAN, 15)},
{"day": "thursday", "time": Date.UTC(2020, JAN, 16)},
{"day": "friday", "time": Date.UTC(2020, JAN, 17)},
{"day": "saturday", "time": Date.UTC(2020, JAN, 18)},
];
var now = new Date().getTime();
for (var i = 0; i < 5; i++) {
var f = fragments[i];
var g = fragments[i+1];
if ((f.time + OFFSET) <= now && now < (g.time + OFFSET)) {
fragment = f.day;
}
}
}
window.addEventListener("hashchange", function(event) {
var fragment = window.location.hash.toLowerCase().substring(1);
if (!fragment) {
return;
};
var tab_id = "#schedule_day_" + fragment + "-tab";
$(tab_id).tab('show');
}, false);
$(".nav-item").click(function(event) {
// This updates the window location fragment so that
// the URL bar is updated, and so that when you go
// back, it loads the right page.
// len("schedule_day_") == 13
var day_tab = event.target.id.substring(13);
var day = day_tab.substr(0, day_tab.length-4);
if (history.pushState) {
history.pushState(null, null, "#" + day);
}
});
</script>
{{ block.super }}
{% endblock %}