fix #30, thumbnail

app/controller/user.js

@@ -8,6 +8,8 @@ const eventController = require('./event')
 const config = require('../config')
 const mail = require('../mail')
 const { Op } = require('sequelize')
+const fs = require('fs')
+const path = require('path')
 
 const userController = {
   async login (req, res) {
@@ -46,6 +48,12 @@ const userController = {
     const event = await Event.findByPk(req.params.id)
     // check if event is mine (or user is admin)
     if (event && (req.user.is_admin || req.user.id === event.userId)) {
+      if (event.image_path) {
+        const old_path = path.resolve(__dirname, '..', '..', 'uploads', event.image_path)
+        const old_thumb_path = path.resolve(__dirname, '..', '..', 'uploads', 'thumb', event.image_path)
+        await fs.unlink(old_path)
+        await fs.unlink(old_thumb_path)
+      }
       await event.destroy()
       res.sendStatus(200)
     } else {
@@ -72,7 +80,7 @@ const userController = {
     }
 
     if (req.file) {
-      eventDetails.image_path = req.file.path
+      eventDetails.image_path = req.file.filename
     }
 
     let event = await Event.create(eventDetails)
@@ -114,10 +122,12 @@ const userController = {
 
     if (req.file) {
       if (event.image_path) {
-        const old_path = path.resolve(__dirname, '..', '..', event.image_path)
+        const old_path = path.resolve(__dirname, '..', '..', 'uploads', event.image_path)
+        const old_thumb_path = path.resolve(__dirname, '..', '..', 'uploads', 'thumb', event.image_path)
         await fs.unlink(old_path, e => console.error(e))
+        await fs.unlink(old_thumb_path, e => console.error(e))
       }
-      body.image_path = req.file.path
+      body.image_path = req.file.filename
     }
 
     body.description = body.description

app/storage.js

@@ -25,8 +25,14 @@ DiskStorage.prototype._handleFile = function _handleFile (req, file, cb) {
 
     const filename = crypto.randomBytes(16).toString('hex') + '.jpg'
     const finalPath = path.join(destination, filename)
+    const thumbPath = path.join(destination, 'thumb', filename)
     const outStream = fs.createWriteStream(finalPath)
+    const thumbStream = fs.createWriteStream(thumbPath)
     const resizer = sharp().resize(800).jpeg({ quality: 80 })
+    const thumbnailer = sharp().resize(400).jpeg({ quality: 60 })
+
+    file.stream.pipe(thumbnailer).pipe(thumbStream)
+    thumbStream.on('error', e => console.log('thumbStream error ', e))
 
     file.stream.pipe(resizer).pipe(outStream)
     outStream.on('error', cb)

client/src/components/Event.vue

@@ -21,7 +21,7 @@ export default {
   computed: {
     ...mapState(['user']),
     imgPath () {
-      return this.event.image_path && process.env.VUE_APP_API + '/' + this.event.image_path
+      return this.event.image_path && process.env.VUE_APP_API + '/uploads/thumb/' + this.event.image_path
     },
     mine () {
       return this.event.userId === this.user.id

client/src/components/EventDetail.vue

@@ -18,8 +18,8 @@
           size='mini' :key='tag.tag') {{tag.tag}}
         .ml-auto(v-if='mine')
           hr
-          el-button(v-if='event.is_visible' plain type='warning' @click.prevents='toggle' icon='el-icon-remove') {{$t('Unconfirm')}}
-          el-button(v-else plain type='success' @click.prevents='toggle' icon='el-icon-remove') {{$t('Confirm')}}
+          el-button(v-if='event.is_visible' plain type='warning' @click.prevents='toggle' icon='el-icon-view') {{$t('Unconfirm')}}
+          el-button(v-else plain type='success' @click.prevents='toggle' icon='el-icon-view') {{$t('Confirm')}}
           el-button(plain type='danger' @click.prevent='remove' icon='el-icon-remove') {{$t('Remove')}} 
           el-button(plain type='primary' @click='$router.replace("/edit/"+event.id)') <v-icon color='orange' name='edit'/> {{$t('Edit')}}
     
@@ -48,7 +48,7 @@ export default {
   computed: {
     ...mapState(['user']),
     imgPath () {
-      return this.event.image_path && process.env.VUE_APP_API + '/' + this.event.image_path
+      return this.event.image_path && process.env.VUE_APP_API + '/uploads/' + this.event.image_path
     },    
     mine () {
       return this.event.userId === this.user.id || this.user.is_admin

client/src/locale/it.js

@@ -60,6 +60,7 @@ const it = {
   Password: 'Password',
   Email: 'Email',
   User: 'Utente',
+  Unconfirm: 'Disabilita',
   Confirm: 'Conferma',
   Events: 'Eventi',
   Color: 'Colore',