Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Browse files

Added a back and replay button.

  • Loading branch information...
commit 82225a91187499d6f8f15d87487fd88098940d33 1 parent bd3bf29
@zgrossbart authored
Showing with 30 additions and 7 deletions.
  1. +1 −1  index.html
  2. +29 −6 touch_gesture.pjs
View
2  index.html
@@ -32,7 +32,7 @@
</div>
<div>
- <a href="#" id="next">Next</a> <a href="#" id="replay">Replay</a>
+ <a href="#" id="back">Back</a> <a href="#" id="replay">Replay</a> <a href="#" id="next">Next</a>
</div>
<canvas id="canvas" width=300 height=300></canvas>
</div>
View
35 touch_gesture.pjs
@@ -32,6 +32,7 @@ function Gesture() {
this.pathsDrawn = [];
this.index = 0;
this.longPath;
+ this.hasPlayed = false;
this.create = function(/*array*/ paths, /*Point*/ textPoint, /*String*/ name) {
this.paths = paths;
@@ -63,19 +64,23 @@ function Gesture() {
}
this.draw = function() {
- for (var i = 0; i < this.paths.length; i++) {
- this.starts[i].opacity = 1;
+ if (!this.hasPlayed) {
+ this.hasPlayed = true;
+ for (var i = 0; i < this.paths.length; i++) {
+ this.starts[i].opacity = 1;
+ }
+ } else {
+ this.replay();
}
}
this.hide = function() {
for (var i = 0; i < this.paths.length; i++) {
- this.starts[i].remove();
- this.pathsDrawn[i].remove();
- this.paths[i].remove();
+ this.starts[i].opacity = 0;
+ this.pathsDrawn[i].visible = false;
}
- this.text.remove();
+ this.text.opacity = 0;
}
this.replay = function() {
@@ -88,6 +93,7 @@ function Gesture() {
this.pathsDrawn[i].strokeCap = 'round';
this.pathsDrawn[i].dashArray = [8, 10];
+ this.starts[i].opacity = 1;
this.starts[i].position = this.paths[i].getPointAt(0);
this.pathsDrawn[i].moveBelow(this.starts[i]);
@@ -647,6 +653,11 @@ function init() {
next();
});
+ $('#back').click(function(evt) {
+ evt.preventDefault();
+ back();
+ });
+
$('#replay').click(function(evt) {
evt.preventDefault();
gesture.replay();
@@ -666,6 +677,18 @@ function next() {
}
+function back() {
+ gesture.hide();
+ gIndex--;
+
+ if (gIndex >= 0) {
+ gesture = gestures[gIndex];
+ gesture.replay();
+ started = true;
+ }
+
+}
+
/**
* This function is called with each frame of the animation.
*/
Please sign in to comment.
Something went wrong with that request. Please try again.