From 1a65d09f708f35e9c38e4e75564f5ac54b136f22 Mon Sep 17 00:00:00 2001 From: Remco Brenninkmeijer Date: Tue, 8 Jul 2014 19:52:28 +0200 Subject: [PATCH 1/9] Changed default sorting except for names. --- apps/files/js/filelist.js | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/apps/files/js/filelist.js b/apps/files/js/filelist.js index 3e311655c9..9f43045d50 100644 --- a/apps/files/js/filelist.js +++ b/apps/files/js/filelist.js @@ -369,7 +369,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(); } From 742589fe01259331baee53e6a5bb3be34a9c8e61 Mon Sep 17 00:00:00 2001 From: Remco Brenninkmeijer Date: Wed, 16 Jul 2014 21:52:08 +0200 Subject: [PATCH 2/9] Show sorting icons when hovering over --- apps/files/css/files.css | 14 +++++++++----- apps/files/js/filelist.js | 25 ++++++++++++++++++------- 2 files changed, 27 insertions(+), 12 deletions(-) diff --git a/apps/files/css/files.css b/apps/files/css/files.css index 287dedc23f..f5fe6819e1 100644 --- a/apps/files/css/files.css +++ b/apps/files/css/files.css @@ -99,7 +99,7 @@ } #filestable tbody tr { background-color:#fff; height:40px; } -#filestable tbody tr:hover, tbody tr:active { +#filestable tbody tr:hover, tbody tr:active , tbody th:hover, tbody th:active { background-color: rgb(240,240,240); } #filestable tbody tr.selected { @@ -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; diff --git a/apps/files/js/filelist.js b/apps/files/js/filelist.js index 9f43045d50..12af559389 100644 --- a/apps/files/js/filelist.js +++ b/apps/files/js/filelist.js @@ -20,7 +20,7 @@ FileList.prototype = { SORT_INDICATOR_ASC_CLASS: 'icon-triangle-s', SORT_INDICATOR_DESC_CLASS: 'icon-triangle-n', - + id: 'files', appName: t('files', 'Files'), isEmpty: true, @@ -380,7 +380,7 @@ } }, - /** + /** * Event handler when clicking on a bread crumb */ _onClickBreadCrumb: function(e) { @@ -908,21 +908,32 @@ * @param sort sort attribute name * @param direction sort direction, one of "asc" or "desc" */ - setSort: function(sort, direction) { + setSort: function(sort, direction, show) { var comparator = FileList.Comparators[sort] || FileList.Comparators.name; - this._sort = sort; + this._show = true; + 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); - this.$el.find('thead th.column-' + sort + ' .sort-indicator') - .addClass(direction === 'desc' ? this.SORT_INDICATOR_DESC_CLASS : this.SORT_INDICATOR_ASC_CLASS); + .removeClass(this.SORT_INDICATOR_ASC_CLASS) + .removeClass(this.SORT_INDICATOR_DESC_CLASS) + .toggleClass('hidden', !show) + .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', show) + .addClass(direction === 'desc' ? this.SORT_INDICATOR_DESC_CLASS : this.SORT_INDICATOR_ASC_CLASS); }, + + /** * Reloads the file list using ajax call * From c8c00d27c4240b4067594316b4657fde9a338e28 Mon Sep 17 00:00:00 2001 From: Remco Brenninkmeijer Date: Wed, 16 Jul 2014 22:08:03 +0200 Subject: [PATCH 3/9] Cleanup of unnecesary addition --- apps/files/css/files.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/apps/files/css/files.css b/apps/files/css/files.css index f5fe6819e1..1437b141f5 100644 --- a/apps/files/css/files.css +++ b/apps/files/css/files.css @@ -99,7 +99,7 @@ } #filestable tbody tr { background-color:#fff; height:40px; } -#filestable tbody tr:hover, tbody tr:active , tbody th:hover, tbody th:active { +#filestable tbody tr:hover, tbody tr:active { background-color: rgb(240,240,240); } #filestable tbody tr.selected { From e307572e8db487461a659fc0191256b2452f799e Mon Sep 17 00:00:00 2001 From: Remco Brenninkmeijer Date: Wed, 16 Jul 2014 22:53:14 +0200 Subject: [PATCH 4/9] Fixed comments from PVince81 --- apps/files/js/filelist.js | 11 +++++------ 1 file changed, 5 insertions(+), 6 deletions(-) diff --git a/apps/files/js/filelist.js b/apps/files/js/filelist.js index 12af559389..67a3de9a5b 100644 --- a/apps/files/js/filelist.js +++ b/apps/files/js/filelist.js @@ -369,7 +369,7 @@ this.setSort(sort, (this._sortDirection === 'desc')?'asc':'desc'); } else { - if ( sort == 'name' ) { //default sorting of name is opposite to size and mtime + if ( sort === 'name' ) { //default sorting of name is opposite to size and mtime this.setSort(sort, 'asc'); } else { @@ -908,10 +908,9 @@ * @param sort sort attribute name * @param direction sort direction, one of "asc" or "desc" */ - setSort: function(sort, direction, show) { + setSort: function(sort, direction ) { var comparator = FileList.Comparators[sort] || FileList.Comparators.name; - this._show = true; - this._sort = sort; + this._sort = sort; this._sortDirection = (direction === 'desc')?'desc':'asc'; this._sortComparator = comparator; @@ -923,13 +922,13 @@ this.$el.find('thead th .sort-indicator') .removeClass(this.SORT_INDICATOR_ASC_CLASS) .removeClass(this.SORT_INDICATOR_DESC_CLASS) - .toggleClass('hidden', !show) + .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', show) + .toggleClass('hidden', false) .addClass(direction === 'desc' ? this.SORT_INDICATOR_DESC_CLASS : this.SORT_INDICATOR_ASC_CLASS); }, From 616c5b26815009a7ef47f0c76fedc6a3fc8cc618 Mon Sep 17 00:00:00 2001 From: Remco Brenninkmeijer Date: Thu, 17 Jul 2014 12:48:50 +0200 Subject: [PATCH 5/9] Corrected (Netbeans?) inserted spaces --- apps/files/css/files.css | 2 +- apps/files/js/filelist.js | 32 ++++++++++++++++---------------- 2 files changed, 17 insertions(+), 17 deletions(-) diff --git a/apps/files/css/files.css b/apps/files/css/files.css index 1437b141f5..a816d55f10 100644 --- a/apps/files/css/files.css +++ b/apps/files/css/files.css @@ -161,7 +161,7 @@ table th .sort-indicator { display: inline-block; } table th:hover .sort-indicator.hidden { - width: 10px; + width: 10px; height: 8px; margin-left: 10px; visibility: visible; diff --git a/apps/files/js/filelist.js b/apps/files/js/filelist.js index 67a3de9a5b..a001475d1f 100644 --- a/apps/files/js/filelist.js +++ b/apps/files/js/filelist.js @@ -20,7 +20,7 @@ FileList.prototype = { SORT_INDICATOR_ASC_CLASS: 'icon-triangle-s', SORT_INDICATOR_DESC_CLASS: 'icon-triangle-n', - + id: 'files', appName: t('files', 'Files'), isEmpty: true, @@ -380,7 +380,7 @@ } }, - /** + /** * Event handler when clicking on a bread crumb */ _onClickBreadCrumb: function(e) { @@ -908,31 +908,31 @@ * @param sort sort attribute name * @param direction sort direction, one of "asc" or "desc" */ - setSort: function(sort, direction ) { + setSort: function(sort, direction) { var comparator = FileList.Comparators[sort] || FileList.Comparators.name; 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) - .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); + .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 * From 4f747aaa7adc7739b17f20e962dc434ec239341e Mon Sep 17 00:00:00 2001 From: Remco Brenninkmeijer Date: Thu, 17 Jul 2014 13:05:58 +0200 Subject: [PATCH 6/9] While busy cleaning, also removed extra enters --- apps/files/css/files.css | 2 -- apps/files/js/filelist.js | 1 - 2 files changed, 3 deletions(-) diff --git a/apps/files/css/files.css b/apps/files/css/files.css index a816d55f10..4a8bd5bb30 100644 --- a/apps/files/css/files.css +++ b/apps/files/css/files.css @@ -371,7 +371,6 @@ table td.filename .uploadtext { left: 18px; } - #fileList tr td.filename { position: relative; width: 100%; @@ -436,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 a001475d1f..5726dd1b29 100644 --- a/apps/files/js/filelist.js +++ b/apps/files/js/filelist.js @@ -932,7 +932,6 @@ .addClass(direction === 'desc' ? this.SORT_INDICATOR_DESC_CLASS : this.SORT_INDICATOR_ASC_CLASS); }, - /** * Reloads the file list using ajax call * From d0cd4d5ad9706e6d392420de7eae48cb8bc7356c Mon Sep 17 00:00:00 2001 From: Remco Brenninkmeijer Date: Thu, 17 Jul 2014 20:27:55 +0200 Subject: [PATCH 7/9] Adjusted tests for new default sorting --- apps/files/tests/js/filelistSpec.js | 57 ++++++++++++++++++----------- 1 file changed, 35 insertions(+), 22 deletions(-) diff --git a/apps/files/tests/js/filelistSpec.js b/apps/files/tests/js/filelistSpec.js index ae22ae0123..0580177c5f 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) - ).toEqual(false); - expect( - fileList.$el.find('.column-size .sort-indicator').hasClass(ASC_CLASS) + fileList.$el.find('.column-name .sort-indicator').hasClass('hidden') ).toEqual(true); - - // click again on size column, reverses direction - fileList.$el.find('.column-size .columntitle').click(); + // 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(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('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('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); }); }); /** From 3ebcc29ee35b9015686153d818c71495c5123fe1 Mon Sep 17 00:00:00 2001 From: Remco Brenninkmeijer Date: Thu, 17 Jul 2014 21:31:54 +0200 Subject: [PATCH 8/9] Before I get spanked ;) --- apps/files/js/filelist.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/apps/files/js/filelist.js b/apps/files/js/filelist.js index 5726dd1b29..a00e2f63c4 100644 --- a/apps/files/js/filelist.js +++ b/apps/files/js/filelist.js @@ -369,7 +369,7 @@ this.setSort(sort, (this._sortDirection === 'desc')?'asc':'desc'); } else { - if ( sort === 'name' ) { //default sorting of name is opposite to size and mtime + if ( sort === 'name' ) { //default sorting of name is opposite to size and mtime this.setSort(sort, 'asc'); } else { From 319caa708928dcb77031dd96f997fbb9b5f3bf44 Mon Sep 17 00:00:00 2001 From: Remco Brenninkmeijer Date: Mon, 21 Jul 2014 23:07:52 +0200 Subject: [PATCH 9/9] Sorting triangles pointing up for ascending, down for descending --- apps/files/js/filelist.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/apps/files/js/filelist.js b/apps/files/js/filelist.js index a00e2f63c4..3c607c5b05 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'),