Improve keyboard shortcuts

This commit is contained in:
syuilo 2018-09-18 16:45:20 +09:00
parent 6ead1de383
commit 8bf4e55338
No known key found for this signature in database
GPG key ID: BDC4C49D06AB9D69
3 changed files with 10 additions and 8 deletions

View file

@ -2,9 +2,9 @@
<div class="onchrpzrvnoruiaenfcqvccjfuupzzwv"> <div class="onchrpzrvnoruiaenfcqvccjfuupzzwv">
<div class="backdrop" ref="backdrop" @click="close"></div> <div class="backdrop" ref="backdrop" @click="close"></div>
<div class="popover" :class="{ hukidasi }" ref="popover"> <div class="popover" :class="{ hukidasi }" ref="popover">
<template v-for="item in items"> <template v-for="item, i in items">
<div v-if="item === null"></div> <div v-if="item === null"></div>
<button v-if="item" @click="clicked(item.action)" v-html="item.icon ? item.icon + ' ' + item.text : item.text"></button> <button v-if="item" @click="clicked(item.action)" v-html="item.icon ? item.icon + ' ' + item.text : item.text" :tabindex="i"></button>
</template> </template>
</div> </div>
</div> </div>

View file

@ -97,10 +97,10 @@ export default Vue.extend({
watch: { watch: {
focus(i) { focus(i) {
this.$refs.buttons.childNodes[i].focus(); this.$refs.buttons.children[i].focus();
if (this.showFocus) { if (this.showFocus) {
this.title = this.$refs.buttons.childNodes[i].title; this.title = this.$refs.buttons.children[i].title;
} }
} }
}, },

View file

@ -51,7 +51,7 @@
<button class="reactionButton" :class="{ reacted: p.myReaction != null }" @click="react()" ref="reactButton" title="%i18n:@add-reaction%"> <button class="reactionButton" :class="{ reacted: p.myReaction != null }" @click="react()" ref="reactButton" title="%i18n:@add-reaction%">
%fa:plus%<p class="count" v-if="p.reactions_count > 0">{{ p.reactions_count }}</p> %fa:plus%<p class="count" v-if="p.reactions_count > 0">{{ p.reactions_count }}</p>
</button> </button>
<button @click="menu" ref="menuButton"> <button @click="menu()" ref="menuButton">
%fa:ellipsis-h% %fa:ellipsis-h%
</button> </button>
<!-- <button title="%i18n:@detail"> <!-- <button title="%i18n:@detail">
@ -114,11 +114,12 @@ export default Vue.extend({
keymap(): any { keymap(): any {
return { return {
'r|left': () => this.reply(true), 'r|left': () => this.reply(true),
'a|plus': () => this.react(true), 'e|a|plus': () => this.react(true),
'q|right': () => this.renote(true), 'q|right': () => this.renote(true),
'ctrl+q|ctrl+right': this.renoteDirectly, 'ctrl+q|ctrl+right': this.renoteDirectly,
'up|k|shift+tab': this.focusBefore, 'up|k|shift+tab': this.focusBefore,
'down|j|tab': this.focusAfter, 'down|j|tab': this.focusAfter,
'm|o': () => this.menu(true),
'1': () => this.reactDirectly('like'), '1': () => this.reactDirectly('like'),
'2': () => this.reactDirectly('love'), '2': () => this.reactDirectly('love'),
'3': () => this.reactDirectly('laugh'), '3': () => this.reactDirectly('laugh'),
@ -278,10 +279,11 @@ export default Vue.extend({
}); });
}, },
menu() { menu(viaKeyboard = false) {
(this as any).os.new(MkNoteMenu, { (this as any).os.new(MkNoteMenu, {
source: this.$refs.menuButton, source: this.$refs.menuButton,
note: this.p note: this.p,
animation: !viaKeyboard
}).$once('closed', this.focus); }).$once('closed', this.focus);
}, },