Merge branch 'feature/instance-specific-panel' into 'develop'
add instance specific panel See merge request pleroma/pleroma-fe!202
This commit is contained in:
commit
ea6ee2aaa2
|
@ -2,6 +2,7 @@ import UserPanel from './components/user_panel/user_panel.vue'
|
||||||
import NavPanel from './components/nav_panel/nav_panel.vue'
|
import NavPanel from './components/nav_panel/nav_panel.vue'
|
||||||
import Notifications from './components/notifications/notifications.vue'
|
import Notifications from './components/notifications/notifications.vue'
|
||||||
import UserFinder from './components/user_finder/user_finder.vue'
|
import UserFinder from './components/user_finder/user_finder.vue'
|
||||||
|
import InstanceSpecificPanel from './components/instance_specific_panel/instance_specific_panel.vue'
|
||||||
import ChatPanel from './components/chat_panel/chat_panel.vue'
|
import ChatPanel from './components/chat_panel/chat_panel.vue'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
|
@ -11,7 +12,8 @@ export default {
|
||||||
NavPanel,
|
NavPanel,
|
||||||
Notifications,
|
Notifications,
|
||||||
UserFinder,
|
UserFinder,
|
||||||
ChatPanel
|
ChatPanel,
|
||||||
|
InstanceSpecificPanel
|
||||||
},
|
},
|
||||||
data: () => ({
|
data: () => ({
|
||||||
mobileActivePanel: 'timeline'
|
mobileActivePanel: 'timeline'
|
||||||
|
@ -24,7 +26,8 @@ export default {
|
||||||
logoStyle () { return { 'background-image': `url(${this.$store.state.config.logo})` } },
|
logoStyle () { return { 'background-image': `url(${this.$store.state.config.logo})` } },
|
||||||
style () { return { 'background-image': `url(${this.background})` } },
|
style () { return { 'background-image': `url(${this.background})` } },
|
||||||
sitename () { return this.$store.state.config.name },
|
sitename () { return this.$store.state.config.name },
|
||||||
chat () { return this.$store.state.chat.channel.state === 'joined' }
|
chat () { return this.$store.state.chat.channel.state === 'joined' },
|
||||||
|
showInstanceSpecificPanel () { return this.$store.state.config.showInstanceSpecificPanel }
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
activatePanel (panelName) {
|
activatePanel (panelName) {
|
||||||
|
|
|
@ -23,6 +23,7 @@
|
||||||
<div class="sidebar">
|
<div class="sidebar">
|
||||||
<user-panel></user-panel>
|
<user-panel></user-panel>
|
||||||
<nav-panel></nav-panel>
|
<nav-panel></nav-panel>
|
||||||
|
<instance-specific-panel v-if="showInstanceSpecificPanel"></instance-specific-panel>
|
||||||
<chat-panel v-if="currentUser && chat"></chat-panel>
|
<chat-panel v-if="currentUser && chat"></chat-panel>
|
||||||
<notifications v-if="currentUser"></notifications>
|
<notifications v-if="currentUser"></notifications>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -0,0 +1,9 @@
|
||||||
|
const InstanceSpecificPanel = {
|
||||||
|
computed: {
|
||||||
|
instanceSpecificPanelContent () {
|
||||||
|
return this.$store.state.config.instanceSpecificPanelContent
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export default InstanceSpecificPanel
|
|
@ -0,0 +1,15 @@
|
||||||
|
<template>
|
||||||
|
<div class="instance-specific-panel">
|
||||||
|
<div class="panel panel-default base01-background">
|
||||||
|
<div class="panel-body">
|
||||||
|
<div v-html="instanceSpecificPanelContent">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script src="./instance_specific_panel.js" ></script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
</style>
|
10
src/main.js
10
src/main.js
|
@ -88,10 +88,11 @@ window.fetch('/api/statusnet/config.json')
|
||||||
window.fetch('/static/config.json')
|
window.fetch('/static/config.json')
|
||||||
.then((res) => res.json())
|
.then((res) => res.json())
|
||||||
.then((data) => {
|
.then((data) => {
|
||||||
const {theme, background, logo} = data
|
const {theme, background, logo, showInstanceSpecificPanel} = data
|
||||||
store.dispatch('setOption', { name: 'theme', value: theme })
|
store.dispatch('setOption', { name: 'theme', value: theme })
|
||||||
store.dispatch('setOption', { name: 'background', value: background })
|
store.dispatch('setOption', { name: 'background', value: background })
|
||||||
store.dispatch('setOption', { name: 'logo', value: logo })
|
store.dispatch('setOption', { name: 'logo', value: logo })
|
||||||
|
store.dispatch('setOption', { name: 'showInstanceSpecificPanel', value: showInstanceSpecificPanel })
|
||||||
if (data['chatDisabled']) {
|
if (data['chatDisabled']) {
|
||||||
store.dispatch('disableChat')
|
store.dispatch('disableChat')
|
||||||
}
|
}
|
||||||
|
@ -163,3 +164,10 @@ window.fetch('/static/emoji.json')
|
||||||
})
|
})
|
||||||
store.dispatch('setOption', { name: 'emoji', value: emoji })
|
store.dispatch('setOption', { name: 'emoji', value: emoji })
|
||||||
})
|
})
|
||||||
|
|
||||||
|
window.fetch('/instance/panel.html')
|
||||||
|
.then((res) => res.text())
|
||||||
|
.then((html) => {
|
||||||
|
store.dispatch('setOption', { name: 'instanceSpecificPanelContent', value: html })
|
||||||
|
})
|
||||||
|
|
||||||
|
|
|
@ -3,5 +3,6 @@
|
||||||
"background": "/static/bg.jpg",
|
"background": "/static/bg.jpg",
|
||||||
"logo": "/static/logo.png",
|
"logo": "/static/logo.png",
|
||||||
"defaultPath": "/main/all",
|
"defaultPath": "/main/all",
|
||||||
"chatDisabled": false
|
"chatDisabled": false,
|
||||||
|
"showInstanceSpecificPanel": false
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue