-
Notifications
You must be signed in to change notification settings - Fork 21
/
Copy pathscrolling-tabs.min.js
8 lines (8 loc) · 14.6 KB
/
scrolling-tabs.min.js
1
2
3
4
5
6
7
8
/**
* angular-bootstrap-scrolling-tabs
* @version v1.2.0
* @link https://github.com/mikejacobson/angular-bootstrap-scrolling-tabs
* @author Mike Jacobson <michaeljjacobson1@gmail.com>
* @license MIT License, http://www.opensource.org/licenses/MIT
*/
!function(t,e){"use strict";function o(t){this.stc=t}function n(t){this.stc=t}function i(t){this.stc=t}function r(t,e,r){var a=this;r=r||{},a.$tabsContainer=t,a.$timeout=e,a.movableContainerLeftPos=0,a.scrollArrowsVisible=!1,a.scrollToTabEdge=!1,a.scrollMovement=new i(a),a.eventHandlers=new n(a),a.elementsHandler=new o(a),a.scrollingTabsActiveOffset=r.scrollingTabsActiveOffset||0}function a(e,o){function n(t){return o.trustAsHtml(t)}return{restrict:"E",template:b,transclude:!1,replace:!0,scope:{tabs:"@",watchTabs:"=",propPaneId:"@",propTitle:"@",propActive:"@",propDisabled:"@",localTabClick:"&tabClick",refreshOn:"="},link:function(o,i,a){var s=new r(i,e),l=a.scrollToTabEdge&&"true"===a.scrollToTabEdge.toLowerCase();if(o.tabsArr=o.$eval(o.tabs),o.propPaneId=o.propPaneId||"paneId",o.propTitle=o.propTitle||"title",o.propActive=o.propActive||"active",o.propDisabled=o.propDisabled||"disabled",o.sanitize=n,i.on("click.scrollingTabs",".nav-tabs > li",function(e){var n=t(this).data();o.localTabClick({$event:e,$index:n.index,tab:n.tab})}),a.refreshOn&&o.$watch("refreshOn",function(t,e){t&&t!==e&&s.handleTriggeredRefresh()}),!a.watchTabs)return void s.initTabs({isWrapperDirective:!1,scrollToTabEdge:l,scrollingTabsActiveOffset:a.scrollingTabsActiveOffset});o.$watch("watchTabs",function(t,n){var r,a;o.tabsArr=o.$eval(o.tabs),t.length&&t[t.length-1].active?e(function(){i.find("ul.nav-tabs > li:last").removeClass("active").find('a[role="tab"]').click()},0):(r=i.find(".nav-tabs > li.active"),r.length&&(a=r.data("index"),o.tabsArr.some(function(t){if(t[o.propActive])return t[o.propActive]=!1,!0}),o.tabsArr[a][o.propActive]=!0)),s.initTabs({isWrapperDirective:!1,isWatchingTabs:!0,scrollToTabEdge:l})},!0)}}}function s(t){return{restrict:"A",template:f,transclude:!0,replace:!0,link:function(e,o,n){function i(t){s.initTabs({isWrapperDirective:!0,isWrappingAngularUITabset:c,isWatchingTabs:!0,scrollToTabEdge:b,isWatchingDom:t&&t.isWatchingDom})}function a(){function n(){return r=s.find("li.active").index(),r!==a&&(a=r,i({isWatchingDom:!0})),!1}var r,a,s=o.find("ul.nav-tabs");s.length&&(e.$watch(function(){return s[0].childNodes.length},function(t,e){t!==e&&i({isWatchingDom:!0})}),e.$watch(function(){return t(n,0,!1),s.find("li.active").index()},angular.noop))}var s=new r(o,t,{scrollingTabsActiveOffset:n.scrollingTabsActiveOffset}),l=o.find("uib-tabset").length>0,c=l||o.find("tabset, .scrtabs-tabs-movable-container div > ul.nav").length>0,b=n.scrollToTabEdge&&"true"===n.scrollToTabEdge.toLowerCase(),f={hasTabContentOutsideMovableContainer:!0};if(angular.extend(e,{scrtc:f}),n.refreshOn&&e.$watch(n.refreshOn,function(t,e){t&&t!==e&&s.handleTriggeredRefresh()}),c||(f.hasTabContentOutsideMovableContainer=!1),!l&&!n.watchTabs)return void s.initTabs({isWrapperDirective:!0,isWrappingAngularUITabset:c,scrollToTabEdge:b});(!(l||n.watchTabs&&"true"===n.watchTabs.toLowerCase())||(c&&(f.hasTabContentOutsideMovableContainer=!1),i(),t(a,10),l&&n.watchTabs&&"true"!==n.watchTabs.toLowerCase()))&&e.$watch(n.watchTabs,function(e,n){c?l&&e.length&&e[e.length-1].active&&t(function(){o.find(".scrtabs-tabs-movable-container ul.nav-tabs > li:last").find('a[role="tab"],a.nav-link').click()},0):e.length&&e[e.length-1].active&&t(function(){o.find("ul.nav-tabs > li:last").removeClass("active").find('a[role="tab"]').click()},0),i()},!0)}}}var l=angular.module("mj.scrollingTabs",[]),c={CONTINUOUS_SCROLLING_TIMEOUT_INTERVAL:50,SCROLL_OFFSET_FRACTION:6,DATA_KEY_IS_MOUSEDOWN:"ismousedown"};!function(t,e){var o=function(t,e,o){var n;return function(){function i(){o||t.apply(r,a),n=null}var r=this,a=arguments;n?clearTimeout(n):o&&t.apply(r,a),n=setTimeout(i,e||100)}};jQuery.fn[e]=function(t){return t?this.bind("resize.scrtabs",o(t)):this.trigger(e)}}(jQuery,"smartresize");var b=['<div class="scrtabs-tab-container">',' <div class="scrtabs-tab-scroll-arrow scrtabs-js-tab-scroll-arrow-left"><span class="glyphicon glyphicon-chevron-left"></span></div>',' <div class="scrtabs-tabs-fixed-container">',' <div class="scrtabs-tabs-movable-container">',' <ul class="nav nav-tabs" role="tablist">'," <li ng-class=\"{ 'active': tab[propActive || 'active'], "," 'disabled': tab[propDisabled || 'disabled'] }\" ",' data-tab="{{tab}}" data-index="{{$index}}" ng-repeat="tab in tabsArr">'," <a ng-href=\"{{'#' + tab[propPaneId || 'paneId']}}\" role=\"tab\""," data-toggle=\"{{tab[propDisabled || 'disabled'] ? '' : 'tab'}}\" "," ng-bind-html=\"sanitize(tab[propTitle || 'title']);\">"," </a>"," </li>"," </ul>"," </div>"," </div>",' <div class="scrtabs-tab-scroll-arrow scrtabs-js-tab-scroll-arrow-right"><span class="glyphicon glyphicon-chevron-right"></span></div>',"</div>"].join(""),f=['<div class="scrtabs-tab-wrapper-container" ng-class="{ \'force-height\': !scrtc.hasTabContentOutsideMovableContainer }">',' <div class="scrtabs-tab-scroll-arrow scrtabs-js-tab-scroll-arrow-left"><span class="glyphicon glyphicon-chevron-left"></span></div>',' <div class="scrtabs-tabs-fixed-container">',' <div class="scrtabs-tabs-movable-container" ng-transclude></div>'," </div>",' <div class="scrtabs-tab-scroll-arrow scrtabs-js-tab-scroll-arrow-right"><span class="glyphicon glyphicon-chevron-right"></span></div>',"</div>"].join("");!function(o){o.initElements=function(t){var e=this,o=e.stc;o.$tabsContainer;e.setElementReferences(),t.isWrappingAngularUITabset&&e.moveTabContentOutsideScrollContainer(t),e.setEventListeners()},o.moveTabContentOutsideScrollContainer=function(t){var e=this,o=e.stc,n=o.$tabsContainer,i=n.find(".scrtabs-tabs-movable-container"),r=i.find(".tab-content"),a=i.find("> div").eq(0).data("$uibTabsetController");r.show().appendTo(n),a&&r.data("$uibTabsetController",a)},o.refreshAllElementSizes=function(){var t,e=this,o=e.stc,n=o.scrollMovement,i=o.scrollArrowsVisible,r={didScrollToActiveTab:!1};return e.setElementWidths(),e.setScrollArrowVisibility(),o.scrollArrowsVisible&&e.setFixedContainerWidthForJustVisibleScrollArrows(),(o.scrollArrowsVisible||i)&&(o.scrollArrowsVisible?(t=n.getMinPos(),o.movableContainerLeftPos<t?n.incrementScrollRight(t):(n.scrollToActiveTab({isOnWindowResize:!0}),r.didScrollToActiveTab=!0)):(o.movableContainerLeftPos=0,n.slideMovableContainerToLeftPos())),r},o.setElementReferences=function(){var o=this,n=o.stc,i=n.$tabsContainer;n.isNavPills=!1,n.$fixedContainer=i.find(".scrtabs-tabs-fixed-container"),n.$movableContainer=i.find(".scrtabs-tabs-movable-container"),n.$tabsUl=n.$movableContainer.find(".nav-tabs"),n.$tabsUl.length||(n.$tabsUl=n.$movableContainer.find(".nav-pills"),n.$tabsUl.length&&(n.isNavPills=!0)),n.$tabsLiCollection=n.$tabsUl.find("> li"),n.$leftScrollArrow=i.find(".scrtabs-js-tab-scroll-arrow-left"),n.$rightScrollArrow=i.find(".scrtabs-js-tab-scroll-arrow-right"),n.$scrollArrows=n.$leftScrollArrow.add(n.$rightScrollArrow),n.$win=t(e)},o.setElementWidths=function(){var t=this,e=t.stc;e.$win&&(e.containerWidth=e.$tabsContainer.outerWidth(),e.winWidth=e.$win.width(),e.scrollArrowsCombinedWidth=e.$leftScrollArrow.outerWidth()+e.$rightScrollArrow.outerWidth(),t.setFixedContainerWidth(),t.setMovableContainerWidth())},o.setEventListeners=function(){var t=this,e=t.stc,o=e.eventHandlers;e.$leftScrollArrow.off(".scrtabs").on({"mousedown.scrtabs touchstart.scrtabs":function(t){o.handleMousedownOnLeftScrollArrow.call(o,t)},"mouseup.scrtabs touchend.scrtabs":function(t){o.handleMouseupOnLeftScrollArrow.call(o,t)},"click.scrtabs":function(t){o.handleClickOnLeftScrollArrow.call(o,t)}}),e.$rightScrollArrow.off(".scrtabs").on({"mousedown.scrtabs touchstart.scrtabs":function(t){o.handleMousedownOnRightScrollArrow.call(o,t)},"mouseup.scrtabs touchend.scrtabs":function(t){o.handleMouseupOnRightScrollArrow.call(o,t)},"click.scrtabs":function(t){o.handleClickOnRightScrollArrow.call(o,t)}}),e.$win.smartresize(function(t){o.handleWindowResize.call(o,t)})},o.setFixedContainerWidth=function(){var t=this,e=t.stc,o=e.$tabsContainer.get(0).getBoundingClientRect();e.fixedContainerWidth=o.width||o.right-o.left,e.$fixedContainer.width(e.fixedContainerWidth)},o.setFixedContainerWidthForJustHiddenScrollArrows=function(){var t=this,e=t.stc;e.$fixedContainer.width(e.fixedContainerWidth)},o.setFixedContainerWidthForJustVisibleScrollArrows=function(){var t=this,e=t.stc;e.$fixedContainer.width(e.fixedContainerWidth-e.scrollArrowsCombinedWidth)},o.setMovableContainerWidth=function(){var e=this,o=e.stc,n=o.$tabsUl.find("li"),i=o.$fixedContainer.height(),r=10;for(o.movableContainerWidth=0,n.length&&(n.each(function(){var e=t(this),n=0;o.isNavPills&&(n=parseInt(e.css("margin-left"),10)+parseInt(e.css("margin-right"),10)),o.movableContainerWidth+=e.outerWidth()+n}),o.movableContainerWidth+=1,o.movableContainerWidth<o.fixedContainerWidth&&(o.movableContainerWidth=o.fixedContainerWidth)),o.$movableContainer.width(o.movableContainerWidth);o.$movableContainer.height()>i&&r--;)o.$movableContainer.width(o.movableContainerWidth+=1)},o.setScrollArrowVisibility=function(){var t=this,e=t.stc,o=e.movableContainerWidth>e.fixedContainerWidth;o&&!e.scrollArrowsVisible?(e.$scrollArrows.show(),e.scrollArrowsVisible=!0,t.setFixedContainerWidthForJustVisibleScrollArrows()):!o&&e.scrollArrowsVisible&&(e.$scrollArrows.hide(),e.scrollArrowsVisible=!1,t.setFixedContainerWidthForJustHiddenScrollArrows())}}(o.prototype),function(t){t.handleClickOnLeftScrollArrow=function(t){this.stc.scrollMovement.incrementScrollLeft()},t.handleClickOnRightScrollArrow=function(t){var e=this,o=e.stc,n=o.scrollMovement;n.incrementScrollRight(n.getMinPos())},t.handleMousedownOnLeftScrollArrow=function(t){this.stc.scrollMovement.startScrollLeft()},t.handleMousedownOnRightScrollArrow=function(t){this.stc.scrollMovement.startScrollRight()},t.handleMouseupOnLeftScrollArrow=function(t){this.stc.scrollMovement.stopScrollLeft()},t.handleMouseupOnRightScrollArrow=function(t){this.stc.scrollMovement.stopScrollRight()},t.handleWindowResize=function(t){var e=this,o=e.stc,n=o.$win.width();if(n===o.winWidth)return!1;o.winWidth=n,o.elementsHandler.refreshAllElementSizes()}}(n.prototype),function(e){e.continueScrollLeft=function(){var t=this,e=t.stc;e.$timeout(function(){e.$leftScrollArrow.data(c.DATA_KEY_IS_MOUSEDOWN)&&e.movableContainerLeftPos<0&&(t.incrementScrollLeft()||t.continueScrollLeft())},c.CONTINUOUS_SCROLLING_TIMEOUT_INTERVAL)},e.continueScrollRight=function(t){var e=this,o=e.stc;o.$timeout(function(){o.$rightScrollArrow.data(c.DATA_KEY_IS_MOUSEDOWN)&&o.movableContainerLeftPos>t&&(e.incrementScrollRight(t)||e.continueScrollRight(t))},c.CONTINUOUS_SCROLLING_TIMEOUT_INTERVAL)},e.decrementMovableContainerLeftPos=function(t){var e=this,o=e.stc;o.movableContainerLeftPos-=o.fixedContainerWidth/c.SCROLL_OFFSET_FRACTION,o.movableContainerLeftPos<t?o.movableContainerLeftPos=t:o.scrollToTabEdge&&(e.setMovableContainerLeftPosToTabEdge("right"),o.movableContainerLeftPos<t&&(o.movableContainerLeftPos=t))},e.getMinPos=function(){var t=this,e=t.stc;return e.scrollArrowsVisible?e.fixedContainerWidth-e.movableContainerWidth-e.scrollArrowsCombinedWidth:0},e.getMovableContainerCssLeftVal=function(){var t=this,e=t.stc;return 0===e.movableContainerLeftPos?"0":e.movableContainerLeftPos+"px"},e.incrementScrollLeft=function(){var t=this,e=t.stc;return e.movableContainerLeftPos+=e.fixedContainerWidth/c.SCROLL_OFFSET_FRACTION,e.movableContainerLeftPos>0?e.movableContainerLeftPos=0:e.scrollToTabEdge&&(t.setMovableContainerLeftPosToTabEdge("left"),e.movableContainerLeftPos>0&&(e.movableContainerLeftPos=0)),t.slideMovableContainerToLeftPos(),0===e.movableContainerLeftPos},e.incrementScrollRight=function(t){var e=this,o=e.stc;return e.decrementMovableContainerLeftPos(t),e.slideMovableContainerToLeftPos(),o.movableContainerLeftPos===t},e.scrollToActiveTab=function(t){var e,o,n,i,r,a,s,l,c,b=this,f=b.stc,d=0;f.scrollArrowsVisible&&(e=f.$tabsUl.find("li.active"),e.length&&(n=e.offset().left,o=e.outerWidth(),i=n+o+parseInt(f.scrollingTabsActiveOffset||0,10),r=f.$rightScrollArrow.offset().left,a=f.$leftScrollArrow.outerWidth(),s=a,l=r,n<s?(d=n-s,f.movableContainerLeftPos=f.movableContainerLeftPos-d):i>l&&(d=i-l,f.movableContainerLeftPos=f.movableContainerLeftPos-d),d?(c=b.getMinPos(),f.movableContainerLeftPos<c?f.movableContainerLeftPos=c:f.movableContainerLeftPos>0&&(f.movableContainerLeftPos=0),b.slideMovableContainerToLeftPos()):f.scrollingTabsActiveOffset&&f.handleArrowsClassNames("left")))},e.setMovableContainerLeftPosToTabEdge=function(e){var o=this,n=o.stc,i=-n.movableContainerLeftPos,r=0;n.$tabsLiCollection.each(function(o){var a=t(this).width();if((r+=a)>i)return n.movableContainerLeftPos="left"===e?-(r-a):-r,!1})},e.slideMovableContainerToLeftPos=function(){var t,e=this,o=e.stc;o.movableContainerLeftPos=o.movableContainerLeftPos/1,t=e.getMovableContainerCssLeftVal(),o.$movableContainer.stop().animate({left:t},"slow",function(){var t=e.getMinPos();if(o.movableContainerLeftPos<t&&(e.decrementMovableContainerLeftPos(t),o.$movableContainer.stop().animate({left:e.getMovableContainerCssLeftVal()},"fast")),o.scrollingTabsActiveOffset){var n;o.movableContainerLeftPos<=0&&o.movableContainerLeftPos>=-2?n="left":o.movableContainerLeftPos-t>=0&&o.movableContainerLeftPos-t<=2&&(n="right"),o.handleArrowsClassNames(n)}})},e.startScrollLeft=function(){var t=this;t.stc.$leftScrollArrow.data(c.DATA_KEY_IS_MOUSEDOWN,!0),t.continueScrollLeft()},e.startScrollRight=function(){var t=this;t.stc.$rightScrollArrow.data(c.DATA_KEY_IS_MOUSEDOWN,!0),t.continueScrollRight(t.getMinPos())},e.stopScrollLeft=function(){this.stc.$leftScrollArrow.data(c.DATA_KEY_IS_MOUSEDOWN,!1)},e.stopScrollRight=function(){this.stc.$rightScrollArrow.data(c.DATA_KEY_IS_MOUSEDOWN,!1)}}(i.prototype),function(t){t.handleTriggeredRefresh=function(){var t=this,e=t.scrollMovement;t.elementsHandler.refreshAllElementSizes(!0).didScrollToActiveTab||t.$timeout(function(){e.scrollToActiveTab({isOnTabsRefresh:!0})},t.scrollingTabsActiveOffset?200:100)},t.initTabs=function(t){var e=this,o=e.elementsHandler,n=e.scrollMovement;t.scrollToTabEdge&&(e.scrollToTabEdge=!0),e.$timeout(function(){var e;o.initElements(t),e=o.refreshAllElementSizes(),e.didScrollToActiveTab||n.scrollToActiveTab({isOnTabsRefresh:t.isWatchingTabs})},100)},t.handleArrowsClassNames=function(t){var e=this,o="scrtabs-tab-scroll-arrow--is-on-edge",n={left:e.$leftScrollArrow,right:e.$rightScrollArrow};t?(n[t].addClass(o),n["left"==t?"right":"left"].removeClass(o)):(n.left.removeClass(o),n.right.removeClass(o))}}(r.prototype),l.directive("scrollingTabs",a),a.$inject=["$timeout","$sce"],l.directive("scrollingTabsWrapper",s),s.$inject=["$timeout"]}(jQuery,window);