|
|
/*! * Angular Material Design * https://github.com/angular/material
* @license MIT * v1.1.0-master-2b98560 */function MdTab(){function e(e,n,a,s){if(s){var r=s.getTabElementIndex(n),d=t(n,"md-tab-body").remove(),i=t(n,"md-tab-label").remove(),o=s.insertTab({scope:e,parent:e.$parent,index:r,element:n,template:d.html(),label:i.html()},r);e.select=e.select||angular.noop,e.deselect=e.deselect||angular.noop,e.$watch("active",function(e){e&&s.select(o.getIndex(),!0)}),e.$watch("disabled",function(){s.refreshIndex()}),e.$watch(function(){return s.getTabElementIndex(n)},function(e){o.index=e,s.updateTabOrder()}),e.$on("$destroy",function(){s.removeTab(o)})}}function t(e,t){for(var n=e[0].children,a=0,s=n.length;a<s;a++){var r=n[a];if(r.tagName===t.toUpperCase())return angular.element(r)}return angular.element()}return{require:"^?mdTabs",terminal:!0,compile:function(n,a){var s=t(n,"md-tab-label"),r=t(n,"md-tab-body");if(0==s.length&&(s=angular.element("<md-tab-label></md-tab-label>"),a.label?s.text(a.label):s.append(n.contents()),0==r.length)){var d=n.contents().detach();r=angular.element("<md-tab-body></md-tab-body>"),r.append(d)}return n.append(s),r.html()&&n.append(r),e},scope:{active:"=?mdActive",disabled:"=?ngDisabled",select:"&?mdOnSelect",deselect:"&?mdOnDeselect"}}}function MdTabItem(){return{require:"^?mdTabs",link:function(e,t,n,a){a&&a.attachRipple(e,t)}}}function MdTabLabel(){return{terminal:!0}}function MdTabScroll(e){return{restrict:"A",compile:function(t,n){var a=e(n.mdTabScroll,null,!0);return function(e,t){t.on("mousewheel",function(t){e.$apply(function(){a(e,{$event:t})})})}}}}function MdTabsController(e,t,n,a,s,r,d,i,o,c){function l(){oe.selectedIndex=oe.selectedIndex||0,b(),m(),u(),c(t),r.nextTick(function(){le=R(),ae(),Z(),se(),oe.tabs[oe.selectedIndex]&&oe.tabs[oe.selectedIndex].scope.select(),me=!0,U()})}function b(){var e=i.$mdTabsTemplate,n=angular.element(t[0].querySelector("md-tab-data"));n.html(e),o(n.contents())(oe.parent),delete i.$mdTabsTemplate}function u(){angular.element(n).on("resize",D),e.$on("$destroy",g)}function m(){e.$watch("$mdTabsCtrl.selectedIndex",w)}function f(e,t){var n=i.$normalize("md-"+e);t&&z(e,t),i.$observe(n,function(t){oe[e]=t})}function p(e,t){function n(t){oe[e]="false"!==t}var a=i.$normalize("md-"+e);t&&z(e,t),i.hasOwnProperty(a)&&n(i[a]),i.$observe(a,n)}function g(){ue=!0,angular.element(n).off("resize",D)}function h(e){var t=R();angular.element(t.wrapper).toggleClass("md-stretch-tabs",H()),se()}function T(e){oe.shouldCenterTabs=_()}function x(e,t){if(e!==t){var n=R();angular.forEach(n.tabs,function(t){t.style.maxWidth=e+"px"}),r.nextTick(oe.updateInkBarStyles)}}function v(e,t){e!==t&&(oe.maxTabWidth=J(),oe.shouldCenterTabs=_(),r.nextTick(function(){oe.maxTabWidth=J(),Z(oe.selectedIndex)}))}function $(e){t[e?"removeClass":"addClass"]("md-no-tab-content")}function C(t){var n=R(),s=oe.shouldCenterTabs?"":"-"+t+"px";angular.element(n.paging).css(a.CSS.TRANSFORM,"translate3d("+s+", 0, 0)"),e.$broadcast("$mdTabsPaginationChanged")}function I(e,t){e!==t&&R().tabs[e]&&(Z(),X())}function w(t,n){t!==n&&(oe.selectedIndex=N(t),oe.lastSelectedIndex=n,oe.updateInkBarStyles(),ae(),Z(t),e.$broadcast("$mdTabsChanged"),oe.tabs[n]&&oe.tabs[n].scope.deselect(),oe.tabs[t]&&oe.tabs[t].scope.select())}function k(e){var n=t[0].getElementsByTagName("md-tab");return Array.prototype.indexOf.call(n,e[0])}function y(){y.watcher||(y.watcher=e.$watch(function(){r.nextTick(function(){y.watcher&&t.prop("offsetParent")&&(y.watcher(),y.watcher=null,D())},!1)}))}function S(e){switch(e.keyCode){case a.KEY_CODE.LEFT_ARROW:e.preventDefault(),V(-1,!0);break;case a.KEY_CODE.RIGHT_ARROW:e.preventDefault(),V(1,!0);break;case a.KEY_CODE.SPACE:case a.KEY_CODE.ENTER:e.preventDefault(),ce||M(oe.focusIndex)}oe.lastClick=!1}function M(e,t){ce||(oe.focusIndex=oe.selectedIndex=e),oe.lastClick=!0,t&&oe.noSelectClick||r.nextTick(function(){oe.tabs[e].element.triggerHandler("click")},!1)}function L(e){oe.shouldPaginate&&(e.preventDefault(),oe.offsetLeft=de(oe.offsetLeft-e.wheelDelta))}function P(){var e,t,n=R(),a=n.canvas.clientWidth,s=a+oe.offsetLeft;for(e=0;e<n.tabs.length&&(t=n.tabs[e],!(t.offsetLeft+t.offsetWidth>s));e++);a>t.offsetWidth?oe.offsetLeft=de(t.offsetLeft):oe.offsetLeft=de(t.offsetLeft+(t.offsetWidth-a+1))}function W(){var e,t,n=R();for(e=0;e<n.tabs.length&&(t=n.tabs[e],!(t.offsetLeft+t.offsetWidth>=oe.offsetLeft));e++);n.canvas.clientWidth>t.offsetWidth?oe.offsetLeft=de(t.offsetLeft+t.offsetWidth-n.canvas.clientWidth):oe.offsetLeft=de(t.offsetLeft)}function D(){oe.lastSelectedIndex=oe.selectedIndex,oe.offsetLeft=de(oe.offsetLeft),r.nextTick(function(){oe.updateInkBarStyles(),U()})}function E(e){angular.element(R().inkBar).toggleClass("ng-hide",e)}function O(e){t.toggleClass("md-dynamic-height",e)}function A(e){if(!ue){var t=oe.selectedIndex,n=oe.tabs.splice(e.getIndex(),1)[0];ne(),oe.selectedIndex===t&&(n.scope.deselect(),oe.tabs[oe.selectedIndex]&&oe.tabs[oe.selectedIndex].scope.select()),r.nextTick(function(){U(),oe.offsetLeft=de(oe.offsetLeft)})}}function B(e,t){var n=me,a={getIndex:function(){return oe.tabs.indexOf(s)},isActive:function(){return this.getIndex()===oe.selectedIndex},isLeft:function(){return this.getIndex()<oe.selectedIndex},isRight:function(){return this.getIndex()>oe.selectedIndex},shouldRender:function(){return!oe.noDisconnect||this.isActive()},hasFocus:function(){return!oe.lastClick&&oe.hasFocus&&this.getIndex()===oe.focusIndex},id:r.nextUid()},s=angular.extend(a,e);return angular.isDefined(t)?oe.tabs.splice(t,0,s):oe.tabs.push(s),ee(),te(),r.nextTick(function(){U(),n&&oe.autoselect&&r.nextTick(function(){r.nextTick(function(){M(oe.tabs.indexOf(s))})})}),s}function R(){var e={},n=t[0];return e.wrapper=n.querySelector("md-tabs-wrapper"),e.canvas=e.wrapper.querySelector("md-tabs-canvas"),e.paging=e.canvas.querySelector("md-pagination-wrapper"),e.inkBar=e.paging.querySelector("md-ink-bar"),e.contents=n.querySelectorAll("md-tabs-content-wrapper > md-tab-content"),e.tabs=e.paging.querySelectorAll("md-tab-item"),e.dummies=e.canvas.querySelectorAll("md-dummy-tab"),e}function q(){return oe.offsetLeft>0}function F(){var e=R(),t=e.tabs[e.tabs.length-1];return t&&t.offsetLeft+t.offsetWidth>e.canvas.clientWidth+oe.offsetLeft}function H(){switch(oe.stretchTabs){case"always":return!0;case"never":return!1;default:return!oe.shouldPaginate&&n.matchMedia("(max-width: 600px)").matches}}function _(){return oe.centerTabs&&!oe.shouldPaginate}function j(){if(oe.noPagination||!me)return!1;var e=t.prop("clientWidth");return angular.forEach(R().dummies,function(t){e-=t.offsetWidth}),e<0}function N(e){if(e===-1)return-1;var t,n,a=Math.max(oe.tabs.length-e,e);for(t=0;t<=a;t++){if(n=oe.tabs[e+t],n&&n.scope.disabled!==!0)return n.getIndex();if(n=oe.tabs[e-t],n&&n.scope.disabled!==!0)return n.getIndex()}return e}function z(e,t,n){Object.defineProperty(oe,e,{get:function(){return n},set:function(e){var a=n;n=e,t&&t(e,a)}})}function U(){K(),oe.maxTabWidth=J(),oe.shouldPaginate=j()}function K(){var e=R();H()?angular.element(e.paging).css("width",""):angular.element(e.paging).css("width",Y()+"px")}function Y(){return G(R().dummies)}function G(e){var t=0;return angular.forEach(e,function(e){t+=Math.max(e.offsetWidth,e.getBoundingClientRect().width)}),Math.ceil(t)}function J(){return t.prop("clientWidth")}function Q(){var e=oe.tabs[oe.selectedIndex],t=oe.tabs[oe.focusIndex];oe.tabs=oe.tabs.sort(function(e,t){return e.index-t.index}),oe.selectedIndex=oe.tabs.indexOf(e),oe.focusIndex=oe.tabs.indexOf(t)}function V(e,t){var n,a=t?"focusIndex":"selectedIndex",s=oe[a];for(n=s+e;oe.tabs[n]&&oe.tabs[n].scope.disabled;n+=e);oe.tabs[n]&&(oe[a]=n)}function X(){R().dummies[oe.focusIndex].focus()}function Z(e){var t=R();if(null==e&&(e=oe.focusIndex),t.tabs[e]&&!oe.shouldCenterTabs){var n=t.tabs[e],a=n.offsetLeft,s=n.offsetWidth+a;oe.offsetLeft=Math.max(oe.offsetLeft,de(s-t.canvas.clientWidth+64)),oe.offsetLeft=Math.min(oe.offsetLeft,de(a))}}function ee(){be.forEach(function(e){r.nextTick(e)}),be=[]}function te(){var e=!1;angular.forEach(oe.tabs,function(t){t.template&&(e=!0)}),oe.hasContent=e}function ne(){oe.selectedIndex=N(oe.selectedIndex),oe.focusIndex=N(oe.focusIndex)}function ae(){if(!oe.dynamicHeight)return t.css("height","");if(!oe.tabs.length)return be.push(ae);var e=R(),n=e.contents[oe.selectedIndex],a=n?n.offsetHeight:0,s=e.wrapper.offsetHeight,i=a+s,o=t.prop("clientHeight");if(o!==i){"bottom"===t.attr("md-align-tabs")&&(o-=s,i-=s,void 0!==t.attr("md-border-bottom")&&++o),ce=!0;var c={height:o+"px"},l={height:i+"px"};t.css(c),d(t,{from:c,to:l,easing:"cubic-bezier(0.35, 0, 0.25, 1)",duration:.5}).start().done(function(){t.css({transition:"none",height:""}),r.nextTick(function(){t.css("transition","")}),ce=!1})}}function se(){var e=R();if(!e.tabs[oe.selectedIndex])return void angular.element(e.inkBar).css({left:"auto",right:"auto"});if(!oe.tabs.length)return be.push(oe.updateInkBarStyles);if(!t.prop("offsetParent"))return y();var n=oe.selectedIndex,a=e.paging.offsetWidth,s=e.tabs[n],d=s.offsetLeft,i=a-d-s.offsetWidth;if(oe.shouldCenterTabs){var o=G(e.tabs);a>o&&r.nextTick(se,!1)}re(),angular.element(e.inkBar).css({left:d+"px",right:i+"px"})}function re(){var e=R(),t=oe.selectedIndex,n=oe.lastSelectedIndex,a=angular.element(e.inkBar);angular.isNumber(n)&&a.toggleClass("md-left",t<n).toggleClass("md-right",t>n)}function de(e){var t=R();if(!t.tabs.length||!oe.shouldPaginate)return 0;var n=t.tabs[t.tabs.length-1],a=n.offsetLeft+n.offsetWidth;return e=Math.max(0,e),e=Math.min(a-t.canvas.clientWidth,e)}function ie(e,t){var n=R(),a={colorElement:angular.element(n.inkBar)};s.attach(e,t,a)}var oe=this,ce=!1,le=R(),be=[],ue=!1,me=!1;f("stretchTabs",h),z("focusIndex",I,oe.selectedIndex||0),z("offsetLeft",C,0),z("hasContent",$,!1),z("maxTabWidth",x,J()),z("shouldPaginate",v,!1),p("noInkBar",E),p("dynamicHeight",O),p("noPagination"),p("swipeContent"),p("noDisconnect"),p("autoselect"),p("noSelectClick"),p("centerTabs",T,!1),p("enableDisconnect"),oe.scope=e,oe.parent=e.$parent,oe.tabs=[],oe.lastSelectedIndex=null,oe.hasFocus=!1,oe.lastClick=!0,oe.shouldCenterTabs=_(),oe.updatePagination=r.debounce(U,100),oe.redirectFocus=X,oe.attachRipple=ie,oe.insertTab=B,oe.removeTab=A,oe.select=M,oe.scroll=L,oe.nextPage=P,oe.previousPage=W,oe.keydown=S,oe.canPageForward=F,oe.canPageBack=q,oe.refreshIndex=ne,oe.incrementIndex=V,oe.getTabElementIndex=k,oe.updateInkBarStyles=r.debounce(se,100),oe.updateTabOrder=r.debounce(Q,100),l()}function MdTabs(e){return{scope:{selectedIndex:"=?mdSelected"},template:function(t,n){return n.$mdTabsTemplate=t.html(),'<md-tabs-wrapper> <md-tab-data></md-tab-data> <md-prev-button tabindex="-1" role="button" aria-label="Previous Page" aria-disabled="{{!$mdTabsCtrl.canPageBack()}}" ng-class="{ \'md-disabled\': !$mdTabsCtrl.canPageBack() }" ng-if="$mdTabsCtrl.shouldPaginate" ng-click="$mdTabsCtrl.previousPage()"> <md-icon md-svg-src="'+e.mdTabsArrow+'"></md-icon> </md-prev-button> <md-next-button tabindex="-1" role="button" aria-label="Next Page" aria-disabled="{{!$mdTabsCtrl.canPageForward()}}" ng-class="{ \'md-disabled\': !$mdTabsCtrl.canPageForward() }" ng-if="$mdTabsCtrl.shouldPaginate" ng-click="$mdTabsCtrl.nextPage()"> <md-icon md-svg-src="'+e.mdTabsArrow+'"></md-icon> </md-next-button> <md-tabs-canvas tabindex="{{ $mdTabsCtrl.hasFocus ? -1 : 0 }}" aria-activedescendant="tab-item-{{$mdTabsCtrl.tabs[$mdTabsCtrl.focusIndex].id}}" ng-focus="$mdTabsCtrl.redirectFocus()" ng-class="{ \'md-paginated\': $mdTabsCtrl.shouldPaginate, \'md-center-tabs\': $mdTabsCtrl.shouldCenterTabs }" ng-keydown="$mdTabsCtrl.keydown($event)" role="tablist"> <md-pagination-wrapper ng-class="{ \'md-center-tabs\': $mdTabsCtrl.shouldCenterTabs }" md-tab-scroll="$mdTabsCtrl.scroll($event)"> <md-tab-item tabindex="-1" class="md-tab" ng-repeat="tab in $mdTabsCtrl.tabs" role="tab" aria-controls="tab-content-{{::tab.id}}" aria-selected="{{tab.isActive()}}" aria-disabled="{{tab.scope.disabled || \'false\'}}" ng-click="$mdTabsCtrl.select(tab.getIndex())" ng-class="{ \'md-active\': tab.isActive(), \'md-focused\': tab.hasFocus(), \'md-disabled\': tab.scope.disabled }" ng-disabled="tab.scope.disabled" md-swipe-left="$mdTabsCtrl.nextPage()" md-swipe-right="$mdTabsCtrl.previousPage()" md-tabs-template="::tab.label" md-scope="::tab.parent"></md-tab-item> <md-ink-bar></md-ink-bar> </md-pagination-wrapper> <md-tabs-dummy-wrapper class="md-visually-hidden md-dummy-wrapper"> <md-dummy-tab class="md-tab" tabindex="-1" id="tab-item-{{::tab.id}}" role="tab" aria-controls="tab-content-{{::tab.id}}" aria-selected="{{tab.isActive()}}" aria-disabled="{{tab.scope.disabled || \'false\'}}" ng-focus="$mdTabsCtrl.hasFocus = true" ng-blur="$mdTabsCtrl.hasFocus = false" ng-repeat="tab in $mdTabsCtrl.tabs" md-tabs-template="::tab.label" md-scope="::tab.parent"></md-dummy-tab> </md-tabs-dummy-wrapper> </md-tabs-canvas> </md-tabs-wrapper> <md-tabs-content-wrapper ng-show="$mdTabsCtrl.hasContent && $mdTabsCtrl.selectedIndex >= 0" class="_md"> <md-tab-content id="tab-content-{{::tab.id}}" class="_md" role="tabpanel" aria-labelledby="tab-item-{{::tab.id}}" md-swipe-left="$mdTabsCtrl.swipeContent && $mdTabsCtrl.incrementIndex(1)" md-swipe-right="$mdTabsCtrl.swipeContent && $mdTabsCtrl.incrementIndex(-1)" ng-if="$mdTabsCtrl.hasContent" ng-repeat="(index, tab) in $mdTabsCtrl.tabs" ng-class="{ \'md-no-transition\': $mdTabsCtrl.lastSelectedIndex == null, \'md-active\': tab.isActive(), \'md-left\': tab.isLeft(), \'md-right\': tab.isRight(), \'md-no-scroll\': $mdTabsCtrl.dynamicHeight }"> <div md-tabs-template="::tab.template" md-connected-if="tab.isActive()" md-scope="::tab.parent" ng-if="$mdTabsCtrl.enableDisconnect || tab.shouldRender()"></div> </md-tab-content> </md-tabs-content-wrapper>'},controller:"MdTabsController",controllerAs:"$mdTabsCtrl",bindToController:!0}}function MdTabsDummyWrapper(e,t){return{require:"^?mdTabs",link:function(n,a,s,r){if(r){var d,i,o=function(){r.updatePagination(),r.updateInkBarStyles()};if("MutationObserver"in t){var c={childList:!0,subtree:!0,characterData:!0};d=new MutationObserver(o),d.observe(a[0],c),i=d.disconnect.bind(d)}else{var l=e.debounce(o,15,null,!1);a.on("DOMSubtreeModified",l),i=a.off.bind(a,"DOMSubtreeModified",l)}n.$on("$destroy",function(){i()})}}}}function MdTabsTemplate(e,t){function n(n,a,s,r){function d(){n.$watch("connected",function(e){e===!1?i():o()}),n.$on("$destroy",o)}function i(){r.enableDisconnect&&t.disconnectScope(c)}function o(){r.enableDisconnect&&t.reconnectScope(c)}if(r){var c=r.enableDisconnect?n.compileScope.$new():n.compileScope;return a.html(n.template),e(a.contents())(c),t.nextTick(d)}}return{restrict:"A",link:n,scope:{template:"=mdTabsTemplate",connected:"=?mdConnectedIf",compileScope:"=mdScope"},require:"^?mdTabs"}}goog.provide("ngmaterial.components.tabs"),goog.require("ngmaterial.components.icon"),goog.require("ngmaterial.core"),angular.module("material.components.tabs",["material.core","material.components.icon"]),angular.module("material.components.tabs").directive("mdTab",MdTab),angular.module("material.components.tabs").directive("mdTabItem",MdTabItem),angular.module("material.components.tabs").directive("mdTabLabel",MdTabLabel),MdTabScroll.$inject=["$parse"],angular.module("material.components.tabs").directive("mdTabScroll",MdTabScroll),MdTabsController.$inject=["$scope","$element","$window","$mdConstant","$mdTabInkRipple","$mdUtil","$animateCss","$attrs","$compile","$mdTheming"],angular.module("material.components.tabs").controller("MdTabsController",MdTabsController),MdTabs.$inject=["$$mdSvgRegistry"],angular.module("material.components.tabs").directive("mdTabs",MdTabs),MdTabsDummyWrapper.$inject=["$mdUtil","$window"],angular.module("material.components.tabs").directive("mdTabsDummyWrapper",MdTabsDummyWrapper),MdTabsTemplate.$inject=["$compile","$mdUtil"],angular.module("material.components.tabs").directive("mdTabsTemplate",MdTabsTemplate),ngmaterial.components.tabs=angular.module("material.components.tabs");
|
