mirror of https://github.com/FreeTubeApp/FreeTube
Fix the trending and watch pages swallowing the arrow key events (#3170)
* Fix the trending page swallowing the arrow key events * Fix the watch page too
This commit is contained in:
parent
4c65982371
commit
a26c8e03a6
|
@ -1838,8 +1838,11 @@ export default defineComponent({
|
|||
},
|
||||
|
||||
// This function should always be at the bottom of this file
|
||||
/**
|
||||
* @param {KeyboardEvent} event
|
||||
*/
|
||||
keyboardShortcutHandler: function (event) {
|
||||
if (document.activeElement.classList.contains('ft-input')) {
|
||||
if (document.activeElement.classList.contains('ft-input') || event.altKey) {
|
||||
return
|
||||
}
|
||||
|
||||
|
|
|
@ -69,9 +69,16 @@ export default defineComponent({
|
|||
}
|
||||
},
|
||||
|
||||
focusTab: function (tab) {
|
||||
this.$refs[tab].focus()
|
||||
this.$emit('showOutlines')
|
||||
/**
|
||||
* @param {KeyboardEvent} event
|
||||
* @param {string} tab
|
||||
*/
|
||||
focusTab: function (event, tab) {
|
||||
if (!event.altKey) {
|
||||
event.preventDefault()
|
||||
this.$refs[tab].focus()
|
||||
this.$emit('showOutlines')
|
||||
}
|
||||
},
|
||||
|
||||
getTrendingInfo: function () {
|
||||
|
|
|
@ -24,8 +24,8 @@
|
|||
:class="{ selectedTab: currentTab === 'default' }"
|
||||
@click="changeTab('default')"
|
||||
@keydown.space.enter.prevent="changeTab('default')"
|
||||
@keydown.left.prevent="focusTab('movies')"
|
||||
@keydown.right.prevent="focusTab('music')"
|
||||
@keydown.left="focusTab($event, 'movies')"
|
||||
@keydown.right="focusTab($event, 'music')"
|
||||
>
|
||||
{{ $t("Trending.Default").toUpperCase() }}
|
||||
</div>
|
||||
|
@ -39,8 +39,8 @@
|
|||
:class="{ selectedTab: currentTab === 'music' }"
|
||||
@click="changeTab('music')"
|
||||
@keydown.space.enter.prevent="changeTab('music')"
|
||||
@keydown.left.prevent="focusTab('default')"
|
||||
@keydown.right.prevent="focusTab('gaming')"
|
||||
@keydown.left="focusTab($event, 'default')"
|
||||
@keydown.right="focusTab($event, 'gaming')"
|
||||
>
|
||||
{{ $t("Trending.Music").toUpperCase() }}
|
||||
</div>
|
||||
|
@ -54,8 +54,8 @@
|
|||
:class="{ selectedTab: currentTab === 'gaming' }"
|
||||
@click="changeTab('gaming')"
|
||||
@keydown.space.enter.prevent="changeTab('gaming')"
|
||||
@keydown.left.prevent="focusTab('music')"
|
||||
@keydown.right.prevent="focusTab('movies')"
|
||||
@keydown.left="focusTab($event, 'music')"
|
||||
@keydown.right="focusTab($event, 'movies')"
|
||||
>
|
||||
{{ $t("Trending.Gaming").toUpperCase() }}
|
||||
</div>
|
||||
|
@ -69,8 +69,8 @@
|
|||
:class="{ selectedTab: currentTab === 'movies' }"
|
||||
@click="changeTab('movies')"
|
||||
@keydown.space.enter.prevent="changeTab('movies')"
|
||||
@keydown.left.prevent="focusTab('gaming')"
|
||||
@keydown.right.prevent="focusTab('default')"
|
||||
@keydown.left="focusTab($event, 'gaming')"
|
||||
@keydown.right="focusTab($event, 'default')"
|
||||
>
|
||||
{{ $t("Trending.Movies").toUpperCase() }}
|
||||
</div>
|
||||
|
|
Loading…
Reference in New Issue