From dfb95e15d8570593ca96e8ffb7d2c98db2035486 Mon Sep 17 00:00:00 2001
From: les <lesion@autistici.org>
Date: Tue, 11 Feb 2020 11:53:32 +0100
Subject: [PATCH] fix #66 - support h-event microformats

---
 components/Event.vue           | 10 ++++----
 locales/it.json                |  2 +-
 pages/embed/_event_id.vue      |  2 +-
 pages/event/_id.vue            | 27 ++++++++++++++--------
 plugins/filters.js             | 42 +++++++++++++++++-----------------
 server/api/controller/event.js |  2 +-
 6 files changed, 46 insertions(+), 39 deletions(-)

diff --git a/components/Event.vue b/components/Event.vue
index 7610dae5..fbec49bb 100644
--- a/components/Event.vue
+++ b/components/Event.vue
@@ -1,19 +1,19 @@
 <template lang="pug">
-  .card.event.mt-1.text-white(body-style='padding: 0px;')
+  .card.event.h-event.mt-1.text-white(body-style='padding: 0px;')
     nuxt-link(:to='`/event/${event.id}`')
       img(v-if='showImage && event.image_path' :src='`/media/thumb/${event.image_path}`')
       .float-right
         i.text-danger.el-icon-refresh(v-if='event.parentId')
         .badge.text-info(v-if='settings.enable_resources && event.resources && event.resources.length') {{event.resources.length}}
-      .title {{event.title}}
+      .p-name.p-summary.title {{event.title}}
 
     .card-body
       div
         i.el-icon-date
-        span  {{event|when('home')}}
-      el-button.mt-1.bg-dark.text-warning.float-right(plain size='mini' round type='text' icon='el-icon-location-outline' @click='addPlace') {{event.place.name}}
+        time.dt-start(:datetime='event.start_datetime|unixFormat("YYYY-MM-DD HH:mm")')  {{event|when}}
+      el-button.p-location.mt-1.bg-dark.text-warning.float-right(plain size='mini' round type='text' icon='el-icon-location-outline' @click='addPlace') {{event.place.name}}
       //- date / place
-      .description.mt-3(v-if='!event.image_path || !event.tags.length' v-html='description')
+      .description.p-description.mt-3(v-if='!event.image_path || !event.tags.length' v-html='description')
 
     .card-footer(v-if='event.tags.length')
       el-button.ml-1.bg-dark(type='text' plain round size='mini' v-for='tag in event.tags' :key='tag' @click='addTag(tag)') {{tag}}
diff --git a/locales/it.json b/locales/it.json
index 09b719c7..706fdc38 100644
--- a/locales/it.json
+++ b/locales/it.json
@@ -55,7 +55,7 @@
     "set_password": "Imposta password",
     "copy_link": "Copia link",
     "send_via_mail": "Invia mail",
-    "add_to_calendar": "Aggiungi al tuo calendario",
+    "add_to_calendar": "Aggiungi al calendario",
     "instances": "Istanze",
     "copied": "Copiato",
     "embed": "Incorpora",
diff --git a/pages/embed/_event_id.vue b/pages/embed/_event_id.vue
index 478b0e1b..4455bc89 100644
--- a/pages/embed/_event_id.vue
+++ b/pages/embed/_event_id.vue
@@ -6,7 +6,7 @@
     .event-info
 
       //-  title
-      .date {{event|when('home')}}<br/>
+      .date {{event|when}}<br/>
       h4 {{event.title}}
 
       //- date / place
diff --git a/pages/event/_id.vue b/pages/event/_id.vue
index 236c43c4..47f7b392 100644
--- a/pages/event/_id.vue
+++ b/pages/event/_id.vue
@@ -1,8 +1,8 @@
 <template lang="pug">
-  el-container#eventDetail
+  el-container#eventDetail.h-event
     el-header
 
-      span.title {{event.title}}
+      span.title.p-summary.p-name {{event.title}}
 
       #arrow
         nuxt-link.mr-1(:to='`/event/${prev}`')
@@ -23,14 +23,17 @@
             div.loading(slot='placeholder')
               el-icon(name='loading')
 
-          pre(v-html='event.description')
-          el-button.ml-1.text-primary(plain round size='mini' v-for='tag in event.tags' :key='tag') {{tag}}
+          pre.p-description(v-html='event.description')
+          el-button.p-category.ml-1.text-primary(plain round size='mini' v-for='tag in event.tags' :key='tag') {{tag}}
 
         //- info & actions
         el-col.menu(:sm='6' :xs='24')
-          el-menu.menu.mt-2(router)
-            p <i class='el-icon-date'></i>  <b>{{event|when}}</b> <br/><small>{{event|to}}</small>
-            p <i class='el-icon-location-outline'></i>  <b>{{event.place.name}}</b> - {{event.place.address}}
+          el-menu.menu(router)
+            time.dt-start(:datetime='event.start_datetime|unixFormat("YYYY-MM-DD HH:mm")') <i class='el-icon-date'></i>  <b>{{event|when}}</b> <br/><small>{{event.start_datetime|to}}</small>
+            p
+              i.el-icon-location-outline
+              b.p-location {{event.place.name}}
+              span  - {{event.place.address}}
             el-divider {{$t('common.actions')}}
             el-menu-item(
               v-clipboard:success='copyLink'
@@ -77,7 +80,7 @@
                 el-dropdown-item(icon='el-icon-delete' @click.native='deleteResource(resource)') {{$t('admin.delete_resource')}}
                 el-dropdown-item(icon='el-icon-lock' @click.native='blockUser(resource)') {{$t('admin.block_user')}}
             a(:href='resource.data.url || resource.data.context')
-              small {{resource.data.published|datetime}}
+              small {{resource.data.published|dateFormat('ddd, D MMMM HH:mm')}}
 
           div.mt-1(v-html='resource_filter(resource.data.content)')
           span.previewImage(@click='showResource(resource)')
@@ -127,7 +130,7 @@ export default {
       rel: 'alternate',
       type: 'application/rss+xml',
       title: `${this.settings.title} events  @${this.event.place.name}`,
-      href: this.settings.baseurl + `/feed/rss?places=${this.event.placeId}`
+      href: this.settings.baseurl + `/feed/rss?places=${this.event.place.id}`
     }
 
     return {
@@ -325,6 +328,10 @@ export default {
 </script>
 <style lang='less'>
 #eventDetail {
+  time {
+    margin: 0rem 0rem 0rem 1rem;
+    display: inline-block;
+  }
 
   #arrow {
     position: absolute;
@@ -377,7 +384,7 @@ export default {
   div.menu {
     border-left: 1px solid #e6e6e6;
     p {
-      margin-left: 10px;
+      margin: 1rem 0rem 1rem 1rem;
     }
   }
 
diff --git a/plugins/filters.js b/plugins/filters.js
index c7c7a3b9..17b6507c 100644
--- a/plugins/filters.js
+++ b/plugins/filters.js
@@ -13,40 +13,40 @@ export default ({ app, store }) => {
   Vue.filter('linkify', value => value.replace(/(https?:\/\/([^\s]+))/g, '<a href="$1">$2</a>'))
   Vue.filter('url2host', url => url.match(/^https?:\/\/(.[^/:]+)/i)[1])
   Vue.filter('datetime', value => moment(value).locale(store.state.locale).format('ddd, D MMMM HH:mm'))
+  Vue.filter('dateFormat', (value, format) => moment(value).format(format))
+  Vue.filter('unixFormat', (timestamp, format) => moment.unix(timestamp).format(format))
 
   // shown in mobile homepage
   Vue.filter('day', value => moment.unix(value).locale(store.state.locale).format('dddd, D MMM'))
 
-  Vue.filter('to', value => moment().to(value.start_datetime * 1000))
+  Vue.filter('to', timestamp => moment.unix(timestamp).to())
   // format event start/end datetime based on page
-  Vue.filter('when', (event, where) => {
+
+  Vue.filter('when', (event) => {
     const start = moment.unix(event.start_datetime)
     const end = moment.unix(event.end_datetime)
 
-    const normal = `${start.format('dddd, D MMMM (HH:mm-')}${end.format('HH:mm) ')}`
-    // recurrent event
-    if (event.parent && where !== 'home') {
-      const { frequency, days, type } = event.parent.recurrent
-      if (frequency === '1w' || frequency === '2w') {
-        const recurrent = app.i18n.tc(`event.recurrent_${frequency}_days`, days.length, { days: days.map(d => moment().day(d - 1).format('dddd')) })
-        return `${normal} - ${recurrent}`
-      } else if (frequency === '1m' || frequency === '2m') {
-        const d = type === 'ordinal' ? days : days.map(d => moment().day(d - 1).format('dddd'))
-        const recurrent = app.i18n.tc(`event.recurrent_${frequency}_${type}`, days.length, { days: d })
-        return `${normal} - ${recurrent}`
-      }
-      return 'recurrent '
-    }
+    // const normal = `${start.format('dddd, D MMMM (HH:mm-')}${end.format('HH:mm) ')}`
+    // // recurrent event
+    // if (event.parent && where !== 'home') {
+    //   const { frequency, days, type } = event.parent.recurrent
+    //   if (frequency === '1w' || frequency === '2w') {
+    //     const recurrent = app.i18n.tc(`event.recurrent_${frequency}_days`, days.length, { days: days.map(d => moment().day(d - 1).format('dddd')) })
+    //     return `${normal} - ${recurrent}`
+    //   } else if (frequency === '1m' || frequency === '2m') {
+    //     const d = type === 'ordinal' ? days : days.map(d => moment().day(d - 1).format('dddd'))
+    //     const recurrent = app.i18n.tc(`event.recurrent_${frequency}_${type}`, days.length, { days: d })
+    //     return `${normal} - ${recurrent}`
+    //   }
+    //   return 'recurrent '
+    // }
 
     // multidate
     if (event.multidate) {
-      return `${start.format('ddd, D MMMM (HH:mm)')} - ${end.format('ddd, D MMMM')}`
+      return `${start.format('ddd, D MMMM HH:mm')} - ${end.format('ddd, D MMMM')}`
     }
 
     // normal event
-    if (event.end_datetime && event.end_datetime !== event.start_datetime) {
-      return `${start.format('ddd, D MMMM HH:mm')}`
-    }
-    return start.format('dddd, D MMMM (HH:mm)')
+    return start.format('ddd, D MMMM HH:mm')
   })
 }
diff --git a/server/api/controller/event.js b/server/api/controller/event.js
index 82447fb0..d57d2e4a 100644
--- a/server/api/controller/event.js
+++ b/server/api/controller/event.js
@@ -97,7 +97,7 @@ const eventController = {
         },
         include: [
           { model: Tag, required: false, attributes: ['tag', 'weigth'], through: { attributes: [] } },
-          { model: Place, attributes: ['name', 'address'] },
+          { model: Place, attributes: ['name', 'address', 'id'] },
           {
             model: Resource,
             where: !is_admin && { hidden: false },