Removed old code

Signed-off-by: fnuesse <felix.nuesse@t-online.de>

Removed duplicate collapse-button and changed api-endpoints

Signed-off-by: fnuesse <felix.nuesse@t-online.de>

Removed app-navigation-caption from apps.scss

Signed-off-by: fnuesse <felix.nuesse@t-online.de>

Changed api-endpoints

Signed-off-by: fnuesse <felix.nuesse@t-online.de>

Fixed Codestyle (.js)

Signed-off-by: fnuesse <felix.nuesse@t-online.de>

Hid away extended Settings

Signed-off-by: fnuesse <felix.nuesse@t-online.de>

Fixed reverse state

Signed-off-by: fnuesse <felix.nuesse@t-online.de>

Fixed Missing reverse after changing sort-strategy

Signed-off-by: fnuesse <felix.nuesse@t-online.de>

Fixed Copyright-Header

Signed-off-by: fnuesse <felix.nuesse@t-online.de>

Removed UI-Flickering

Signed-off-by: fnuesse <felix.nuesse@t-online.de>

hid dotmenu on toggle while favorites are empty

Signed-off-by: fnuesse <felix.nuesse@t-online.de>

Added Draggable to listelements (WIP)

Signed-off-by: fnuesse <felix.nuesse@t-online.de>

Rebuild appnavigation.php with recursive function to allow easy implementation of sublists

Signed-off-by: fnuesse <felix.nuesse@t-online.de>

Fixed draggable Sublist-Elements

Signed-off-by: fnuesse <felix.nuesse@t-online.de>

Fixed draggable Sublist-Elements

Signed-off-by: fnuesse <felix.nuesse@t-online.de>

Added date-modified sorting option to quickaccess

Signed-off-by: fnuesse <felix.nuesse@t-online.de>

Added custom order sorting option to quickaccess

Signed-off-by: fnuesse <felix.nuesse@t-online.de>

Added custom order sorting option to quickaccess

Signed-off-by: fnuesse <felix.nuesse@t-online.de>

Added fallback for custom ordering

Signed-off-by: fnuesse <felix.nuesse@t-online.de>

apps/files/appinfo/routes.php

@@ -78,34 +78,59 @@ $application->registerRoutes(
 			],
 			[
 				'name' => 'API#showQuickAccess',
-				'url' => '/api/v1/showquickaccess',
+				'url' => '/api/v1/quickaccess/set/showList',
 				'verb' => 'GET',
 			],
 			[
-				'name' => 'API#hideQuickAccess',
-				'url' => '/api/v1/hidequickaccess',
+				'name' => 'API#getShowQuickAccess',
+				'url' => '/api/v1/quickaccess/get/showList',
+				'verb' => 'GET',
+			],
+			[
+				'name' => 'API#getShowQuickaccessSettings',
+				'url' => '/api/v1/quickaccess/showsettings',
+				'verb' => 'GET',
+			],
+			[
+				'name' => 'API#setShowQuickaccessSettings',
+				'url' => '/api/v1/quickaccess/set/showsettings',
 				'verb' => 'GET',
 			],
 			[
 				'name' => 'API#setSortingStrategy',
-				'url' => '/api/v1/setsortingstrategy',
+				'url' => '/api/v1/quickaccess/set/SortingStrategy',
 				'verb' => 'GET',
 			],
 			[
 				'name' => 'API#setReverseQuickaccess',
-				'url' => '/api/v1/setreversequickaccess',
+				'url' => '/api/v1/quickaccess/set/ReverseList',
 				'verb' => 'GET',
 			],
 			[
 				'name' => 'API#getSortingStrategy',
-				'url' => '/api/v1/getsortingstrategy',
+				'url' => '/api/v1/quickaccess/get/SortingStrategy',
 				'verb' => 'GET',
 			],
 			[
 				'name' => 'API#getReverseQuickaccess',
-				'url' => '/api/v1/getreversequickaccess',
+				'url' => '/api/v1/quickaccess/get/ReverseList',
+				'verb' => 'GET',
+			],
+			[
+				'name' => 'API#getFavoritesFolder',
+				'url' => '/api/v1/quickaccess/get/FavoriteFolders/',
+				'verb' => 'GET'
+			],
+			[
+				'name' => 'API#setSortingOrder',
+				'url' => '/api/v1/quickaccess/set/CustomSortingOrder',
 				'verb' => 'GET',
-			]
+			],
+			[
+				'name' => 'API#getSortingOrder',
+				'url' => '/api/v1/quickaccess/get/CustomSortingOrder',
+				'verb' => 'GET',
+			],
 		]
 	]
 );

apps/files/js/navigation.js

@@ -1,10 +1,9 @@
 /*
- * Copyright (c) 2014
+ * @Copyright 2014 Vincent Petry <pvince81@owncloud.com>
  *
  * @author Vincent Petry
- * @copyright 2014 Vincent Petry <pvince81@owncloud.com>
+ * @author Felix Nüsse <felix.nuesse@t-online.de>
  *
- * Edited by: Felix Nüsse <felix.nuesse@t-online.de> 2018
  *
  * This file is licensed under the Affero General Public License version 3
  * or later.
@@ -13,7 +12,7 @@
  *
  */
 
-(function() {
+(function () {
 
 	/**
 	 * @class OCA.Files.Navigation
@@ -21,7 +20,7 @@
 	 *
 	 * @param $el element containing the navigation
 	 */
-	var Navigation = function($el) {
+	var Navigation = function ($el) {
 		this.initialize($el);
 	};
 
@@ -42,29 +41,44 @@
 
 		/**
 		 * Strategy by which the quickaccesslist is sorted
+		 *
+		 * Possible Strategies:
+		 * customorder
+		 * datemodified
+		 * date
+		 * alphabet
+		 *
 		 */
-		$sortingStrategy: 'alphabet',
+		$sortingStrategy: 'customorder',
+
+		/**
+		 * Key for the quick-acces-list
+		 */
+		$quickAccessListKey: 'sublist-favorites',
 		/**
 		 * Initializes the navigation from the given container
 		 *
 		 * @private
 		 * @param $el element containing the navigation
 		 */
-		initialize: function($el) {
+		initialize: function ($el) {
 			this.$el = $el;
 			this._activeItem = null;
 			this.$currentContent = null;
 			this._setupEvents();
-			this.initialSort();
+			this.setInitialQuickaccessSettings();
+
+
 		},
 
 		/**
 		 * Setup UI events
 		 */
-		_setupEvents: function() {
+		_setupEvents: function () {
 			this.$el.on('click', 'li a', _.bind(this._onClickItem, this))
 			this.$el.on('click', 'li button', _.bind(this._onClickMenuButton, this));
-			this.$el.on('click', 'li input', _.bind(this._onClickMenuItem, this));
+			this._setOnDrag();
+
 		},
 
 		/**
@@ -72,16 +86,16 @@
 		 *
 		 * @return app container
 		 */
-		getActiveContainer: function() {
+		getActiveContainer: function () {
 			return this.$currentContent;
 		},
 
 		/**
 		 * Returns the currently active item
-		 * 
+		 *
 		 * @return item ID
 		 */
-		getActiveItem: function() {
+		getActiveItem: function () {
 			return this._activeItem;
 		},
 
@@ -92,12 +106,15 @@
 		 * @param string itemId id of the navigation item to select
 		 * @param array options "silent" to not trigger event
 		 */
-		setActiveItem: function(itemId, options) {
+		setActiveItem: function (itemId, options) {
 			var oldItemId = this._activeItem;
 			if (itemId === this._activeItem) {
 				if (!options || !options.silent) {
 					this.$el.trigger(
-						new $.Event('itemChanged', {itemId: itemId, previousItemId: oldItemId})
+						new $.Event('itemChanged', {
+							itemId: itemId,
+							previousItemId: oldItemId
+						})
 					);
 				}
 				return;
@@ -114,7 +131,10 @@
 			if (!options || !options.silent) {
 				this.$currentContent.trigger(jQuery.Event('show'));
 				this.$el.trigger(
-					new $.Event('itemChanged', {itemId: itemId, previousItemId: oldItemId})
+					new $.Event('itemChanged', {
+						itemId: itemId,
+						previousItemId: oldItemId
+					})
 				);
 			}
 		},
@@ -122,14 +142,14 @@
 		/**
 		 * Returns whether a given item exists
 		 */
-		itemExists: function(itemId) {
+		itemExists: function (itemId) {
 			return this.$el.find('li[data-id=' + itemId + ']').length;
 		},
 
 		/**
 		 * Event handler for when clicking on an item.
 		 */
-		_onClickItem: function(ev) {
+		_onClickItem: function (ev) {
 			var $target = $(ev.target);
 			var itemId = $target.closest('li').attr('data-id');
 			if (!_.isUndefined(itemId)) {
@@ -137,136 +157,148 @@
 			}
 			ev.preventDefault();
 		},
+
 		/**
-		 * Event handler for when clicking on an three-dot-menu.
+		 * Event handler for when dragging an item
 		 */
-		_onClickMenuButton: function(ev) {
-			var $target = $(ev.target);
-			var itemId = $target.closest('button').attr('id');
-			var qaSelector= '#quickaccess-list';
-
-			if(itemId==='button-collapseQuickAccess'){
-
-				document.getElementById('enableQuickAccess').checked=!document.getElementById('enableQuickAccess').checked;
-				$.get(OC.generateUrl("/apps/files/api/v1/showquickaccess"),  {show: document.getElementById('enableQuickAccess').checked}, function(data, status){
-				});
-
-				$("#favorites-toggle" ).toggleClass('open');
-
-			}
-
-			if(itemId==='button-favorites'){
-				document.getElementById('menu-favorites').classList.toggle('open');
-			}
-			ev.preventDefault();
+		_setOnDrag: function () {
+			var scope=this;
+			$(function () {
+				if (document.getElementById(scope.$quickAccessListKey.toString()).hasAttribute("draggable")) {
+					$("#sublist-favorites").sortable({
+						update: function (event, ui) {
+							var list = document.getElementById(scope.$quickAccessListKey.toString()).getElementsByTagName('li');
+							var string=[];
+							for (var j = 0; j < list.length; j++) {
+								var Object = {id:j, name:scope.getCompareValue(list,j,'alphabet') };
+								string.push(Object);
+							}
+							var resultorder=JSON.stringify(string);
+							console.log(resultorder);
+							$.get(OC.generateUrl("/apps/files/api/v1/quickaccess/set/CustomSortingOrder"),{
+							order: resultorder}, function (data, status) {});
+						}
+					});
+				}else{
+					if(scope.$sortingStrategy === 'customorder'){
+						scope.$sortingStrategy = 'datemodified';
+					}
+				}
+			});
 		},
 
 		/**
-		 * Event handler for when clicking on a menuitem.
+		 * Event handler for clicking a button
 		 */
-		_onClickMenuItem: function(ev) {
+		_onClickMenuButton: function (ev) {
+			var $target = $(ev.target);
+			var itemId = $target.closest('button').attr('id');
 
-			var qaSelector= '#quickaccess-list';
-			var qaKey= 'quickaccess-list';
+			var collapsibleToggles = [];
+			var dotmenuToggles = [];
 
-			var itemId = $(ev.target).closest('input').attr('id');
-			var list = document.getElementById(qaKey).getElementsByTagName('li');
+			// The collapsibleToggles-Array consists of a list of Arrays. Every subarray must contain the Button to listen to at the 0th index,
+			// and the parent, which should be toggled at the first arrayindex.
+			collapsibleToggles.push(["#button-collapse-favorites", "#button-collapse-parent-favorites"]);
 
-			if(itemId==='enableQuickAccess' ){
-				$.get(OC.generateUrl("/apps/files/api/v1/showquickaccess"),  {show: document.getElementById('enableQuickAccess').checked}, function(data, status){
-				});
-				$("#favorites-toggle" ).toggleClass('open');
-				document.getElementById('menu-favorites').classList.toggle('open');
-			}
+			// The dotmenuToggles-Array consists of a list of Arrays. Every subarray must contain the Button to listen to at the 0th index,
+			// and the parent, which should be toggled at the first arrayindex.
+			dotmenuToggles.push(["#dotmenu-button-favorites", "dotmenu-content-favorites"]);
 
-			if(itemId==='sortByAlphabet'){
-				//Prevents deselecting Group-Item
-				if(!document.getElementById('sortByAlphabet').checked){
-					ev.preventDefault();
-					return;
+
+			collapsibleToggles.forEach(function foundToggle (item) {
+				if (item[0] === ("#" + itemId)) {
+					$(item[1]).toggleClass('open');
+					var show=1;
+					if(!$(item[1]).hasClass('open')){
+						show=0;
+					}
+					$.get(OC.generateUrl("/apps/files/api/v1/quickaccess/set/showList"), {show: show}, function (data, status) {
+					});
 				}
-				this.sortingStrategy='alphabet';
-				document.getElementById('sortByDate').checked=false;
-				$.get(OC.generateUrl("/apps/files/api/v1/setsortingstrategy"), {strategy: this.sortingStrategy}, function(data, status){});
-				this.QuickSort(list, 0, list.length - 1);
-				document.getElementById('menu-favorites').classList.toggle('open');
-			}
+			});
 
-			if(itemId==='sortByDate'){
-				//Prevents deselecting Group-Item
-				if(!document.getElementById('sortByDate').checked){
-					ev.preventDefault();
-					return;
+			dotmenuToggles.forEach(function foundToggle (item) {
+				if (item[0] === ("#" + itemId)) {
+					document.getElementById(item[1]).classList.toggle('open');
 				}
-				this.sortingStrategy='date';
-				document.getElementById('sortByAlphabet').checked=false;
-				$.get(OC.generateUrl("/apps/files/api/v1/setsortingstrategy"), {strategy: this.sortingStrategy}, function(data, status){});
-				this.QuickSort(list, 0, list.length - 1);
-				document.getElementById('menu-favorites').classList.toggle('open');
-			}
+			});
 
-			if(itemId==='enableReverse'){
-				this.reverse(list);
-				var state = document.getElementById('enableReverse').checked;
-				$.get(OC.generateUrl("/apps/files/api/v1/setreversequickaccess"), {reverse: state}, function(data, status){});
-				document.getElementById('menu-favorites').classList.toggle('open');
-			}
-			//ev.preventDefault();
+			ev.preventDefault();
 		},
 
 		/**
 		 * Sort initially as setup of sidebar for QuickAccess
 		 */
-		initialSort: function() {
+		setInitialQuickaccessSettings: function () {
+
+			var quickAccesKey = this.$quickAccessListKey;
+			var list = document.getElementById(quickAccesKey).getElementsByTagName('li');
+
+			var sort = true;
+			var reverse = false;
+			if (this.$sortingStrategy === 'datemodified') {
+				sort = false;
+				reverse = false;
+
+				var scope = this;
+				$.get(OC.generateUrl("/apps/files/api/v1/quickaccess/get/FavoriteFolders/"), function (data, status) {
+					for (var i = 0; i < data.favoriteFolders.length; i++) {
+						for (var j = 0; j < list.length; j++) {
+							if (scope.getCompareValue(list, j, 'alphabet').toLowerCase() === data.favoriteFolders[i].name.toLowerCase()) {
+								list[j].setAttribute("mtime", data.favoriteFolders[i].mtime);
+							}
+						}
+					}
+					scope.QuickSort(list, 0, list.length - 1);
+					scope.reverse(list);
+				});
 
-			var domRevState=document.getElementById('enableReverse').checked;
-			var domSortAlphabetState=document.getElementById('sortByAlphabet').checked;
-			var domSortDateState=document.getElementById('sortByDate').checked;
 
-			var qaKey= 'quickaccess-list';
-			var list = document.getElementById(qaKey).getElementsByTagName('li');
+			} else if (this.$sortingStrategy === 'alphabet') {
+				sort = true;
+			} else if (this.$sortingStrategy === 'date') {
+				sort = true;
+			} else if (this.$sortingStrategy === 'customorder') {
+				var scope = this;
+				$.get(OC.generateUrl("/apps/files/api/v1/quickaccess/get/CustomSortingOrder"), function (data, status) {
+					console.log("load order:");
+					var ordering=JSON.parse(data)
+					console.log(ordering);
+					for (var i = 0; i < ordering.length; i++) {
+						for (var j = 0; j < list.length; j++) {
+							if (scope.getCompareValue(list, j, 'alphabet').toLowerCase() === ordering[i].name.toLowerCase()) {
+								list[j].setAttribute("folderPosition", ordering[i].id);
+							}
+						}
+					}
+					scope.QuickSort(list, 0, list.length - 1);
+				});
 
-			if(domSortAlphabetState){
-				this.sortingStrategy='alphabet';
-			}
-			if(domSortDateState){
-				this.sortingStrategy='date';
+				sort = false;
 			}
 
-			this.QuickSort(list, 0, list.length - 1);
-
-			if(domRevState){
+			if (sort) {
+				this.QuickSort(list, 0, list.length - 1);
+			}
+			if (reverse) {
 				this.reverse(list);
 			}
 
-			/*This creates flashes the UI, which is bad userexperience. It is the cleaner way to do it, that is why i haven't deleted it yet.
-			var scope=this;
-			$.get(OC.generateUrl("/apps/files/api/v1/getsortingstrategy"), function(data, status){
-				scope.sortingStrategy=data;
-				scope.QuickSort(list, 0, list.length - 1);
-
-			});
-
-			$.get(OC.generateUrl("/apps/files/api/v1/getreversequickaccess"), function(data, status){
-				if(data){
-					scope.reverse(list);
-				}
-			});
-			*/
 		},
 
 		/**
 		 * Sorting-Algorithm for QuickAccess
 		 */
-		QuickSort: function(list, start, end) {
-			var lastmatch;
-			if(list.length > 1){
-				lastmatch = this.quicksort_helper(list, start, end);
-				if(start < lastmatch - 1){
-					this.QuickSort(list, start, lastmatch - 1);
+		QuickSort: function (list, start, end) {
+			var lastMatch;
+			if (list.length > 1) {
+				lastMatch = this.quicksort_helper(list, start, end);
+				if (start < lastMatch - 1) {
+					this.QuickSort(list, start, lastMatch - 1);
 				}
-				if(lastmatch < end){
-					this.QuickSort(list, lastmatch, end);
+				if (lastMatch < end) {
+					this.QuickSort(list, lastMatch, end);
 				}
 			}
 		},
@@ -274,20 +306,20 @@
 		/**
 		 * Sorting-Algorithm-Helper for QuickAccess
 		 */
-		quicksort_helper: function(list, start, end) {
+		quicksort_helper: function (list, start, end) {
 			var pivot = Math.floor((end + start) / 2);
-			var pivotelem = this.getCompareValue(list,pivot);
-			var	i = start;
-			var	j = end;
+			var pivotElement = this.getCompareValue(list, pivot);
+			var i = start;
+			var j = end;
 
-			while(i <= j){
-				while(this.getCompareValue(list,i) < pivotelem){
+			while (i <= j) {
+				while (this.getCompareValue(list, i) < pivotElement) {
 					i++;
 				}
-				while(this.getCompareValue(list,j) > pivotelem){
+				while (this.getCompareValue(list, j) > pivotElement) {
 					j--;
 				}
-				if(i <= j){
+				if (i <= j) {
 					this.swap(list, i, j);
 					i++;
 					j--;
@@ -300,11 +332,20 @@
 		 * Sorting-Algorithm-Helper for QuickAccess
 		 * This method allows easy access to the element which is sorted by.
 		 */
-		getCompareValue: function(nodes, int){
-			if(this.sortingStrategy==='alphabet'){
+		getCompareValue: function (nodes, int, strategy) {
+
+			if ((typeof strategy === 'undefined')) {
+				strategy = this.$sortingStrategy;
+			}
+
+			if (strategy === 'alphabet') {
 				return nodes[int].getElementsByTagName('a')[0].innerHTML.toLowerCase();
-			}else if(this.sortingStrategy==='date'){
+			} else if (strategy === 'date') {
 				return nodes[int].getAttribute('folderPos').toLowerCase();
+			} else if (strategy === 'datemodified') {
+				return nodes[int].getAttribute('mtime');
+			}else if (strategy === 'customorder') {
+				return nodes[int].getAttribute('folderPosition');
 			}
 			return nodes[int].getElementsByTagName('a')[0].innerHTML.toLowerCase();
 		},
@@ -313,7 +354,7 @@
 		 * Sorting-Algorithm-Helper for QuickAccess
 		 * This method allows easy swapping of elements.
 		 */
-		swap: function(list, j, i){
+		swap: function (list, j, i) {
 			list[i].before(list[j]);
 			list[j].before(list[i]);
 		},
@@ -321,10 +362,10 @@
 		/**
 		 * Reverse QuickAccess-List
 		 */
-		reverse: function(list){
-			var len=list.length-1;
-			for(var i = 0; i < len/2; i++) {
-				this.swap(list, i, len-i);
+		reverse: function (list) {
+			var len = list.length - 1;
+			for (var i = 0; i < len / 2; i++) {
+				this.swap(list, i, len - i);
 			}
 		}
 

apps/files/js/tagsplugin.js

@@ -10,11 +10,11 @@
 
 /* global Handlebars */
 
-(function(OCA) {
+(function (OCA) {
 
 	_.extend(OC.Files.Client, {
-		PROPERTY_TAGS:	'{' + OC.Files.Client.NS_OWNCLOUD + '}tags',
-		PROPERTY_FAVORITE:	'{' + OC.Files.Client.NS_OWNCLOUD + '}favorite'
+		PROPERTY_TAGS: '{' + OC.Files.Client.NS_OWNCLOUD + '}tags',
+		PROPERTY_FAVORITE: '{' + OC.Files.Client.NS_OWNCLOUD + '}favorite'
 	});
 
 	var TEMPLATE_FAVORITE_MARK =
@@ -30,7 +30,7 @@
 	 * @param {boolean} state true if starred, false otherwise
 	 * @return {string} icon class for star image
 	 */
-	function getStarIconClass(state) {
+	function getStarIconClass (state) {
 		return state ? 'icon-starred' : 'icon-star';
 	}
 
@@ -40,7 +40,7 @@
 	 * @param {boolean} state true if starred, false otherwise
 	 * @return {Object} jQuery object
 	 */
-	function renderStar(state) {
+	function renderStar (state) {
 		if (!this._template) {
 			this._template = Handlebars.compile(TEMPLATE_FAVORITE_MARK);
 		}
@@ -57,7 +57,7 @@
 	 * @param {Object} $favoriteMarkEl favorite mark element
 	 * @param {boolean} state true if starred, false otherwise
 	 */
-	function toggleStar($favoriteMarkEl, state) {
+	function toggleStar ($favoriteMarkEl, state) {
 		$favoriteMarkEl.removeClass('icon-star icon-starred').addClass(getStarIconClass(state));
 		$favoriteMarkEl.toggleClass('permanent', state);
 	}
@@ -65,73 +65,64 @@
 	/**
 	 * Remove Item from Quickaccesslist
 	 *
-	 * @param {String} $appfolder folder to be removed
+	 * @param {String} appfolder folder to be removed
 	 */
-	function removeFavoriteFromList(appfolder) {
+	function removeFavoriteFromList (appfolder) {
 
-		var qaKey= 'quickaccess-list';
-		var listUL = document.getElementById(qaKey);
-		var list = listUL.getElementsByTagName('li');
-		var appname=appfolder.substring(appfolder.lastIndexOf("/")+1, appfolder.length);
+		var quickAccessList = 'sublist-favorites';
+		var collapsibleButtonId = 'button-collapse-favorites';
+		var listULElements = document.getElementById(quickAccessList);
+		var listLIElements = listULElements.getElementsByTagName('li');
+		var appName = appfolder.substring(appfolder.lastIndexOf("/") + 1, appfolder.length);
 
-		for(var i = 0; i <= list.length-1; i++) {
-			if(appname === list[i].getElementsByTagName('a')[0].innerHTML){
-				list[i].remove();
+		for (var i = 0; i <= listLIElements.length - 1; i++) {
+			if (appName === listLIElements[i].getElementsByTagName('a')[0].innerHTML) {
+				listLIElements[i].remove();
 			}
 		}
 
-		if(listUL.childElementCount==0){
-			var dotmenu = document.getElementById("quickaccessbutton");
-			dotmenu.style.display='none';
-
-			var collapsibleButton = document.getElementById("button-collapseQuickAccess");
-			collapsibleButton.style.display='none';
-
-			$("#favorites-toggle" ).removeClass('collapsible');
+		if (listULElements.childElementCount === 0) {
+			var collapsibleButton = document.getElementById(collapsibleButtonId);
+			collapsibleButton.style.display = 'none';
+			$("#favorites-toggle").removeClass('collapsible');
 		}
 	}
 
 	/**
 	 * Add Item to Quickaccesslist
 	 *
-	 * @param {String} $appfolder folder to be added
+	 * @param {String} appfolder folder to be added
 	 */
-	function addFavoriteToList(appfolder) {
-		var qaKey= 'quickaccess-list';
-		var listUL = document.getElementById(qaKey);
-		var list = listUL.getElementsByTagName('li');
-
-		var appname=appfolder.substring(appfolder.lastIndexOf("/")+1, appfolder.length);
-
-		var a = document.createElement('A');
-		a.setAttribute("href","/cloud/index.php/apps/files/?dir="+appfolder);
-		a.setAttribute("class","nav-icon-files svg");
-		a.innerHTML=appname;
-
-		var len=list.length+1;
-		var li = document.createElement('li');
-		li.setAttribute("data-id", "/cloud/index.php/apps/files/?dir="+appfolder);
-		li.setAttribute("class", "nav-"+appname);
-		li.setAttribute("folderpos", len.toString());
-		li.appendChild(a);
-
-
-		if(listUL.childElementCount<=0){
-			listUL.appendChild(li);
-			var dotmenu = document.getElementById("quickaccessbutton");
-			dotmenu.style.display='';
-
-			var collapsibleButton = document.getElementById("button-collapseQuickAccess");
-			collapsibleButton.style.display='';
-
-			$("#favorites-toggle" ).addClass('collapsible');
-		}else{
-			list[list.length-1].after(li);
+	function addFavoriteToList (appfolder) {
+		var quickAccessList = 'sublist-favorites';
+		var collapsibleButtonId = 'button-collapse-favorites';
+		var listULElements = document.getElementById(quickAccessList);
+		var listLIElements = listULElements.getElementsByTagName('li');
+
+		var appName = appfolder.substring(appfolder.lastIndexOf("/") + 1, appfolder.length);
+
+		var innerTagA = document.createElement('A');
+		innerTagA.setAttribute("href", "/cloud/index.php/apps/files/?dir=" + appfolder);
+		innerTagA.setAttribute("class", "nav-icon-files svg");
+		innerTagA.innerHTML = appName;
+
+		var length = listLIElements.length + 1;
+		var innerTagLI = document.createElement('li');
+		innerTagLI.setAttribute("data-id", "/cloud/index.php/apps/files/?dir=" + appfolder);
+		innerTagLI.setAttribute("class", "nav-" + appName);
+		innerTagLI.setAttribute("folderpos", length.toString());
+		innerTagLI.appendChild(innerTagA);
+
+
+		if (listULElements.childElementCount <= 0) {
+			listULElements.appendChild(innerTagLI);
+			var collapsibleButton = document.getElementById(collapsibleButtonId);
+			collapsibleButton.style.display = '';
+
+			$("#favorites-toggle").addClass('collapsible');
+		} else {
+			listLIElements[listLIElements.length - 1].after(innerTagLI);
 		}
-
-		//list[list.length-1].after(li);
-		//document.getElementById('menu-favorites').classList.toggle('open');
-		//this.QuickSort(list, 0, list.length - 1);
 	}
 
 	OCA.Files = OCA.Files || {};
@@ -155,12 +146,12 @@
 			'shares.link'
 		],
 
-		_extendFileActions: function(fileActions) {
+		_extendFileActions: function (fileActions) {
 			var self = this;
 
 			fileActions.registerAction({
 				name: 'Favorite',
-				displayName: function(context) {
+				displayName: function (context) {
 					var $file = context.$file;
 					var isFavorite = $file.data('favorite') === true;
 
@@ -177,7 +168,7 @@
 				mime: 'all',
 				order: -100,
 				permissions: OC.PERMISSION_NONE,
-				iconClass: function(fileName, context) {
+				iconClass: function (fileName, context) {
 					var $file = context.$file;
 					var isFavorite = $file.data('favorite') === true;
 
@@ -187,7 +178,7 @@
 
 					return 'icon-starred';
 				},
-				actionHandler: function(fileName, context) {
+				actionHandler: function (fileName, context) {
 					var $favoriteMarkEl = context.$file.find('.favorite-mark');
 					var $file = context.$file;
 					var fileInfo = context.fileList.files[$file.index()];
@@ -219,7 +210,7 @@
 						tags,
 						$favoriteMarkEl,
 						isFavorite
-					).then(function(result) {
+					).then(function (result) {
 						context.fileInfoModel.trigger('busy', context.fileInfoModel, false);
 						// response from server should contain updated tags
 						var newTags = result.tags;
@@ -235,10 +226,10 @@
 			});
 		},
 
-		_extendFileList: function(fileList) {
+		_extendFileList: function (fileList) {
 			// extend row prototype
 			var oldCreateRow = fileList._createRow;
-			fileList._createRow = function(fileData) {
+			fileList._createRow = function (fileData) {
 				var $tr = oldCreateRow.apply(this, arguments);
 				var isFavorite = false;
 				if (fileData.tags) {
@@ -253,7 +244,7 @@
 				return $tr;
 			};
 			var oldElementToFile = fileList.elementToFile;
-			fileList.elementToFile = function($el) {
+			fileList.elementToFile = function ($el) {
 				var fileInfo = oldElementToFile.apply(this, arguments);
 				var tags = $el.attr('data-tags');
 				if (_.isUndefined(tags)) {
@@ -266,22 +257,22 @@
 			};
 
 			var oldGetWebdavProperties = fileList._getWebdavProperties;
-			fileList._getWebdavProperties = function() {
+			fileList._getWebdavProperties = function () {
 				var props = oldGetWebdavProperties.apply(this, arguments);
 				props.push(OC.Files.Client.PROPERTY_TAGS);
 				props.push(OC.Files.Client.PROPERTY_FAVORITE);
 				return props;
 			};
 
-			fileList.filesClient.addFileInfoParser(function(response) {
+			fileList.filesClient.addFileInfoParser(function (response) {
 				var data = {};
 				var props = response.propStat[0].properties;
 				var tags = props[OC.Files.Client.PROPERTY_TAGS];
 				var favorite = props[OC.Files.Client.PROPERTY_FAVORITE];
 				if (tags && tags.length) {
-					tags = _.chain(tags).filter(function(xmlvalue) {
+					tags = _.chain(tags).filter(function (xmlvalue) {
 						return (xmlvalue.namespaceURI === OC.Files.Client.NS_OWNCLOUD && xmlvalue.nodeName.split(':')[1] === 'tag');
-					}).map(function(xmlvalue) {
+					}).map(function (xmlvalue) {
 						return xmlvalue.textContent || xmlvalue.text;
 					}).value();
 				}
@@ -296,7 +287,7 @@
 			});
 		},
 
-		attach: function(fileList) {
+		attach: function (fileList) {
 			if (this.allowedLists.indexOf(fileList.id) < 0) {
 				return;
 			}
@@ -312,7 +303,7 @@
 		 * @param {Object} $favoriteMarkEl favorite mark element
 		 * @param {boolean} isFavorite Was the item favorited before
 		 */
-		applyFileTags: function(fileName, tagNames, $favoriteMarkEl, isFavorite) {
+		applyFileTags: function (fileName, tagNames, $favoriteMarkEl, isFavorite) {
 			var encodedPath = OC.encodePath(fileName);
 			while (encodedPath[0] === '/') {
 				encodedPath = encodedPath.substr(1);
@@ -325,10 +316,10 @@
 				}),
 				dataType: 'json',
 				type: 'POST'
-			}).fail(function(response) {
+			}).fail(function (response) {
 				var message = '';
 				// show message if it is available
-				if(response.responseJSON && response.responseJSON.message) {
+				if (response.responseJSON && response.responseJSON.message) {
 					message = ': ' + response.responseJSON.message;
 				}
 				OC.Notification.show(t('files', 'An error occurred while trying to update the tags' + message), {type: 'error'});

apps/files/lib/Controller/ApiController.php

@@ -11,7 +11,7 @@
  * @author Roeland Jago Douma <roeland@famdouma.nl>
  * @author Tobias Kaminsky <tobias@kaminsky.me>
  * @author Vincent Petry <pvince81@owncloud.com>
- *
+ * @author Felix Nüsse <felix.nuesse@t-online.de>
  * @license AGPL-3.0
  *
  * This code is free software: you can redistribute it and/or modify
@@ -55,7 +55,7 @@ use Sabre\VObject\Property\Boolean;
 class ApiController extends Controller {
 	/** @var TagService */
 	private $tagService;
-	/** @var IManager **/
+	/** @var IManager * */
 	private $shareManager;
 	/** @var IPreview */
 	private $previewManager;
@@ -108,7 +108,7 @@ class ApiController extends Controller {
 	 * @return DataResponse|FileDisplayResponse
 	 */
 	public function getThumbnail($x, $y, $file) {
-		if($x < 1 || $y < 1) {
+		if ($x < 1 || $y < 1) {
 			return new DataResponse(['message' => 'Requested size must be numeric and a positive value.'], Http::STATUS_BAD_REQUEST);
 		}
 
@@ -199,6 +199,29 @@ class ApiController extends Controller {
 		return new DataResponse(['files' => $files]);
 	}
 
+	/**
+	 * Returns a list of favorites modifed folder.
+	 *
+	 * @NoAdminRequired
+	 *
+	 * @return DataResponse
+	 */
+	public function getFavoritesFolder() {
+		$nodes = $this->userFolder->searchByTag('_$!<Favorite>!$_', $this->userSession->getUser()->getUID());
+
+		$favorites = [];
+		$i = 0;
+		foreach ($nodes as &$node) {
+
+			$favorites[$i]['id'] = $node->getId();
+			$favorites[$i]['name'] = $node->getName();
+			$favorites[$i]['mtime'] = $node->getMTime();
+			$i++;
+		}
+
+		return new DataResponse(['favoriteFolders' => $favorites]);
+	}
+
 	/**
 	 * Return a list of share types for outgoing shares
 	 *
@@ -262,7 +285,7 @@ class ApiController extends Controller {
 	 * @param bool $show
 	 */
 	public function showHiddenFiles($show) {
-		$this->config->setUserValue($this->userSession->getUser()->getUID(), 'files', 'show_hidden', (int) $show);
+		$this->config->setUserValue($this->userSession->getUser()->getUID(), 'files', 'show_hidden', (int)$show);
 		return new Response();
 	}
 
@@ -276,9 +299,21 @@ class ApiController extends Controller {
 	 * @return Response
 	 */
 	public function showQuickAccess($show) {
-		$this->config->setUserValue($this->userSession->getUser()->getUID(), 'files', 'show_Quick_Access', (int) $show);
+		$this->config->setUserValue($this->userSession->getUser()->getUID(), 'files', 'show_Quick_Access', (int)$show);
 		return new Response();
-		}
+	}
+
+	/**
+	 * Toggle default for showing/hiding QuickAccess folder
+	 *
+	 * @NoAdminRequired
+	 *
+	 * @return String
+	 */
+	public function getShowQuickAccess() {
+
+		return $this->config->getUserValue($this->userSession->getUser()->getUID(), 'files', 'show_Quick_Access', 1);
+	}
 
 	/**
 	 * quickaccess-sorting-strategy
@@ -289,7 +324,7 @@ class ApiController extends Controller {
 	 * @return Response
 	 */
 	public function setSortingStrategy($strategy) {
-		$this->config->setUserValue($this->userSession->getUser()->getUID(), 'files', 'quickaccess_sorting_strategy', (String) $strategy);
+		$this->config->setUserValue($this->userSession->getUser()->getUID(), 'files', 'quickaccess_sorting_strategy', (String)$strategy);
 		return new Response();
 	}
 
@@ -313,7 +348,7 @@ class ApiController extends Controller {
 	 * @return Response
 	 */
 	public function setReverseQuickaccess($reverse) {
-		$this->config->setUserValue($this->userSession->getUser()->getUID(), 'files', 'quickaccess_reverse_list', (int) $reverse);
+		$this->config->setUserValue($this->userSession->getUser()->getUID(), 'files', 'quickaccess_reverse_list', (int)$reverse);
 		return new Response();
 	}
 
@@ -325,10 +360,62 @@ class ApiController extends Controller {
 	 * @return bool
 	 */
 	public function getReverseQuickaccess() {
-		if($this->config->getUserValue($this->userSession->getUser()->getUID(), 'files', 'quickaccess_reverse_list', false)){
+		if ($this->config->getUserValue($this->userSession->getUser()->getUID(), 'files', 'quickaccess_reverse_list', false)) {
 			return true;
 		}
 		return false;
 	}
 
+	/**
+	 * Set state for show sorting menu
+	 *
+	 * @NoAdminRequired
+	 *
+	 * @param bool $show
+	 * @return Response
+	 */
+	public function setShowQuickaccessSettings($show) {
+		$this->config->setUserValue($this->userSession->getUser()->getUID(), 'files', 'quickaccess_show_settings', (int)$show);
+		return new Response();
+	}
+
+	/**
+	 * Get state for show sorting menu
+	 *
+	 * @NoAdminRequired
+	 *
+	 * @return bool
+	 */
+	public function getShowQuickaccessSettings() {
+		if ($this->config->getUserValue($this->userSession->getUser()->getUID(), 'files', 'quickaccess_show_settings', false)) {
+			return true;
+		}
+		return false;
+	}
+
+	/**
+	 * Set sorting-order for custom sorting
+	 *
+	 * @NoAdminRequired
+	 *
+	 * @param String $order
+	 * @return Response
+	 */
+	public function setSortingOrder($order) {
+		$this->config->setUserValue($this->userSession->getUser()->getUID(), 'files', 'quickaccess_custom_sorting_order', (String)$order);
+		return new Response();
+	}
+
+	/**
+	 * Get sorting-order for custom sorting
+	 *
+	 * @NoAdminRequired
+	 *
+	 * @param String
+	 * @return String
+	 */
+	public function getSortingOrder() {
+		return $this->config->getUserValue($this->userSession->getUser()->getUID(), 'files', 'quickaccess_custom_sorting_order', "");
+	}
+
 }

apps/files/lib/Controller/ViewController.php

@@ -8,7 +8,7 @@
  * @author Roeland Jago Douma <roeland@famdouma.nl>
  * @author Thomas Müller <thomas.mueller@tmit.eu>
  * @author Vincent Petry <pvince81@owncloud.com>
- * @author Felix Nüsse Petry <felix.nuesse@t-online.de>
+ * @author Felix Nüsse <felix.nuesse@t-online.de>
  *
  * @license AGPL-3.0
  *
@@ -162,16 +162,6 @@ class ViewController extends Controller {
 
 		$user = $this->userSession->getUser()->getUID();
 
-		//Load QuickAccess-Defaults
-		$sorting = $this->config->getUserValue($user, $this->appName, 'quickaccess_sorting_strategy', 'date');
-		$reverseListSetting = $this->config->getUserValue($user, $this->appName, 'quickaccess_reverse_list', 'false');
-		if ($this->config->getUserValue($user, $this->appName, 'show_Quick_Access', true)) {
-			$quickAccessExpandedState = 'true';
-		} else {
-			$quickAccessExpandedState = 'false';
-		}
-
-
 		//Get Favorite-Folder
 		$tagger = \OC::$server->getTagManager();
 		$helper = new \OCA\Files\Activity\Helper($tagger);
@@ -182,71 +172,56 @@ class ViewController extends Controller {
 			$favElements['folders'] = null;
 		}
 
-		$favoritesFolderCount = sizeof($favElements['folders']);
-
 		$collapseClasses = '';
-		if ($favoritesFolderCount > 0) {
+		if (sizeof($favElements['folders']) > 0) {
 			$collapseClasses = 'collapsible';
 		}
 
+		$favoritesSublistArray = Array();
+
+		$navBarPositionPosition = 6;
+		$currentCount = 0;
+		foreach ($favElements['folders'] as $elem) {
+
+			$id = substr($elem, strrpos($elem, '/') + 1, strlen($elem));
+			$link = $this->urlGenerator->linkToRouteAbsolute('files.view.index', ['dir' => $elem]);
+			$sortingValue = ++$currentCount;
+
+			$element = [
+				'id' => $id,
+				'href' => $link,
+				'order' => $navBarPositionPosition,
+				'folderPosition' => $sortingValue,
+				'name' => $id,
+				'icon' => 'files',
+				'quickaccesselement' => 'true'
+			];
+
+			array_push($favoritesSublistArray, $element);
+			$navBarPositionPosition++;
+		}
+
+
+		$defaultExpandedState='true';
+		if(!$this->config->getUserValue($this->userSession->getUser()->getUID(), 'files', 'show_Quick_Access', 1)){
+			$defaultExpandedState='false';
+		}
+
 		\OCA\Files\App::getNavigationManager()->add(
 			[
 				'id' => 'favorites',
 				'appname' => 'files',
 				'script' => 'simplelist.php',
 				'classes' => $collapseClasses,
-				'enableQuickaccess' => $quickAccessExpandedState,
-				'quickaccessSortingStrategy' => $sorting,
-				'quickaccessSortingReverse' => $reverseListSetting,
 				'order' => 5,
 				'name' => $this->l10n->t('Favorites'),
-				//If there are zero elements, add ul end tag directly.
-				'favoritescount' => $favoritesFolderCount
+				'sublist' => $favoritesSublistArray,
+				'draggableSublist' => 'false',
+				'defaultExpandedState' => $defaultExpandedState,
+				'enableMenuButton' => 0,
 			]
 		);
 
-
-		//Add Favorite-folder as menuentries, if there are any
-		if ($favoritesFolderCount > 0) {
-
-			$navBarPositionPosition = 6;
-			$currentCount = 0;
-			foreach ($favElements['folders'] as $elem) {
-
-				$id = substr($elem, strrpos($elem, '/') + 1, strlen($elem));
-				$link = $this->urlGenerator->linkToRouteAbsolute('files.view.index', ['dir' => $elem]);
-
-				$sortingValue = ++$currentCount;
-				if ($currentCount != $favoritesFolderCount) {
-					\OCA\Files\App::getNavigationManager()->add(
-						[
-							'id' => $id,
-							'href' => $link,
-							'order' => $navBarPositionPosition,
-							'folderPosition' => $sortingValue,
-							'name' => $id,
-							'icon' => 'files',
-							'quickaccesselement' => 'true'
-						]
-					);
-				} else {
-					\OCA\Files\App::getNavigationManager()->add(
-						[
-							'id' => $id,
-							'href' => $link,
-							'order' => $navBarPositionPosition,
-							'folderPosition' => $sortingValue,
-							'name' => $id,
-							'icon' => 'files',
-							'quickaccesselement' => 'last'
-						]
-					);
-				}
-				$navBarPositionPosition++;
-			}
-		}
-
-
 		$navItems = \OCA\Files\App::getNavigationManager()->getAll();
 		usort($navItems, function ($item1, $item2) {
 			return $item1['order'] - $item2['order'];

apps/files/templates/appnavigation.php

@@ -1,71 +1,18 @@
 <div id="app-navigation">
 	<ul class="with-icon">
 
-		<?php $pinned = 0 ?>
-		<?php foreach ($_['navigationItems'] as $item) {
-			strpos($item['classes'], 'pinned')!==false ? $pinned++ : '';
-			?>
-
-			<li data-id="<?php p(isset($item['href']) ? $item['href'] : $item['id']) ?>"
-				class="nav-<?php p($item['id']) ?> <?php p($item['classes']) ?> <?php p($pinned===1?'first-pinned':'') ?> <?php if ($item['enableQuickaccess'] === 'true') { ?> open<?php } ?>"
-				<?php if (isset($item['folderPosition'])){ ?> folderPos="<?php p($item['folderPosition']);?>"<?php } ?>
-				<?php if ($item['id'] === 'favorites'){?>id="favorites-toggle"<?php } ?>>
-
-				<?php if ($item['id'] ===  'favorites'){?>
-				<button id="button-collapseQuickAccess" class="collapse" <?php if ($item['favoritescount'] === 0){ ?> style="display: none"<?php } ?>></button><?php } ?>
+		<?php
 
-				<a href="<?php p(isset($item['href']) ? $item['href'] : '#') ?>"
-				   class="nav-icon-<?php p($item['icon'] !== '' ? $item['icon'] : $item['id']) ?> svg"><?php p($item['name']);?></a>
-				<?php if ($item['id'] === 'favorites') {?>
-					<div id="quickaccessbutton" class="app-navigation-entry-utils" <?php if ($item['favoritescount'] === 0) { ?> style="display: none"<?php } ?>>
-						<ul>
-							<li class="app-navigation-entry-utils-menu-button svg">
-								<button id="button-<?php p($item['id']) ?>"></button>
-							</li>
-						</ul>
-					</div>
-				<div class="app-navigation-entry-menu" id="menu-<?php p($item['id']) ?>">
-					<ul>
-						<li>
-							<span class="menuitem">
-								<input id="enableQuickAccess" type="checkbox" class="checkbox"  <?php if($item['enableQuickaccess']=='true'){ ?> checked<?php } ?>/>
-								<label for="enableQuickAccess"><?php p($l->t('Enable Quickaccess')); ?></label>
-							</span>
-						</li>
-						<li>
-							<span class="menuitem">
-								<input id="sortByAlphabet" type="checkbox" class="checkbox" data-group='SortingStrategy'<?php if($item['quickaccessSortingStrategy']=='alphabet'){ ?> checked<?php } ?>/>
-								<label for="sortByAlphabet"><?php p($l->t('Sort by Alphabet')); ?></label>
-							</span>
-						</li>
-						<li>
-							<span class="menuitem">
-								<input id="sortByDate" type="checkbox" class="checkbox" data-group='SortingStrategy'<?php if($item['quickaccessSortingStrategy']=='date'){ ?> checked<?php } ?>/>
-								<label for="sortByDate"><?php p($l->t('Sort by Date')); ?></label>
-							</span>
-						</li>
-						<li>
-							<span class="menuitem">
-								<input id="enableReverse" type="checkbox" class="checkbox" <?php if($item['quickaccessSortingReverse']==true){ ?> checked<?php } ?>/>
-								<label for="enableReverse"><?php p($l->t('Reverse List')); ?></label>
-							</span>
-						</li>
-					</ul>
-				</div>
-					<ul id="quickaccess-list" >
-					<?php /*This fixes the styleerrors if no favorites are set*/ if ($item['favoritescount'] === 0) {?></ul><?php } ?>
-				<?php } ?>
-
-				<?php if ($item['quickaccesselement'] === 'last') {?>
-				</ul>
-				<?php } ?>
-			</li>
+		$pinned = 0;
+		foreach ($_['navigationItems'] as $item) {
+			$pinned = NavigationListElements($item, $pinned, $l);
+		}
+		?>
 
-		<?php } ?>
-
-		<li id="quota" class="pinned <?php p($pinned===0?'first-pinned ':'') ?><?php
-		if ($_['quota'] !== \OCP\Files\FileInfo::SPACE_UNLIMITED) {
-		?>has-tooltip" title="<?php p($_['usage_relative'] . '%');
+		<li id="quota"
+			class="pinned <?php p($pinned === 0 ? 'first-pinned ' : '') ?><?php
+			if ($_['quota'] !== \OCP\Files\FileInfo::SPACE_UNLIMITED) {
+			?>has-tooltip" title="<?php p($_['usage_relative'] . '%');
 		} ?>">
 			<a href="#" class="icon-quota svg">
 				<p id="quotatext"><?php
@@ -75,27 +22,103 @@
 						p($l->t('%s used', [$_['usage']]));
 					} ?></p>
 				<div class="quota-container">
-					<progress value="<?php p($_['usage_relative']); ?>" max="100"
-						<?php if($_['usage_relative'] > 80): ?> class="warn" <?php endif; ?>></progress>
+					<progress value="<?php p($_['usage_relative']); ?>"
+							  max="100"
+						<?php if ($_['usage_relative'] > 80): ?> class="warn" <?php endif; ?>></progress>
 				</div>
 			</a>
 		</li>
 	</ul>
 	<div id="app-settings">
 		<div id="app-settings-header">
-			<button class="settings-button" data-apps-slide-toggle="#app-settings-content">
-				<?php p($l->t('Settings'));?>
+			<button class="settings-button"
+					data-apps-slide-toggle="#app-settings-content">
+				<?php p($l->t('Settings')); ?>
 			</button>
 		</div>
 		<div id="app-settings-content">
 			<div id="files-setting-showhidden">
-				<input class="checkbox" id="showhiddenfilesToggle" checked="checked" type="checkbox">
+				<input class="checkbox" id="showhiddenfilesToggle"
+					   checked="checked" type="checkbox">
 				<label for="showhiddenfilesToggle"><?php p($l->t('Show hidden files')); ?></label>
 			</div>
-			<label for="webdavurl"><?php p($l->t('WebDAV'));?></label>
-			<input id="webdavurl" type="text" readonly="readonly" value="<?php p(\OCP\Util::linkToRemote('webdav')); ?>" />
-			<em><?php print_unescaped($l->t('Use this address to <a href="%s" target="_blank" rel="noreferrer noopener">access your Files via WebDAV</a>', array(link_to_docs('user-webdav'))));?></em>
+			<label for="webdavurl"><?php p($l->t('WebDAV')); ?></label>
+			<input id="webdavurl" type="text" readonly="readonly"
+				   value="<?php p(\OCP\Util::linkToRemote('webdav')); ?>"/>
+			<em><?php print_unescaped($l->t('Use this address to <a href="%s" target="_blank" rel="noreferrer noopener">access your Files via WebDAV</a>', array(link_to_docs('user-webdav')))); ?></em>
 		</div>
 	</div>
 
 </div>
+
+
+<?php
+
+/**
+ * Prints the HTML for a single Entry.
+ *
+ * @param $item The item to be added
+ * @param $pinned IntegerValue to count the pinned entries at the bottom
+ * @param $l Translator
+ *
+ * @return int Returns the pinned value
+ */
+function NavigationListElements($item, $pinned, $l) {
+	strpos($item['classes'], 'pinned') !== false ? $pinned++ : '';
+	?>
+	<li <?php if (isset($item['sublist'])){ ?>id="button-collapse-parent-<?php p($item['id']); ?>"<?php } ?>
+		data-id="<?php p(isset($item['href']) ? $item['href'] : $item['id']) ?> "
+		class="nav-<?php p($item['id']) ?> <?php p($item['classes']) ?> <?php p($pinned === 1 ? 'first-pinned' : '') ?> <?php if ($item['defaultExpandedState'] === 'true') { ?> open<?php } ?>"
+		<?php if (isset($item['folderPosition'])) { ?> folderPos="<?php p($item['folderPosition']); ?>" <?php } ?>>
+
+		<a href="<?php p(isset($item['href']) ? $item['href'] : '#') ?>"
+		   class="nav-icon-<?php p($item['icon'] !== '' ? $item['icon'] : $item['id']) ?> svg"><?php p($item['name']); ?></a>
+
+
+		<?php
+		NavigationElementMenu($item);
+		if (isset($item['sublist'])) {
+			?>
+			<button id="button-collapse-<?php p($item['id']); ?>"
+					class="collapse"></button>
+			<ul id="sublist-<?php p($item['id']); ?>" <?php if ($item['draggableSublist'] === 'true') { ?> draggable="true"<?php } ?>>
+				<?php
+				foreach ($item['sublist'] as $item) {
+					$pinned = NavigationListElements($item, $pinned, $l);
+				}
+				?>
+			</ul>
+		<?php } ?>
+	</li>
+
+
+	<?php
+	return $pinned;
+}
+
+/**
+ * Prints the HTML for a dotmenu.
+ *
+ * @param $item The item to be added
+ *
+ * @return void
+ */
+function NavigationElementMenu($item) {
+	if ($item['menubuttons'] === 'true') {
+		?>
+		<div id="dotmenu-<?php p($item['id']); ?>"
+			 class="app-navigation-entry-utils" <?php if ($item['enableMenuButton'] === 0) { ?> style="display: none"<?php } ?>>
+			<ul>
+				<li class="app-navigation-entry-utils-menu-button svg">
+					<button id="dotmenu-button-<?php p($item['id']) ?>"></button>
+				</li>
+			</ul>
+		</div>
+		<div id="dotmenu-content-<?php p($item['id']) ?>"
+			 class="app-navigation-entry-menu">
+			<ul>
+
+			</ul>
+		</div>
+	<?php }
+}

core/css/apps.scss

@@ -584,24 +584,6 @@ kbd {
 	.app-navigation-entry-menu ul {
 		list-style-type: none;
 	}
-
-	.app-navigation-caption {
-		font-weight: bold;
-		line-height: 44px;
-		white-space: nowrap;
-		text-overflow: ellipsis;
-		float: left;
-		margin-left:10px;
-		margin-top:10px;
-		margin-bottom:10px;
-		//Make the Link in the spacer not selectable and prevent mouseevents
-		-moz-user-select: -moz-none;
-		-khtml-user-select: none;
-		-webkit-user-select: none;
-		-o-user-select: none;
-		user-select: none;
-		pointer-events:none;
-	}
 }
 
 /* APP-CONTENT ---------------------------------------------------------------*/