toe.js Version 2 Was Released!

| Comments

It’s been a week that I released version 2.0 of my touch library toe.js, so it’s time to describe the changes here. First of all the new version is smaller and faster. Just have a look at the grunt output:

Uncompressed size: 10743 bytes.
Compressed size: 1318 bytes gzipped (4208 bytes minified).

It is still modular and all gestures are still stored in the /gestures folder. The library supports tap, taphold, swipe (all directions), transform (rotate and scale). I eventually removed doubletap because it doesn’t seem useful to me. The usage is still the same, simply use the default jQuery event handling to bind events.

1
2
3
$('div.myElem').on('tap', function (event) {
  
});

With the new version I added some properties to the event object.

1
2
3
4
5
6
7
$('div.myElem').on('tap', function (event) {
  event.finger; // amount of fingers used for the gesture

  event.start; // start point extracted from touchstart
  event.move; // array of all moved points extracted from touchmove 
  event.end; // end point extracted from touchend
});

Swipe adds the following properties

1
2
3
4
$('div.myElem').on('swipe', function (event) {
  event.angle; // angle of the swipe direction
  event.direction; // direction of the swipe expressed by a string ['left', 'right', 'up', 'down']
});

To detect transformations you may use the events transformstart, transform and transformend. The last two events will give you these additional properties

1
2
3
4
$('div.myElem').on('transform transformend', function (event) {
  event.rotation; // degrees
  event.scale; // pinch move expressed as a number between 0 to 1
});

I hope you like it. In future I’m planning to add MSPointer support to it.

Copyright © 2014 - Damien Antipa. Powered by Octopress