dashboard-ui/modules/emby-elements/emby-tabs/emby-tabs.js

define(["exports","./../../dom.js","./../../scroller/smoothscroller.js","./../../focusmanager.js"],function(_exports,_dom,_smoothscroller,_focusmanager){Object.defineProperty(_exports,"__esModule",{value:!0}),_exports.default=void 0,require(["css!modules/emby-elements/emby-tabs/emby-tabs.css"]);var buttonClass="emby-tab-button",activeButtonClass=buttonClass+"-active";function setActiveTabButton(tabs,newButton){newButton&&newButton.classList.add(activeButtonClass)}function onFocus(e){var delay;this.clearFocusTimeout(),e.target.closest("."+buttonClass)&&(delay=-1===this.selectedIndex()?0:700,this.focusTimeout=setTimeout(function(tabs,e){return function(){var target,activeElement=document.activeElement;activeElement&&(activeElement===(target=e.target)||activeElement.contains(target)?(e={type:e.type,target:target,currentTarget:e.currentTarget},onClick.call(tabs,e)):(activeElement=tabs.querySelector("."+activeButtonClass))&&tabs.scroller&&tabs.scroller.to(tabs.scroller.options.focusScroll,activeElement,{offset:tabs.scroller.options.focusScrollOffset}))}}(this,e),delay))}function triggerBeforeTabChangeInternal(tabs,index,previousIndex,triggerEvent){!1!==triggerEvent&&tabs.dispatchEvent(new CustomEvent("beforetabchange",{detail:{selectedTabIndex:index,previousIndex:previousIndex}}))}function onClick(e){this.clearFocusTimeout();var index,current=this.querySelector("."+activeButtonClass),tabButton=e.target.closest("."+buttonClass);tabButton&&tabButton!==current&&(current&&current.classList.remove(activeButtonClass),current=current?parseInt(current.getAttribute("data-index")):null,setActiveTabButton(0,tabButton),triggerBeforeTabChangeInternal(this,index=parseInt(tabButton.getAttribute("data-index")),current),this.selectedTabIndex=index,"click"!==e.type&&tabButton.href&&tabButton.click(),this.dispatchEvent(new CustomEvent("tabchange",{detail:{selectedTabIndex:index,previousIndex:current}})))}function onInit(){this.hasInit||(this.hasInit=!0,this.classList.add("emby-tabs","focusable"))}var EmbyTabs=function(_HTMLDivElement){babelHelpers.inherits(EmbyTabs,_HTMLDivElement);var _super=_createSuper(EmbyTabs);function EmbyTabs(){babelHelpers.classCallCheck(this,EmbyTabs);var _this,self=_this=_super.call(this);return onInit.call(self),babelHelpers.possibleConstructorReturn(_this,self)}return babelHelpers.createClass(EmbyTabs,[{key:"connectedCallback",value:function(){var tabs,focusScroll,contentScrollSlider;onInit.call(this),_dom.default.removeEventListener(this,"click",onClick,{passive:!0}),_dom.default.addEventListener(this,"click",onClick,{passive:!0}),_dom.default.removeEventListener(this,"focus",onFocus,{passive:!0,capture:!0}),_dom.default.addEventListener(this,"focus",onFocus,{passive:!0,capture:!0}),!(tabs=this).scroller&&(focusScroll=tabs.getAttribute("data-focusscroll")||"center",contentScrollSlider=tabs.querySelector(".emby-tabs-slider"))&&(contentScrollSlider.classList.add("nohoverfocus"),tabs.scroller=new _smoothscroller.default(tabs,{horizontal:1,slidee:contentScrollSlider,speed:240,dragHandle:1,hiddenScroll:!0,focusScroll:focusScroll,focusScrollOffset:tabs.getAttribute("data-focusscrolloffset")||null,allowNativeSmoothScroll:!0,forceNativeScroll:!0,autoPreventScrollOnFocus:!1}),tabs.scroller.init()),this.onTabsChanged(),this.readyFired||(this.readyFired=!0,this.dispatchEvent(new CustomEvent("ready",{})))}},{key:"onTabsChanged",value:function(){var current=this.querySelector("."+activeButtonClass),current=current?parseInt(current.getAttribute("data-index")):parseInt(this.getAttribute("data-index")||"0");-1!==(this.selectedTabIndex=current)&&(current=this.querySelectorAll("."+buttonClass)[current])&&(setActiveTabButton(0,current),this.scroller)&&this.scroller.to(this.scroller.options.focusScroll,current,{behavior:"instant",offset:this.scroller.options.focusScrollOffset})}},{key:"clearFocusTimeout",value:function(){this.focusTimeout&&clearTimeout(this.focusTimeout)}},{key:"detachedCallback",value:function(){this.scroller&&(this.scroller.destroy(),this.scroller=null),_dom.default.removeEventListener(this,"click",onClick,{passive:!0}),_dom.default.removeEventListener(this,"focus",onFocus,{passive:!0,capture:!0})}},{key:"focus",value:function(){var selected=this.querySelector("."+activeButtonClass);selected?_focusmanager.default.focus(selected):_focusmanager.default.autoFocus(this)}},{key:"selectedIndex",value:function(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(0,tabButtons[selected]),current!==selected&&triggerEvent&&triggerEvent.classList.remove(activeButtonClass)):onClick.call(this,{target:tabButtons[selected]})}},{key:"triggerBeforeTabChange",value:function(selected){triggerBeforeTabChangeInternal(this,this.selectedIndex())}},{key:"triggerTabChange",value:function(selected){this.dispatchEvent(new CustomEvent("tabchange",{detail:{selectedTabIndex:this.selectedIndex()}}))}},{key:"setTabEnabled",value:function(index,enabled){index=this.querySelector('.emby-tab-button[data-index="'+index+'"]');enabled?index.classList.remove("hide"):index.classList.add("hide")}}]),EmbyTabs}(babelHelpers.wrapNativeSuper(HTMLDivElement));customElements.define("emby-tabs",EmbyTabs,{extends:"div"}),_exports.default=EmbyTabs});