angular-material-design-lite
Version:
Angular wrapper for Material Design Lite.
3 lines (2 loc) • 6 kB
JavaScript
!function(){"use strict";angular.module("mdl",[]),angular.module("mdl").provider("mdlConfig",function(){var e=this;this.floating=!0,this.rippleEffect=!0,e.$get=function(){return e}}),angular.module("mdl").directive("mdlTextField",["mdlConfig",function(e){return{restrict:"A",template:"",scope:{},link:function(l,a,n){var t=n.placeholder||"",d=e.floating?"mdl-textfield--floating-label":"",s=angular.element('<div class="mdl-textfield mdl-js-textfield '+d+'" ng-class="ngClass"></div>'),t=angular.element('<label class="mdl-textfield__label">'+t+"</label>");a[0].classList.add("mdl-textfield__input"),a[0].placeholder="",a.after(s),s.prepend(a),s.prepend(t),l.$on("$destroy",function(){s.after(a),s.remove()})}}}]),angular.module("mdl").directive("mdlCheckbox",["mdlConfig",function(e){return{restrict:"E",template:'<label class="mdl-checkbox mdl-js-checkbox" ng-class="ngClass"><input type="checkbox" ng-model="ngModel" class="mdl-checkbox__input" /><span class="mdl-checkbox__label">{{label}}</span></label>',scope:{ngModel:"="},link:function(l,a,n){l.label=n.label,l.ngClass={"mdl-js-ripple-effect":e.rippleEffect}}}}]),angular.module("mdl").directive("mdlRadio",["mdlConfig",function(e){return{restrict:"E",template:'<label class="mdl-radio mdl-js-radio" ng-class="ngClass"><input type="radio" ng-model="ngModel" class="mdl-radio__button" name="options" value="{{value}}" /><span class="mdl-radio__label">{{label}}</span></label>',scope:{ngModel:"="},link:function(l,a,n){l.label=n.label,l.value=n.value,l.ngClass={"mdl-js-ripple-effect":e.rippleEffect}}}}]),angular.module("mdl").directive("mdlSwitch",["mdlConfig",function(e){return{restrict:"E",template:'<label class="mdl-switch mdl-js-switch" ng-class="ngClass"><input type="checkbox" ng-model="ngModel" class="mdl-switch__input" ng-checked="ngModel" /><span class="mdl-switch__label">{{label}}</span></label>',scope:{ngModel:"="},link:function(l,a,n){l.label=n.label,l.ngClass={"mdl-js-ripple-effect":e.rippleEffect},l.$watch(function(){return l.ngModel},function(e){return a[0].childNodes[0]&&a[0].childNodes[0].MaterialSwitch?void(e?a[0].childNodes[0].MaterialSwitch.on():a[0].childNodes[0].MaterialSwitch.off()):!1})}}}]),angular.module("mdl").directive("mdlButton",["mdlConfig",function(e){return{restrict:"E",template:'<button class="mdl-button mdl-js-button" ng-class="ngClass" ng-transclude></button>',scope:{ngModel:"="},transclude:!0,link:function(l,a,n){l.ngClass={"mdl-js-ripple-effect":e.rippleEffect,"mdl-button--primary":"primary"===n.theme,"mdl-button--accent":"accent"===n.theme}}}}]),angular.module("mdl").directive("mdlButtonRaised",["mdlConfig",function(e){return{restrict:"E",template:'<button class="mdl-button mdl-js-button mdl-button--raised" ng-class="ngClass" ng-transclude></button>',scope:{ngModel:"="},transclude:!0,link:function(l,a,n){l.ngClass={"mdl-js-ripple-effect":e.rippleEffect,"mdl-button--primary":"primary"===n.theme,"mdl-button--accent":"accent"===n.theme}}}}]),angular.module("mdl").directive("mdlProgress",["mdlConfig",function(e){return{restrict:"E",template:'<div id="p1" class="mdl-progress mdl-js-progress" ng-model="ngModel"></div>',scope:{ngModel:"="},transclude:!0,link:function(e,l,a){a.$observe("progress",function(e){if(e=parseInt(e)){var a=l[0].childNodes[0];a.MaterialProgress?a.MaterialProgress.setProgress(e):a.addEventListener("mdl-componentupgraded",function(){a.MaterialProgress.setProgress(e)})}})}}}]),angular.module("mdl").directive("mdlSpinner",["mdlConfig",function(e){return{restrict:"E",template:'<div class="mdl-spinner mdl-js-spinner is-active" ng-class="ngClass" ng-model="ngModel"></div>',scope:{ngModel:"="},link:function(e,l,a){e.ngClass={"mdl-spinner--single-color":a.singleColor}}}}]),angular.module("mdl").directive("mdlUpgrade",["$timeout",function(e){return{restrict:"A",compile:function(){return{post:function(l,a){e(function(){componentHandler.upgradeElements(a[0])},0)}}}}}]),angular.module("mdl").directive("mdlNavigationLayout",["mdlConfig",function(e){return{restrict:"E",transclude:!0,template:'<div class="mdl-layout mdl-js-layout {{classlist}}" ng-class="layoutClasses"><header class="mdl-layout__header" ng-class="headerClasses" ng-show="showHeader"><div class="mdl-layout__header-row"><span class="mdl-layout-title">{{mdlHeaderTitle}}</span><div class="mdl-layout-spacer"></div><nav class="mdl-navigation"><span ng-repeat="el in mdlHeaderItems"><a class="mdl-navigation__link" ng-show="!el.download"ng-href="{{el.href||\'\'}}" hreflang="{{el.hreflang||\'\'}}" media="{{el.media||\'\'}}" rel="{{el.rel||\'\'}}" shape="{{el.shape||\'\'}}" target="{{el.target||\'_self\'}}" type="{{el.type||\'text/html\'}}" ng-click="el.onclick()">{{el.text}}</a><a class="mdl-navigation__link" ng-show="!!el.download" download ng-href="{{el.href||\'\'}}">{{el.text}}</a></span></nav></div></header><div class="mdl-layout__drawer"><span class="mdl-layout-title">{{mdlMenuTitle}}</span><nav class="mdl-navigation"><span ng-repeat="el in mdlMenuItems"><a class="mdl-navigation__link" ng-show="!el.download"ng-href="{{el.href||\'\'}}" hreflang="{{el.hreflang||\'\'}}" media="{{el.media||\'\'}}" rel="{{el.rel||\'\'}}" shape="{{el.shape||\'\'}}" target="{{el.target||\'_self\'}}" type="{{el.type||\'text/html\'}}" ng-click="el.onclick()">{{el.text}}</a><a class="mdl-navigation__link" ng-show="!!el.download" download ng-href="{{el.href||\'\'}}">{{el.text}}</a></span></nav></div><main class="mdl-layout__content" ng-transclude></main></div>',scope:{"class":"@",mdlMenuItems:"=",mdlMenuTitle:"=",mdlHeaderItems:"=",mdlHeaderTitle:"="},link:function(e,l,a){e.classlist=a["class"],e.mdlFixedDrawer=a.mdlFixedDrawer,e.mdlHeaderTransparent=a.mdlHeaderTransparent,e.mdlFixedHeader=a.mdlFixedHeader,e.showHeader=!a.mdlHeaderHidden,e.layoutClasses={"mdl-layout--fixed-drawer":a.mdlFixedDrawer},e.headerClasses={"mdl-layout__header--transparent":a.mdlHeaderTransparent,"mdl-layout--fixed-header":a.mdlFixedHeader}}}}])}();
//# sourceMappingURL=angular-material-design-lite.min.js.map