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

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