From 71a93b2b435a1747a710a593588c1daec8ef7878 Mon Sep 17 00:00:00 2001 From: syuilo Date: Tue, 18 Sep 2018 12:42:56 +0900 Subject: [PATCH] Refactor & Usability improvements --- src/client/app/common/hotkey.ts | 3 ++- .../views/components/reaction-picker.vue | 18 +++++++++++------- .../desktop/views/components/notes.note.vue | 16 +++++++--------- 3 files changed, 20 insertions(+), 17 deletions(-) diff --git a/src/client/app/common/hotkey.ts b/src/client/app/common/hotkey.ts index 66336fca6..03806fb18 100644 --- a/src/client/app/common/hotkey.ts +++ b/src/client/app/common/hotkey.ts @@ -51,7 +51,8 @@ export default { const actions = getKeyMap(binding.value); - const reservedKeys = concat(actions.map(a => a.patterns.map(p => p.which))); + // flatten + const reservedKeys = concat(concat(actions.map(a => a.patterns.map(p => p.which)))); el.dataset.reservedKeys = reservedKeys.map(key => `'${key}'`).join(' '); diff --git a/src/client/app/common/views/components/reaction-picker.vue b/src/client/app/common/views/components/reaction-picker.vue index 811f82283..ce0d2a8ea 100644 --- a/src/client/app/common/views/components/reaction-picker.vue +++ b/src/client/app/common/views/components/reaction-picker.vue @@ -56,6 +56,12 @@ export default Vue.extend({ type: Boolean, required: false, default: false + }, + + animation: { + type: Boolean, + required: false, + default: true } }, @@ -70,9 +76,7 @@ export default Vue.extend({ keymap(): any { return { 'esc': this.close, - 'enter': this.choose, - 'space': this.choose, - 'plus': this.choose, + 'enter|space|plus': this.choose, 'up': this.focusUp, 'right': this.focusRight, 'down': this.focusDown, @@ -126,7 +130,7 @@ export default Vue.extend({ anime({ targets: this.$refs.backdrop, opacity: 1, - duration: 100, + duration: this.animation ? 100 : 0, easing: 'linear' }); @@ -134,7 +138,7 @@ export default Vue.extend({ targets: this.$refs.popover, opacity: 1, scale: [0.5, 1], - duration: 500 + duration: this.animation ? 500 : 0 }); }); }, @@ -164,7 +168,7 @@ export default Vue.extend({ anime({ targets: this.$refs.backdrop, opacity: 0, - duration: 200, + duration: this.animation ? 200 : 0, easing: 'linear' }); @@ -173,7 +177,7 @@ export default Vue.extend({ targets: this.$refs.popover, opacity: 0, scale: 0.5, - duration: 200, + duration: this.animation ? 200 : 0, easing: 'easeInBack', complete: () => { this.$emit('closed'); diff --git a/src/client/app/desktop/views/components/notes.note.vue b/src/client/app/desktop/views/components/notes.note.vue index 26f6ef455..18a1ce9e5 100644 --- a/src/client/app/desktop/views/components/notes.note.vue +++ b/src/client/app/desktop/views/components/notes.note.vue @@ -113,14 +113,11 @@ export default Vue.extend({ computed: { keymap(): any { return { - 'r': this.reply, - 'a': () => this.react(true), - 'plus': () => this.react(true), - 'n': this.renote, - 'up': this.focusBefore, - 'shift+tab': this.focusBefore, - 'down': this.focusAfter, - 'tab': this.focusAfter, + 'r|left': this.reply, + 'a|plus': () => this.react(true), + 'n|right': this.renote, + 'up|shift+tab': this.focusBefore, + 'down|tab': this.focusAfter, }; }, @@ -250,7 +247,8 @@ export default Vue.extend({ (this as any).os.new(MkReactionPicker, { source: this.$refs.reactButton, note: this.p, - showFocus: viaKeyboard + showFocus: viaKeyboard, + animation: !viaKeyboard }).$once('closed', this.focus); },