Skip to content
This repository

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP

Describe and recognize multitouch gestures in JavaScript. (Highly experimental)

branch: master

Fetching latest commit…

Octocat-spinner-32-eaf2f5

Cannot retrieve the latest commit at this time

Octocat-spinner-32 examples
Octocat-spinner-32 lib
Octocat-spinner-32 spec
Octocat-spinner-32 src
Octocat-spinner-32 .gitignore
Octocat-spinner-32 Gemfile
Octocat-spinner-32 Gemfile.lock
Octocat-spinner-32 README.markdown
Octocat-spinner-32 Rakefile
Octocat-spinner-32 specs.watchr
README.markdown

Gesticulate

Describe and recognize multitouch gestures in JavaScript. This is very experimental and currently only intended to figure out the possibilites. Comments are highly appreciated!

Requirements

  • An iTouch device

Intended Usage

This is just a sketch to gather ideas. Don't expect anything to work like described here.

Defining gestures

Simple one finger gesture:

Gesticulate.buildGesture('swipe', function(gesture) {
  gesture.finger().moves({ from: 'left', to: 'right' });
});

Simple two finger gesture:

Gesticulate.buildGesture('twoFingerSwipe', function(gesture) {
  // There are no constraints yet.
  // It's possible to swipe one finger and then a second one.
  gesture.finger(0).moves({ from: 'left', to: 'right' });
  gesture.finger(1).moves({ from: 'left', to: 'right' });

  // Possible alternative:
  gesture.fingers([0, 1]).move({ from: 'left', to: 'right });
});

Observing gestures

Gesticulate.observe(document.getElementById('canvas'), 'swipe');

Explicitly firing gestures (for simulation purposes)

// Set up a fake gesture. Doesn't really recognize anything.
var gesture = new Gesticulate.Gesture('swipe');
Gesticulate.fire(document.getElementById('canvas'), gesture);

Explicitly driving the recognition process (for simulation purposes)

var gesture = new Gesticulate.Gesture('swipe');
gesture.finger().moves({ from: 'left', to: 'right' });

gesture.update(new Gesticulate.TouchEvent('start', {
  changedTouches: [{ x: 0, y: 0 }]
}));

for(var i = 1; i < 200; i++) {
  gesture.update(new Gesticulate.TouchEvent('move', {
    changedTouches: [{ x: i, y: 0 }]
  }));
}

gesture.update(new Gesticulate.TouchEvent('end', {
  changedTouches: [{ x: 200, y: 0 }]
}));

Known issues

See the issue tracker on GitHub

Repository

See the repository on GitHub and feel free to fork it!

Copyright

Copyright (c) 2010 Benedikt Deicke. See LICENSE for details.

Something went wrong with that request. Please try again.