gerrit.onap Code Review - vnfsdk/refrepo.git/blob

   1 /*!
   2  * Angular Material Design
   3  * https://github.com/angular/material
   4  * @license MIT
   5  * v0.9.0-rc1-master-3c0ce9b
   6  */
   7 (function() {
   8 'use strict';
   9
  10 /**
  11  * @ngdoc module
  12  * @name material.components.textField
  13  * @description
  14  * Form
  15  */
  16 angular.module('material.components.textField', [
  17   'material.core'
  18 ])
  19   .directive('mdInputGroup', mdInputGroupDirective)
  20   .directive('mdInput', mdInputDirective)
  21   .directive('mdTextFloat', mdTextFloatDirective);
  22
  23
  24 function mdTextFloatDirective($mdTheming, $mdUtil, $parse, $log) {
  25   return {
  26     restrict: 'E',
  27     replace: true,
  28     scope : {
  29       fid : '@?mdFid',
  30       label : '@?',
  31       value : '=ngModel'
  32     },
  33     compile : function(element, attr) {
  34
  35       $log.warn('<md-text-float> is deprecated. Please use `<md-input-container>` and `<input>`.' +
  36                 'More information at http://material.angularjs.org/#/api/material.components.input/directive/mdInputContainer');
  37
  38       if ( angular.isUndefined(attr.mdFid) ) {
  39         attr.mdFid = $mdUtil.nextUid();
  40       }
  41
  42       return {
  43         pre : function(scope, element, attrs) {
  44           var disabledParsed = $parse(attrs.ngDisabled);
  45           scope.isDisabled = function() {
  46             return disabledParsed(scope.$parent);
  47           };
  48
  49           scope.inputType = attrs.type || "text";
  50         },
  51         post: $mdTheming
  52       };
  53     },
  54     template:
  55     '<md-input-group tabindex="-1">' +
  56     ' <label for="{{fid}}" >{{label}}</label>' +
  57     ' <md-input id="{{fid}}" ng-disabled="isDisabled()" ng-model="value" type="{{inputType}}"></md-input>' +
  58     '</md-input-group>'
  59   };
  60 }
  61 mdTextFloatDirective.$inject = ["$mdTheming", "$mdUtil", "$parse", "$log"];
  62
  63 function mdInputGroupDirective($log) {
  64   return {
  65     restrict: 'CE',
  66     controller: ['$element', function($element) {
  67
  68       $log.warn('<md-input-group> is deprecated. Please use `<md-input-container>` and `<input>`.' +
  69                 'More information at http://material.angularjs.org/#/api/material.components.input/directive/mdInputContainer');
  70       this.setFocused = function(isFocused) {
  71         $element.toggleClass('md-input-focused', !!isFocused);
  72       };
  73       this.setHasValue = function(hasValue) {
  74         $element.toggleClass('md-input-has-value', hasValue );
  75       };
  76     }]
  77   };
  78
  79 }
  80 mdInputGroupDirective.$inject = ["$log"];
  81
  82 function mdInputDirective($mdUtil, $log) {
  83   return {
  84     restrict: 'E',
  85     replace: true,
  86     template: '<input >',
  87     require: ['^?mdInputGroup', '?ngModel'],
  88     link: function(scope, element, attr, ctrls) {
  89       if ( !ctrls[0] ) return;
  90
  91       $log.warn('<md-input> is deprecated. Please use `<md-input-container>` and `<input>`.' +
  92                 'More information at http://material.angularjs.org/#/api/material.components.input/directive/mdInputContainer');
  93
  94       var inputGroupCtrl = ctrls[0];
  95       var ngModelCtrl = ctrls[1];
  96
  97       scope.$watch(scope.isDisabled, function(isDisabled) {
  98         element.attr('aria-disabled', !!isDisabled);
  99         element.attr('tabindex', !!isDisabled);
 100       });
 101       element.attr('type', attr.type || element.parent().attr('type') || "text");
 102
 103       // When the input value changes, check if it "has" a value, and
 104       // set the appropriate class on the input group
 105       if (ngModelCtrl) {
 106         //Add a $formatter so we don't use up the render function
 107         ngModelCtrl.$formatters.push(function(value) {
 108           inputGroupCtrl.setHasValue( isNotEmpty(value) );
 109           return value;
 110         });
 111       }
 112
 113       element
 114         .on('input', function() {
 115           inputGroupCtrl.setHasValue( isNotEmpty() );
 116         })
 117         .on('focus', function(e) {
 118           // When the input focuses, add the focused class to the group
 119           inputGroupCtrl.setFocused(true);
 120         })
 121         .on('blur', function(e) {
 122           // When the input blurs, remove the focused class from the group
 123           inputGroupCtrl.setFocused(false);
 124           inputGroupCtrl.setHasValue( isNotEmpty() );
 125         });
 126
 127       scope.$on('$destroy', function() {
 128         inputGroupCtrl.setFocused(false);
 129         inputGroupCtrl.setHasValue(false);
 130       });
 131
 132
 133       function isNotEmpty(value) {
 134         value = angular.isUndefined(value) ? element.val() : value;
 135         return (angular.isDefined(value) && (value!==null) &&
 136                (value.toString().trim() !== ""));
 137       }
 138     }
 139   };
 140 }
 141 mdInputDirective.$inject = ["$mdUtil", "$log"];
 142
 143 })();