UNPKG

angular-material

Version:

This repository publishes the AngularJS Material v1.x library and localized installs using `npm`. You can find the component source-code for this library in the [AngularJS Material repository](https://github.com/angular/material).

140 lines (132 loc) 3.96 kB
/*! * AngularJS Material Design * https://github.com/angular/material * @license MIT * v1.2.1 */ (function( window, angular, undefined ){ "use strict"; /** * @ngdoc module * @name material.components.swipe * @description Swipe module! */ /** * @ngdoc directive * @module material.components.swipe * @name mdSwipeLeft * * @restrict A * * @description * The md-swipe-left directive allows you to specify custom behavior when an element is swiped * left. * * ### Notes * - The `$event.currentTarget` of the swiped element will be `null`, but you can get a * reference to the element that actually holds the `md-swipe-left` directive by using * `$target.current` * * > You can see this in action on the <a ng-href="demo/swipe">demo page</a> (Look at the Developer * Tools console while swiping). * * @usage * <hljs lang="html"> * <div md-swipe-left="onSwipeLeft($event, $target)">Swipe me left!</div> * </hljs> */ /** * @ngdoc directive * @module material.components.swipe * @name mdSwipeRight * * @restrict A * * @description * The md-swipe-right directive allows you to specify custom behavior when an element is swiped * right. * * ### Notes * - The `$event.currentTarget` of the swiped element will be `null`, but you can get a * reference to the element that actually holds the `md-swipe-right` directive by using * `$target.current` * * > You can see this in action on the <a ng-href="demo/swipe">demo page</a> (Look at the Developer * Tools console while swiping). * * @usage * <hljs lang="html"> * <div md-swipe-right="onSwipeRight($event, $target)">Swipe me right!</div> * </hljs> */ /** * @ngdoc directive * @module material.components.swipe * @name mdSwipeUp * * @restrict A * * @description * The md-swipe-up directive allows you to specify custom behavior when an element is swiped * up. * * ### Notes * - The `$event.currentTarget` of the swiped element will be `null`, but you can get a * reference to the element that actually holds the `md-swipe-up` directive by using * `$target.current` * * > You can see this in action on the <a ng-href="demo/swipe">demo page</a> (Look at the Developer * Tools console while swiping). * * @usage * <hljs lang="html"> * <div md-swipe-up="onSwipeUp($event, $target)">Swipe me up!</div> * </hljs> */ /** * @ngdoc directive * @module material.components.swipe * @name mdSwipeDown * * @restrict A * * @description * The md-swipe-down directive allows you to specify custom behavior when an element is swiped * down. * * ### Notes * - The `$event.currentTarget` of the swiped element will be `null`, but you can get a * reference to the element that actually holds the `md-swipe-down` directive by using * `$target.current` * * > You can see this in action on the <a ng-href="demo/swipe">demo page</a> (Look at the Developer * Tools console while swiping). * * @usage * <hljs lang="html"> * <div md-swipe-down="onSwipeDown($event, $target)">Swipe me down!</div> * </hljs> */ angular.module('material.components.swipe', ['material.core']) .directive('mdSwipeLeft', getDirective('SwipeLeft')) .directive('mdSwipeRight', getDirective('SwipeRight')) .directive('mdSwipeUp', getDirective('SwipeUp')) .directive('mdSwipeDown', getDirective('SwipeDown')); function getDirective(name) { DirectiveFactory['$inject'] = ["$parse"]; var directiveName = 'md' + name; var eventName = '$md.' + name.toLowerCase(); return DirectiveFactory; /* ngInject */ function DirectiveFactory($parse) { return { restrict: 'A', link: postLink }; function postLink(scope, element, attr) { var fn = $parse(attr[directiveName]); element.on(eventName, function(ev) { var currentTarget = ev.currentTarget; scope.$applyAsync(function() { fn(scope, { $event: ev, $target: { current: currentTarget } }); }); }); } } } })(window, window.angular);