redesign default layout; add new sections type (Timetable, Logs, Search); fix multiple things & minors changes in some sections; new settings for referencing; new templates for date_list's items; etc

This commit is contained in:
bkfox
2016-07-25 22:31:00 +02:00
parent 960fcab65d
commit bce84af7f3
21 changed files with 630 additions and 249 deletions

View File

@ -1,34 +1,58 @@
{% load i18n %}
<script>
/// Function used to select a panel on a tab selection.
/// The tab should be at max level -2 of the main container
/// The panel must have a class "panel"
function select_tab(target) {
parent = target.parentNode.parentNode;
var date = target.dataset.date;
panel = parent.querySelector('.panel[data-date="' + date + '"]');
// unselect
qs = parent.querySelectorAll('*[selected]');
for(var i = 0; i < qs.length; i++)
if(qs[i].dataset.date != date)
qs[i].removeAttribute('selected');
console.log(panel, target, date);
panel.setAttribute('selected', 'true');
target.setAttribute('selected', 'true');
}
</script>
{# FIXME: get current complete URL #}
<div class="list dated_list">
<div class="list date_list">
{% if nav_dates %}
<nav class="nav_dates">
{% if nav_dates.prev %}
<a href="?date={{ nav_dates.prev|date:"Y-m-d" }}" title="{% trans "previous days" %}">&lt;</a>
<a href="?date={{ nav_dates.prev|date:"Y-m-d" }}" title="{% trans "previous days" %}"></a>
{% endif %}
{% for day in nav_dates.dates %}
<a href="#day_{{day|date:"Y-m-d"}}"
{% if day == nav_dates.date %}class="today"{% endif %}>
<a onclick="select_tab(this);" data-date="day_{{day|date:"Y-m-d"}}"
{% if day == nav_dates.date %}selected{% endif %}
class="tab {% if day == nav_dates.date %}today{% endif %}">
{{ day|date:'D. d' }}
</a>
{% endfor %}
{% if nav_dates.next %}
<a href="?date={{ nav_dates.next|date:"Y-m-d" }}" title="{% trans "next days" %}">&gt;</a>
<a href="?date={{ nav_dates.next|date:"Y-m-d" }}" title="{% trans "next days" %}"></a>
{% endif %}
</nav>
{% endif %}
{% for day, list in object_list %}
<ul id="day_{{day|date:"Y-m-d"}}"
{% if day == nav_dates.date %}class="today"{% endif %}>
<ul class="panel {% if day == nav_dates.date %}class="today"{% endif %}"
{% if day == nav_dates.date %}selected{% endif %}
data-date="day_{{day|date:"Y-m-d"}}">
{# you might like to hide it by default -- this more for sections #}
<h2>{{ day|date:'l d F' }}</h2>
{% with object_list=list item_date_format="H:i" %}
{% for item in list %}
{% include "cms/snippets/list_item.html" %}
{% include "cms/snippets/date_list_item.html" %}
{% endfor %}
{% endwith %}
</ul>

View File

@ -0,0 +1,43 @@
{% comment %}
Configurable item to be put in a dated list. Work like list_item, the layout
is just a bit different.
{% endcomment %}
{% load wagtailimages_tags %}
<a {% if item.url %}href="{{ item.url }}" {% endif %}
class="list_item date_list_item {% if not item_big_cover %}flex_row {% endif %}{% if item.css_class %}{{ item.css_class }}{% endif %}">
{% if not item.show_in_menus and item.date and item_date_format != '' %}
{% with date_format=item_date_format|default_if_none:'l d F, H:i' %}
<time datetime="{{ item.date }}">
{{ item.date|date:date_format }}
</time>
{% endwith %}
{% endif %}
{% if item_big_cover %}
{% image item.cover max-640x480 class="cover big" height="" width="" %}
{% elif item.cover %}
{% image item.cover fill-64x64 class="cover small" %}
{% else %}
<div class="cover small"></div>
{% endif %}
<div class="flex_item">
<h3>{{ item.title }}</h3>
{% if item.summary %}<div class="summary">{{ item.summary }}</div>{% endif %}
{% if item.info %}
<span class="info">{{ item.info|safe }}</span>
{% endif %}
{% if item.extra %}
<div class="extra"></div>
{% endif %}
</div>
</a>

View File

@ -1,15 +1,19 @@
{% comment %}
Options:
- list_css_class: extra class for the main list container
- list_paginator: paginator object to display pagination at the bottom;
{% endcomment %}
{% load i18n %}
{% load aircox_cms %}
<div class="list">
<ul>
<ul class="list {{ list_css_class|default:'' }}">
{% for page in object_list %}
{% with item=page.specific %}
{% include "cms/snippets/list_item.html" %}
{% endwith %}
{% endfor %}
</ul>
{# we use list_paginator to avoid conflicts when there are multiple lists #}
{% if list_paginator and list_paginator.num_pages > 1 %}
@ -54,6 +58,6 @@
</nav>
{% endif %}
</div>
</ul>

View File

@ -4,30 +4,41 @@ ListItem instance.
Options:
* item: item to render. Fields: title, summary, cover, url, date, info, css_class
* item_date_format: format passed to the date filter instead of default one
* item_date_format: format passed to the date filter instead of default one. If
it is an empty string, do not print the date.
* item_big_cover: cover should is big instead of thumbnail (width: 600)
{% endcomment %}
{% load wagtailimages_tags %}
<a {% if item.url %}href="{{ item.url }}" {% endif %}
class="item page_item{% if item.css_class %}{{ item.css_class }}{% endif %}">
{% if item_big_cover %}
{% image item.cover max-600 class="cover item_cover" %}
{% else %}
{% image item.cover fill-64x64 class="cover item_cover" %}
class="list_item {% if not item_big_cover %}flex_row {% endif %}{% if item.css_class %}{{ item.css_class }}{% endif %}">
{% if item.cover %}
{% if item_big_cover %}
{% image item.cover max-640x480 class="cover big" height="" width="" %}
{% else %}
{% image item.cover fill-64x64 class="cover small" %}
{% endif %}
{% endif %}
<h3>{{ item.title }}</h3>
{% if item.summary %}<div class="summary">{{ item.summary }}</div>{% endif %}
{% if not item.show_in_menus and item.date %}
{% with date_format=list_date_format|default:'l d F, H:i' %}
<time datetime="{{ item.date }}">
{{ item.date|date:date_format }}
</time>
{% endwith %}
{% endif %}
{% if item.info %}
<span class="info">{{ item.info|safe }}</span>
<div class="flex_item">
<h3>{{ item.title }}</h3>
{% if item.info %}
<span class="info">{{ item.info|safe }}</span>
{% endif %}
{% if item.summary %}<div class="summary">{{ item.summary }}</div>{% endif %}
{% if not item.show_in_menus and item.date and item_date_format != '' %}
{% with date_format=item_date_format|default_if_none:'l d F, H:i' %}
<time datetime="{{ item.date }}">
{{ item.date|date:date_format }}
</time>
{% endwith %}
{% endif %}
</div>
{% if item.extra %}
<div class="extra"></div>
{% endif %}
</a>