I have a mobile Web app framework with custom gestures for touch devices
(Android, iOS and Windows Phone 8). The events are: tap, singeltap,
longtap, doubletap, swipe, swipeleft, swiperight, swipeup swipedown. They
are currently exposed on the DOM through use of the following jQuery code:
['swipe', 'swipeleft', 'swiperight', 'swipeup', 'swipedown', 'tap',
doubletap', 'singletap', 'longtap'].forEach(function(method){
// Add gesture events to jQuery:
$.fn.extend({
method : function(callback){
return this.on(method, callback);
}
});
});
I would like to enable the use of the framework with Angularjs. Although
the framework works fine with Angularjs on desktop browsers, the gestures
don't work with Angular on mobile. Well, that's because the framework
checks for the platform. On desktop it creates these gestures with mouse
equivalents. On mobile they're implemented with touch and pointer events,
depending on the platform. The inclusion of the Angular Touch module does
not resolve this problem.
I'd like to create a module which the framework users could inject in their
app to enable the use of the framework's gestures just like the default
Angular event directives. I noticed that if I included my events in the
string used by "ngEventDirectives" in the Angular source code, that these
events work just like the Angular ones. I do not expect users to do this.
Besides, ngEventDirectives gets processed at load time, hence is not
extendible after page load.
I've scoured the Web searching for examples or information on how to create
custom event directives that work like the Angular ones. However, all I've
found are custom events used inside of element directives, or customs
events with event handlers directly defined inside the directive. I'd like
to find a solution where the event directive would handle whatever function
the user provided in the attribute, just like ng-click="doSomething()", for
example:
<li cc-singletap="obj.doSomething()">Blah</li>
<p cc-singletap="doSomethingElse()>Blah blah.</p>
<a cc-singletap="someElseEntirely()" class="button">Tap</a>
Any help or direction on how to create these event directives would be
greatly appreciated.
--
You received this message because you are subscribed to the Google Groups
"AngularJS" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at http://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.
