EmbyCrackedClient/web/modules/emby-elements/emby-tabs/emby-tabs.js
2025-06-25 11:46:04 +08:00

1 line
No EOL
5.5 KiB
JavaScript

import dom from"./../../dom.js";import scroller from"./../../scroller/smoothscroller.js";import focusManager from"./../../focusmanager.js";require(["css!modules/emby-elements/emby-tabs/emby-tabs.css"]);let buttonClass="emby-tab-button",activeButtonClass="emby-tab-button-active";function setActiveTabButton(tabs,newButton,oldButton){newButton&&newButton.classList.add(activeButtonClass)}function getFocusCallback(tabs,e){return function(){var target,activeElement=document.activeElement;activeElement&&(activeElement===(target=e.target)||activeElement.contains(target)?tabs.disablefocusActivation||(e={type:e.type,target:target,currentTarget:e.currentTarget},onClick.call(tabs,e)):(activeElement=tabs.querySelector("."+activeButtonClass))&&tabs.scroller&&tabs.scroller.scrollToElement(activeElement,{}))}}function onFocus(e){var delay;this.clearFocusTimeout(),e.target.closest("."+buttonClass)&&(delay=-1===this.selectedIndex()?0:700,this.focusTimeout=setTimeout(getFocusCallback(this,e),delay))}function getTabPanel(tabs,index){return null}function removeActivePanelClass(tabs,index){tabs=getTabPanel(tabs,index);tabs&&tabs.classList.remove("is-active")}function triggerBeforeTabChangeInternal(tabs,index,previousIndex,triggerEvent){!1!==triggerEvent&&tabs.dispatchEvent(new CustomEvent("beforetabchange",{detail:{selectedTabIndex:index,previousIndex:previousIndex}})),null!=previousIndex&&previousIndex!==index&&removeActivePanelClass(tabs,previousIndex);triggerEvent=getTabPanel(tabs,index);triggerEvent&&triggerEvent.classList.add("is-active")}function onClick(e){this.clearFocusTimeout();var previousIndex,current=this.querySelector("."+activeButtonClass),tabButton=e.target.closest("."+buttonClass);tabButton&&tabButton!==current&&(current&&current.classList.remove(activeButtonClass),previousIndex=current?parseInt(current.getAttribute("data-index")):null,setActiveTabButton(this,tabButton,current,!0),triggerBeforeTabChangeInternal(this,current=parseInt(tabButton.getAttribute("data-index")),previousIndex),this.selectedTabIndex=current,"click"!==e.type&&tabButton.href&&tabButton.click(),this.dispatchEvent(new CustomEvent("tabchange",{detail:{selectedTabIndex:current,previousIndex:previousIndex}})))}let DefaultFocusScroll="adaptive";function initScroller(tabs){if(!tabs.scroller){let focusScroll=tabs.getAttribute("data-focusscroll");focusScroll="true"===focusScroll?DefaultFocusScroll:"false"===focusScroll?null:focusScroll||("false"!==tabs.getAttribute("data-centerfocus")?DefaultFocusScroll:null);var contentScrollSlider=tabs.querySelector(".emby-tabs-slider");contentScrollSlider&&(contentScrollSlider.classList.add("nohoverfocus"),tabs.scroller=new scroller(tabs,{horizontal:1,slidee:contentScrollSlider,speed:240,dragHandle:1,hiddenScroll:!0,focusScroll:focusScroll,focusScrollOffsetLeft:tabs.getAttribute("data-focusscrolloffsetleft")||tabs.getAttribute("data-focusscrolloffset")||null,allowNativeSmoothScroll:!0,autoPreventScrollOnFocus:!1,autoStartEdge:!1,adaptiveBorderXStart:0,adaptiveBorderXEnd:0}),tabs.scroller.init())}}function onInit(){this.hasInit||(this.hasInit=!0,this.classList.add("emby-tabs","focusable"))}class EmbyTabs extends HTMLDivElement{constructor(){var self=super();return onInit.call(self),self}connectedCallback(){onInit.call(this),dom.removeEventListener(this,"click",onClick,{passive:!0}),dom.addEventListener(this,"click",onClick,{passive:!0}),dom.removeEventListener(this,"focus",onFocus,{passive:!0,capture:!0}),dom.addEventListener(this,"focus",onFocus,{passive:!0,capture:!0}),initScroller(this),this.onTabsChanged(),this.readyFired||(this.readyFired=!0,this.dispatchEvent(new CustomEvent("ready",{})))}onTabsChanged(){var current=this.querySelector("."+activeButtonClass),currentIndex=current?parseInt(current.getAttribute("data-index")):parseInt(this.getAttribute("data-index")||"0");-1!==(this.selectedTabIndex=currentIndex)&&(currentIndex=this.querySelectorAll("."+buttonClass)[currentIndex])&&(setActiveTabButton(this,currentIndex,current,!1),this.scroller)&&this.scroller.scrollToElement(currentIndex,{behavior:"instant"})}clearFocusTimeout(){this.focusTimeout&&clearTimeout(this.focusTimeout)}detachedCallback(){this.scroller&&(this.scroller.destroy(),this.scroller=null),dom.removeEventListener(this,"click",onClick,{passive:!0}),dom.removeEventListener(this,"focus",onFocus,{passive:!0,capture:!0})}focus(){var selected=this.querySelector("."+activeButtonClass);selected?focusManager.focus(selected):focusManager.autoFocus(this)}selectedIndex(selected,triggerEvent){if(null==selected)return this.selectedTabIndex||0;this.clearFocusTimeout();var current=this.selectedIndex(),tabButtons=(this.selectedTabIndex=selected,this.querySelectorAll("."+buttonClass));current===selected||!1===triggerEvent||-1===selected?(triggerBeforeTabChangeInternal(this,selected,current,triggerEvent),!1!==triggerEvent&&this.dispatchEvent(new CustomEvent("tabchange",{detail:{selectedTabIndex:selected}})),triggerEvent=tabButtons[current],setActiveTabButton(this,tabButtons[selected],triggerEvent,!1),current!==selected&&triggerEvent&&triggerEvent.classList.remove(activeButtonClass)):onClick.call(this,{target:tabButtons[selected]})}triggerBeforeTabChange(selected){triggerBeforeTabChangeInternal(this,this.selectedIndex())}triggerTabChange(selected){this.dispatchEvent(new CustomEvent("tabchange",{detail:{selectedTabIndex:this.selectedIndex()}}))}setTabEnabled(index,enabled){index=this.querySelector('.emby-tab-button[data-index="'+index+'"]');enabled?index.classList.remove("hide"):index.classList.add("hide")}}customElements.define("emby-tabs",EmbyTabs,{extends:"div"});export default EmbyTabs;