Factorisation

src/agenda_culturel/static/style.scss

@@ -24,6 +24,9 @@ $primary-700: #008080;
         --typography-spacing-vertical: 0.6rem;
         --font-size: 1.3rem;
     }
+    p {
+        --typography-spacing-vertical: 0.6rem;
+    }
 }
 
 
@@ -84,4 +87,12 @@ body>nav {
     @extend .outline;
     font-size: 90%;
     padding: 0.15em 0.4em 0.3em 0.4em;
+}
+
+ul {
+    margin-left: 0.5em;
+}
+
+span.small-cat {
+    cursor: default;
 }

src/agenda_culturel/templates/agenda_culturel/event-inc.html

@@ -0,0 +1,67 @@
+{% load cat_extra %}
+
+
+<article>
+    {% comment %}
+        Le début contient les informations principales: titre, date
+    {% endcomment %}
+    {% if display in "in list by day" %}
+        {% if display == "in list" %}<h2>{% else %}<h3>{% endif %}
+            {% if not event.end_day and event.start_time %}{{ event.start_time }}{% endif %}
+            <a href="{{ event.get_absolute_url }}">{{ event.title }}</a>
+            {% if display == "in list" %}</h2>{% else %}</h3>{% endif %}
+        {% if event.end_day %}<p><em>Cet événement dure du {{ event.start_day |date:"l j F" }} au {{ event.end_day |date:"l j F" }}</em></p>{% endif %}
+    {% else %}
+    <header>
+        <h1>{{ event.title }}</h1>
+        <ul>
+            <li>Début&nbsp;: {{ event.start_day }} {% if event.start_time %} à {{ event.start_time }}{% endif %}</li>
+            {% if event.end_day or event.end_time %}
+            <li>Fin&nbsp;: 
+            {% if event.end_day %}{{ event.end_day }}{% endif %}
+            {% if event.end_time %}{{ event.end_time }}{% endif %}
+            </li>
+            {% endif %}
+        </ul>    
+    </header>
+    {% endif %}
+
+
+
+
+    {% comment %}
+    On affiche le corps du message avec plus ou moins de longueur
+    {% endcomment %}
+    {% if display in "in list by day" %}
+        <p>{{ event.description |truncatewords:20 }}</p>
+    {% else %}
+        <p>{{ event.description }}</p>
+    {% endif %}
+
+
+
+
+    {% comment %}
+    On affiche le pied qui contient les informations de tags, catégories, etc
+    {% endcomment %}
+<footer>
+    <p>
+    {% if mode %}
+        {% if category %}
+            {{ event.category | small_cat }}
+        {% else %}
+            {% url 'view_mode_cat' selected_mode.name event.category.pk as url_cat %}
+            {{ event.category | small_cat:url_cat }}
+        {% endif %}
+    {% else %}
+        {{ event.category | small_cat }}
+    {% endif %}
+    </p>
+    <p>
+        {% for tag in event.tags %}
+        <a href="{% url 'view_tag' tag %}" role="button" class="small-cat">{{ tag }}</a>
+        {% endfor %}
+    </p>
+    </footer>
+</article>
+

src/agenda_culturel/templates/agenda_culturel/event.html

@@ -1,37 +0,0 @@
-{% extends "agenda_culturel/page.html" %}
-
-{% block title %}{{ object.title }}{% endblock %}
-
-{% load cat_extra %}
-
-
-{% block content %}
-
-<article>
-    <header>
-    <h1>{{ object.title }}</h1>
-    <ul>
-        <li>Début&nbsp;: {{ object.start_day }} {% if object.start_time %} à {{ object.start_time }}{% endif %}</li>
-        {% if object.end_day or object.end_time %}
-        <li>Fin&nbsp;: 
-        {% if object.end_day %}{{ object.end_day }}{% endif %}
-        {% if object.end_time %}{{ object.end_time }}{% endif %}
-        </li>
-        {% endif %}
-        
-    </ul>
-    </header>
-
-<p>{{ event.description }}</p>
-
-<footer>
-    <p>{{ event.category | small_cat }}</p>
-    <p>
-        {% for tag in event.tags %}
-        <a href="{% url 'view_tag' tag %}" role="button" class="small-cat">{{ tag }}</a>
-        {% endfor %}
-    </p>
-    </footer>
-</article>
-
-{% endblock %}

src/agenda_culturel/templates/agenda_culturel/page-event.html

@@ -0,0 +1,10 @@
+{% extends "agenda_culturel/page.html" %}
+
+{% block title %}{{ object.title }}{% endblock %}
+
+
+{% block content %}
+
+{% include "agenda_culturel/event-inc.html" with event=event %}
+
+{% endblock %}

src/agenda_culturel/templates/agenda_culturel/page-events.html

@@ -80,27 +80,7 @@
                 {% if events_date %}
                 <h2>{{ date |date:"l j F"| capfirst }}</h2>
                     {% for event in events_date %}
-                        <article>
+                        {% include "agenda_culturel/event-inc.html" with event=event display="in list by day" mode=selected_mode category=category %}
-                            <h3>
-                                {% if not event.end_day and event.start_time %}{{ event.start_time }}{% endif %}
-                                <a href="{{ event.get_absolute_url }}">{{ event.title }}</a></h3>
-                            {% if event.end_day %}<p><em>Cet événement dure du {{ event.start_day |date:"l j F" }} au {{ event.end_day |date:"l j F" }}</em></p>{% endif %}
-                            <p>{{ event.description |truncatewords:20 }}</p>
-
-                            <footer>
-                            <p>{% if category %}
-                            {{ event.category | small_cat }}
-                            {% else %}
-                            {% url 'view_mode_cat' selected_mode.name event.category.pk as url_cat %}
-                            {{ event.category | small_cat:url_cat }}
-                            {% endif %} </p>
-                            <p>
-                                {% for tag in event.tags %}
-                                <a href="{% url 'view_tag' tag %}" role="button" class="small-cat">{{ tag }}</a>
-                                {% endfor %}
-                            </p>
-                            </footer>
-                        </article>
                     {% endfor %}
                 {% endif %}
                 {% endwith %}

src/agenda_culturel/templates/agenda_culturel/tag.html

@@ -10,32 +10,7 @@
 <h1>Étiquette <em>{{ tag }}</em></h1>
 
 {% for event in events %}
-<article>
+{% include "agenda_culturel/event-inc.html" with event=event display="in list" %}
-    <h3>
-        {% if not event.end_day and event.start_time %}{{ event.start_time }}{% endif %}
-        <a href="{{ event.get_absolute_url }}">{{ event.title }}</a></h3>
-        <ul>
-            <li>Début&nbsp;: {{ event.start_day }} {% if event.start_time %} à {{ event.start_time }}{% endif %}</li>
-            {% if event.end_day or event.end_time %}
-            <li>Fin&nbsp;: 
-            {% if event.end_day %}{{ event.end_day }}{% endif %}
-            {% if event.end_time %}{{ event.end_time }}{% endif %}
-            </li>
-            {% endif %}
-            
-        </ul>
-
-    <p>{{ event.description |truncatewords:20 }}</p>
-
-    <footer>
-    <p>{{ event.category | small_cat }}</p>
-    <p>
-        {% for tag in event.tags %}
-        <a href="{% url 'view_tag' tag %}" role="button" class="small-cat">{{ tag }}</a>
-        {% endfor %}
-    </p>
-    </footer>
-</article>
 {% endfor %}
 
 {% endblock %}

src/agenda_culturel/views.py

@@ -102,7 +102,7 @@ def tag_list(request):
 
 class EventDetailView(DetailView):
     model = Event
-    template_name = "agenda_culturel/event.html"
+    template_name = "agenda_culturel/page-event.html"
 
     def get_context_data(self, **kwargs):
         context = super().get_context_data(**kwargs)