ecomp-portal-FE/client/bower_components/angular-material/modules/closure/list/list.js

   1 /*!
   2  * Angular Material Design
   3  * https://github.com/angular/material
   4  * @license MIT
   5  * v0.9.8
   6  */
   7 goog.provide('ng.material.components.list');
   8 goog.require('ng.material.core');
   9 /**
  10  * @ngdoc module
  11  * @name material.components.list
  12  * @description
  13  * List module
  14  */
  15 angular.module('material.components.list', [
  16   'material.core'
  17 ])
  18   .controller('MdListController', MdListController)
  19   .directive('mdList', mdListDirective)
  20   .directive('mdListItem', mdListItemDirective);
  21
  22 /**
  23  * @ngdoc directive
  24  * @name mdList
  25  * @module material.components.list
  26  *
  27  * @restrict E
  28  *
  29  * @description
  30  * The `<md-list>` directive is a list container for 1..n `<md-list-item>` tags.
  31  *
  32  * @usage
  33  * <hljs lang="html">
  34  * <md-list>
  35  *   <md-list-item class="md-2-line" ng-repeat="item in todos">
  36  *     <md-checkbox ng-model="item.done"></md-checkbox>
  37  *     <div class="md-list-item-text">
  38  *       <h3>{{item.title}}</h3>
  39  *       <p>{{item.description}}</p>
  40  *     </div>
  41  *   </md-list-item>
  42  * </md-list>
  43  * </hljs>
  44  */
  45
  46 function mdListDirective($mdTheming) {
  47   return {
  48     restrict: 'E',
  49     compile: function(tEl) {
  50       tEl[0].setAttribute('role', 'list');
  51       return $mdTheming;
  52     }
  53   };
  54 }
  55 mdListDirective.$inject = ["$mdTheming"];
  56 /**
  57  * @ngdoc directive
  58  * @name mdListItem
  59  * @module material.components.list
  60  *
  61  * @restrict E
  62  *
  63  * @description
  64  * The `<md-list-item>` directive is a container intended for row items in a `<md-list>` container.
  65  *
  66  * @usage
  67  * <hljs lang="html">
  68  *  <md-list>
  69  *    <md-list-item>
  70  *            Item content in list
  71  *    </md-list-item>
  72  *  </md-list>
  73  * </hljs>
  74  *
  75  */
  76 function mdListItemDirective($mdAria, $mdConstant, $timeout) {
  77   var proxiedTypes = ['md-checkbox', 'md-switch'];
  78   return {
  79     restrict: 'E',
  80     controller: 'MdListController',
  81     compile: function(tEl, tAttrs) {
  82       // Check for proxy controls (no ng-click on parent, and a control inside)
  83       var secondaryItem = tEl[0].querySelector('.md-secondary');
  84       var hasProxiedElement;
  85       var proxyElement;
  86
  87       tEl[0].setAttribute('role', 'listitem');
  88
  89       if (!tAttrs.ngClick) {
  90         for (var i = 0, type; type = proxiedTypes[i]; ++i) {
  91           if (proxyElement = tEl[0].querySelector(type)) {
  92             hasProxiedElement = true;
  93             break;
  94           }
  95         }
  96         if (hasProxiedElement) {
  97           wrapIn('div');
  98         } else if (!tEl[0].querySelector('md-button')) {
  99           tEl.addClass('md-no-proxy');
 100         }
 101       } else {
 102         wrapIn('button');
 103       }
 104       setupToggleAria();
 105
 106
 107       function setupToggleAria() {
 108         var toggleTypes = ['md-switch', 'md-checkbox'];
 109         var toggle;
 110
 111         for (var i = 0, toggleType; toggleType = toggleTypes[i]; ++i) {
 112           if (toggle = tEl.find(toggleType)[0]) {
 113             if (!toggle.hasAttribute('aria-label')) {
 114               var p = tEl.find('p')[0];
 115               if (!p) return;
 116               toggle.setAttribute('aria-label', 'Toggle ' + p.textContent);
 117             }
 118           }
 119         }
 120       }
 121
 122       function wrapIn(type) {
 123         var container;
 124         if (type == 'div') {
 125           container = angular.element('<div class="md-no-style md-list-item-inner">');
 126           container.append(tEl.contents());
 127           tEl.addClass('md-proxy-focus');
 128         } else {
 129           container = angular.element('<md-button class="md-no-style"><div class="md-list-item-inner"></div></md-button>');
 130           var copiedAttrs = ['ng-click', 'aria-label', 'ng-disabled'];
 131           angular.forEach(copiedAttrs, function(attr) {
 132             if (tEl[0].hasAttribute(attr)) {
 133               container[0].setAttribute(attr, tEl[0].getAttribute(attr));
 134               tEl[0].removeAttribute(attr);
 135             }
 136           });
 137           container.children().eq(0).append(tEl.contents());
 138         }
 139
 140         tEl[0].setAttribute('tabindex', '-1');
 141         tEl.append(container);
 142
 143         if (secondaryItem && secondaryItem.hasAttribute('ng-click')) {
 144           $mdAria.expect(secondaryItem, 'aria-label');
 145           var buttonWrapper = angular.element('<md-button class="md-secondary-container md-icon-button">');
 146           buttonWrapper.attr('ng-click', secondaryItem.getAttribute('ng-click'));
 147           secondaryItem.removeAttribute('ng-click');
 148           secondaryItem.setAttribute('tabindex', '-1');
 149           secondaryItem.classList.remove('md-secondary');
 150           buttonWrapper.append(secondaryItem);
 151           secondaryItem = buttonWrapper[0];
 152         }
 153
 154         // Check for a secondary item and move it outside
 155         if ( secondaryItem && (
 156           secondaryItem.hasAttribute('ng-click') ||
 157             ( tAttrs.ngClick &&
 158              isProxiedElement(secondaryItem) )
 159         )) {
 160           tEl.addClass('md-with-secondary');
 161           tEl.append(secondaryItem);
 162         }
 163       }
 164
 165       function isProxiedElement(el) {
 166         return proxiedTypes.indexOf(el.nodeName.toLowerCase()) != -1;
 167       }
 168
 169       return postLink;
 170
 171       function postLink($scope, $element, $attr, ctrl) {
 172
 173         var proxies    = [],
 174             firstChild = $element[0].firstElementChild,
 175             hasClick   = firstChild && firstChild.hasAttribute('ng-click');
 176
 177         computeProxies();
 178         computeClickable();
 179
 180         if ($element.hasClass('md-proxy-focus') && proxies.length) {
 181           angular.forEach(proxies, function(proxy) {
 182             proxy = angular.element(proxy);
 183
 184             $scope.mouseActive = false;
 185             proxy.on('mousedown', function() {
 186               $scope.mouseActive = true;
 187               $timeout(function(){
 188                 $scope.mouseActive = false;
 189               }, 100);
 190             })
 191             .on('focus', function() {
 192               if ($scope.mouseActive === false) { $element.addClass('md-focused'); }
 193               proxy.on('blur', function proxyOnBlur() {
 194                 $element.removeClass('md-focused');
 195                 proxy.off('blur', proxyOnBlur);
 196               });
 197             });
 198           });
 199         }
 200
 201         function computeProxies() {
 202           var children = $element.children();
 203           if (children.length && !children[0].hasAttribute('ng-click')) {
 204             angular.forEach(proxiedTypes, function(type) {
 205               angular.forEach(firstChild.querySelectorAll(type), function(child) {
 206                 proxies.push(child);
 207               });
 208             });
 209           }
 210         }
 211         function computeClickable() {
 212           if (proxies.length || hasClick) {
 213             $element.addClass('md-clickable');
 214
 215             ctrl.attachRipple($scope, angular.element($element[0].querySelector('.md-no-style')));
 216           }
 217         }
 218
 219         if (!hasClick && !proxies.length) {
 220           firstChild && firstChild.addEventListener('keypress', function(e) {
 221             if (e.target.nodeName != 'INPUT' && e.target.nodeName != 'TEXTAREA') {
 222               var keyCode = e.which || e.keyCode;
 223               if (keyCode == $mdConstant.KEY_CODE.SPACE) {
 224                 if (firstChild) {
 225                   firstChild.click();
 226                   e.preventDefault();
 227                   e.stopPropagation();
 228                 }
 229               }
 230             }
 231           });
 232         }
 233
 234         $element.off('click');
 235         $element.off('keypress');
 236
 237         if (proxies.length && firstChild) {
 238           $element.children().eq(0).on('click', function(e) {
 239             if (firstChild.contains(e.target)) {
 240               angular.forEach(proxies, function(proxy) {
 241                 if (e.target !== proxy && !proxy.contains(e.target)) {
 242                   angular.element(proxy).triggerHandler('click');
 243                 }
 244               });
 245             }
 246           });
 247         }
 248       }
 249     }
 250   };
 251 }
 252 mdListItemDirective.$inject = ["$mdAria", "$mdConstant", "$timeout"];
 253
 254 /*
 255  * @private
 256  * @ngdoc controller
 257  * @name MdListController
 258  * @module material.components.list
 259  *
 260  */
 261 function MdListController($scope, $element, $mdListInkRipple) {
 262   var ctrl = this;
 263   ctrl.attachRipple = attachRipple;
 264
 265   function attachRipple (scope, element) {
 266     var options = {};
 267     $mdListInkRipple.attach(scope, element, options);
 268   }
 269 }
 270 MdListController.$inject = ["$scope", "$element", "$mdListInkRipple"];
 271
 272
 273 ng.material.components.list = angular.module("material.components.list");