From 66d170e22527cf462634aae6e60af6f00286b249 Mon Sep 17 00:00:00 2001
From: Michael Boelen <michael.boelen@cisofy.com>
Date: Mon, 26 Jun 2023 11:38:27 +0200
Subject: [PATCH] Structuur aanbrengen in weergave van events

---
 themes/nluug/layouts/calendar/single.html | 136 ++++++++++++----------
 1 file changed, 73 insertions(+), 63 deletions(-)

diff --git a/themes/nluug/layouts/calendar/single.html b/themes/nluug/layouts/calendar/single.html
index 75af551..2be46f9 100644
--- a/themes/nluug/layouts/calendar/single.html
+++ b/themes/nluug/layouts/calendar/single.html
@@ -4,70 +4,80 @@
   <h2>Aankomende evenementen</h2>
     {{ $upcoming_events := .Site.Data.evenementen.kalender }}
     {{ $upcoming_events := sort $upcoming_events ".date_start" "asc" }}
+    <div class="three-column-grid">
     {{ range first 50 (where $upcoming_events "date_start" "gt" (dateFormat "2006-01-02" now)) }}
-    <div id="{{ anchorize (.date_start | dateFormat "2006-01-02") }}-{{ anchorize .name }}" style="border: 1px solid darkgray; border-radius: 2px; padding:10px; margin:2px;">
-      <h3>{{ .date_start | dateFormat "02-01-2006" }} - {{ .name }}</h3>
-      {{ with .organizer }}<p><em>Georganiseerd door {{ .}}</em></p>{{ end }}
-      {{ with .event_organizer }}<p><em>Georganiseerd door {{ .}}</em></p>{{ end }}
-      {{ if ne .date_start .date_end }}
-      <p>Event van meerdere dagen: <time class="g time" datetime="{{ dateFormat "2006-01-02" .date_start }}">{{ .date_start | dateFormat "02-01-2006" }}</time> t/m <time class="g time" datetime="{{ dateFormat "2006-01-02" .date_end }}">{{ .date_end | dateFormat "02-01-2006" }}</time></p>
-      {{ end }}
-      {{ $event_location := .event_location | default "Locatie onbekend" }}
-      {{ with .event_address }}
-      <h4>Locatie en adres</h4>
-      <p><strong>{{ $event_location }}</strong><br>{{ with .street_address }}{{ . }}{{ end }}<br>{{ with .postal_code }}{{ . }}{{ end }}{{ with .city }}, {{ . }}{{ end }}{{ with .country }}, {{ . }}{{ end }}</p>
-      <a href="https://www.openstreetmap.org/search?query={{ with .street_address }}{{ . | urlquery }}{{ end }},{{ with .postal_code }}{{ . | urlquery }}{{ end }}{{ with .city }},%20{{ . | urlquery }}{{ end }}">{{ partial "show-svg-icon.html" (dict "context" . "icon" "map-location-dot" "title" "Bekijk locatie op OpenStreetMap") }}</a>
-      {{ end }}
-      {{ with .link_external }}
-      <p>&raquo; <a href="{{ . }}" rel="nofollow">Meer informatie (externe link)</a></p>
-      {{ end }}
-      </div>
+      <div id="{{ anchorize (.date_start | dateFormat "2006-01-02") }}-{{ anchorize .name }}">
+        <h3>{{ .name }}</h3>
+        {{ if .organizer }}<small><em>Georganiseerd door {{ .organizer }}</em></small>{{ end }}
+        {{ if .event_organizer }}<small><em>Georganiseerd door {{ if .event_organizer_url }}<a href="{{ .event_organizer_url }}" rel="nofollow noopener">{{ .event_organizer }}</a>{{ else }}{{ .event_organizer }}{{ end }}</em></small>{{ end }}
+        {{ if ne .date_start .date_end }}
+        <p>Event van meerdere dagen: <time class="g time" datetime="{{ dateFormat "2006-01-02" .date_start }}">{{ .date_start | time.Format ":date_full" }}</time> t/m <time class="g time" datetime="{{ dateFormat "2006-01-02" .date_end }}">{{ .date_end | time.Format ":date_full" }}</time></p>
+        {{ else }}
+          <p>Datum: <time class="g time" datetime="{{ dateFormat "2006-01-02" .date_start }}">{{ .date_start | time.Format ":date_full" }}</time></p>
+        {{ end }}
+        {{ $event_location := .event_location | default "Locatie onbekend" }}
+        {{ with .event_address }}
+        <h4>Locatie en adres</h4>
+        <p><strong>{{ $event_location }}</strong><br>{{ with .street_address }}{{ . }}{{ end }}<br>{{ with .postal_code }}{{ . }}{{ end }}{{ with .city }}, {{ . }}{{ end }}{{ with .country }}, {{ . }}{{ end }}</p>
+        <a href="https://www.openstreetmap.org/search?query={{ with .street_address }}{{ . | urlquery }}{{ end }},{{ with .postal_code }}{{ . | urlquery }}{{ end }}{{ with .city }},%20{{ . | urlquery }}{{ end }}">{{ partial "show-svg-icon.html" (dict "context" . "icon" "map-location-dot" "title" "Bekijk locatie op OpenStreetMap") }}</a>
+        {{ end }}
+        {{ with .link_external }}
+        <p>&raquo; <a href="{{ . }}" rel="nofollow">Meer informatie (externe link)</a></p>
+        {{ end }}
+        </div>
 
-        <script type="application/ld+json">
-            {
-                "@context": "https://schema.org",
-                "@type": "Event",
-                "name": "{{ .name }}",
-                "startDate": "{{ .date_start | dateFormat "02-01-2006" }}",
-                "endDate": "{{ .date_end | dateFormat "02-01-2006" }}",
-                "eventAttendanceMode": "https://schema.org/{{ if .event_attendance_mode }}{{ .event_attendance_mode | strings.FirstUpper }}{{ else }}Offline{{ end }}EventAttendanceMode",
-                "eventStatus": "https://schema.org/EventScheduled",
-                {{ with .event_address }}
-                "location": {
-                    "@type": "Place",
-                    "address": {
-                        "@type": "PostalAddress",
-                        {{ with .city }}"addressLocality": "{{ . }}",{{ end }}
-                        {{ with .street_address }}"streetAddress": "{{ . }}",{{ end }}
-                        {{ with .postal_code }}"postalCode": "{{ . }}",{{ end }}
-                        "addressCountry": "{{ if .country }}{{ .country }}{{ else }}The Netherlands{{ end }}"
-                    }
-                },
-                {{ end }}
-                {{ with .event_image }}
-                "image": [
-                    "{{ .url }}"
-                ],
-                {{ end }}
-                "description": "{{ if .event_description }}{{ .event_description }}{{ else }}{{ default .name }}{{ with .event_location}} @ {{ . }}{{ end }}{{ end }}",
-                {{ if .event_organizer }}
-                "performer": {
-                    "@type": "Organization",
-                    "name": "{{ .event_organizer }}"
-                },
-                "organizer": {
-                    "@type": "Organization",
-                    "name": "{{ .event_organizer }}",
-                    "url": "{{ .event_organizer_url }}"
-                },
-                {{ end }}
-                {{ if .event_url }}
-                    "url": "{{ .event_url }}",
-                {{ else if .link_external }}
-                    "url": "{{ .link_external }}",
-                {{ end }}
-                "isAccessibleForFree": {{ if .event_free_access }}true{{ else }}false{{ end }}
-            }
-        </script>
+          <script type="application/ld+json">
+              {
+                  "@context": "https://schema.org",
+                  "@type": "Event",
+                  "name": "{{ .name }}",
+                  "startDate": "{{ .date_start | dateFormat "02-01-2006" }}",
+                  "endDate": "{{ .date_end | dateFormat "02-01-2006" }}",
+                  "eventAttendanceMode": "https://schema.org/{{ if .event_attendance_mode }}{{ .event_attendance_mode | strings.FirstUpper }}{{ else }}Offline{{ end }}EventAttendanceMode",
+                  "eventStatus": "https://schema.org/EventScheduled",
+                  {{ with .event_address }}
+                  "location": {
+                      "@type": "Place",
+                      "address": {
+                          "@type": "PostalAddress",
+                          {{ with .city }}"addressLocality": "{{ . }}",{{ end }}
+                          {{ with .street_address }}"streetAddress": "{{ . }}",{{ end }}
+                          {{ with .postal_code }}"postalCode": "{{ . }}",{{ end }}
+                          "addressCountry": "{{ if .country }}{{ .country }}{{ else }}The Netherlands{{ end }}"
+                      }
+                  },
+                  {{ end }}
+                  {{ if .event_virtual_location }}
+                      "location": {
+                          "@type": "VirtualLocation",
+                          "url": "{{ . }}"
+                      },
+                  {{ end }}
+                  {{ with .event_image }}
+                  "image": [
+                      "{{ .url }}"
+                  ],
+                  {{ end }}
+                  "description": "{{ if .event_description }}{{ .event_description }}{{ else }}{{ default .name }}{{ with .event_location}} @ {{ . }}{{ end }}{{ end }}",
+                  {{ if .event_organizer }}
+                  "performer": {
+                      "@type": "Organization",
+                      "name": "{{ .event_organizer }}"
+                  },
+                  "organizer": {
+                      "@type": "Organization",
+                      "name": "{{ .event_organizer }}",
+                      "url": "{{ .event_organizer_url }}"
+                  },
+                  {{ end }}
+                  {{ if .event_url }}
+                      "url": "{{ .event_url }}",
+                  {{ else if .link_external }}
+                      "url": "{{ .link_external }}",
+                  {{ end }}
+                  "isAccessibleForFree": {{ if .event_free_access }}true{{ else }}false{{ end }}
+              }
+          </script>
     {{ end }}
+    </div>
 {{ end }}