From c0b930ad31a09816ae05816aeee4b678f5cc5574 Mon Sep 17 00:00:00 2001 From: Paul Neubauer Date: Wed, 24 Aug 2022 11:07:57 +0200 Subject: [PATCH 1/9] Extend keyboard actions focus --- .../components/FilesList/KeyboardActions.vue | 23 +++++++++++++------ 1 file changed, 16 insertions(+), 7 deletions(-) diff --git a/packages/web-app-files/src/components/FilesList/KeyboardActions.vue b/packages/web-app-files/src/components/FilesList/KeyboardActions.vue index db8cd4924fa..e999bff447e 100644 --- a/packages/web-app-files/src/components/FilesList/KeyboardActions.vue +++ b/packages/web-app-files/src/components/FilesList/KeyboardActions.vue @@ -16,10 +16,10 @@ export default defineComponent({ type: Array, required: true }, - keybindOnElementId: { - type: String, + keybindOnElementIds: { + type: Array, required: false, - default: 'files-view' + default: () => ['files', 'web-nav-sidebar'] } }, setup() { @@ -40,10 +40,14 @@ export default defineComponent({ }, mounted() { - const filesList = document.getElementById(this.keybindOnElementId) - if (filesList) { - filesList.addEventListener('keydown', this.handleShortcut, false) + for(var elementId of this.keybindOnElementIds) { + console.log(elementId) + const element = document.getElementById(elementId) + if (element) { + element.addEventListener('keydown', this.handleShortcut, false) + } } + const fileListClickedEvent = bus.subscribe('app.files.list.clicked', this.resetSelectionCursor) const fileListClickedMetaEvent = bus.subscribe( 'app.files.list.clicked.meta', @@ -58,7 +62,12 @@ export default defineComponent({ bus.unsubscribe('app.files.list.clicked', fileListClickedEvent) bus.unsubscribe('app.files.list.clicked.meta', fileListClickedMetaEvent) bus.unsubscribe('app.files.list.clicked.shift', fileListClickedShiftEvent) - filesList.removeEventListener('keydown', this.handleShortcut) + for(var elementId of this.keybindOnElementIds) { + const element = document.getElementById(elementId) + if (element) { + element.removeEventListener('keydown', this.handleShortcut) + } + } }) }, From 47cee0d5f55ec18c616fa0a5bbc1c56b653a6492 Mon Sep 17 00:00:00 2001 From: Paul Neubauer Date: Wed, 24 Aug 2022 12:41:02 +0200 Subject: [PATCH 2/9] Add global paste shortcut --- .../src/components/FilesList/KeyboardActions.vue | 10 +++++++++- 1 file changed, 9 insertions(+), 1 deletion(-) diff --git a/packages/web-app-files/src/components/FilesList/KeyboardActions.vue b/packages/web-app-files/src/components/FilesList/KeyboardActions.vue index e999bff447e..c07c9180b95 100644 --- a/packages/web-app-files/src/components/FilesList/KeyboardActions.vue +++ b/packages/web-app-files/src/components/FilesList/KeyboardActions.vue @@ -41,12 +41,12 @@ export default defineComponent({ mounted() { for(var elementId of this.keybindOnElementIds) { - console.log(elementId) const element = document.getElementById(elementId) if (element) { element.addEventListener('keydown', this.handleShortcut, false) } } + document.addEventListener('keydown', this.handlePasteShortcut) const fileListClickedEvent = bus.subscribe('app.files.list.clicked', this.resetSelectionCursor) const fileListClickedMetaEvent = bus.subscribe( @@ -68,6 +68,7 @@ export default defineComponent({ element.removeEventListener('keydown', this.handleShortcut) } } + document.removeEventListener('keydown', this.handlePasteShortcut) }) }, @@ -96,6 +97,13 @@ export default defineComponent({ this.handleFileSelectionShortcuts(key, shift, ctrl, event) }, + handlePasteShortcut(event) { + const key = event.keyCode || event.which + const ctrl = window.navigator.platform.match('Mac') ? event.metaKey : event.ctrlKey + const isPasteAction = key === 86 + if (isPasteAction && ctrl) return this.handlePasteAction() + }, + handleFileActionsShortcuts(key, ctrl) { const isCopyAction = key === 67 const isPasteAction = key === 86 From c1dda560241229ade0639933f15b9ea1faf4028e Mon Sep 17 00:00:00 2001 From: Paul Neubauer Date: Wed, 24 Aug 2022 12:47:49 +0200 Subject: [PATCH 3/9] Add changelog, linting, snapshots --- .../unreleased/bugfix-keyboard-not-working-spaces | 6 ++++++ .../src/components/FilesList/KeyboardActions.vue | 6 +++--- .../components/__snapshots__/TrashBin.spec.js.snap | 12 ++++++------ .../views/spaces/__snapshots__/Project.spec.js.snap | 4 ++-- 4 files changed, 17 insertions(+), 11 deletions(-) create mode 100644 changelog/unreleased/bugfix-keyboard-not-working-spaces diff --git a/changelog/unreleased/bugfix-keyboard-not-working-spaces b/changelog/unreleased/bugfix-keyboard-not-working-spaces new file mode 100644 index 00000000000..8a31d30f64f --- /dev/null +++ b/changelog/unreleased/bugfix-keyboard-not-working-spaces @@ -0,0 +1,6 @@ +Bugfix: Paste action (keyboard) not working in project spaces + +We've fixed a bug which caused the user to be unable to paste in project spaces. + +https://github.com/owncloud/web/issues/7510 +https://github.com/owncloud/web/pull/7514 \ No newline at end of file diff --git a/packages/web-app-files/src/components/FilesList/KeyboardActions.vue b/packages/web-app-files/src/components/FilesList/KeyboardActions.vue index c07c9180b95..60759a2c062 100644 --- a/packages/web-app-files/src/components/FilesList/KeyboardActions.vue +++ b/packages/web-app-files/src/components/FilesList/KeyboardActions.vue @@ -40,14 +40,14 @@ export default defineComponent({ }, mounted() { - for(var elementId of this.keybindOnElementIds) { + for (const elementId of this.keybindOnElementIds) { const element = document.getElementById(elementId) if (element) { element.addEventListener('keydown', this.handleShortcut, false) } } document.addEventListener('keydown', this.handlePasteShortcut) - + const fileListClickedEvent = bus.subscribe('app.files.list.clicked', this.resetSelectionCursor) const fileListClickedMetaEvent = bus.subscribe( 'app.files.list.clicked.meta', @@ -62,7 +62,7 @@ export default defineComponent({ bus.unsubscribe('app.files.list.clicked', fileListClickedEvent) bus.unsubscribe('app.files.list.clicked.meta', fileListClickedMetaEvent) bus.unsubscribe('app.files.list.clicked.shift', fileListClickedShiftEvent) - for(var elementId of this.keybindOnElementIds) { + for (const elementId of this.keybindOnElementIds) { const element = document.getElementById(elementId) if (element) { element.removeEventListener('keydown', this.handleShortcut) diff --git a/packages/web-app-files/tests/unit/components/__snapshots__/TrashBin.spec.js.snap b/packages/web-app-files/tests/unit/components/__snapshots__/TrashBin.spec.js.snap index 26b53e8113f..05c7116a478 100644 --- a/packages/web-app-files/tests/unit/components/__snapshots__/TrashBin.spec.js.snap +++ b/packages/web-app-files/tests/unit/components/__snapshots__/TrashBin.spec.js.snap @@ -18,8 +18,8 @@ exports[`Trashbin component when the view is not loading anymore when length of
-
-
file-name-1234 +
+
file-name-1234
file-path @@ -38,8 +38,8 @@ exports[`Trashbin component when the view is not loading anymore when length of
-
-
file-name-5896 +
+
file-name-5896
file-path @@ -58,8 +58,8 @@ exports[`Trashbin component when the view is not loading anymore when length of
-
-
file-name-9856 +
+
file-name-9856
file-path diff --git a/packages/web-app-files/tests/unit/views/spaces/__snapshots__/Project.spec.js.snap b/packages/web-app-files/tests/unit/views/spaces/__snapshots__/Project.spec.js.snap index 526a1830ef8..0cb316849f8 100644 --- a/packages/web-app-files/tests/unit/views/spaces/__snapshots__/Project.spec.js.snap +++ b/packages/web-app-files/tests/unit/views/spaces/__snapshots__/Project.spec.js.snap @@ -2,7 +2,7 @@ exports[`Spaces project view space image should show if given 1`] = `
- +
@@ -41,7 +41,7 @@ exports[`Spaces project view space image should show if given 1`] = ` exports[`Spaces project view space readme should show if given 1`] = `
- +
From 3c6190b4ae3fc634c6c8e93423e7b777a2d18b15 Mon Sep 17 00:00:00 2001 From: Paul Neubauer Date: Fri, 26 Aug 2022 10:36:58 +0200 Subject: [PATCH 4/9] Make ctrl+c, +v, +x global --- .../src/components/FilesList/KeyboardActions.vue | 8 ++------ 1 file changed, 2 insertions(+), 6 deletions(-) diff --git a/packages/web-app-files/src/components/FilesList/KeyboardActions.vue b/packages/web-app-files/src/components/FilesList/KeyboardActions.vue index 60759a2c062..a376de66d45 100644 --- a/packages/web-app-files/src/components/FilesList/KeyboardActions.vue +++ b/packages/web-app-files/src/components/FilesList/KeyboardActions.vue @@ -93,22 +93,18 @@ export default defineComponent({ const ctrl = window.navigator.platform.match('Mac') ? event.metaKey : event.ctrlKey const shift = event.shiftKey - this.handleFileActionsShortcuts(key, ctrl) this.handleFileSelectionShortcuts(key, shift, ctrl, event) }, handlePasteShortcut(event) { const key = event.keyCode || event.which const ctrl = window.navigator.platform.match('Mac') ? event.metaKey : event.ctrlKey - const isPasteAction = key === 86 - if (isPasteAction && ctrl) return this.handlePasteAction() - }, - - handleFileActionsShortcuts(key, ctrl) { const isCopyAction = key === 67 const isPasteAction = key === 86 const isCutAction = key === 88 + const isTextSelected = window.getSelection().type === 'Range' + if(isTextSelected) return if (isCopyAction && ctrl) return this.copySelectedFiles() if (isPasteAction && ctrl) return this.handlePasteAction() if (isCutAction && ctrl) return this.cutSelectedFiles() From ccb0b6b5aad4f654a65cef718cb18fec232ea715 Mon Sep 17 00:00:00 2001 From: Paul Neubauer Date: Fri, 26 Aug 2022 10:39:02 +0200 Subject: [PATCH 5/9] Linting --- .../web-app-files/src/components/FilesList/KeyboardActions.vue | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/web-app-files/src/components/FilesList/KeyboardActions.vue b/packages/web-app-files/src/components/FilesList/KeyboardActions.vue index a376de66d45..29ddce60530 100644 --- a/packages/web-app-files/src/components/FilesList/KeyboardActions.vue +++ b/packages/web-app-files/src/components/FilesList/KeyboardActions.vue @@ -104,7 +104,7 @@ export default defineComponent({ const isCutAction = key === 88 const isTextSelected = window.getSelection().type === 'Range' - if(isTextSelected) return + if (isTextSelected) return if (isCopyAction && ctrl) return this.copySelectedFiles() if (isPasteAction && ctrl) return this.handlePasteAction() if (isCutAction && ctrl) return this.cutSelectedFiles() From 87ade019eed787c1709be151746b551560da5604 Mon Sep 17 00:00:00 2001 From: Paul Neubauer Date: Fri, 26 Aug 2022 11:30:12 +0200 Subject: [PATCH 6/9] Refactor function names --- .../src/components/FilesList/KeyboardActions.vue | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/packages/web-app-files/src/components/FilesList/KeyboardActions.vue b/packages/web-app-files/src/components/FilesList/KeyboardActions.vue index 29ddce60530..1d0a13c3aff 100644 --- a/packages/web-app-files/src/components/FilesList/KeyboardActions.vue +++ b/packages/web-app-files/src/components/FilesList/KeyboardActions.vue @@ -43,10 +43,10 @@ export default defineComponent({ for (const elementId of this.keybindOnElementIds) { const element = document.getElementById(elementId) if (element) { - element.addEventListener('keydown', this.handleShortcut, false) + element.addEventListener('keydown', this.handleSelectionShortcuts, false) } } - document.addEventListener('keydown', this.handlePasteShortcut) + document.addEventListener('keydown', this.handleClipboardShortcuts) const fileListClickedEvent = bus.subscribe('app.files.list.clicked', this.resetSelectionCursor) const fileListClickedMetaEvent = bus.subscribe( @@ -65,10 +65,10 @@ export default defineComponent({ for (const elementId of this.keybindOnElementIds) { const element = document.getElementById(elementId) if (element) { - element.removeEventListener('keydown', this.handleShortcut) + element.removeEventListener('keydown', this.handleSelectionShortcuts) } } - document.removeEventListener('keydown', this.handlePasteShortcut) + document.removeEventListener('keydown', this.handleClipboardShortcuts) }) }, @@ -88,7 +88,7 @@ export default defineComponent({ addFileSelection: 'ADD_FILE_SELECTION' }), - handleShortcut(event) { + handleSelectionShortcuts(event) { const key = event.keyCode || event.which const ctrl = window.navigator.platform.match('Mac') ? event.metaKey : event.ctrlKey const shift = event.shiftKey @@ -96,7 +96,7 @@ export default defineComponent({ this.handleFileSelectionShortcuts(key, shift, ctrl, event) }, - handlePasteShortcut(event) { + handleClipboardShortcuts(event) { const key = event.keyCode || event.which const ctrl = window.navigator.platform.match('Mac') ? event.metaKey : event.ctrlKey const isCopyAction = key === 67 From da59af8e6c7bf611131b1a8f5100d5142db5de78 Mon Sep 17 00:00:00 2001 From: Paul Neubauer Date: Fri, 26 Aug 2022 11:47:33 +0200 Subject: [PATCH 7/9] Update snapshot --- .../components/__snapshots__/TrashBin.spec.js.snap | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/packages/web-app-files/tests/unit/components/__snapshots__/TrashBin.spec.js.snap b/packages/web-app-files/tests/unit/components/__snapshots__/TrashBin.spec.js.snap index 05c7116a478..26b53e8113f 100644 --- a/packages/web-app-files/tests/unit/components/__snapshots__/TrashBin.spec.js.snap +++ b/packages/web-app-files/tests/unit/components/__snapshots__/TrashBin.spec.js.snap @@ -18,8 +18,8 @@ exports[`Trashbin component when the view is not loading anymore when length of
-
-
file-name-1234 +
+
file-name-1234
file-path @@ -38,8 +38,8 @@ exports[`Trashbin component when the view is not loading anymore when length of
-
-
file-name-5896 +
+
file-name-5896
file-path @@ -58,8 +58,8 @@ exports[`Trashbin component when the view is not loading anymore when length of
-
-
file-name-9856 +
+
file-name-9856
file-path From 32793fc772a865a0b866e5a5f855b970e6fab613 Mon Sep 17 00:00:00 2001 From: Paul Neubauer Date: Fri, 26 Aug 2022 14:52:39 +0200 Subject: [PATCH 8/9] Bind files-view instead of files --- .../web-app-files/src/components/FilesList/KeyboardActions.vue | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/web-app-files/src/components/FilesList/KeyboardActions.vue b/packages/web-app-files/src/components/FilesList/KeyboardActions.vue index 1d0a13c3aff..dfd26ff44fc 100644 --- a/packages/web-app-files/src/components/FilesList/KeyboardActions.vue +++ b/packages/web-app-files/src/components/FilesList/KeyboardActions.vue @@ -19,7 +19,7 @@ export default defineComponent({ keybindOnElementIds: { type: Array, required: false, - default: () => ['files', 'web-nav-sidebar'] + default: () => ['files-view', 'web-nav-sidebar'] } }, setup() { From 9142633a2f583425a62b4a0c42c2bc74de7e62a8 Mon Sep 17 00:00:00 2001 From: Paul Neubauer Date: Fri, 26 Aug 2022 15:12:09 +0200 Subject: [PATCH 9/9] Update snapshots --- .../unit/views/spaces/__snapshots__/Project.spec.js.snap | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/web-app-files/tests/unit/views/spaces/__snapshots__/Project.spec.js.snap b/packages/web-app-files/tests/unit/views/spaces/__snapshots__/Project.spec.js.snap index 0cb316849f8..e5af682d58b 100644 --- a/packages/web-app-files/tests/unit/views/spaces/__snapshots__/Project.spec.js.snap +++ b/packages/web-app-files/tests/unit/views/spaces/__snapshots__/Project.spec.js.snap @@ -2,7 +2,7 @@ exports[`Spaces project view space image should show if given 1`] = `
- +
@@ -41,7 +41,7 @@ exports[`Spaces project view space image should show if given 1`] = ` exports[`Spaces project view space readme should show if given 1`] = `
- +