SideMenu and SideMenuBig use the new controller to get configuration

This commit is contained in:
Simon Vieille 2020-09-20 20:56:36 +02:00
parent 5153bee7c6
commit 45abf1f09d
2 changed files with 39 additions and 26 deletions

View file

@ -19,9 +19,12 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
<div class="side-menu-header">
<button class="side-menu-opener"></button>
<div v-if="logo" v-bind:class="{'side-menu-logo': true, 'avatardiv': isAvatar}">
<div v-if="!isAvatar && logo" v-bind:class="{'side-menu-logo': true, 'avatardiv': false}">
<img v-bind:src="logo">
</div>
<div v-if="isAvatar && avatar" v-bind:class="{'side-menu-logo': true, 'avatardiv': true}">
<img v-bind:src="avatar">
</div>
</div>
<ul class="side-menu-apps-list">
@ -37,6 +40,7 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
<script>
import trim from 'trim'
import axios from 'axios'
export default {
name: 'SideMenu',
@ -45,8 +49,9 @@ export default {
apps: [],
logo: null,
forceLightIcon: false,
targetBlank: false,
isAvatar: false,
targetBlankApps: [],
isAvatar: false,
avatar: null,
}
},
methods: {
@ -88,7 +93,7 @@ export default {
}
this.apps.push({
id: dataId,
id: dataId,
href: href,
name: trim(element.querySelector('span').innerHTML),
icon: svg,
@ -103,30 +108,25 @@ export default {
}, 1000)
})(this.apps)
},
retrieveLogo() {
const ncLogo = document.querySelector('#nextcloud .logo')
const avatar = document.querySelector('#side-menu-container').getAttribute('data-avatar');
if (avatar) {
this.logo = avatar
this.isAvatar = true
} else if (ncLogo) {
const url = window.getComputedStyle(ncLogo, null)
.getPropertyValue('background-image')
.replace('url("', '')
.replace('")', '')
retrieveConfig() {
let that = this
if (url && url !== 'none') {
this.logo = url
}
}
axios
.get(OC.generateUrl('/apps/side_menu/js/config'))
.then(function(response) {
const config = response.data
that.targetBlankApps = config['target-blank-apps']
that.forceLightIcon = config['force-light-icon']
that.avatar = config['avatar']
that.logo = config['logo']
});
},
},
mounted() {
this.retrieveConfig()
this.retrieveApps()
this.retrieveLogo()
this.forceLightIcon = document.querySelector('#side-menu-container').getAttribute('data-forcelighticon') == 1;
this.targetBlankApps = document.querySelector('#side-menu-container').getAttribute('data-targetblankapps').split(',');
const menu = document.querySelector('#appmenu')

View file

@ -18,7 +18,7 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
<div id="side-menu" class="side-menu-big">
<div class="side-menu-header">
<button class="side-menu-opener side-menu-closer"></button>
<button class="side-menu-opener"></button>
<button class="side-menu-opener"></button>
</div>
<div class="side-menu-categories-wrapper">
@ -50,7 +50,8 @@ export default {
return {
items: [],
activeApp: null,
targetBlank: false,
targetBlank: false,
targetBlankApps: [],
}
},
methods: {
@ -74,14 +75,26 @@ export default {
jQuery('body').trigger('side-menu.apps', [apps])
});
},
retrieveActiveApp() {
let activeAppLink = document.querySelector('#appmenu a.active')
this.activeApp = activeAppLink ? activeAppLink.parentNode.getAttribute('data-id') : null
},
retrieveConfig() {
let that = this
axios
.get(OC.generateUrl('/apps/side_menu/js/config'))
.then(function(response) {
const config = response.data
that.targetBlankApps = config['target-blank-apps']
});
},
},
mounted() {
this.targetBlankApps = document.querySelector('#side-menu-container').getAttribute('data-targetblankapps').split(',');
this.retrieveConfig()
this.retrieveApps()
this.retrieveActiveApp()
}