1
0
Fork 0
mirror of https://github.com/jellyfin/jellyfin-web synced 2025-03-30 19:56:21 +00:00

Fix tabs always focusing the active tab in TV layout

This commit is contained in:
MrTimscampi 2020-08-18 20:08:49 +02:00
parent d544c7cb37
commit 161e1aff2f

View file

@ -12,7 +12,7 @@ import 'scrollStyles';
const buttonClass = 'emby-tab-button';
const activeButtonClass = buttonClass + '-active';
function setActiveTabButton(tabs, newButton, oldButton, animate) {
function setActiveTabButton(tabs, newButton) {
newButton.classList.add(activeButtonClass);
}
@ -77,7 +77,7 @@ import 'scrollStyles';
const previousIndex = current ? parseInt(current.getAttribute('data-index')) : null;
setActiveTabButton(tabs, tabButton, current, true);
setActiveTabButton(tabs, tabButton);
const index = parseInt(tabButton.getAttribute('data-index'));
@ -101,6 +101,15 @@ import 'scrollStyles';
}
}
function onFocusOut(e) {
const parentContainer = e.target.parentNode;
const previousFocus = parentContainer.querySelector('.lastFocused');
if (previousFocus) {
previousFocus.classList.remove('lastFocused');
}
e.target.classList.add('lastFocused');
}
function initScroller(tabs) {
if (tabs.scroller) {
return;
@ -146,13 +155,18 @@ import 'scrollStyles';
dom.addEventListener(this, 'click', onClick, {
passive: true
});
dom.addEventListener(this, 'focusout', onFocusOut);
};
EmbyTabs.focus = function () {
const selected = this.querySelector('.' + activeButtonClass);
EmbyTabs.focus = function onFocusIn() {
const selectedTab = this.querySelector('.' + activeButtonClass);
const lastFocused = this.querySelector('.lastFocused');
if (selected) {
focusManager.focus(selected);
if (lastFocused) {
focusManager.focus(lastFocused);
} else if (selectedTab) {
focusManager.focus(selectedTab);
} else {
focusManager.autoFocus(this);
}