From 3e11337b3b4c36df20d5565d60d05995b0314363 Mon Sep 17 00:00:00 2001
From: Julius Härtl <jus@bitgrid.net>
Date: Thu, 8 Nov 2018 13:30:39 +0100
Subject: Allow sorting in the file picker
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Signed-off-by: Julius Härtl <jus@bitgrid.net>
---
 core/css/styles.scss | 41 +++++++++++++++++++++++++++++++++++++++++
 1 file changed, 41 insertions(+)

(limited to 'core/css')

diff --git a/core/css/styles.scss b/core/css/styles.scss
index 9b7da393698..62d2bb45c96 100644
--- a/core/css/styles.scss
+++ b/core/css/styles.scss
@@ -773,6 +773,47 @@ code {
 		margin-bottom: 50px;
 	}
 	.filelist {
+		thead {
+			tr {
+				border-bottom: 1px solid var(--color-border);
+				background-color: var(--color-main-background);
+				th {
+					width: auto;
+					border: none;
+				}
+			}
+		}
+		th .columntitle {
+			display: block;
+			padding: 15px;
+			height: 50px;
+			box-sizing: border-box;
+			-moz-box-sizing: border-box;
+			vertical-align: middle;
+		}
+		th .columntitle.name {
+			padding-left: 5px;
+			margin-left: 50px;
+		}
+
+		th .sort-indicator {
+			width: 10px;
+			height: 8px;
+			margin-left: 5px;
+			display: inline-block;
+			vertical-align: text-bottom;
+			opacity: .3;
+		}
+		.sort-indicator.hidden,
+		th:hover .sort-indicator.hidden,
+		th:focus .sort-indicator.hidden {
+			visibility: hidden;
+		}
+		th:hover .sort-indicator.hidden,
+		th:focus .sort-indicator.hidden {
+			visibility: visible;
+		}
+
 		td {
 			padding: 14px;
 			border-bottom: 1px solid var(--color-border);
-- 
cgit v1.2.3


From 5e5cced48cc912f3dcd71013483f62dbb56d7362 Mon Sep 17 00:00:00 2001
From: Julius Härtl <jus@bitgrid.net>
Date: Fri, 16 Nov 2018 14:50:40 +0100
Subject: Properly align loading indicator when switching folders
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Signed-off-by: Julius Härtl <jus@bitgrid.net>
---
 core/css/styles.scss  | 2 +-
 core/js/oc-dialogs.js | 9 +++++++--
 2 files changed, 8 insertions(+), 3 deletions(-)

(limited to 'core/css')

diff --git a/core/css/styles.scss b/core/css/styles.scss
index 62d2bb45c96..da270893e66 100644
--- a/core/css/styles.scss
+++ b/core/css/styles.scss
@@ -778,7 +778,7 @@ code {
 				border-bottom: 1px solid var(--color-border);
 				background-color: var(--color-main-background);
 				th {
-					width: auto;
+					width: 80%;
 					border: none;
 				}
 			}
diff --git a/core/js/oc-dialogs.js b/core/js/oc-dialogs.js
index 49bf626ed82..3169dab4b88 100644
--- a/core/js/oc-dialogs.js
+++ b/core/js/oc-dialogs.js
@@ -257,6 +257,7 @@ var OCdialogs = {
 			self.$filePicker.ready(function() {
 				self.$fileListHeader = self.$filePicker.find('.filelist thead tr');
 				self.$filelist = self.$filePicker.find('.filelist tbody');
+				self.$filelistContainer = self.$filePicker.find('.filelist-container');
 				self.$dirTree = self.$filePicker.find('.dirtree');
 				self.$dirTree.on('click', 'div:not(:last-child)', self, function (event) {
 					self._handleTreeListSelect(event, type);
@@ -896,7 +897,9 @@ var OCdialogs = {
 	*/
 	_fillFilePicker:function(dir) {
 		var self = this;
-		this.$filelist.empty().addClass('icon-loading');
+		this.$filelist.empty();
+		this.$filePicker.find('.emptycontent').hide();
+		this.$filelistContainer.addClass('icon-loading');
 		this.$filePicker.data('path', dir);
 		var filter = this.$filePicker.data('mimetype');
 		if (typeof(filter) === "string") {
@@ -952,8 +955,10 @@ var OCdialogs = {
 
 			if (files.length === 0) {
 				self.$filePicker.find('.emptycontent').show();
+				self.$fileListHeader.hide();
 			} else {
 				self.$filePicker.find('.emptycontent').hide();
+				self.$fileListHeader.show();
 			}
 
 			$.each(files, function(idx, entry) {
@@ -993,7 +998,7 @@ var OCdialogs = {
 				self.$filelist.append($row);
 			});
 
-			self.$filelist.removeClass('icon-loading');
+			self.$filelistContainer.removeClass('icon-loading');
 		});
 	},
 	/**
-- 
cgit v1.2.3