yandere_fe/src/App.js

91 lines
3.0 KiB
JavaScript
Raw Normal View History

2016-10-27 09:01:48 -07:00
import UserPanel from './components/user_panel/user_panel.vue'
2016-11-06 11:11:23 -08:00
import NavPanel from './components/nav_panel/nav_panel.vue'
2016-11-27 10:44:56 -08:00
import Notifications from './components/notifications/notifications.vue'
2017-05-12 09:54:12 -07:00
import UserFinder from './components/user_finder/user_finder.vue'
2018-02-03 07:27:33 -08:00
import InstanceSpecificPanel from './components/instance_specific_panel/instance_specific_panel.vue'
2018-09-02 23:57:22 -07:00
import FeaturesPanel from './components/features_panel/features_panel.vue'
2018-09-02 22:43:10 -07:00
import WhoToFollowPanel from './components/who_to_follow_panel/who_to_follow_panel.vue'
2018-01-26 06:11:34 -08:00
import ChatPanel from './components/chat_panel/chat_panel.vue'
2016-10-26 10:03:55 -07:00
export default {
name: 'app',
components: {
2016-11-06 11:11:23 -08:00
UserPanel,
2016-11-27 10:44:56 -08:00
NavPanel,
2017-05-12 09:54:12 -07:00
Notifications,
2018-01-26 06:11:34 -08:00
UserFinder,
2018-02-11 06:12:05 -08:00
InstanceSpecificPanel,
2018-09-02 23:57:22 -07:00
FeaturesPanel,
2018-09-02 22:55:40 -07:00
WhoToFollowPanel,
2018-02-11 06:12:05 -08:00
ChatPanel
2016-11-03 08:58:32 -07:00
},
2017-01-17 08:27:39 -08:00
data: () => ({
mobileActivePanel: 'timeline',
finderHidden: true,
supportsMask: window.CSS && window.CSS.supports && (
window.CSS.supports('mask-size', 'contain') ||
window.CSS.supports('-webkit-mask-size', 'contain') ||
window.CSS.supports('-moz-mask-size', 'contain') ||
window.CSS.supports('-ms-mask-size', 'contain') ||
window.CSS.supports('-o-mask-size', 'contain')
)
2017-01-17 08:27:39 -08:00
}),
created () {
// Load the locale from the storage
this.$i18n.locale = this.$store.state.config.interfaceLanguage
},
2016-11-03 08:58:32 -07:00
computed: {
2016-11-27 10:44:56 -08:00
currentUser () { return this.$store.state.users.currentUser },
2017-02-16 07:59:06 -08:00
background () {
2018-09-09 12:02:22 -07:00
return this.currentUser.background_image || this.$store.state.instance.background
2017-02-16 07:59:06 -08:00
},
2018-09-09 12:02:22 -07:00
enableMask () { return this.supportsMask && this.$store.state.instance.logoMask },
logoStyle () {
return {
'visibility': this.enableMask ? 'hidden' : 'visible'
}
},
logoMaskStyle () {
return this.enableMask ? {
2018-09-09 12:02:22 -07:00
'mask-image': `url(${this.$store.state.instance.logo})`
} : {
'background-color': this.enableMask ? '' : 'transparent'
}
},
logoBgStyle () {
return Object.assign({
'margin': `${this.$store.state.instance.logoMargin} 0`,
opacity: this.finderHidden ? 1 : 0
}, this.enableMask ? {} : {
'background-color': this.enableMask ? '' : 'transparent'
})
},
2018-09-09 12:02:22 -07:00
logo () { return this.$store.state.instance.logo },
style () {
return {
'--body-background-image': `url(${this.background})`,
'background-image': `url(${this.background})`
}
},
2018-09-09 11:21:23 -07:00
sitename () { return this.$store.state.instance.name },
2018-02-03 15:36:10 -08:00
chat () { return this.$store.state.chat.channel.state === 'joined' },
2018-09-09 11:21:23 -07:00
suggestionsEnabled () { return this.$store.state.instance.suggestionsEnabled },
showInstanceSpecificPanel () { return this.$store.state.instance.showInstanceSpecificPanel }
2017-01-17 08:27:39 -08:00
},
methods: {
activatePanel (panelName) {
this.mobileActivePanel = panelName
},
scrollToTop () {
window.scrollTo(0, 0)
2017-07-02 03:25:34 -07:00
},
logout () {
2018-11-10 01:43:25 -08:00
this.$router.replace('/main/public')
2017-07-02 03:25:34 -07:00
this.$store.dispatch('logout')
},
onFinderToggled (hidden) {
this.finderHidden = hidden
2017-01-17 08:27:39 -08:00
}
2016-10-26 10:03:55 -07:00
}
}