finished calendar, past lectures. WIP - lecture view

lectures/templates/lectures/includes/lecture.html

+{% load markdownify %}
+
+<li>
+    <a href="{% url "lectures:view_lecture" lecture.id %}" class="hover:no-underline">
+        <div class="card elevation-6">
+            <div class="card__body p-5 hover:bg-gray-100 duration-100">
+                <h2 class="head-alt-sm mb-4">{{ lecture.name }}</h2>
+
+                <span class="flex gap-2 mb-4">
+                    <span>
+                        <i class="ico--clock mr-1"></i> {{ lecture.timestamp }}
+                    </span>
+                </span>
+
+                {% if lecture.description %}
+                    <div class="prose max-w-none">
+                        {{ lecture.description|markdownify|safe }}
+                    </div>
+                {% endif %}
+            </div>
+        </div>
+    </a>
+</li>

lectures/templates/lectures/view_lecture_index.html

@@ -37,35 +37,31 @@
             </div>
             <div>
                 <template v-if="isCurrentView('current_lectures')">
+                    {% if current_lectures %}
                         <ul class="grid md:grid-cols-2 grid-cols-1 gap-4">
                             {% for lecture in current_lectures %}
-                            <li class="card elevation-6">
-                                <div class="card__body p-5">
-                                    <h2 class="head-alt-sm mb-4">{{ lecture.name }}</h2>
-
-                                    <span class="flex gap-2 mb-4">
-                                        <span>
-                                            <i class="ico--clock mr-1"></i> {{ lecture.timestamp }}
-                                        </span>
-                                    </span>
-
-                                    {% if lecture.description %}
-                                        <div class="prose max-w-none">
-                                            {{ lecture.description|markdownify|safe }}
-                                        </div>
-                                    {% endif %}
-                                </div>
-                            </li>
+                                {% include "lectures/includes/lecture.html" with lecture=lecture %}
                             {% endfor %}
                         </ul>
+                    {% else %}
+                        <span class="text-gray-600">Žádné dostupné aktuální lekce.</span>
+                    {% endif %}
                 </template>
                 <template v-if="isCurrentView('calendar')">
-                    <div class="__js-root">
-                        <ui-person-calendar events='[]'></ui-person-calendar>
+                    <div>
+                        <ui-person-calendar events='{{ calendar_data|safe }}'></ui-person-calendar>
                     </div>
                 </template>
                 <template v-if="isCurrentView('recordings')">
-                    c
+                    {% if past_lectures %}
+                        <ul class="grid md:grid-cols-2 grid-cols-1 gap-4">
+                            {% for lecture in past_lectures %}
+                                {% include "lectures/includes/lecture.html" with lecture=lecture %}
+                            {% endfor %}
+                        </ul>
+                    {% else %}
+                        <span class="text-gray-600">Žádné dostupné záznamy.</span>
+                    {% endif %}
                 </template>
             </div>
         </ui-view-provider>

lectures/urls.py

@@ -6,8 +6,13 @@ app_name = "lectures"
 urlpatterns = [
     path("", views.view_avilable_groups, name="view_avilable_groups"),
     path(
-        "lectures/<int:group_id>",
+        "groups/<int:group_id>",
         views.view_lecture_index,
         name="view_lecture_index"
-    )
+    ),
+    path(
+        "lectures/<int:lecture_id>",
+        views.view_lecture,
+        name="view_lecture"
+    ),
 ]

lectures/views.py

+import datetime
+import json
+
+from itertools import chain
+
 from django.conf import settings
 from django.db import models
 from django.shortcuts import get_object_or_404, render
 from django.utils import timezone
+from django.urls import reverse
+from django_http_exceptions import HTTPExceptions
 from guardian.shortcuts import get_objects_for_user
 
 from .models import Lecture, LectureGroup
@@ -62,6 +69,16 @@ def view_lecture_index(request, group_id: int):
         .all()
     )
 
+    calendar_data = []
+    all_lectures = list(chain(current_lectures, past_lectures))
+
+    for lecture in all_lectures:
+        calendar_data.append({
+            "title": lecture.name,
+            "date": lecture.timestamp.date().isoformat(),
+            "url": reverse("lectures:view_lecture", args={"lecture_id": lecture.id}),
+        })
+
     return render(
         request,
         "lectures/view_lecture_index.html",
@@ -73,5 +90,28 @@ def view_lecture_index(request, group_id: int):
             "group": group,
             "current_lectures": current_lectures,
             "past_lectures": past_lectures,
+            "calendar_data": json.dumps(calendar_data)
+        },
+    )
+
+def view_lecture(request, lecture_id: int):
+    lecture = (
+        get_objects_for_user(request.user, "lectures.view_lecture").
+        filter(id=lecture_id).
+        first()
+    )
+
+    if lecture is not None:
+        raise HTTPExceptions.NOT_FOUND
+
+    return render(
+        request,
+        "lectures/view_lecture.html",
+        {
+            **get_base_context(request),
+            "title": f"{lecture.name}",
+            "description": f"e-Learningová lekce {lecture.name}.",
+            "header_name": lecture.name,
+            "lecture": lecture,
         },
     )

shared/static/shared/style.css

@@ -1185,6 +1185,11 @@ html {
   font-weight: 700;
 }
 
+.text-gray-600 {
+  --tw-text-opacity: 1;
+  color: rgb(75 85 99 / var(--tw-text-opacity));
+}
+
 .text-white {
   --tw-text-opacity: 1;
   color: rgb(255 255 255 / var(--tw-text-opacity));

shared/templates/shared/includes/base.html

@@ -37,12 +37,12 @@
         >
 
         <link
-            href="https://styleguide.pirati.cz/2.11.x/css/styles.css"
+            href="http://localhost:3000/css/styles.css"
             rel="stylesheet"
             media="all"
         >
         <link
-            href="https://styleguide.pirati.cz/2.11.x/css/pattern-scaffolding.css"
+            href="http://localhost:3000/css/pattern-scaffolding.css"
             rel="stylesheet"
             media="all"
         >
@@ -192,7 +192,7 @@
         </footer>
 
         <script
-            src="https://styleguide.pirati.cz/2.12.x/js/main.bundle.js"
+            src="http://localhost:3000/js/main.bundle.js"
         ></script>
     </body>
 </html>