Skip to content
Snippets Groups Projects
Commit 87ee2d0f authored by Benjamin Hättasch's avatar Benjamin Hättasch
Browse files

Add calendar view for slots to AK detail page

parent 1374140f
No related branches found
No related tags found
1 merge request!10Port/Rewrite Plan
{% load static %}
{% load tz %}
{% load i18n %}
{% get_current_language as LANGUAGE_CODE %}
<link href='{% static 'AKPlan/fullcalendar/core/main.min.css' %}' rel='stylesheet' />
<link href='{% static 'AKPlan/fullcalendar/daygrid/main.min.css' %}' rel='stylesheet' />
<link href='{% static 'AKPlan/fullcalendar/timegrid/main.min.css' %}' rel='stylesheet' />
<script src='{% static 'AKPlan/fullcalendar/core/main.min.js' %}'></script>
{% with 'AKPlan/fullcalendar/core/locales/'|add:LANGUAGE_CODE|add:'.js' as locale_file %}
<script src="{% static locale_file %}"></script>
{% endwith %}
<script src='{% static 'AKPlan/fullcalendar/daygrid/main.min.js' %}'></script>
<script src='{% static 'AKPlan/fullcalendar/timegrid/main.min.js' %}'></script>
<script src='{% static 'AKPlan/fullcalendar/bootstrap/main.min.js' %}'></script>
<script>
document.addEventListener('DOMContentLoaded', function() {
var calendarEl = document.getElementById('akSlotCalendar');
var calendar = new FullCalendar.Calendar(calendarEl, {
plugins: [ 'timeGrid', 'bootstrap' ],
// Adapt to timezone of the connected event
timeZone: '{{ ak.event.timezone }}',
defaultView: 'timeGrid',
// Adapt to user selected loclae
locale: '{{ LANGUAGE_CODE }}',
// No header, not buttons
header: {
left: '',
center: '',
right: ''
},
aspectRatio: 2.5,
themeSystem: 'bootstrap',
// Only show calendar view for the dates of the connected event
visibleRange: {
start: '{{ ak.event.start | timezone:ak.event.timezone | date:"Y-m-d H:i:s" }}',
end: '{{ ak.event.end | timezone:ak.event.timezone | date:"Y-m-d H:i:s"}}',
},
allDaySlot: false,
nowIndicator: true,
eventTextColor: '#fff',
eventColor: '#127ba3',
// Create entries for all scheduled slots
events: [
{% for slot in ak.akslot_set.all %}
{% if slot.start %}
{'title': '{{ slot.room }}',
'start': '{{ slot.start | timezone:ak.event.timezone | date:"Y-m-d H:i:s" }}',
'end': '{{ slot.end | timezone:ak.event.timezone | date:"Y-m-d H:i:s" }}'},
{% endif %}
{% endfor %}
]
});
calendar.render();
});
</script>
...@@ -4,6 +4,8 @@ ...@@ -4,6 +4,8 @@
{% load fontawesome %} {% load fontawesome %}
{% load tags_AKSubmission %} {% load tags_AKSubmission %}
{% load tags_AKModel %}
{% block title %}{% trans "AKs" %}: {{ ak.event.name }} - {% trans "AK" %}: {{ ak.name }}{% endblock %} {% block title %}{% trans "AKs" %}: {{ ak.event.name }} - {% trans "AK" %}: {{ ak.name }}{% endblock %}
...@@ -14,6 +16,12 @@ ...@@ -14,6 +16,12 @@
<li class="breadcrumb-item active">{{ ak.name }}</li> <li class="breadcrumb-item active">{{ ak.name }}</li>
{% endblock %} {% endblock %}
{% if 'AKPlan'|check_app_installed %}
{% block imports %}
{% include "AKPlan/plan_akslot.html" %}
{% endblock %}
{% endif %}
{% block content %} {% block content %}
{% include "AKSubmission/messages.html" %} {% include "AKSubmission/messages.html" %}
...@@ -60,6 +68,10 @@ ...@@ -60,6 +68,10 @@
<p style="margin-top: 30px;margin-bottom: 30px;">{{ ak.description }}</p> <p style="margin-top: 30px;margin-bottom: 30px;">{{ ak.description }}</p>
{% if 'AKPlan'|check_app_installed %}
<div id='akSlotCalendar' style="margin-bottom: 50px;"></div>
{% endif %}
<table class="table"> <table class="table">
<thead> <thead>
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment