new hide_calendar / hide_thumbs / header_image settings

This commit is contained in:
lesion 2022-11-09 10:17:52 +01:00
parent 68b7fc6cd0
commit 31cfef1d89
No known key found for this signature in database
GPG key ID: 352918250B012177
9 changed files with 111 additions and 21 deletions

View file

@ -224,6 +224,7 @@ export default {
transition: opacity .5s;
opacity: 0;
visibility: hidden;
overflow: scroll;
// position: absolute;
}

View file

@ -1,14 +1,14 @@
<template lang="pug">
v-card.h-event.event.d-flex(itemscope itemtype="https://schema.org/Event")
nuxt-link(:to='`/event/${event.slug || event.id}`' itemprop="url")
MyPicture(:event='event' thumb :lazy='lazy')
MyPicture(v-if='!settings.hide_thumbs' :event='event' thumb :lazy='lazy')
v-icon.float-right.mr-1(v-if='event.parentId' color='success' v-text='mdiRepeat')
.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")' itemprop="startDate" :content="event.start_datetime | unixFormat('YYYY-MM-DDTHH:mm')") <v-icon v-text='mdiCalendar'></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') }}
nuxt-link.place.d-block.p-location.pl-0(text color='primary' :to='`/place/${encodeURIComponent(event.place.name)}`' itemprop="location" itemscope itemtype="https://schema.org/Place") <v-icon v-text='mdiMapMarker'></v-icon> <span itemprop='name'>{{ event.place.name }}</span>
.d-none.dt-end(v-if='event.end_datetime' itemprop="endDate" :content="event.end_datetime | unixFormat('YYYY-MM-DDTHH:mm')") {{ event.end_datetime | unixFormat('YYYY-MM-DD HH:mm') }}
nuxt-link.place.d-block.p-location.pl-0(text :to='`/place/${encodeURIComponent(event.place.name)}`' itemprop="location" itemscope itemtype="https://schema.org/Place") <v-icon v-text='mdiMapMarker'></v-icon> <span itemprop='name'>{{ event.place.name }}</span>
.d-none(itemprop='address') {{ event.place.address }}
v-card-actions.pt-0.actions.justify-space-between

View file

@ -23,7 +23,7 @@ export default {
.loading-page {
z-index: -10;
position: fixed;
top: 0;
top: 178px;
left: 0;
width: 100%;
height: 100%;

View file

@ -6,9 +6,19 @@ v-container
v-switch.mt-5(v-model='is_dark'
inset
:label="$t('admin.is_dark')")
v-switch.mt-5(v-model='hide_thumbs'
inset
:label="$t('admin.hide_thumbs')")
v-switch.mt-5(v-model='hide_calendar'
inset
:label="$t('admin.hide_calendar')")
v-card-title {{$t('admin.default_images')}}
v-card-text
v-row
v-col(cols='6')
v-col(cols='4')
//- LOGO
v-file-input.mt-5(ref='upload'
:label="$t('admin.favicon')"
@ -18,16 +28,29 @@ v-container
v-btn(color='warning' text @click='resetLogo') <v-icon v-text='mdiRestore'></v-icon> {{$t('common.reset')}}
v-img.mt-2(:src='`/logo.png?${logoKey}`' max-height="60px" contain)
v-col(cols='6')
//- NOIMG
v-col(cols='4')
//- FALLBACK IMAGE
v-file-input.mt-5(ref='upload'
:label="$t('admin.fallbackImage')"
:label="$t('admin.fallback_image')"
persistent-hint
@change='uploadFallbackImage'
accept='image/*')
template(slot='append-outer')
v-btn(color='warning' text @click='resetFallbackImage') <v-icon v-text='mdiRestore'></v-icon> {{$t('common.reset')}}
v-img.mt-2(:src='`/fallbackimage.png?${fallbackImageKey}`' max-height="150px" contain)
v-img.mt-2(:src='`/fallbackimage.png?${fallbackImageKey}`' max-height="150px" contain)
v-col(cols='4')
//- HEADER IMAGE
v-file-input.mt-5(ref='upload'
:label="$t('admin.header_image')"
persistent-hint
@change='uploadHeaderImage'
accept='image/*')
template(slot='append-outer')
v-btn(color='warning' text @click='resetHeaderImage') <v-icon v-text='mdiRestore'></v-icon> {{$t('common.reset')}}
v-img.mt-2(:src='`/headerimage.png?${headerImageKey}`' max-height="150px" contain)
//- TODO choose theme colors
//- v-row
@ -91,6 +114,7 @@ export default {
valid: false,
logoKey: 0,
fallbackImageKey: 0,
headerImageKey: 0,
link: { href: '', label: '' },
linkModal: false
// menu: [false, false, false, false]
@ -111,7 +135,15 @@ export default {
this.$vuetify.theme.dark = value
this.setSetting({ key: 'theme.is_dark', value })
}
}
},
hide_thumbs: {
get () { return this.settings.hide_thumbs },
set (value) { this.setSetting({ key: 'hide_thumbs', value }) }
},
hide_calendar: {
get () { return this.settings.hide_calendar },
set (value) { this.setSetting({ key: 'hide_calendar', value }) }
},
// 'colors[0]': {
// get () {
// return this.settings['theme.colors'] || [0, 0]
@ -144,16 +176,24 @@ export default {
forceFallbackImageReload () {
this.fallbackImageKey++
},
forceHeaderImageReload () {
this.headerImageKey++
},
resetLogo (e) {
this.setSetting({ key: 'logo', value: null })
.then(this.forceLogoReload)
e.stopPropagation()
},
resetFallbackImage (e) {
this.setSetting({ key: 'fallbackImage', value: null })
this.setSetting({ key: 'fallback_image', value: null })
.then(this.forceFallbackImageReload)
e.stopPropagation()
},
resetHeaderImage (e) {
this.setSetting({ key: 'header_image', value: null })
.then(this.forceHeaderImageReload)
e.stopPropagation()
},
updateColor (i, v) {
this.colors[i] = v.hex
this.$vuetify.theme.themes.dark[i] = v.hex
@ -210,8 +250,21 @@ export default {
this.forceFallbackImageReload()
} catch (e) {
}
}
},
async uploadHeaderImage (file) {
const formData = new FormData()
formData.append('headerImage', file)
try {
await this.$axios.$post('/settings/headerImage', formData)
this.$root.$emit('message', {
message: 'Header image updated'
})
this.forceHeaderImageReload()
} catch (e) {
}
},
save (key, value) {
if (this.settings[key] !== value) {
this.setSetting({ key, value })

View file

@ -247,7 +247,10 @@
"edit_collection": "Edit Collection",
"config_plugin": "Plugin configuration",
"plugins_description": "",
"fallbackImage": "Fallback image"
"fallback_image": "Fallback image",
"header_image": "Header image",
"hide_thumbs": "Hide thumbs",
"hide_calendar": "Hide calendar"
},
"auth": {
"not_confirmed": "Not confirmed yet…",

View file

@ -81,7 +81,7 @@ export default ({ app, store }) => {
let time = start.format('dddd D MMMM HH:mm')
if (end) {
time += event.multidate ? `-${end.format('dddd D MMMM HH:mm')}` : `-${end.format('HH:mm')}`
time += event.multidate ? `${end.format('dddd D MMMM HH:mm')}` : `-${end.format('HH:mm')}`
}
return time
})

View file

@ -36,6 +36,8 @@ const defaultSettings = {
trusted_instances: [],
'theme.is_dark': true,
'theme.primary': '#FF4500',
hide_thumbs: false,
hide_calendar: false,
footerLinks: [
{ href: '/', label: 'home' },
{ href: '/about', label: 'about' }
@ -180,7 +182,7 @@ const settingsController = {
setFallbackImage (req, res) {
if (!req.file) {
settingsController.set('fallbackImage', false)
settingsController.set('fallback_image', false)
return res.status(200)
}
@ -195,7 +197,29 @@ const settingsController = {
if (err) {
log.error('[FALLBACK IMAGE] ' + err)
}
settingsController.set('fallbackImage', baseImgPath)
settingsController.set('fallback_image', baseImgPath)
res.sendStatus(200)
})
},
setHeaderImage (req, res) {
if (!req.file) {
settingsController.set('header_image', false)
return res.status(200)
}
const uploadedPath = path.join(req.file.destination, req.file.filename)
const baseImgPath = path.resolve(config.upload_path, 'fallbackImage.png')
// convert and resize to png
return sharp(uploadedPath)
.resize(600)
.png({ quality: 99 })
.toFile(baseImgPath, (err) => {
if (err) {
log.error('[HEADER IMAGE] ' + err)
}
settingsController.set('header_image', baseImgPath)
res.sendStatus(200)
})
}

View file

@ -142,6 +142,7 @@ if (config.status !== 'READY') {
api.get('/settings', isAdmin, settingsController.getAll)
api.post('/settings/logo', isAdmin, multer({ dest: config.upload_path }).single('logo'), settingsController.setLogo)
api.post('/settings/fallbackImage', isAdmin, multer({ dest: config.upload_path }).single('fallbackImage'), settingsController.setFallbackImage)
api.post('/settings/headerImage', isAdmin, multer({ dest: config.upload_path }).single('headerImage'), settingsController.setHeaderImage)
api.post('/settings/smtp', isAdmin, settingsController.testSMTP)
api.get('/settings/smtp', isAdmin, settingsController.getSMTPSettings)

View file

@ -88,7 +88,10 @@ module.exports = {
trusted_instances: settings.trusted_instances,
'theme.is_dark': settings['theme.is_dark'],
'theme.primary': settings['theme.primary'],
footerLinks: settings.footerLinks
hide_thumbs: settings.hide_thumbs,
hide_calendar: settings.hide_calendar,
footerLinks: settings.footerLinks,
about: settings.about
}
// set user locale
res.locals.user_locale = settingsController.user_locale[res.locals.acceptedLocale]
@ -114,18 +117,23 @@ module.exports = {
})
router.use('/fallbackimage.png', (req, res, next) => {
const fallbackImagePath = settingsController.settings.fallbackImage || './static/noimg.svg'
return express.static(fallbackImagePath)(req, res, next)
const fallbackImagePath = settingsController.settings.fallback_image || './static/noimg.svg'
return express.static(fallbackImagePath, { maxAge: '1d' })(req, res, next)
})
router.use('/headerimage.png', (req, res, next) => {
const headerImagePath = settingsController.settings.header_image || './static/noimg.svg'
return express.static(headerImagePath)(req, res, next)
})
router.use('/logo.png', (req, res, next) => {
const logoPath = settingsController.settings.logo || './static/gancio'
return express.static(logoPath + '.png')(req, res, next)
return express.static(logoPath + '.png', {maxAge: '1d'})(req, res, next)
})
router.use('/favicon.ico', (req, res, next) => {
const faviconPath = res.locals.settings.logo ? res.locals.settings.logo + '.png' : './assets/favicon.ico'
return express.static(faviconPath)(req, res, next)
return express.static(faviconPath, {maxAge: '1d'})(req, res, next)
})
return router