forked from deblan/side_menu
add compatibility with AppOrder, refactoring
This commit is contained in:
parent
e1d40bdfab
commit
323f2c753b
|
@ -4,6 +4,8 @@
|
|||
|
||||
This application moves the top menu of Nextcloud to the left side.
|
||||
|
||||
Comptatible with AppOrder.
|
||||
|
||||
![](https://upload.deblan.org/u/2020-03/5e7fab2b.jpg)
|
||||
|
||||
![](https://upload.deblan.org/u/2020-03/5e7fab16.jpg)
|
||||
|
|
|
@ -6,7 +6,7 @@
|
|||
<description>Move the top menu to the left side.</description>
|
||||
<licence>agpl</licence>
|
||||
<author mail="dev+sidemenu@deblan.fr" homepage="https://www.deblan.io/">Simon Vieille</author>
|
||||
<version>1.1.0</version>
|
||||
<version>1.1.1</version>
|
||||
<namespace>SideMenu</namespace>
|
||||
<category>customization</category>
|
||||
<website>https://gitnet.fr/deblan/side_menu</website>
|
||||
|
|
|
@ -1,23 +1,23 @@
|
|||
<template>
|
||||
<div id="side-menu">
|
||||
<div class="side-menu-header">
|
||||
<button class="side-menu-opener"></button>
|
||||
<div id="side-menu">
|
||||
<div class="side-menu-header">
|
||||
<button class="side-menu-opener"></button>
|
||||
|
||||
<div v-if="logo" class="side-menu-logo">
|
||||
<img v-bind:src="logo">
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="logo" class="side-menu-logo">
|
||||
<img v-bind:src="logo">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<ul class="side-menu-apps-list">
|
||||
<li v-for="app in apps" v-bind:class="{'side-menu-app': true, 'is-active': app.active}">
|
||||
<a v-bind:href="app.href">
|
||||
<span class="side-menu-app-icon" v-html="app.icon"></span>
|
||||
<ul class="side-menu-apps-list">
|
||||
<li v-for="app in apps" v-bind:class="{'side-menu-app': true, 'is-active': app.active}">
|
||||
<a v-bind:href="app.href">
|
||||
<span class="side-menu-app-icon" v-html="app.icon"></span>
|
||||
|
||||
{{ app.name }}
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
{{ app.name }}
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
@ -25,34 +25,46 @@ import axios from '@nextcloud/axios'
|
|||
import { generateUrl } from '@nextcloud/router'
|
||||
|
||||
export default {
|
||||
name: 'SideMenu',
|
||||
data() {
|
||||
return {
|
||||
apps: [],
|
||||
logo: null
|
||||
}
|
||||
},
|
||||
created() {
|
||||
let that = this
|
||||
var links = document.querySelectorAll('#appmenu a')
|
||||
name: 'SideMenu',
|
||||
data() {
|
||||
return {
|
||||
apps: [],
|
||||
logo: null
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
retrieveApps() {
|
||||
this.apps = [];
|
||||
const links = document.querySelectorAll('#appmenu a');
|
||||
|
||||
this.logo = window.getComputedStyle(document.querySelector('#nextcloud .logo'), null)
|
||||
.getPropertyValue('background-image')
|
||||
.replace('url("', '')
|
||||
.replace('")', '')
|
||||
for (let element of links) {
|
||||
let href = element.getAttribute('href')
|
||||
|
||||
for (let element of links) {
|
||||
let href = element.getAttribute('href')
|
||||
if (href !== '#') {
|
||||
this.apps.push({
|
||||
href: href,
|
||||
name: element.querySelector('span').innerHTML,
|
||||
icon: element.querySelector('svg').outerHTML,
|
||||
active: element.classList.contains('active')
|
||||
});
|
||||
}
|
||||
}
|
||||
},
|
||||
retrieveLogo() {
|
||||
this.logo = window.getComputedStyle(document.querySelector('#nextcloud .logo'), null)
|
||||
.getPropertyValue('background-image')
|
||||
.replace('url("', '')
|
||||
.replace('")', '')
|
||||
},
|
||||
},
|
||||
created() {
|
||||
this.retrieveApps();
|
||||
this.retrieveLogo();
|
||||
|
||||
if (href !== '#') {
|
||||
that.apps.push({
|
||||
href: href,
|
||||
name: element.querySelector('span').innerHTML,
|
||||
icon: element.querySelector('svg').outerHTML,
|
||||
active: element.classList.contains('active')
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
const menu = document.querySelector('#appmenu')
|
||||
const config = {attributes: true, childList: true, subtree: true};
|
||||
const observer = new MutationObserver(this.retrieveApps);
|
||||
observer.observe(menu, config);
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
Loading…
Reference in a new issue