filteredEventsWithPast, check db connection

components/Calendar.vue

@@ -39,8 +39,8 @@ export default {
     },
   },
   computed: {
-    ...mapGetters(['filteredEvents']),
-    ...mapState(['tags']),
+    ...mapGetters(['filteredEventsWithPast']),
+    ...mapState(['tags', 'filters']),
     attributes () {
       const colors = ['indigo', 'orange', 'yellow', 'green', 'teal', 'blue', 'red', 'purple', 'pink', 'grey']
       const tags = take(this.tags, 10).map(t=>t.tag)
@@ -48,8 +48,9 @@ export default {
       let attributes = []
       attributes.push ({ key: 'today', dates: new Date(), highlight: { color: 'green' }})
 
+      const that = this
       function getColor(event) {
-        const color = { class: event.past ? 'past-event vc-rounded-full' : 'vc-rounded-full', color: 'blue' }
+        const color = { class: event.past && !that.filters.show_past_events ? 'past-event vc-rounded-full' : 'vc-rounded-full', color: 'blue' }
         const tag = get(event, 'tags[0].tag')
         if (!tag) return color
         const idx = tags.indexOf(tag)
@@ -58,14 +59,14 @@ export default {
         return color
       }
 
-      attributes = attributes.concat(this.filteredEvents
+      attributes = attributes.concat(this.filteredEventsWithPast
         .filter(e => !e.multidate)
         .map(e => ({
           key: e.id, 
           dot: getColor(e),
           dates: new Date(e.start_datetime*1000)})))
 
-      attributes = attributes.concat(this.filteredEvents
+      attributes = attributes.concat(this.filteredEventsWithPast
         .filter(e => e.multidate)
         .map( e => ({ key: e.id, highlight: getColor(e), dates: { 
           start: new Date(e.start_datetime*1000), end: new Date(e.end_datetime*1000) }})))

components/Home.vue

@@ -9,7 +9,7 @@
       Calendar
     .row.m-0
 
-      .p-0.col-sm-6.col-lg-4.col-xl-3(v-for='event in filteredEvents' v-if='!event.past')
+      .p-0.col-sm-6.col-lg-4.col-xl-3(v-for='event in filteredEvents')
         a(:id='event.newDay' v-if='event.newDay')
           .d-block.d-sm-none
             el-divider {{event.start_datetime|day}}

components/List.vue

@@ -4,7 +4,6 @@ div#list
   el-timeline
     el-timeline-item(
       v-for='event in events'
-      v-if='!event.past'
       :key='event.id'
       :timestamp='event|event_when'
       placement='top' icon='el-icon-arrow-down' size='large'

pages/event/_id.vue

@@ -1,5 +1,5 @@
 <template lang="pug">
-  el-card#eventDetail(v-loading='!loaded')
+  el-card#eventDetail
     //- close button
     nuxt-link.float-right(to='/')
       v-icon(name='times' color='red')
@@ -19,7 +19,7 @@
             v-icon(name='chevron-right')
     
       //- image
-      img(:src='imgPath' v-if='event.image_path' @load='image_loaded')
+      img(:src='imgPath' v-if='event.image_path')
 
       .info
         div {{event|event_when}}
@@ -59,11 +59,6 @@ import { MessageBox } from 'element-ui'
 
 export default {
   name: 'Event',
-  data () {
-    return {
-      loaded: false,
-    }
-  },
   // transition: null,
   // Watch for $route.query.page to call Component methods (asyncData, fetch, validate, layout, etc.)
   // watchQuery: ['id'],
@@ -101,8 +96,7 @@ export default {
   },
   async asyncData ( { $axios, params }) {
     const event = await $axios.$get(`/event/${params.id}`)
-    const loaded = !event.image_path
-    return { event, id: params.id, loaded }
+    return { event, id: params.id }
   },  
   computed: {
     ...mapGetters(['filteredEvents']),
@@ -131,9 +125,6 @@ export default {
     },
   },
   methods: {
-    image_loaded (e, b) {
-      this.loaded = true
-    },
     ...mapActions(['delEvent']),
     comment_filter (value) {
       return value.replace(/<a.*href="([^">]+).*>(?:.(?!\<\/a\>))*.<\/a>/, (orig, url) => {

server/api/controller/user.js

@@ -70,7 +70,7 @@ const userController = {
     }
   },
 
-  // ADD EVENT
+  // ADD EVENT // there's probably a better way to do this with sequelize! TOFIX
   async addEvent(req, res) {
     const body = req.body
 

server/api/models/index.js

@@ -1,12 +1,16 @@
-const argv = require('yargs').argv
 const fs = require('fs')
 const path = require('path')
 const Sequelize = require('sequelize')
 const basename = path.basename(__filename)
 const config = require('config')
+const consola = require('consola')
 const db = {}
 
 const sequelize = new Sequelize(config.db)
+sequelize.authenticate().catch( e => {
+  consola.error('Error connecting to DB: ', e)
+  process.exit(-1)
+})
 
 fs
   .readdirSync(__dirname)

server/api/models/tag.js

@@ -7,8 +7,7 @@ module.exports = (sequelize, DataTypes) => {
       index: true,
       primaryKey: true
     },
-    weigth: { type: DataTypes.INTEGER, defaultValue: 0, allowNull: false },
-    color: DataTypes.STRING
+    weigth: { type: DataTypes.INTEGER, defaultValue: 0, allowNull: false }
   }, {})
 
   tag.associate = function (models) {

store/index.js

@@ -22,9 +22,8 @@ export const state = () => ({
 
 export const getters = {
 
-  // filter current + future events only
-  // plus, filter matches search tag/place
-  filteredEvents: (state) => {
+  // filter matches search tag/place
+  filteredEvents: state => {
     let events = state.events
 
     // TOFIX: use lodash
@@ -43,26 +42,46 @@ export const getters = {
       })
     }
 
-    // if (!state.filters.show_past_events) {
-    //   events = events.filter(e => !e.past)
-    // }
+    if (!state.filters.show_past_events) {
+      events = events.filter(e => !e.past)
+    }
 
-    let lastDay = null
-    events = map(events, e => {
-      const currentDay = moment(e.start_datetime*1000).date()
-      e.newDay = (!lastDay || lastDay !== currentDay) && currentDay
-      lastDay = currentDay
-      return e
+    return events
+  },
+  // filter matches search tag/place
+  filteredEventsWithPast: state => {
+    let events = state.events
+
+    // TOFIX: use lodash
+    if (state.filters.tags.length || state.filters.places.length) {
+      events = events.filter((e) => {
+        if (state.filters.tags.length) {
+          const m = intersection(e.tags.map(t => t.tag), state.filters.tags)
+          if (m.length > 0) return true
+        }
+        if (state.filters.places.length) {
+          if (state.filters.places.find(p => p === e.place.id)) {
+            return true
+          }
+        }
+        return 0
       })
+    }
 
     return events
   }
+
+
 }
 
 export const mutations = {
   setEvents(state, events) {
-    // set a `past` flag
+    // set`past` and `newDay` flags to event
+    let lastDay = null
     state.events = events.map((e) => {
+      const currentDay = moment(e.start_datetime*1000).date()
+      e.newDay = (!lastDay || lastDay !== currentDay) && currentDay
+      lastDay = currentDay      
       const end_datetime = e.end_datetime || e.start_datetime+3600*2
       const past = (moment().unix() - end_datetime) > 0
       e.past = !!past