var tabcontent_portlet_ns=tabcontent_portlet_ns||{};tabcontent_portlet_ns.DEBUG_MODE=tabcontent_portlet_ns.DEBUG_MODE||false;tabcontent_portlet_ns.requirelist=tabcontent_portlet_ns.DEBUG_MODE?["dna-fi-theme$vue@2.3.0/dist/vue"]:["dna-fi-theme$vue@2.3.0/dist/vue.min"];
Liferay.Loader.require(tabcontent_portlet_ns.requirelist,function(Vue){Vue.component("tab-content",{data:function(){return{tabs:[],contentList:{},scrollTop:undefined}},template:"#tab-content__list-wrapper",mounted:function(){var body=document.querySelector("body");var adminSignedIn=body.classList.contains("admin-signed-in");try{this.contentList=this.$refs.contentList;this.tabs=JSON.parse(tabcontent_portlet_ns.tabs);if(!adminSignedIn){this.$nextTick(this.initSelectedTab);this.$nextTick(this.handleScroll)}}catch(err){console.error(err)}this.initWindowEvents()},
methods:{initSelectedTab:function(){var hash=location.hash.substr(1);if(!hash)this.checkActiveTab(this.tabs[0].tabAnchor,true);else this.checkActiveTab(hash,true)},checkActiveTab:function(id,initialLoad=false){if(document.getElementById("tab-"+id)){this.$refs.tabs.forEach(function(tab){var portletId=tab.getAttribute("data-nestedPortletId");var link=tab.querySelector("a");var linkid=link.id;var portlet=document.getElementById("p_p_id_"+portletId+"_");portlet.classList.add("tab-content__tab");portlet.setAttribute("role",
"tabpanel");portlet.setAttribute("aria-labelledby",linkid);if(tab.id==="tab-"+id){this.scrollToTab(tab);tab.classList.add("active");link.ariaSelected=true;portlet.classList.add("tab-content__tab--visible");if(initialLoad)portlet.classList.add("tab-content__tab--initial")}else{tab.classList.remove("active");link.ariaSelected=false;portlet.classList.remove("tab-content__tab--visible","tab-content__tab--initial")}}.bind(this));if(initialLoad){var hash=location.hash.substr(1);if(hash){var offset=84+15+
10;this.scrollTop=this.$el.getBoundingClientRect().top-119}}if(this.scrollTop)window.scrollTo(0,this.scrollTop)}else if(!document.querySelector(".tab-content__list .active"))this.checkActiveTab(this.tabs[0].tabAnchor)},handleScroll:function(){var leftArrow=this.$refs.leftArrow;var rightArrow=this.$refs.rightArrow;var elem=this.contentList;elem.scrollLeft>0?leftArrow.classList.add("visible"):leftArrow.classList.remove("visible");elem.scrollLeft+elem.clientWidth===elem.scrollWidth?rightArrow.classList.remove("visible"):
rightArrow.classList.add("visible")},scrollRight:function(){var elem=this.contentList;elem.scrollLeft+=elem.clientWidth/2;this.handleScroll()},scrollLeft:function(){var elem=this.contentList;elem.scrollLeft-=elem.clientWidth/2;this.handleScroll()},scrollToTab:function(selectedTab){var tabs=this.$refs.tabs;var scroll=0;for(var i=0;i<tabs.length;i++){var tab=tabs[i];scroll+=tab.clientWidth;if(tab.id===selectedTab.id){scroll-=tab.clientWidth;break}}this.contentList.scrollLeft=scroll},initWindowEvents:function(){var that=
this;window.onscroll=function(){this.scrollTop=window.pageYOffset}.bind(this);window.onresize=function(){this.handleScroll()}.bind(this);window.addEventListener("hashchange",function(){that.checkActiveTab(location.hash.substr(1))},false)}}});new Vue({el:"#tab-content-container"})});