From 1d10e139464d96c34a2651d094306920d04d3fbb Mon Sep 17 00:00:00 2001
From: lesion <lesion@autistici.org>
Date: Mon, 24 Jan 2022 14:12:41 +0100
Subject: [PATCH] add microdata Event support

---
 components/Event.vue  | 14 +++++++-------
 pages/event/_slug.vue | 18 +++++++++---------
 2 files changed, 16 insertions(+), 16 deletions(-)

diff --git a/components/Event.vue b/components/Event.vue
index 0c18301d..870cd2f0 100644
--- a/components/Event.vue
+++ b/components/Event.vue
@@ -1,14 +1,14 @@
 <template lang="pug">
-  v-card.h-event.event.d-flex
-    nuxt-link(:to='`/event/${event.slug || event.id}`')
-      img.img.u-featured(:src='thumbnail' :alt='alt' loading='lazy' :style="{ 'object-position': thumbnailPosition }")
+  v-card.h-event.event.d-flex(itemscope itemtype="https://schema.org/Event")
+    nuxt-link(:to='`/event/${event.slug || event.id}`' itemprop="url")
+      img.img.u-featured(:src='thumbnail' :alt='alt' loading='lazy' itemprop="image" :style="{ 'object-position': thumbnailPosition }")
       v-icon.float-right.mr-1(v-if='event.parentId' color='success') mdi-repeat
-      .title.p-name {{event.title}}
+      .title.p-name(itemprop="name") {{event.title}}
 
     v-card-text.body.pt-0.pb-0
-      time.dt-start.subtitle-1(:datetime='event.start_datetime|unixFormat("YYYY-MM-DD HH:mm")')  <v-icon>mdi-calendar</v-icon> {{ event|when }}
-      .d-none.dt-end {{event.end_datetime|unixFormat('YYYY-MM-DD HH:mm')}}
-      a.place.d-block.p-location.pl-0(text color='primary' @click="$emit('placeclick', event.place.id)") <v-icon>mdi-map-marker</v-icon> {{event.place.name}}
+      time.dt-start.subtitle-1(:datetime='event.start_datetime|unixFormat("YYYY-MM-DD HH:mm")' itemprop="startDate" :content="event.start_datetime|unixFormat('YYYY-MM-DDTHH:mm')")  <v-icon>mdi-calendar</v-icon> {{ event|when }}
+      .d-none.dt-end(itemprop="endDate" :content="event.end_datetime|unixFormat('YYYY-MM-DDTHH:mm')") {{event.end_datetime|unixFormat('YYYY-MM-DD HH:mm')}}
+      a.place.d-block.p-location.pl-0(text color='primary' @click="$emit('placeclick', event.place.id)") <v-icon>mdi-map-marker</v-icon> <span itemprop="location">{{event.place.name}}</span>
 
     v-card-actions.pt-0.actions.justify-space-between
       .tags
diff --git a/pages/event/_slug.vue b/pages/event/_slug.vue
index b90d790a..a9f3262b 100644
--- a/pages/event/_slug.vue
+++ b/pages/event/_slug.vue
@@ -2,7 +2,7 @@
 v-container#event.pa-0.pa-sm-2
   //- EVENT PAGE
   //- gancio supports microformats (http://microformats.org/wiki/h-event)
-  v-card.h-event
+  v-card.h-event(itemscope itemtype="https://schema.org/Event")
     v-card-actions
       //- admin controls
       EventAdmin.mb-1(v-if='is_mine' :event='event')
@@ -11,32 +11,32 @@ v-container#event.pa-0.pa-sm-2
       v-row
         v-col.col-12.col-lg-8
           //- fake image to use u-featured in h-event microformat
-          img.u-featured(v-show='false' v-if='hasMedia' :src='event | mediaURL')
+          img.u-featured(v-show='false' v-if='hasMedia' :src='event | mediaURL' itemprop="image")
           v-img.main_image.mb-3(
             contain
             :alt='event | mediaURL("alt")'
             :src='event | mediaURL'
             :lazy-src='event | mediaURL("thumb")'
             v-if='hasMedia')
-          .p-description.text-body-1.pa-3.rounded(v-if='!hasMedia && event.description' v-html='event.description')
+          .p-description.text-body-1.pa-3.rounded(v-if='!hasMedia && event.description' itemprop='description' v-html='event.description')
 
         v-col.col-12.col-lg-4
           v-card
             v-card-text
               v-icon.float-right(v-if='event.parentId' color='success') mdi-repeat
               .title.text-h5
-                b.p-name {{event.title}}
+                b.p-name(itemprop="name") {{event.title}}
 
-              time.dt-start.text-h6(:datetime='event.start_datetime|unixFormat("YYYY-MM-DD HH:mm")')
+              time.dt-start.text-h6(:datetime='event.start_datetime|unixFormat("YYYY-MM-DD HH:mm")' itemprop="startDate" :content="event.start_datetime|unixFormat('YYYY-MM-DDTHH:mm')")
                 v-icon mdi-calendar
                 b.ml-2 {{event|when}}
               div.text-subtitle-1 {{event.start_datetime|from}}
                 small(v-if='event.parentId')  ({{event|recurrentDetail}})
 
-              .text-h6.p-location
+              .text-h6.p-location(itemprop="location" itemscope itemtype="https://schema.org/Place")
                 v-icon mdi-map-marker
-                b.vcard.ml-2 {{event.place && event.place.name}}
-              .text-subtitle-1.adr {{event.place && event.place.address}}
+                b.vcard.ml-2(itemprop="name") {{event.place && event.place.name}}
+                .text-subtitle-1.adr(itemprop='address') {{event.place && event.place.address}}
 
             //- tags, hashtags
             v-card-text(v-if='event.tags.length')
@@ -60,7 +60,7 @@ v-container#event.pa-0.pa-sm-2
                     :href='`/api/event/${event.slug || event.id}.ics`')
                     v-icon mdi-calendar-export
 
-      .p-description.text-body-1.pa-3.rounded(v-if='hasMedia && event.description' v-html='event.description')
+      .p-description.text-body-1.pa-3.rounded(v-if='hasMedia && event.description' itemprop='description' v-html='event.description')
 
       //- resources from fediverse
       #resources.mt-1(v-if='settings.enable_federation')