Skip to content

Instantly share code, notes, and snippets.

@udayms
Forked from phindmarsh/directives.js
Last active December 14, 2015 03:49
Show Gist options
  • Save udayms/5024113 to your computer and use it in GitHub Desktop.
Save udayms/5024113 to your computer and use it in GitHub Desktop.
Ported for Hammer v2 events. The v2 version of Hammer can be found at https://github.com/EightMedia/hammer.js/tree/v2. Demos at http://eightmedia.github.com/hammer.js/v2/
/**
* Inspired by AngularJS' implementation of "click dblclick mousedown..."
*
* This ties in the Hammer v2 events to attributes like:
* The v2 version of Hammer can be found at https://github.com/EightMedia/hammer.js/tree/v2
*
* hm-tap="add_something()"
* hm-swipe="remove_something()"
*
* and also has support for Hammer options with:
*
* hm-tap-opts="{hold: false}"
*
* or any other of the "hm-event" listed underneath.
*/
angular.forEach('hmHold:hold hmTap:tap hmDoubleTap:doubletap hmDrag:drag hmDragStart:dragstart hmDragEnd:dragend hmDragUp:dragup hmDragDown:dragdown hmDragLeft:dragleft hmDragRight:dragright hmSwipe:swipe hmSwipeUp:swipeup hmSwipeDown:swipedown hmSwipeLeft:swipeleft hmSwipeRight:swiperight hmTransform:transform hmTransformStart:transformstart hmTransformEnd:transformend hmRotate:rotate hmPinch:pinch hmPinchIn:pinchin hmPinchOut:pinchout hmTouch:touch hmRelease:release'.split(' '), function(eventlist) {
var directive = eventlist.split(':');
var directiveName = directive[0];
var eventName = directive[1];
angular.module('YOUR_MODULE_NAME', []).directive(directiveName, ['$parse', function($parse) {
return function(scope, element, attr) {
var fn = $parse(attr[directiveName]);
var opts = $parse(attr[directiveName + 'Opts'])(scope, {});
var hammertime = Hammer(element[0], opts).on(eventName, function(event) {
scope.$apply(function() {
fn(scope, {
$event: event
});
});
});
};
}]);
});
somewhere near the bottom of the page:
<!-- Hammer JS for multi-touch events -->
<script src="static/js/libs/hammer.js"></script>
<!-- AngularJS libs -->
<script src="static/js/libs/angular/angular-1.0.1.min.js"></script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment