diff options
author | Vinicius Reis <vinicius.reis@nextcloud.com> | 2022-07-14 22:14:30 +0300 |
---|---|---|
committer | Vinicius Reis (Rebase PR Action) <luiz.vinicius73@gmail.com> | 2022-07-19 15:05:09 +0300 |
commit | 0f00d51080c423ffa3730b7fca8a8de90227c507 (patch) | |
tree | d4bee0b01b2b84074731035afde88884582178c4 /src | |
parent | 0c570513b0278c139564b035935d9cd32eed013a (diff) |
🚸 (#2381): show menubar when user use tab key to navigate
Signed-off-by: Vinicius Reis <vinicius.reis@nextcloud.com>
Diffstat (limited to 'src')
-rw-r--r-- | src/views/RichWorkspace.vue | 44 |
1 files changed, 39 insertions, 5 deletions
diff --git a/src/views/RichWorkspace.vue b/src/views/RichWorkspace.vue index f2aff22b4..bfca53088 100644 --- a/src/views/RichWorkspace.vue +++ b/src/views/RichWorkspace.vue @@ -41,12 +41,12 @@ :share-token="shareToken" :mime="file.mimetype" :autofocus="autofocus" + :autohide="autohide" active - autohide rich-workspace @ready="ready=true" - @focus="focus=true" - @blur="unfocus" + @focus="onFocus" + @blur="onBlur" @error="reset" /> </div> </template> @@ -78,6 +78,7 @@ export default { loaded: false, ready: false, autofocus: false, + autohide: true, darkTheme: OCA.Accessibility && OCA.Accessibility.theme === 'dark', enabled: OCA.Text.RichWorkspaceEnabled, } @@ -109,14 +110,23 @@ export default { } subscribe('Text::showRichWorkspace', this.showRichWorkspace) subscribe('Text::hideRichWorkspace', this.hideRichWorkspace) + + this.listenKeydownEvents() + }, beforeDestroy() { unsubscribe('Text::showRichWorkspace', this.showRichWorkspace) unsubscribe('Text::hideRichWorkspace', this.hideRichWorkspace) + + this.unlistenKeydownEvents() }, methods: { - unfocus() { - // setTimeout(() => this.focus = false, 2000) + onBlur() { + this.listenKeydownEvents() + }, + onFocus() { + this.focus = true + this.unlistenKeydownEvents() }, reset() { this.file = null @@ -185,6 +195,30 @@ export default { hideRichWorkspace() { this.enabled = false }, + listenKeydownEvents() { + window.addEventListener('keydown', this.onKeydown) + }, + unlistenKeydownEvents() { + clearInterval(this.$_timeoutAutohide) + + window.removeEventListener('keydown', this.onKeydown) + }, + onTimeoutAutohide() { + this.autohide = true + }, + onKeydown(e) { + if (e.key !== 'Tab') { + return + } + + // remove previous timeout + clearInterval(this.$_timeoutAutohide) + + this.autohide = false + + // schedule to normal behaviour + this.$_timeoutAutohide = setTimeout(this.onTimeoutAutohide, 7000) // 7s + }, }, } </script> |