Verified Commit 29986f32 authored by les's avatar les
Browse files

refactoring FollowMe flow

parent 05d0032d
......@@ -5,20 +5,23 @@
p(v-html="$t('event.follow_me_description', { title: settings.title, account: `@${settings.instance_name}@${domain}`})")
v-text-field(
:rules="[$validators.required('common.url')]"
:loading='loading'
:label="$t('common.url')"
v-model='instance_hostname')
p <img class='instance_thumb' :src="instance.thumbnail"/> {{instance.title}}
v-btn(v-if='!isDialog' slot='prepend' text :disabled='(!couldGo || !proceed)' :href='link' target='_blank'
:loading='loading' color="primary") {{$t("common.follow")}}
v-card-actions
p(slot='append') <img class='instance_thumb' :src="instance.thumbnail"/> {{instance.title}}
v-card-actions(v-if='isDialog')
v-spacer
v-btn(color='warning' @click="$emit('close')") {{$t("common.cancel")}}
v-btn(:disabled='(!couldGo || !proceed)'
v-btn(v-if='isDialog' color='warning' @click="$emit('close')") {{$t("common.cancel")}}
v-btn(:disabled='(!couldGo || !proceed)' :href='link' target='_blank'
:loading='loading' color="primary") {{$t("common.follow")}}
</template>
<script>
import { mapState } from 'vuex'
import debounce from 'lodash/debounce'
import url from 'url'
export default {
name: 'FollowMe',
......@@ -30,19 +33,19 @@ export default {
proceed: false,
instance: {},
loading: false,
get_instance_info: debounce(this.getInstanceInfo, 500)
get_instance_info: debounce(this.getInstanceInfo, 300)
}
},
computed: {
...mapState(['settings']),
domain () {
const URL = url.parse(this.settings.baseurl)
const URL = new window.URL(this.settings.baseurl)
return URL.hostname
},
couldGo () {
// check if is mastodon
this.get_instance_info()
this.get_instance_info(this.instance_hostname)
return true
},
link () {
......@@ -55,14 +58,19 @@ export default {
if (!this.instance_hostname) {
return
}
this.loading = true
const instance_url = `https://${this.instance_hostname}/api/v1/instance`
this.$axios.$get(instance_url)
.then(ret => {
this.instance = ret
this.proceed = true
this.loading = false
})
.catch(e => {
this.instance = {}
this.proceed = false
this.loading = false
})
}
}
......
<template lang="pug">
v-footer(color='secondary')
v-dialog(v-model='showFollowMe' destroy-on-close max-width='700px')
FollowMe(@close='showFollowMe=false' is-dialog)
v-btn(color='primary' text href='https://gancio.org' target='_blank') Gancio <small>{{settings.version}}</small>
v-btn(v-for='link in settings.footerLinks'
v-btn.ml-1(v-for='link in settings.footerLinks'
:key='link.label' color='primary' text :to='link.href') {{link.label}}
v-menu(v-if='settings.enable_trusted_instances && settings.trusted_instances && settings.trusted_instances.length'
offset-y bottom open-on-hover transition="slide-y-transition")
template(v-slot:activator="{ on, attrs }")
v-btn(v-bind='attrs' v-on='on' color='primary' text) {{$t('common.places')}}
v-btn.ml-1(v-bind='attrs' v-on='on' color='primary' text) {{$t('common.places')}}
v-list
v-list-item(v-for='instance in settings.trusted_instances'
:key='instance.name'
......@@ -19,15 +23,21 @@
v-list-item-title {{instance.name}}
v-list-item-subtitle {{instance.label}}
//- v-btn(v-if='settings.enable_federation' text rel='me' @click.prevent='showFollowMe=true') follow me
//- v-btn(nuxt to='/about' text) about
//- v-btn(href='https://blog.gancio.org' text) blog
v-btn.ml-1(v-if='settings.enable_federation' color='primary' text rel='me' @click.prevent='showFollowMe=true') {{$t('event.interact_with_me')}}
//- v-btn(href='https://blog.gancio.org' text) blog
//- v-btn(href='https://framagit.org/les/gancio' text) source
</template>
<script>
import { mapState } from 'vuex'
import FollowMe from '../components/FollowMe'
export default {
components: { FollowMe },
data () {
return {
showFollowMe: false
}
},
computed: mapState(['settings'])
}
</script>
......@@ -13,7 +13,6 @@
</template>
<script>
import Nav from '~/components/Nav.vue'
import FollowMe from '../components/FollowMe'
import Snackbar from '../components/Snackbar'
import Footer from '../components/Footer'
import Confirm from '../components/Confirm'
......@@ -21,7 +20,7 @@ import { mapState } from 'vuex'
export default {
name: 'Default',
components: { Nav, FollowMe, Snackbar, Footer, Confirm },
components: { Nav, Snackbar, Footer, Confirm },
computed: mapState(['settings']),
created () {
this.$vuetify.theme.dark = this.settings['theme.is_dark']
......@@ -29,4 +28,4 @@ export default {
this.$vuetify.theme.themes.light.primary = this.settings['theme.primary']
}
}
</script>
\ No newline at end of file
</script>
......@@ -13,13 +13,12 @@
</template>
<script>
import Nav from '~/components/Nav.vue'
import FollowMe from '../components/FollowMe'
import Snackbar from '../components/Snackbar'
import Footer from '../components/Footer'
import Confirm from '../components/Confirm'
export default {
name: 'Default',
components: { Nav, FollowMe, Snackbar, Footer, Confirm },
components: { Nav, Snackbar, Footer, Confirm }
}
</script>
......@@ -165,7 +165,8 @@
"event_confirm_description": "Puoi confermare qui gli eventi inseriti da utenti anonimi",
"delete_user": "Elimina",
"remove_admin": "Rimuovi admin",
"delete_user_confirm": "Sei sicuro/a di rimuovere questo utente?",
"disable_user_confirm": "Vuoi disabilitare {user}?",
"delete_user_confirm": "Vuoi rimuovere {user}?",
"user_remove_ok": "Utente eliminato",
"user_create_ok": "Utente creato",
"allow_registration_description": "Vuoi abilitare la registrazione?",
......
......@@ -74,14 +74,6 @@ v-container#event
small.mr-3 🔖 {{event.likes.length}}
small ✊ {{event.boost.length}}<br/>
//- p.p-2
//- v-btn(type='text' @click='showFollowMe=true') {{$t('event.interact_with_me')}}
//- span(v-if='settings.enable_resources && event.resources.length') - {{$tc('common.n_resources', event.resources.length)}}
//- v-dialog(v-model='showFollowMe' destroy-on-close max-width='500px')
h4(slot='title') {{$t('common.follow_me_title')}}
FollowMe(@close='showFollowMe=false' is-dialog)
v-dialog.showResource#resourceDialog(v-model='showResources' fullscreen
width='95vw'
destroy-on-close
......@@ -132,13 +124,12 @@ v-container#event
import { mapState } from 'vuex'
import EventAdmin from './eventAdmin'
import EmbedEvent from './embedEvent'
import FollowMe from '../../components/FollowMe'
import moment from 'dayjs'
const htmlToText = require('html-to-text')
export default {
name: 'Event',
components: { EventAdmin, EmbedEvent, FollowMe },
components: { EventAdmin, EmbedEvent },
async asyncData ({ $axios, params, error, store }) {
try {
const event = await $axios.$get(`/event/${params.id}`)
......@@ -151,7 +142,6 @@ export default {
return {
event: {},
showEmbed: false,
showFollowMe: false,
showResources: false,
selectedResource: { data: { attachment: [] } }
}
......
......@@ -64,9 +64,9 @@
color='primary' v-clipboard:copy='listScript' v-clipboard:success='copyLink.bind(this,"list")') {{$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')
//- FollowMe
v-tab(v-if='settings.enable_federation') {{$t('common.fediverse')}}
v-tab-item(v-if='settings.enable_federation')
FollowMe
//- TOFIX
//- v-tab.pt-1(label='calendar' name='calendar')
//- v-tab-item
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment