CGM_Public/pretix_original
2
0
Fork 1
mirror of https://github.com/pretix/pretix.git synced 2026-02-05 02:32:28 +00:00
Code Issues Packages Projects Releases Wiki Activity

Week calendar: Collapse days on mobile (except the current day)

Browse Source
This commit is contained in:
Raphael Michel
2020-10-07 10:41:30 +02:00
parent 3bfaf55094
commit 9b671d6370
7 changed files with 61 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
src/pretix/presale/templates/pretixpresale/event/fragment_subevent_calendar_week.html
View File

@@ -40,3 +40,15 @@
</div>
</form>
{% include "pretixpresale/fragment_week_calendar.html" with show_avail=event.settings.event_list_availability %}
<div class="col-sm-4 visible-xs text-center">
<a href="?{% url_replace request "year" before.isocalendar.0 "week" before.isocalendar.1 %}"
class="btn btn-default">
<span class="fa fa-arrow-left"></span>
{{ before|date:week_format }}
</a>
<a href="?{% url_replace request "year" after.isocalendar.0 "week" after.isocalendar.1 %}"
class="btn btn-default">
{{ after|date:week_format }}
<span class="fa fa-arrow-right"></span>
</a>
</div>

2
src/pretix/presale/templates/pretixpresale/fragment_js.html
View File

@@ -8,12 +8,12 @@
<script type="text/javascript" src="{% static "bootstrap/js/bootstrap.js" %}"></script>
<script type="text/javascript" src="{% static "datetimepicker/bootstrap-datetimepicker.js" %}"></script>
<script type="text/javascript" src="{% static "slider/bootstrap-slider.js" %}"></script>
<script type="text/javascript" src="{% static "pretixbase/js/details.js" %}"></script>
<script type="text/javascript" src="{% static "pretixcontrol/js/jquery.qrcode.min.js" %}"></script>
<script type="text/javascript" src="{% static "pretixpresale/js/widget/floatformat.js" %}"></script>
<script type="text/javascript" src="{% static "pretixpresale/js/ui/questions.js" %}"></script>
<script type="text/javascript" src="{% static "pretixpresale/js/ui/main.js" %}"></script>
<script type="text/javascript" src="{% static "pretixbase/js/asynctask.js" %}"></script>
<script type="text/javascript" src="{% static "pretixbase/js/details.js" %}"></script>
<script type="text/javascript" src="{% static "pretixpresale/js/ui/cart.js" %}"></script>
<script type="text/javascript" src="{% static "lightbox/js/lightbox.min.js" %}"></script>
<script type="text/javascript" src="{% static "pretixpresale/js/ui/iframe.js" %}"></script>

10
src/pretix/presale/templates/pretixpresale/fragment_week_calendar.html
View File

@@ -1,9 +1,11 @@
{% load i18n %}
<div class="week-calendar">
{% for day in days %}
<div class="weekday {% if day.events %}has-events{% else %}no-events{% endif %}"
data-date="{{ day.date|date:"SHORT_DATE_FORMAT" }}">
<h3>{{ day.day_formatted }}</h3>
<details class="weekday {% if day.events %}has-events{% else %}no-events{% endif %} {% if day.today %}today{% endif %}"
data-date="{{ day.date|date:"SHORT_DATE_FORMAT" }}" open>
<summary>
<h3><span class="fa fa-fw"></span> {{ day.day_formatted }}</h3>
</summary>
<div class="events">
{% for event in day.events %}
<a class="event {% if event.continued %}continued{% else %} {% spaceless %}
@@ -84,6 +86,6 @@
</a>
{% endfor %}
</div>
</div>
</details>
{% endfor %}
</div>

12
src/pretix/presale/templates/pretixpresale/organizers/calendar_week.html
View File

@@ -77,6 +77,18 @@
{% endfor %}
</form>
{% include "pretixpresale/fragment_week_calendar.html" with show_avail=request.organizer.settings.event_list_availability %}
<div class="col-sm-4 visible-xs text-center">
<a href="?{% url_replace request "year" before.isocalendar.0 "week" before.isocalendar.1 %}"
class="btn btn-default">
<span class="fa fa-arrow-left"></span>
{{ before|date:week_format }}
</a>
<a href="?{% url_replace request "year" after.isocalendar.0 "week" after.isocalendar.1 %}"
class="btn btn-default">
{{ after|date:week_format }}
<span class="fa fa-arrow-right"></span>
</a>
</div>
{% if multiple_timezones %}
<div class="alert alert-info">

3
src/pretix/presale/views/organizer.py
View File

@@ -10,7 +10,7 @@ from django.db.models.functions import Coalesce, Greatest
from django.http import Http404, HttpResponse
from django.utils.decorators import method_decorator
from django.utils.formats import date_format, get_format
from django.utils.timezone import now
from django.utils.timezone import now, get_current_timezone
from django.views import View
from django.views.decorators.cache import cache_page
from django.views.generic import ListView, TemplateView
@@ -427,6 +427,7 @@ def days_for_template(ebd, week):
{
'day_formatted': date_format(day, day_format),
'date': day,
'today': day == now().astimezone(get_current_timezone()).date(),
'events': sorted(ebd.get(day), key=sort_ev) if day in ebd else []
}
for day in week.days()

10
src/pretix/static/pretixpresale/js/ui/main.js
View File

@@ -439,6 +439,14 @@ $(function () {
}
});
// Week calendar
// On mobile, auto-collapse all days except today
if ($(window).width() < 992) {
$(".week-calendar .weekday:not(.today)").each(function () {
$(this).prop("open", false);
});
}
// Lightbox
lightbox.init();
});
@@ -480,4 +488,4 @@ function copy_answers(elements, answers) {
}
});
questions_toggle_dependent(true);
}
}

20
src/pretix/static/pretixpresale/scss/_calendar.scss
View File

@@ -80,6 +80,16 @@
h3 {
margin-bottom: 5px;
font-weight: bold;
cursor: pointer;
}
h3 .fa::before {
content: $fa-var-caret-right;
}
details[open] h3 .fa::before {
content: $fa-var-caret-down;
}
.events {
overflow: hidden; /* required for smooth toggle animation */
}
.no-events {
display: none;
@@ -90,6 +100,14 @@
display: flex;
flex-direction: row;
details[open] summary {
cursor: default;
pointer-events: none;
h3 .fa {
display: none;
}
}
.weekday {
flex: 1;
margin: 0 5px;
@@ -128,4 +146,4 @@
.select-calendar-week-short {
max-width: 50%;
}
}
}