fix event embed filters + new clipboard mixin

This commit is contained in:
lesion
2021-12-06 15:58:12 +01:00
parent 1d80faaa37
commit 2d3ab6b572
14 changed files with 236 additions and 200 deletions

View File

@@ -41,15 +41,14 @@ v-container#event.pa-0.pa-sm-2
//- tags, hashtags
v-card-text(v-if='event.tags.length')
v-chip.p-category.ml-1.mt-3(v-for='tag in event.tags' color='primary'
outlined :key='tag' v-text='tag')
outlined :key='tag')
span(v-text='tag')
//- info & actions
v-toolbar
v-tooltip(bottom) {{$t('common.copy_link')}}
template(v-slot:activator="{on, attrs} ")
v-btn.ml-2(large icon v-on='on' color='primary'
v-clipboard:success='copyLink'
v-clipboard:copy='`${settings.baseurl}/event/${event.slug || event.id}`')
v-btn.ml-2(large icon v-on='on' color='primary' @click='clipboard(`${settings.baseurl}/event/${event.slug || event.id}`)')
v-icon mdi-content-copy
v-tooltip(bottom) {{$t('common.embed')}}
template(v-slot:activator="{on, attrs} ")
@@ -136,10 +135,13 @@ import EventAdmin from './eventAdmin'
import EmbedEvent from './embedEvent'
import get from 'lodash/get'
import moment from 'dayjs'
import clipboard from '../../assets/clipboard'
const htmlToText = require('html-to-text')
export default {
name: 'Event',
mixins: [clipboard],
components: { EventAdmin, EmbedEvent },
async asyncData ({ $axios, params, error, store }) {
try {

View File

@@ -3,10 +3,8 @@ v-card
v-card-title(v-text="$t('common.embed_title')")
v-card-text
v-alert.mb-3.mt-1(type='info' show-icon) {{$t('common.embed_help')}}
v-alert.pa-5.my-4.blue-grey.darken-4.text-body-1.lime--text.text--lighten-3 {{code.script}}<br/>{{code.el}}<br/><br/>
v-btn.float-end(text color='primary'
v-clipboard:copy='code'
v-clipboard:success='copyLink') {{$t("common.copy")}}
v-alert.pa-5.my-4.blue-grey.darken-4.text-body-1.lime--text.text--lighten-3 <pre>{{code}}</pre>
v-btn.float-end(text color='primary' @click='clipboard(code)') {{$t("common.copy")}}
v-icon.ml-1 mdi-content-copy
p.mx-auto
.mx-auto
@@ -14,27 +12,22 @@ v-card
v-card-actions
v-spacer
v-btn(text color='warning' @click="$emit('close')") {{$t("common.cancel")}}
v-btn(text v-clipboard:copy='code' v-clipboard:success='copyLink' color="primary") {{$t("common.copy")}}
v-btn(text @click='clipboard(code)' color="primary") {{$t("common.copy")}}
</template>
<script>
import { mapState } from 'vuex'
import clipboard from '../../assets/clipboard'
export default {
name: 'EmbedEvent',
mixins: [clipboard],
props: {
event: { type: Object, default: () => ({}) }
},
computed: {
...mapState(['settings']),
code () {
const script = `<script src='${this.settings.baseurl}/gancio-events.es.js'/>`
const el = `<gancio-event id='${this.event.id}' baseurl='${this.settings.baseurl}'></gancio-event>`
return { script, el }
}
},
methods: {
copyLink () {
this.$root.$message('common.copied', { color: 'success' })
return `<script src='${this.settings.baseurl}/gancio-events.es.js'/>\n<gancio-event baseurl='${this.settings.baseurl}' id=${this.event.id}></gancio-event>\n\n`
}
}
}

View File

@@ -10,7 +10,7 @@
v-col
Search(
:filters='filters'
@update='updateFilters')
@update='f => filters = f')
v-tabs(v-model='type')
//- TOFIX
@@ -30,9 +30,7 @@
v-card-text
p(v-html='$t(`export.feed_description`)')
v-text-field(v-model='link' readonly)
v-btn(slot='prepend' text color='primary'
v-clipboard:copy='link'
v-clipboard:success='copyLink.bind(this, "feed")') {{$t("common.copy")}}
v-btn(slot='prepend' text color='primary' @click='clipboard(link)') {{$t("common.copy")}}
v-icon.ml-1 mdi-content-copy
v-tab ics/ical
@@ -41,8 +39,7 @@
v-card-text
p(v-html='$t(`export.ical_description`)')
v-text-field(v-model='link')
v-btn(slot='prepend' text color='primary'
v-clipboard:copy='link' v-clipboard:success='copyLink.bind(this, "ical")') {{$t("common.copy")}}
v-btn(slot='prepend' text color='primary' @click='clipboard(link)') {{$t("common.copy")}}
v-icon.ml-1 mdi-content-copy
v-tab List
@@ -56,11 +53,15 @@
v-text-field(v-model='list.title' :label='$t("common.title")')
v-text-field(v-model='list.maxEvents' type='number' min='1' :label='$t("common.max_events")')
v-col.float-right(:span='12')
gancio-events(:baseurl='settings.baseurl' :maxlength='list.maxEvents && Number(list.maxEvents)' :title='list.title')
v-text-field.mb-1(type='textarea' v-model='listScript' readonly )
v-btn(slot='prepend' text
color='primary' v-clipboard:copy='listScript' v-clipboard:success='copyLink.bind(this,"list")') {{$t('common.copy')}}
v-icon.ml-1 mdi-content-copy
span {{filters.places.join(',')}}
gancio-events(:baseurl='settings.baseurl'
:maxlength='list.maxEvents && Number(list.maxEvents)'
:title='list.title'
:places='filters.places.join(",")'
:tags='filters.tags.join(",")')
v-alert.pa-5.my-4.blue-grey.darken-4.text-body-1.lime--text.text--lighten-3 <pre>{{code}}</pre>
v-btn.float-end(text color='primary' @click='clipboard(code)') {{$t("common.copy")}}
v-icon.ml-1 mdi-content-copy
v-tab(v-if='settings.enable_federation') {{$t('common.fediverse')}}
v-tab-item(v-if='settings.enable_federation')
@@ -81,10 +82,12 @@ import { mapState } from 'vuex'
import List from '@/components/List'
import FollowMe from '../components/FollowMe'
import Search from '@/components/Search'
import clipboard from '../assets/clipboard'
export default {
name: 'Exports',
components: { List, FollowMe, Search },
mixins: [clipboard],
async asyncData ({ $axios, params, store, $api }) {
const events = await $api.getEvents({
start: dayjs().unix(),
@@ -96,7 +99,7 @@ export default {
return {
type: 'rss',
notification: { email: '' },
list: { title: 'Gancio', maxEvents: 1 },
list: { title: 'Gancio', maxEvents: null },
filters: { tags: [], places: [], show_recurrent: false },
events: []
}
@@ -108,18 +111,19 @@ export default {
},
computed: {
...mapState(['settings']),
listScript () {
const params = []
code () {
const params = [`baseurl="${this.settings.baseurl}"`]
if (this.list.title) {
params.push(`title="${this.list.title}"`)
}
if (this.filters.places.length) {
params.push(`places=${this.filters.places.map(p => p.id)}`)
params.push(`places="${this.filters.places.join(',')}"`)
}
if (this.filters.tags.length) {
params.push(`tags=${this.filters.tags.join(',')}`)
params.push(`tags="${this.filters.tags.join(',')}"`)
}
if (this.filters.show_recurrent) {
@@ -129,7 +133,10 @@ export default {
if (this.list.maxEvents) {
params.push('maxlength=' + this.list.maxEvents)
}
return `<script src="${this.settings.baseurl}/gancio-events.es.js'><gancio-events ${params.join(' ')}></gancio-events>`
return `<script src="${this.settings.baseurl}/gancio-events.es.js'>\n<gancio-events ${params.join(' ')}></gancio-events>\n\n`
},
link () {
const typeMap = ['rss', 'ics', 'list']
@@ -154,22 +161,6 @@ export default {
}
},
methods: {
async updateFilters (filters) {
this.filters = filters
this.events = await this.$api.getEvents({
start: dayjs().unix(),
places: this.filters.places,
tags: this.filters.tags,
show_recurrent: !!this.filters.show_recurrent
})
},
copyLink (type) {
if (type === 'feed') {
this.$root.$message('common.feed_url_copied')
} else {
this.$root.$message('common.copied')
}
},
async add_notification () {
// validate()
// if (!this.notification.email) {