Knockouch is a javascript library that adds touch bindings to knockoutjs library. So you can work with touch events in knockout way.
Adds bindings for: tap, doubletap, hold, rotate, drag, transform, swipe, pinch
Provides touch related event data, like distance, angle etc + knockout data.
By default works with any of 3 touch libraries: hammer, zepto, jquery.mobile. You can also add your own touch lib see details here.
Detects touch library you are using automatically. You can also set specific library explicitly
You can download the sources from github or use nuget or just type Install-Package knockouch in package manager console. Note, that nuget adds hammerjs as a default touch library.
After adding knockouch you can just start using new touch bindings, like in the example below:
<button data-bind="tap:tapHandler, hold:tapHandler, swipe:swipeHandler, doubletap:doubletapHandler">knockouch me</button>And here is the knockoutjs model to handle it:
//your knockoutjs view model:
var model = {
someText: ko.observable('do something with'),
tapHandler: function (data, e) {
//Note, event types will be tap or hold, depending on what your action will be.
model.someText('you just ' + e.type + 'ed.');
},
swipeHandler: function (data, e) {
model.someText('you just swiped!!!');
},
doubletapHandler: function (data, e) {
model.someText('doubletap goes here!!!');
}
};
//applying bindings as usual
ko.applyBindings(model);Sure, you can have a look at this in chrome and firefox only or this everywhere including the latest android and iphone.
knockout 2.x support
bower support
Provides touch related event data, like distance, angle etc + knockout data. was just added by user request.
MIT license - http://www.opensource.org/licenses/mit-license.php