From 98adee557910ec25af8da35c17823e274f1316d5 Mon Sep 17 00:00:00 2001 From: Jan-Christoph Borchardt Date: Tue, 17 Jul 2018 12:04:10 +0200 Subject: [PATCH 01/12] Fix tooltip for More apps showing on focus Signed-off-by: Jan-Christoph Borchardt --- core/css/header.scss | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/core/css/header.scss b/core/css/header.scss index e218f86fa9..349b36ed51 100644 --- a/core/css/header.scss +++ b/core/css/header.scss @@ -490,7 +490,8 @@ nav[role='navigation'] { } li:hover span, - li:focus span { + li:focus span, + li a:focus span { display: inline-block; } From a21be0ad97131b2d9f6cdc1affb2863e9760fa5c Mon Sep 17 00:00:00 2001 From: Jan-Christoph Borchardt Date: Tue, 17 Jul 2018 12:55:54 +0200 Subject: [PATCH 02/12] Show skip navigation links above everything, also on narrow screens Signed-off-by: Jan-Christoph Borchardt --- core/css/header.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/core/css/header.scss b/core/css/header.scss index 349b36ed51..3693dcecb8 100644 --- a/core/css/header.scss +++ b/core/css/header.scss @@ -571,7 +571,7 @@ nav[role='navigation'] { padding: 11px; position: absolute; overflow: hidden; - z-index: 1000; + z-index: 9999; top: -999px; left: 3px; /* Force primary color, otherwise too light focused color */ From 6d083c4de975a4151026c5942d795f9ab299fd92 Mon Sep 17 00:00:00 2001 From: Jan-Christoph Borchardt Date: Tue, 17 Jul 2018 13:10:25 +0200 Subject: [PATCH 03/12] Make left sidebar toggle also work with keyboard Signed-off-by: Jan-Christoph Borchardt --- core/js/js.js | 17 +++++++++++++++-- 1 file changed, 15 insertions(+), 2 deletions(-) diff --git a/core/js/js.js b/core/js/js.js index c1713539f4..699c2667bd 100644 --- a/core/js/js.js +++ b/core/js/js.js @@ -1617,14 +1617,27 @@ function initCore() { maxPosition: 250, minDragDistance: 100 }); - $('#app-content').prepend(''); - $('#app-navigation-toggle').click(function(){ + + $('#app-content').prepend(''); + + var toggleSnapperOnButton = function(){ if(snapper.state().state == 'left'){ snapper.close(); } else { snapper.open('left'); } + }; + + $('#app-navigation-toggle').click(function(){ + toggleSnapperOnButton(); }); + + $('#app-navigation-toggle').keypress(function(e) { + if(e.which == 13) { + toggleSnapperOnButton(); + } + }); + // close sidebar when switching navigation entry var $appNavigation = $('#app-navigation'); $appNavigation.delegate('a, :button', 'click', function(event) { From 9bf4827c1243cd8e869ccace92baf9ae36c64c55 Mon Sep 17 00:00:00 2001 From: Jan-Christoph Borchardt Date: Fri, 20 Jul 2018 12:17:48 +0200 Subject: [PATCH 04/12] Fix visual keyboard tab feedback for avatar / settings icon in header Signed-off-by: Jan-Christoph Borchardt --- core/css/header.scss | 6 +----- 1 file changed, 1 insertion(+), 5 deletions(-) diff --git a/core/css/header.scss b/core/css/header.scss index 3693dcecb8..8df672f0c5 100644 --- a/core/css/header.scss +++ b/core/css/header.scss @@ -348,17 +348,13 @@ nav[role='navigation'] { opacity: 1; /* override icon opacity */ padding-right: 12px; - img { - opacity: .7; - margin-bottom: -2px; - } &:hover, &:focus, &:active { color: var(--color-primary-text); img, #expandDisplayName { - opacity: 1; + opacity: .57 !important; } } From fe38e33d1093c2832e4b5b7049b05c0bf37fffda Mon Sep 17 00:00:00 2001 From: Jan-Christoph Borchardt Date: Fri, 20 Jul 2018 12:18:11 +0200 Subject: [PATCH 05/12] Fix visual keyboard tab feedback for Contacts menu icon in header Signed-off-by: Jan-Christoph Borchardt --- core/css/styles.scss | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/core/css/styles.scss b/core/css/styles.scss index 6ff8d30a59..fec4171452 100644 --- a/core/css/styles.scss +++ b/core/css/styles.scss @@ -866,7 +866,12 @@ span.ui-icon { background-size: 16px 16px; padding: 14px; cursor: pointer; - opacity: .6; + + &:hover, + &:focus, + &:active { + opacity: 1 !important; + } } } From 7f0d60fefcab33c5ed52e1cf338277397f63149e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?John=20Molakvo=C3=A6=20=28skjnldsv=29?= Date: Fri, 20 Jul 2018 20:51:23 +0200 Subject: [PATCH 06/12] Enter key on menu registration MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: John Molakvoæ (skjnldsv) --- core/js/js.js | 14 +++++++++++++- 1 file changed, 13 insertions(+), 1 deletion(-) diff --git a/core/js/js.js b/core/js/js.js index 699c2667bd..015517020b 100644 --- a/core/js/js.js +++ b/core/js/js.js @@ -684,10 +684,15 @@ var OCP = {}, registerMenu: function($toggle, $menuEl, toggle, headerMenu) { var self = this; $menuEl.addClass('menu'); - $toggle.on('click.menu', function(event) { + $toggle.on('click.menu keypress.menu', function(event) { // prevent the link event (append anchor to URL) event.preventDefault(); + // allow enter key as a trigger + if (event.keyCode && event.keyCode !== 13) { + return; + } + if ($menuEl.is(OC._currentMenu)) { self.hideMenus(); return; @@ -1422,7 +1427,14 @@ function initCore() { OC.registerMenu($('#expand'), $('#expanddiv'), false, true); // toggle for menus + //$(document).on('mouseup.closemenus keyup', function(event) { $(document).on('mouseup.closemenus', function(event) { + + // allow enter as a trigger + // if (event.keyCode && event.keyCode !== 13) { + // return; + // } + var $el = $(event.target); if ($el.closest('.menu').length || $el.closest('.menutoggle').length) { // don't close when clicking on the menu directly or a menu toggle From e9581f212671df21e074ab1ddecb4d45d24d242a Mon Sep 17 00:00:00 2001 From: Jan-Christoph Borchardt Date: Fri, 20 Jul 2018 20:42:46 +0200 Subject: [PATCH 07/12] Make Upload entry in +Menu focusable Signed-off-by: Jan-Christoph Borchardt --- apps/files/js/newfilemenu.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/apps/files/js/newfilemenu.js b/apps/files/js/newfilemenu.js index a340b8b621..32720cab99 100644 --- a/apps/files/js/newfilemenu.js +++ b/apps/files/js/newfilemenu.js @@ -15,7 +15,7 @@ var TEMPLATE_MENU = '
    ' + '
  • ' + - '' + + '' + '
    • ' + '{{#each items}}' + '
  • ' + From 3e6ac57abe40075133c43fe36e7124920309e087 Mon Sep 17 00:00:00 2001 From: Jan-Christoph Borchardt Date: Fri, 20 Jul 2018 20:51:28 +0200 Subject: [PATCH 08/12] Add visual feedback for keyboard tab in breadcrumbs Signed-off-by: Jan-Christoph Borchardt --- core/css/styles.scss | 2 ++ 1 file changed, 2 insertions(+) diff --git a/core/css/styles.scss b/core/css/styles.scss index fec4171452..d2288047ae 100644 --- a/core/css/styles.scss +++ b/core/css/styles.scss @@ -1103,6 +1103,8 @@ div.crumb { } } &:hover, &:focus, a:focus, &:active { + opacity: 1; + > a, > span { opacity: .7; From a2ad1b9aa920ce3c07c2a2d1cfb32832a59775b3 Mon Sep 17 00:00:00 2001 From: Jan-Christoph Borchardt Date: Fri, 20 Jul 2018 21:12:40 +0200 Subject: [PATCH 09/12] Fix ability to open file or folder via keyboard, fix #10008 Before, the file or folder was opened when clicking on the name span, but not when clicking on the link that contains the name; clicking on the link highlighted the file and opened the sidebar, just like clicking on the file size or date. Now clicking on the link opens the file or folder, so the unit tests that tested clicks on the link were changed to test clicking on the file size instead. Signed-off-by: Jan-Christoph Borchardt --- apps/files/js/filelist.js | 2 +- apps/files/tests/js/filelistSpec.js | 22 +++++++++++----------- 2 files changed, 12 insertions(+), 12 deletions(-) diff --git a/apps/files/js/filelist.js b/apps/files/js/filelist.js index 18872568ab..1f207a2f72 100644 --- a/apps/files/js/filelist.js +++ b/apps/files/js/filelist.js @@ -678,7 +678,7 @@ this.updateSelectionSummary(); } else { // clicked directly on the name - if (!this._detailsView || $(event.target).is('.nametext') || $(event.target).closest('.nametext').length) { + if (!this._detailsView || $(event.target).is('.nametext, .name') || $(event.target).closest('.nametext').length) { var filename = $tr.attr('data-file'); var renaming = $tr.data('renaming'); if (!renaming) { diff --git a/apps/files/tests/js/filelistSpec.js b/apps/files/tests/js/filelistSpec.js index efaf9968de..754d62204c 100644 --- a/apps/files/tests/js/filelistSpec.js +++ b/apps/files/tests/js/filelistSpec.js @@ -2429,7 +2429,7 @@ describe('OCA.Files.FileList tests', function() { ); fileList.fileActions.setDefault('text/plain', 'Test'); var $tr = fileList.findFileEl('One.txt'); - $tr.find('td.filename>a.name').click(); + $tr.find('td.filesize').click(); expect(actionStub.calledOnce).toEqual(true); expect(updateDetailsViewStub.notCalled).toEqual(true); updateDetailsViewStub.restore(); @@ -2437,14 +2437,14 @@ describe('OCA.Files.FileList tests', function() { it('highlights current file when clicked and updates sidebar', function() { fileList.fileActions.setDefault('text/plain', 'Test'); var $tr = fileList.findFileEl('One.txt'); - $tr.find('td.filename>a.name').click(); + $tr.find('td.filesize').click(); expect($tr.hasClass('highlighted')).toEqual(true); expect(fileList._detailsView.getFileInfo().id).toEqual(1); }); it('keeps the last highlighted file when clicking outside', function() { var $tr = fileList.findFileEl('One.txt'); - $tr.find('td.filename>a.name').click(); + $tr.find('td.filesize').click(); fileList.$el.find('tfoot').click(); @@ -2455,12 +2455,12 @@ describe('OCA.Files.FileList tests', function() { var $tr = fileList.findFileEl('One.txt'); // select - $tr.find('td.filename>a.name').click(); + $tr.find('td.filesize').click(); $tr.find('input:checkbox').click(); expect($tr.hasClass('highlighted')).toEqual(false); // deselect - $tr.find('td.filename>a.name').click(); + $tr.find('td.filesize').click(); $tr.find('input:checkbox').click(); expect($tr.hasClass('highlighted')).toEqual(false); @@ -2470,12 +2470,12 @@ describe('OCA.Files.FileList tests', function() { var $tr = fileList.findFileEl('One.txt'); // select - $tr.find('td.filename>a.name').click(); + $tr.find('td.filesize').click(); fileList.$el.find('.select-all.checkbox').click(); expect($tr.hasClass('highlighted')).toEqual(false); // deselect - $tr.find('td.filename>a.name').click(); + $tr.find('td.filesize').click(); fileList.$el.find('.select-all.checkbox').click(); expect($tr.hasClass('highlighted')).toEqual(false); @@ -2484,7 +2484,7 @@ describe('OCA.Files.FileList tests', function() { it('closes sidebar whenever the currently highlighted file was removed from the list', function() { jQuery.fx.off = true; var $tr = fileList.findFileEl('One.txt'); - $tr.find('td.filename>a.name').click(); + $tr.find('td.filesize').click(); expect($tr.hasClass('highlighted')).toEqual(true); expect(fileList._detailsView.getFileInfo().id).toEqual(1); @@ -2496,7 +2496,7 @@ describe('OCA.Files.FileList tests', function() { }); it('returns the currently selected model instance when calling getModelForFile', function() { var $tr = fileList.findFileEl('One.txt'); - $tr.find('td.filename>a.name').click(); + $tr.find('td.filesize').click(); var model1 = fileList.getModelForFile('One.txt'); var model2 = fileList.getModelForFile('One.txt'); @@ -2511,7 +2511,7 @@ describe('OCA.Files.FileList tests', function() { it('closes the sidebar when switching folders', function() { jQuery.fx.off = true; var $tr = fileList.findFileEl('One.txt'); - $tr.find('td.filename>a.name').click(); + $tr.find('td.filesize').click(); expect($('#app-sidebar').hasClass('disappear')).toEqual(false); fileList.changeDirectory('/another'); @@ -2560,7 +2560,7 @@ describe('OCA.Files.FileList tests', function() { // not set. fileList.fileActions.currentFile = null; var $tr = fileList.findFileEl('One.txt'); - $tr.find('td.filename a.name').click(); + $tr.find('td.filesize').click(); expect(detailsActionStub.calledOnce).toEqual(true); expect(detailsActionStub.getCall(0).args[0]).toEqual('One.txt'); var context = detailsActionStub.getCall(0).args[1]; From d06e00ffe3a6c0660107ce6f4a5766674640610f Mon Sep 17 00:00:00 2001 From: Jan-Christoph Borchardt Date: Sat, 21 Jul 2018 00:06:17 +0200 Subject: [PATCH 10/12] Trigger upload action also with keyboard navigation on enter Signed-off-by: Jan-Christoph Borchardt --- apps/files/js/newfilemenu.js | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/apps/files/js/newfilemenu.js b/apps/files/js/newfilemenu.js index 32720cab99..3581b2cd8f 100644 --- a/apps/files/js/newfilemenu.js +++ b/apps/files/js/newfilemenu.js @@ -235,6 +235,11 @@ items: this._menuItems })); OC.Util.scaleFixForIE8(this.$('.svg')); + + // Trigger upload action also with keyboard navigation on enter + this.$el.find('[for="file_upload_start"]').on('keypress', function() { + $('#file_upload_start').trigger('click'); + }); }, /** From 1cdf808197156b5389444db298f78c5255dd165c Mon Sep 17 00:00:00 2001 From: Kevin Ndung'u Date: Sat, 21 Jul 2018 20:30:58 +0300 Subject: [PATCH 11/12] Trigger upload actions only for Enter & Space keys Signed-off-by: Kevin Ndung'u --- apps/files/js/newfilemenu.js | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/apps/files/js/newfilemenu.js b/apps/files/js/newfilemenu.js index 3581b2cd8f..0ad7312c98 100644 --- a/apps/files/js/newfilemenu.js +++ b/apps/files/js/newfilemenu.js @@ -237,8 +237,10 @@ OC.Util.scaleFixForIE8(this.$('.svg')); // Trigger upload action also with keyboard navigation on enter - this.$el.find('[for="file_upload_start"]').on('keypress', function() { - $('#file_upload_start').trigger('click'); + this.$el.find('[for="file_upload_start"]').on('keyup', function(event) { + if (event.key === " " || event.key === "Enter") { + $('#file_upload_start').trigger('click'); + } }); }, From fe2509231213409238c8243c8211bcab0bc4a00b Mon Sep 17 00:00:00 2001 From: Kevin Ndung'u Date: Mon, 23 Jul 2018 11:17:32 +0300 Subject: [PATCH 12/12] Remove deprecated keyboard events & properties Signed-off-by: Kevin Ndung'u --- core/js/js.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/core/js/js.js b/core/js/js.js index 015517020b..5b5ff6bf3f 100644 --- a/core/js/js.js +++ b/core/js/js.js @@ -684,12 +684,12 @@ var OCP = {}, registerMenu: function($toggle, $menuEl, toggle, headerMenu) { var self = this; $menuEl.addClass('menu'); - $toggle.on('click.menu keypress.menu', function(event) { + $toggle.on('click.menu keyup.menu', function(event) { // prevent the link event (append anchor to URL) event.preventDefault(); // allow enter key as a trigger - if (event.keyCode && event.keyCode !== 13) { + if (event.key && event.key !== "Enter") { return; } @@ -1431,7 +1431,7 @@ function initCore() { $(document).on('mouseup.closemenus', function(event) { // allow enter as a trigger - // if (event.keyCode && event.keyCode !== 13) { + // if (event.key && event.key !== "Enter") { // return; // }