cotugno/jellyfin-web
2
Fork 0
mirror of https://github.com/jellyfin/jellyfin-web.git synced 2024-11-16 02:18:16 -07:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #2622 from dmitrylyzo/fix-tabs-transform-focus

Browse Source 
Fix tabs scrolling in Tizen
This commit is contained in:
Bill Thornton 2021-06-24 02:01:23 -04:00 committed by GitHub
commit b065055635
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 20 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
src/components/scrollManager.js
View File

@ -223,8 +223,9 @@ import layoutManager from './layoutManager';
let parent = element.parentElement; let parent = element.parentElement;
while (parent) { while (parent) {
// Skip 'emby-scroller' because it scrolls by itself // Skip 'emby-scroller' and 'emby-tabs' because they scroll by themselves
if (!parent.classList.contains('emby-scroller') && if (!parent.classList.contains('emby-scroller') &&
!parent.classList.contains('emby-tabs') &&
parent[nameScroll] > parent[nameClient] && parent.classList.contains(nameClass)) { parent[nameScroll] > parent[nameClient] && parent.classList.contains(nameClass)) {
return parent; return parent;
} }

19
src/elements/emby-tabs/emby-tabs.js
View File

@ -3,6 +3,7 @@ import dom from '../../scripts/dom';
import scroller from '../../libraries/scroller'; import scroller from '../../libraries/scroller';
import browser from '../../scripts/browser'; import browser from '../../scripts/browser';
import focusManager from '../../components/focusManager'; import focusManager from '../../components/focusManager';
import layoutManager from '../../components/layoutManager';
import './emby-tabs.scss'; import './emby-tabs.scss';
import '../../assets/css/scrollstyles.scss'; import '../../assets/css/scrollstyles.scss';
@ -100,6 +101,14 @@ import '../../assets/css/scrollstyles.scss';
} }
} }
function onFocusIn(e) {
const tabs = this;
const tabButton = dom.parentWithClass(e.target, buttonClass);
if (tabButton && tabs.scroller) {
tabs.scroller.toCenter(tabButton, false);
}
}
function onFocusOut(e) { function onFocusOut(e) {
const parentContainer = e.target.parentNode; const parentContainer = e.target.parentNode;
const previousFocus = parentContainer.querySelector('.lastFocused'); const previousFocus = parentContainer.querySelector('.lastFocused');
@ -155,10 +164,14 @@ import '../../assets/css/scrollstyles.scss';
passive: true passive: true
}); });
if (layoutManager.tv) {
dom.addEventListener(this, 'focusin', onFocusIn, { passive: true });
}
dom.addEventListener(this, 'focusout', onFocusOut); dom.addEventListener(this, 'focusout', onFocusOut);
}; };
EmbyTabs.focus = function onFocusIn() { EmbyTabs.focus = function () {
const selectedTab = this.querySelector('.' + activeButtonClass); const selectedTab = this.querySelector('.' + activeButtonClass);
const lastFocused = this.querySelector('.lastFocused'); const lastFocused = this.querySelector('.lastFocused');
@ -210,6 +223,10 @@ import '../../assets/css/scrollstyles.scss';
dom.removeEventListener(this, 'click', onClick, { dom.removeEventListener(this, 'click', onClick, {
passive: true passive: true
}); });
if (layoutManager.tv) {
dom.removeEventListener(this, 'focusin', onFocusIn, { passive: true });
}
}; };
function getSelectedTabButton(elem) { function getSelectedTabButton(elem) {