dashboard-ui/modules/navdrawer/navdrawer.js

define(["exports","./../dom.js","./../browser.js","./../common/globalize.js","./../emby-apiclient/events.js","./navdrawercontent.js","./../common/usersettings/usersettings.js","./../emby-elements/emby-scroller/emby-scroller.js","./../focusmanager.js","./../common/inputmanager.js","./../viewmanager/viewmanager.js","./../layoutmanager.js","./../common/servicelocator.js"],function(_exports,_dom,_browser,_globalize,_events,_navdrawercontent,_usersettings,_embyScroller,_focusmanager,_inputmanager,_viewmanager,_layoutmanager,_servicelocator){Object.defineProperty(_exports,"__esModule",{value:!0}),_exports.default=void 0,require(["css!modules/navdrawer/navdrawer.css"]);var instance,mask,previousFocusedElement,_scrollingElement,navDrawerElement=document.querySelector(".mainDrawer"),allowBackdropFilter=_dom.default.allowBackdropFilter(),DrawerStates={Closed:0,Open:1,Docked:2,DockedMini:3};function closeOnNavCommand(instance){switch(instance.drawerState){case DrawerStates.Open:instance.close(),previousFocusedElement?(_focusmanager.default.focus(previousFocusedElement),previousFocusedElement=null):_viewmanager.default.autoFocusCurrentView({skipIfNotEnabled:!1});break;case DrawerStates.Docked:case DrawerStates.DockedMini:previousFocusedElement?(_focusmanager.default.focus(previousFocusedElement),previousFocusedElement=null):_viewmanager.default.autoFocusCurrentView({skipIfNotEnabled:!1})}}function onMainDrawerClick(e){e.target.closest(".btnPinNavDrawer")&&instance.togglePinState()}function setPinIcon(icon){var title,btnPinNavDrawerIcon=navDrawerElement.querySelector(".btnPinNavDrawerIcon"),btnPinNavDrawerIcon=(btnPinNavDrawerIcon&&(btnPinNavDrawerIcon.innerHTML=icon),navDrawerElement.querySelector(".btnPinNavDrawer"));btnPinNavDrawerIcon&&("menu_open"===icon?(title=_globalize.default.translate("Collapse"),btnPinNavDrawerIcon.classList.remove("btnPinNavDrawer-iconpin"),btnPinNavDrawerIcon.classList.add("btnPinNavDrawer-iconclose")):(title=_globalize.default.translate("HeaderPinSidebar"),btnPinNavDrawerIcon.classList.add("btnPinNavDrawer-iconpin"),btnPinNavDrawerIcon.classList.remove("btnPinNavDrawer-iconclose")),btnPinNavDrawerIcon.title=title,btnPinNavDrawerIcon.setAttribute("aria-label",title))}function onOpenRequested(){this.closeState=this.drawerState===DrawerStates.DockedMini?DrawerStates.DockedMini:null,this.open()}function NavDrawer(){instance=this,navDrawerElement.classList.add("hiddenScrollY-hover","scrollY-mini"),_dom.default.addEventListener(navDrawerElement,"click",onMainDrawerClick,{passive:!0}),_dom.default.addEventListener(navDrawerElement,_dom.default.whichTransitionEvent(),onNavDrawerTransitionEnd,{passive:!0,capture:!0}),_events.default.on(_navdrawercontent.default,"open-requested",onOpenRequested.bind(this)),_events.default.on(_navdrawercontent.default,"navigated",function(){this.drawerState===DrawerStates.Open&&closeOnNavCommand(this)}.bind(this)),this.onInputCommandFn=function(e){var _viewManager$currentV;switch(e.detail.command){case"back":_layoutmanager.default.tv&&null!=(_viewManager$currentV=_viewmanager.default.currentViewController())&&_viewManager$currentV.enableBackMenu&&_servicelocator.appHost.supports("exit")&&!_browser.default.electron?_servicelocator.appHost.exit():closeOnNavCommand(this),e.preventDefault();break;case"left":"rtl"!==document.dir||e.target.closest("input")||(closeOnNavCommand(this),e.preventDefault());break;case"right":"rtl"===document.dir||e.target.closest("input")||(closeOnNavCommand(this),e.preventDefault())}}.bind(this);var onInputCommandFn=this.onInputCommandFn;onInputCommandFn&&_inputmanager.default.on(navDrawerElement,onInputCommandFn)}function getScrollingElement(){var elem=_scrollingElement;return elem||(elem=document.scrollingElement||document.documentElement,_scrollingElement=elem),elem}function onNavDrawerTransitionEnd(e){e.target!==e.currentTarget||this.classList.contains("drawer-open")||this.classList.add("hide")}function onMaskTransitionEnd(e){e.target===e.currentTarget&&(e=mask)&&e.classList.contains("drawer-backdrop-fadeout")&&(e.remove(),mask=null)}NavDrawer.prototype.openIfClosed=function(autoFocus){switch(this.drawerState){case 1:case 2:this.autoFocus({skipIfNotEnabled:!1});break;case 3:onOpenRequested.call(this),this.autoFocus({skipIfNotEnabled:!1});break;default:this.open(!1,!1,!0)}},NavDrawer.prototype.open=function(isDocked,miniDock,autoFocus){_navdrawercontent.default.onBeforeOpen(autoFocus);var focused,autoFocus=isDocked?miniDock?DrawerStates.DockedMini:DrawerStates.Docked:DrawerStates.Open,miniDock=this.drawerState;autoFocus!==miniDock&&((focused=document.activeElement)&&!navDrawerElement.contains(focused)&&(previousFocusedElement=focused),this.drawerState=autoFocus,isDocked?(_focusmanager.default.popScope(navDrawerElement),autoFocus===DrawerStates.DockedMini?navDrawerElement.classList.add("drawer-docked","mainDrawer-mini"):(navDrawerElement.classList.add("drawer-docked"),navDrawerElement.classList.remove("mainDrawer-mini")),setPinIcon("menu_open")):(_focusmanager.default.pushScope(navDrawerElement),navDrawerElement.classList.remove("drawer-docked","mainDrawer-mini"),navDrawerElement.classList.add("drawer-opening"),this.closeState===DrawerStates.DockedMini?setPinIcon("menu_open"):setPinIcon("view_sidebar")),navDrawerElement.classList.remove("hide"),navDrawerElement.offsetWidth,allowBackdropFilter?navDrawerElement.classList.add("drawer-open","drawer-open-backdropfilter"):navDrawerElement.classList.add("drawer-open"),navDrawerElement.classList.remove("drawer-opening"),isDocked?(this.hideMask(),getScrollingElement().classList.remove("withDialogOpen")):(this.showMask(),getScrollingElement().classList.add("withDialogOpen")),autoFocus!==miniDock)&&_events.default.trigger(this,"drawer-state-change",[autoFocus])},NavDrawer.prototype.autoFocus=function(options){return _navdrawercontent.default.autoFocus(options)},NavDrawer.prototype.close=function(){var currentDrawerState,previousDrawerState,newDrawerState;this.closeState===DrawerStates.DockedMini?(this.closeState=null,this.open(!0,!0,!1)):(_focusmanager.default.popScope(navDrawerElement),currentDrawerState=this.drawerState,previousDrawerState=this.drawerState,newDrawerState=this.drawerState=DrawerStates.Closed,navDrawerElement.classList.remove("drawer-open","drawer-opening","drawer-open-backdropfilter","drawer-docked","mainDrawer-mini"),this.hideMask(),getScrollingElement().classList.remove("withDialogOpen"),currentDrawerState!==DrawerStates.Docked&&currentDrawerState!==DrawerStates.DockedMini||navDrawerElement.classList.add("hide"),setPinIcon("view_sidebar"),newDrawerState!==previousDrawerState&&_events.default.trigger(this,"drawer-state-change",[newDrawerState]))},NavDrawer.prototype.onViewShow=function(e){_navdrawercontent.default.onViewShow(e)},NavDrawer.prototype.toggle=function(){this.drawerState?this.close():this.open()},NavDrawer.prototype.togglePinState=function(){this.drawerState===DrawerStates.Open?this.closeState===DrawerStates.DockedMini?(this.closeState=null,_usersettings.default.drawerStyle("closed"),this.close()):(_usersettings.default.drawerStyle("docked"),this.open(!0)):this.drawerState===DrawerStates.Docked?(_usersettings.default.drawerStyle("docked-mini"),this.open(!0,!0)):(this.closeState=null,_usersettings.default.drawerStyle("closed"),this.close())},NavDrawer.prototype.showMask=function(){mask=mask||function(instance){var mask=document.createElement("div");return mask.className="drawer-backdrop",_dom.default.addEventListener(mask,_dom.default.whichAnimationEvent(),onMaskTransitionEnd,{passive:!0,capture:!0}),_dom.default.addEventListener(mask,"click",instance.close.bind(instance),{passive:!0}),document.body.appendChild(mask),mask}(this)},NavDrawer.prototype.hideMask=function(){mask&&mask.classList.add("drawer-backdrop-fadeout")};var _default=new NavDrawer;_exports.default=_default});