From c1baca161682c56696484caa1720d81a465d1f6e Mon Sep 17 00:00:00 2001
From: =?utf8?q?Je=CC=81re=CC=81my=20Fabre?= <Jeremy@iMac-de-Jeremy.local>
Date: Thu, 29 Sep 2016 16:40:23 +0200
Subject: [PATCH] Events list and details

---
 app/static/src/sass/modules/_all.scss         |  1 +
 app/static/src/sass/modules/_page.scss        |  6 ++
 .../sass/modules/boxes/_event-line-box.scss   | 72 +++++++++++++++++
 app/templates/agenda/event_detail.html        |  3 +
 app/templates/agenda/event_list.html          | 81 +++++++++++++------
 .../agenda/includes/event_linecard.html       | 63 +++++++++++++++
 .../agenda/includes/event_metainfo.html       |  8 +-
 7 files changed, 208 insertions(+), 26 deletions(-)
 create mode 100644 app/static/src/sass/modules/boxes/_event-line-box.scss
 create mode 100644 app/templates/agenda/includes/event_linecard.html

diff --git a/app/static/src/sass/modules/_all.scss b/app/static/src/sass/modules/_all.scss
index ed2511ba..95236e32 100755
--- a/app/static/src/sass/modules/_all.scss
+++ b/app/static/src/sass/modules/_all.scss
@@ -13,6 +13,7 @@
 @import 'boxes/page-box';
 @import 'boxes/brief-box';
 @import 'boxes/person-list-box';
+@import 'boxes/event-line-box';
 
 // Sliders
 @import 'sliders/slider-page';
diff --git a/app/static/src/sass/modules/_page.scss b/app/static/src/sass/modules/_page.scss
index 719d228d..21852d8b 100644
--- a/app/static/src/sass/modules/_page.scss
+++ b/app/static/src/sass/modules/_page.scss
@@ -64,6 +64,12 @@ $module: ".page";
 
     }
 
+    &__filters {
+
+        @include margin(0 0 6 0);
+
+    }
+
     hr + #{$module}__block--yellow {
 
         @include margin-top(-2);
diff --git a/app/static/src/sass/modules/boxes/_event-line-box.scss b/app/static/src/sass/modules/boxes/_event-line-box.scss
new file mode 100644
index 00000000..290bac26
--- /dev/null
+++ b/app/static/src/sass/modules/boxes/_event-line-box.scss
@@ -0,0 +1,72 @@
+$module: ".event-line-box";
+
+#{$module} {
+
+    &__content {
+
+        &:after {
+
+            content: "";
+            display: block;
+            width: 100%;
+            height: 1px;
+            background: rgba(0, 0, 0, 0.5);
+
+            @include margin(1 0 2 0);
+
+            @include mq($until: sm) {
+                @include margin(1 0 1 0);
+            }
+
+        }
+
+    }
+
+    &__month {
+
+        @include font-size(l);
+        @include line-height(1);
+        @include typeface(serif);
+        font-weight: weight(heavy);
+
+        @include mq($until: sm) {
+            display: none;
+        }
+
+    }
+
+    &__image {
+
+        width: 100%;
+        height: auto;
+
+    }
+
+    &__tags {
+
+        margin-bottom: 5px;
+
+    }
+
+    &__title {
+
+        @include font-size(xxl);
+        @include line-height(1.25);
+        @include typeface(sans-serif);
+        font-weight: weight(bold);
+
+        margin-top: 0;
+        @include margin-bottom(1);
+
+    }
+
+    &__desc {
+
+        @include font-size(m);
+        @include line-height(1);
+        @include typeface(serif);
+        font-weight: weight(light);
+
+    }
+
+}
diff --git a/app/templates/agenda/event_detail.html b/app/templates/agenda/event_detail.html
index f9f979df..d1680a9b 100644
--- a/app/templates/agenda/event_detail.html
+++ b/app/templates/agenda/event_detail.html
@@ -46,6 +46,9 @@
 
 {% block breadcrumb_menu %}
     {{ block.super }}
+    <li class="breadcrumb__item">
+        <a href="{% url 'event_list' %}" class="breadcrumb__link">{% trans "Agenda" %}</a>
+    </li>
     <li class="breadcrumb__item active">{{ event.title }}</li>
 {% endblock %}
 
diff --git a/app/templates/agenda/event_list.html b/app/templates/agenda/event_list.html
index 64ceebdc..907fb3b3 100644
--- a/app/templates/agenda/event_list.html
+++ b/app/templates/agenda/event_list.html
@@ -27,10 +27,10 @@
 
 {% block breadcrumb_menu %}
     {{ block.super }}
-    <li class="breadcrumb__item">
-        <a href="{% url 'event_list' %}" class="breadcrumb__link">{% trans "Agenda" %}</a>
-    </li>
     {% if tag or location or month or week or author %}
+        <li class="breadcrumb__item">
+            <a href="{% url 'event_list' %}" class="breadcrumb__link">{% trans "Agenda" %}</a>
+        </li>
         <li class="breadcrumb__item active">
             {% if tag %}
                 {% trans "Tag:" %} {{ tag }}
@@ -47,32 +47,65 @@
                 {% trans "Author:" %} {{ author.get_full_name|default:author.username }}
             {% endif %}
         </li>
+    {% else %}
+        <li class="breadcrumb__item active">
+            {% trans "Agenda" %}
+        </li>
     {% endif %}
 {% endblock %}
 
 {% block main %}
-<div class="msry__container">
-    <div class="msry__sizer">
-        {% for event in events.object_list %}
-         {% include 'agenda/includes/event_card.html' %}
-        {% endfor %}
-    </div>
-</div>
-{% endblock %}
-{# <a href='{% icalendar_url %}' target="_blank" class="small  push-ical">{% trans "Subscribe to all events in" %} Google Calendar/Outlook/iCal</a>#}
+    <div class="page page--{% spaceless %}{% block page_class %}{% endblock %}{% endspaceless %}">
 
-{% pagination_for events %}
+        <div class="container">
 
-{% if settings.COMMENTS_DISQUS_SHORTNAME %}
-{% include "generic/includes/disqus_counts.html" %}
-{% endif %}
+            <div class="row">
 
-{% block page_title %}
-    <h1 class="dotted">
-        {% if page %}
-            {{ page.richtextpage.meta_title }}
-        {% else %}
-            {% trans "Agenda" %}
-        {% endif %}
-    </h1>
+                <div class="col-sm-9 col-sm-push-3 col-lg-8 col-lg-push-2 white-bg">
+                    <h1 class="dotted">
+                        {% if page %}
+                            {{ page.richtextpage.meta_title }}
+                        {% else %}
+                            {% trans "Agenda" %}
+                        {% endif %}
+                    </h1>
+
+                    <div class="page__filters">
+                        {% keywords_for mezzanine_agenda.event as tags %}
+                        {% all_events as all_events %}
+                        {% if tags %}
+                            <a href="{% url 'event_list' %}" class="button{% if not tag %} button--black{% else %} button--white{% endif %}">{% trans "All events" %} ({{ all_events.count }})</a>
+                            {% for t in tags %}
+                                <a href="{% url "event_list_tag" t.slug %}" class="button{% if tag == t %} button--black{% else %} button--white{% endif %}">
+                                    {{ t }} ({{ t.item_count }})
+                                </a>
+                            {% endfor %}
+                        {% endif %}
+                    </div>
+
+                </div>
+
+            </div>
+
+            <div class="row">
+
+                <div class="col-xs-12">
+
+                    <div class="white-bg page__content">
+                        <div class="container">
+                            {% for event in events.object_list %}
+                                {% include 'agenda/includes/event_linecard.html' %}
+                            {% endfor %}
+                        </div>
+                    </div>
+
+                </div>
+
+            </div>
+
+        </div>
+
+        {% pagination_for events %}
+
+    </div>
 {% endblock %}
diff --git a/app/templates/agenda/includes/event_linecard.html b/app/templates/agenda/includes/event_linecard.html
new file mode 100644
index 00000000..e41f7a45
--- /dev/null
+++ b/app/templates/agenda/includes/event_linecard.html
@@ -0,0 +1,63 @@
+{% load i18n future mezzanine_tags event_tags keyword_tags disqus_tags organization_tags %}
+
+<div class="row event-line-box">
+
+    <div class="col-sm-2 col-md-3 col-lg-3 event-line-box__month">
+
+        {% ifchanged event.start.month %}
+            {{ event.start|date:'F' }}
+        {% endifchanged %}
+
+    </div>
+
+    <div class="col-sm-10 col-md-9 col-lg-9 event-line-box__content">
+
+        <div class="row">
+
+            <div class="col-xs-3">
+                {% with True as unit_booking %}
+                {% with True as line_display %}
+                    {% include 'agenda/includes/event_metainfo.html' %}
+                {% endwith %}
+                {% endwith %}
+            </div>
+            <div class="col-xs-3">
+                {% with event.images.all|get_type:'card' as images %}
+                    {% if images %}
+                        <a href="{{ event.get_absolute_url }}">
+                            <img class="event-line-box__image" src="{{ MEDIA_URL }}{% thumbnail images.0.file 203 140 %}" width="203" height="140">
+                        </a>
+                    {% endif %}
+                {% endwith %}
+            </div>
+            <div class="col-xs-6">
+                {% keywords_for event as tags %}
+                {% if event.departments.all.0 or tags %}
+                    <div class="event-line-box__tags">
+                        {% if event.departments.all.0 %}
+                            <div class="tag tag--small dashed dashed--gray">
+                              {{ event.departments.all.0.department.name }}
+                            </div>
+                        {% endif %}
+                        {% keywords_for event as tags %}
+                        {% if tags %}
+                            <div class="tag tag--small tag--category">
+                                {% keywords_for event as tags %}
+                                {{tags.0}}
+                            </div>
+                        {% endif %}
+                    </div>
+                {% endif %}
+                <h2 class="event-line-box__title">
+                    <a href="{{ event.get_absolute_url }}">{{ event.title }}</a>
+                </h2>
+                <div class="event-line-box__desc">
+                    {{ event.description|slice:":128" }}
+                </div>
+            </div>
+
+        </div>
+
+    </div>
+
+</div>
diff --git a/app/templates/agenda/includes/event_metainfo.html b/app/templates/agenda/includes/event_metainfo.html
index 0804eb1c..c13f8ffe 100644
--- a/app/templates/agenda/includes/event_metainfo.html
+++ b/app/templates/agenda/includes/event_metainfo.html
@@ -16,9 +16,11 @@
             <small><u>{{ event.location.room }}</u></small>
         {% endif %}
     </a>
+    {% if not line_display %}
     <a href="{{ event|google_nav_url }}" target="_blank" class="">
          {% google_static_map event 900 300 15 %}
-    </a/>
+    </a>
+    {% endif %}
 
     <div class="page__meta-separator"></div>
 {% endif %}
@@ -43,7 +45,9 @@
         </p>
 
     {% else %}
-        {% trans "Free entry. Limited seats available" %}
+        <p>
+            {% trans "Free entry. Limited seats available" %}
+        </p>
     {% endif %}
 
 {% endif %}
-- 
2.39.5