akkoma-fe/src/components/timeline_menu/timeline_menu.js

72 lines
2 KiB
JavaScript
Raw Normal View History

import Popover from '../popover/popover.vue'
2021-02-22 14:24:04 +00:00
import TimelineMenuContent from './timeline_menu_content.vue'
import { library } from '@fortawesome/fontawesome-svg-core'
import {
faChevronDown
} from '@fortawesome/free-solid-svg-icons'
2021-02-22 14:24:04 +00:00
library.add(faChevronDown)
2020-11-10 10:52:54 +00:00
// Route -> i18n key mapping, exported and not in the computed
// because nav panel benefits from the same information.
export const timelineNames = () => {
return {
2021-02-22 14:24:04 +00:00
'friends': 'nav.home_timeline',
'bookmarks': 'nav.bookmarks',
'dms': 'nav.dms',
'public-timeline': 'nav.public_tl',
2022-07-22 14:36:45 +00:00
'public-external-timeline': 'nav.twkn',
'bubble-timeline': 'nav.bubble_timeline'
}
}
const TimelineMenu = {
components: {
2021-02-22 14:24:04 +00:00
Popover,
TimelineMenuContent
},
data () {
return {
isOpen: false
}
},
created () {
2020-07-28 06:41:00 +00:00
if (timelineNames()[this.$route.name]) {
this.$store.dispatch('setLastTimeline', this.$route.name)
}
},
methods: {
openMenu () {
// $nextTick is too fast, animation won't play back but
// instead starts in fully open position. Low values
// like 1-5 work on fast machines but not on mobile, 25
// seems like a good compromise that plays without significant
// added lag.
setTimeout(() => {
this.isOpen = true
}, 25)
},
2020-12-03 08:07:42 +00:00
blockOpen (event) {
// For the blank area inside the button element.
// Just setting @click.stop="" makes unintuitive behavior when
// menu is open and clicking on the blank area doesn't close it.
if (!this.isOpen) {
event.stopPropagation()
}
},
timelineName () {
const route = this.$route.name
if (route === 'tag-timeline') {
return '#' + this.$route.params.tag
}
2022-06-16 07:42:45 +00:00
if (route === 'list-timeline') {
return this.$store.getters.findListTitle(this.$route.params.id)
2022-06-16 07:42:45 +00:00
}
const i18nkey = timelineNames()[this.$route.name]
return i18nkey ? this.$t(i18nkey) : route
}
}
}
export default TimelineMenu