diff options
author | Remco Brenninkmeijer <requist1@starmail.nl> | 2014-07-08 19:52:28 +0200 |
---|---|---|
committer | Vincent Petry <pvince81@owncloud.com> | 2014-07-23 15:54:26 +0200 |
commit | faf0bfb29b6c676d8b1334effba2df01f403c32c (patch) | |
tree | 347c2ca2bec34741b30e5745ea41bf1bda459a70 | |
parent | c7d7ca455a8e885e97824d2de93858fa4245aa6b (diff) | |
download | nextcloud-server-faf0bfb29b6c676d8b1334effba2df01f403c32c.tar.gz nextcloud-server-faf0bfb29b6c676d8b1334effba2df01f403c32c.zip |
Backport of sorting fix from master
Changed default sorting except for names.
Show sorting icons when hovering over
Cleanup of unnecesary addition
Fixed comments from PVince81
Corrected (Netbeans?) inserted spaces
While busy cleaning, also removed extra enters
Adjusted tests for new default sorting
Sorting triangles pointing up for ascending, down for descending
Backport + squash of 1a65d09..319caa7 from master
-rw-r--r-- | apps/files/css/files.css | 14 | ||||
-rw-r--r-- | apps/files/js/filelist.js | 22 | ||||
-rw-r--r-- | apps/files/tests/js/filelistSpec.js | 51 |
3 files changed, 58 insertions, 29 deletions
diff --git a/apps/files/css/files.css b/apps/files/css/files.css index 287dedc23f2..4a8bd5bb30f 100644 --- a/apps/files/css/files.css +++ b/apps/files/css/files.css @@ -152,16 +152,20 @@ table th .columntitle.name { padding-right: 80px; margin-left: 50px; } -/* hover effect on sortable column */ -table th a.columntitle:hover { - color: #000; -} + +.sort-indicator.hidden { visibility: hidden; } table th .sort-indicator { width: 10px; height: 8px; margin-left: 10px; display: inline-block; } +table th:hover .sort-indicator.hidden { + width: 10px; + height: 8px; + margin-left: 10px; + visibility: visible; +} table th, table td { border-bottom:1px solid #ddd; text-align:left; font-weight:normal; } table td { padding: 0 15px; @@ -367,7 +371,6 @@ table td.filename .uploadtext { left: 18px; } - #fileList tr td.filename { position: relative; width: 100%; @@ -432,7 +435,6 @@ a.action>img { margin-bottom: -1px; } - #fileList a.action { display: inline; padding: 18px 8px; diff --git a/apps/files/js/filelist.js b/apps/files/js/filelist.js index 61e73b7bebc..4ff7d0c3fa0 100644 --- a/apps/files/js/filelist.js +++ b/apps/files/js/filelist.js @@ -18,8 +18,8 @@ this.initialize($el, options); }; FileList.prototype = { - SORT_INDICATOR_ASC_CLASS: 'icon-triangle-s', - SORT_INDICATOR_DESC_CLASS: 'icon-triangle-n', + SORT_INDICATOR_ASC_CLASS: 'icon-triangle-n', + SORT_INDICATOR_DESC_CLASS: 'icon-triangle-s', id: 'files', appName: t('files', 'Files'), @@ -371,7 +371,12 @@ this.setSort(sort, (this._sortDirection === 'desc')?'asc':'desc'); } else { - this.setSort(sort, 'asc'); + if ( sort === 'name' ) { //default sorting of name is opposite to size and mtime + this.setSort(sort, 'asc'); + } + else { + this.setSort(sort, 'desc'); + } } this.reload(); } @@ -914,16 +919,25 @@ this._sort = sort; this._sortDirection = (direction === 'desc')?'desc':'asc'; this._sortComparator = comparator; + if (direction === 'desc') { this._sortComparator = function(fileInfo1, fileInfo2) { return -comparator(fileInfo1, fileInfo2); }; } this.$el.find('thead th .sort-indicator') - .removeClass(this.SORT_INDICATOR_ASC_CLASS + ' ' + this.SORT_INDICATOR_DESC_CLASS); + .removeClass(this.SORT_INDICATOR_ASC_CLASS) + .removeClass(this.SORT_INDICATOR_DESC_CLASS) + .toggleClass('hidden', true) + .addClass(this.SORT_INDICATOR_DESC_CLASS); + this.$el.find('thead th.column-' + sort + ' .sort-indicator') + .removeClass(this.SORT_INDICATOR_ASC_CLASS) + .removeClass(this.SORT_INDICATOR_DESC_CLASS) + .toggleClass('hidden', false) .addClass(direction === 'desc' ? this.SORT_INDICATOR_DESC_CLASS : this.SORT_INDICATOR_ASC_CLASS); }, + /** * Reloads the file list using ajax call * diff --git a/apps/files/tests/js/filelistSpec.js b/apps/files/tests/js/filelistSpec.js index ae22ae0123e..0580177c5ff 100644 --- a/apps/files/tests/js/filelistSpec.js +++ b/apps/files/tests/js/filelistSpec.js @@ -1696,7 +1696,7 @@ describe('OCA.Files.FileList tests', function() { var url = fakeServer.requests[0].url; var query = OC.parseQueryString(url.substr(url.indexOf('?') + 1)); expect(query.sort).toEqual('size'); - expect(query.sortdirection).toEqual('asc'); + expect(query.sortdirection).toEqual('desc'); }); it('Toggles sort direction when clicking on already sorted column', function() { fileList.$el.find('.column-name .columntitle').click(); @@ -1710,37 +1710,51 @@ describe('OCA.Files.FileList tests', function() { var ASC_CLASS = fileList.SORT_INDICATOR_ASC_CLASS; var DESC_CLASS = fileList.SORT_INDICATOR_DESC_CLASS; fileList.$el.find('.column-size .columntitle').click(); - // moves triangle to size column + // moves triangle to size column, check indicator on name is hidden expect( - fileList.$el.find('.column-name .sort-indicator').hasClass(ASC_CLASS + ' ' + DESC_CLASS) + fileList.$el.find('.column-name .sort-indicator').hasClass('hidden') + ).toEqual(true); + // check indicator on size is visible and defaults to descending + expect( + fileList.$el.find('.column-size .sort-indicator').hasClass('hidden') ).toEqual(false); expect( - fileList.$el.find('.column-size .sort-indicator').hasClass(ASC_CLASS) + fileList.$el.find('.column-size .sort-indicator').hasClass(DESC_CLASS) ).toEqual(true); // click again on size column, reverses direction fileList.$el.find('.column-size .columntitle').click(); expect( - fileList.$el.find('.column-size .sort-indicator').hasClass(DESC_CLASS) + fileList.$el.find('.column-size .sort-indicator').hasClass('hidden') + ).toEqual(false); + expect( + fileList.$el.find('.column-size .sort-indicator').hasClass(ASC_CLASS) ).toEqual(true); // click again on size column, reverses direction fileList.$el.find('.column-size .columntitle').click(); expect( - fileList.$el.find('.column-size .sort-indicator').hasClass(ASC_CLASS) + fileList.$el.find('.column-size .sort-indicator').hasClass('hidden') + ).toEqual(false); + expect( + fileList.$el.find('.column-size .sort-indicator').hasClass(DESC_CLASS) ).toEqual(true); // click on mtime column, moves indicator there fileList.$el.find('.column-mtime .columntitle').click(); expect( - fileList.$el.find('.column-size .sort-indicator').hasClass(ASC_CLASS + ' ' + DESC_CLASS) + fileList.$el.find('.column-size .sort-indicator').hasClass('hidden') + ).toEqual(true); + expect( + fileList.$el.find('.column-mtime .sort-indicator').hasClass('hidden') ).toEqual(false); expect( - fileList.$el.find('.column-mtime .sort-indicator').hasClass(ASC_CLASS) + fileList.$el.find('.column-mtime .sort-indicator').hasClass(DESC_CLASS) ).toEqual(true); }); it('Uses correct sort comparator when inserting files', function() { testFiles.sort(OCA.Files.FileList.Comparators.size); + testFiles.reverse(); //default is descending // this will make it reload the testFiles with the correct sorting fileList.$el.find('.column-size .columntitle').click(); expect(fakeServer.requests.length).toEqual(1); @@ -1764,17 +1778,16 @@ describe('OCA.Files.FileList tests', function() { etag: '999' }; fileList.add(newFileData); + expect(fileList.findFileEl('Three.pdf').index()).toEqual(0); + expect(fileList.findFileEl('new file.txt').index()).toEqual(1); + expect(fileList.findFileEl('Two.jpg').index()).toEqual(2); + expect(fileList.findFileEl('somedir').index()).toEqual(3); + expect(fileList.findFileEl('One.txt').index()).toEqual(4); expect(fileList.files.length).toEqual(5); expect(fileList.$fileList.find('tr').length).toEqual(5); - expect(fileList.findFileEl('One.txt').index()).toEqual(0); - expect(fileList.findFileEl('somedir').index()).toEqual(1); - expect(fileList.findFileEl('Two.jpg').index()).toEqual(2); - expect(fileList.findFileEl('new file.txt').index()).toEqual(3); - expect(fileList.findFileEl('Three.pdf').index()).toEqual(4); }); it('Uses correct reversed sort comparator when inserting files', function() { testFiles.sort(OCA.Files.FileList.Comparators.size); - testFiles.reverse(); // this will make it reload the testFiles with the correct sorting fileList.$el.find('.column-size .columntitle').click(); expect(fakeServer.requests.length).toEqual(1); @@ -1811,13 +1824,13 @@ describe('OCA.Files.FileList tests', function() { etag: '999' }; fileList.add(newFileData); + expect(fileList.findFileEl('One.txt').index()).toEqual(0); + expect(fileList.findFileEl('somedir').index()).toEqual(1); + expect(fileList.findFileEl('Two.jpg').index()).toEqual(2); + expect(fileList.findFileEl('new file.txt').index()).toEqual(3); + expect(fileList.findFileEl('Three.pdf').index()).toEqual(4); expect(fileList.files.length).toEqual(5); expect(fileList.$fileList.find('tr').length).toEqual(5); - expect(fileList.findFileEl('One.txt').index()).toEqual(4); - expect(fileList.findFileEl('somedir').index()).toEqual(3); - expect(fileList.findFileEl('Two.jpg').index()).toEqual(2); - expect(fileList.findFileEl('new file.txt').index()).toEqual(1); - expect(fileList.findFileEl('Three.pdf').index()).toEqual(0); }); }); /** |