Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(6259)

Unified Diff: chrome/browser/resources/touch_ntp/touchhandler.js

Issue 6661024: Use a specialized new tab page in TOUCH_UI builds (Closed) Base URL: http://git.chromium.org/git/chromium.git@trunk
Patch Set: Created 9 years, 9 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View side-by-side diff with in-line comments
Download patch
Index: chrome/browser/resources/touch_ntp/touchhandler.js
diff --git a/chrome/browser/resources/touch_ntp/touchhandler.js b/chrome/browser/resources/touch_ntp/touchhandler.js
new file mode 100644
index 0000000000000000000000000000000000000000..cb53afcb0754488c208fc0deb91b56a13a2e418d
--- /dev/null
+++ b/chrome/browser/resources/touch_ntp/touchhandler.js
@@ -0,0 +1,838 @@
+// Copyright (c) 2011 The Chromium Authors. All rights reserved.
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+/**
+ * @fileoverview Touch Handler. Class that handles all touch events and
+ * uses them to interpret higher level gestures and behaviors. TouchEvent is a
+ * built in mobile safari type:
+ * http://developer.apple.com/safari/library/documentation/UserExperience/Reference/TouchEventClassReference/TouchEvent/TouchEvent.html.
+ * This class is intended to work with all webkit browsers, tested on Chrome and
+ * iOS.
+ *
+ * The following types of gestures are currently supported. See the definition
+ * of TouchHandler.EventType for details.
+ *
+ * Single Touch:
+ * This provides simple single-touch events. Any secondary touch is
+ * ignored.
+ *
+ * Drag:
+ * A single touch followed by some movement. This behavior will handle all
+ * of the required events and report the properties of the drag to you
+ * while the touch is happening and at the end of the drag sequence. This
+ * behavior will NOT perform the actual dragging (redrawing the element)
+ * for you, this responsibility is left to the client code.
+ *
+ * Long press:
+ * When your element is touched and held without any drag occuring, the
+ * LONG_PRESS event will fire.
+ */
+
+
+/**
+ * A TouchHandler attaches to an Element, listents for low-level touch (or
+ * mouse) events and dispatching higher-level events on the element.
+ * @param {!Element} element The element to listen on and fire events
+ * for.
+ * @constructor
+ */
+function TouchHandler(element) {
+ /**
+ * @type {!Element}
+ * @private
+ */
+ this.element_ = element;
+
+ /**
+ * The absolute sum of all touch y deltas.
+ * @type {number}
+ * @private
+ */
+ this.totalMoveY_ = 0;
arv (Not doing code reviews) 2011/03/10 19:25:59 move value types to prototype
+
+ /**
+ * The absolute sum of all touch x deltas.
+ * @type {number}
+ * @private
+ */
+ this.totalMoveX_ = 0;
+
+ /**
+ * An array of tuples where the first item is the horizontal component of a
+ * recent relevant touch and the second item is the touch's time stamp. Old
+ * touches are removed based on the max tracking time and when direction
+ * changes.
+ * @type {!Array.<number>}
+ * @private
+ */
+ this.recentTouchesX_ = [];
+
+ /**
+ * An array of tuples where the first item is the vertical component of a
+ * recent relevant touch and the second item is the touch's time stamp. Old
+ * touches are removed based on the max tracking time and when direction
+ * changes.
+ * @type {!Array.<number>}
+ * @private
+ */
+ this.recentTouchesY_ = [];
+
+ /**
+ * Used to keep track of all events we subscribe to so we can easily clean up
+ * @type {EventTracker}
+ * @private
+ */
+ this.events_ = new EventTracker();
+}
+
+
+/**
+ * DOM Events that may be fired by the TouchHandler at the element
+ * All events are fired as DOM CustomEvents using TouchHandler.EventDetail
+ * to supply the details.
+ */
+TouchHandler.EventType = {
+ // Fired whenever the element is touched as the only touch to the device.
+ // detail.enableDrag defaults to false, set to true to permit dragging.
+ TOUCH_START: 'touchhandler:touch_start',
+
+ // Fired when an element is held for a period of time. Prevents dragging
+ // from occuring (even if enableDrag was set to true).
+ LONG_PRESS: 'touchhandler:long_press',
+
+ // If enableDrag was set to true at TOUCH_START, DRAG_START will fire when the
+ // touch first moves sufficient distance. detail.enableDrag is set to true
+ // but can be reset to false to cancel the drag.
+ DRAG_START: 'touchhandler:drag_start',
+
+ // If detail.enableDrag was true after DRAG_START, DRAG_MOVE will fire
+ // whenever the touch is moved.
+ DRAG_MOVE: 'touchhandler:drag_move',
+
+ // Fired just before TOUCH_END when a drag is released. Correlates 1:1 with a
+ // DRAG_START.
+ DRAG_END: 'touchhandler:drag_end',
+
+ // Fired whenever a touch that is being tracked has been released. Correlates
+ // 1:1 with a TOUCH_START.
+ TOUCH_END: 'touchhandler:touch_end'
+};
+
+
+/**
+ * The type of object use for our CustomEvent detail
+ * @constructor
+ * @param {number} clientX The X location of the touch.
+ * @param {number} clientY The Y location of the touch.
+ */
+TouchHandler.EventDetail = function(clientX, clientY) {
+ /**
+ * The X location of the touch affected
+ * @type {number}
+ */
+ this.clientX = clientX;
+
+ /**
+ * The Y location of the touch affected
+ * @type {number}
+ */
+ this.clientY = clientY;
+};
+
+/**
+ * For TOUCH_START and DRAG START events, set to true to enable dragging or
+ * false to disable dragging.
+ * @type {boolean|undefined}
+ */
+TouchHandler.EventDetail.enableDrag;
+
+/**
+ * For DRAG events, provides the horizontal component of the
+ * drag delta. Drag delta is defined as the delta of the start touch position
+ * and the current drag position.
+ * @type {number|undefined}
+ */
+TouchHandler.EventDetail.dragDeltaX;
+
+/**
+ * For DRAG events, provides the vertical component of the
+ * drag delta.
+ * @type {number|undefined}
+ */
+TouchHandler.EventDetail.dragDeltaY;
+
+/**
+ * Minimum movement of touch required to be considered a drag.
+ * @type {number}
+ * @private
+ */
+TouchHandler.MIN_TRACKING_FOR_DRAG_ = 8;
+
+
+/**
+ * The maximum number of ms to track a touch event. After an event is older than
+ * this value, it will be ignored in velocity calculations.
+ * @type {number}
+ * @private
+ */
+TouchHandler.MAX_TRACKING_TIME_ = 250;
+
+
+/**
+ * The maximum number of touches to track.
+ * @type {number}
+ * @private
+ */
+TouchHandler.MAX_TRACKING_TOUCHES_ = 5;
+
+
+/**
+ * The maximum velocity to return, in pixels per millisecond, that is used to
+ * guard against errors in calculating end velocity of a drag. This is a very
+ * fast drag velocity.
+ * @type {number}
+ * @private
+ */
+TouchHandler.MAXIMUM_VELOCITY_ = 5;
+
+
+/**
+ * The velocity to return, in pixel per millisecond, when the time stamps on the
+ * events are erroneous. The browser can return bad time stamps if the thread
+ * is blocked for the duration of the drag. This is a low velocity to prevent
+ * the content from moving quickly after a slow drag. It is less jarring if the
+ * content moves slowly after a fast drag.
+ * @type {number}
+ * @private
+ */
+TouchHandler.VELOCITY_FOR_INCORRECT_EVENTS_ = 1;
+
+/**
+ * The time, in milliseconds, that a touch must be held to be considered
+ * 'long'.
+ * @type {number}
+ * @private
+ */
+TouchHandler.TIME_FOR_LONG_PRESS_ = 500;
+
+/**
+ * If defined, the identifer of the single touch that is active. Note that 0 is
+ * a valid touch identifier - it should not be treated equivalently to
+ * undefined.
+ * @type {number|undefined}
+ * @private
+ */
+TouchHandler.prototype.activeTouch_;
+
+
+/**
+ * @type {boolean|undefined}
+ * @private
+ */
+TouchHandler.prototype.tracking_;
+
+
+/**
+ * @type {number|undefined}
+ * @private
+ */
+TouchHandler.prototype.startTouchX_;
+
+
+/**
+ * @type {number|undefined}
+ * @private
+ */
+TouchHandler.prototype.startTouchY_;
+
+
+/**
+ * @type {number|undefined}
+ * @private
+ */
+TouchHandler.prototype.endTouchX_;
+
+
+/**
+ * @type {number|undefined}
+ * @private
+ */
+TouchHandler.prototype.endTouchY_;
+
+
+/**
+ * Time of the touchstart event.
+ * @type {number|undefined}
+ * @private
+ */
+TouchHandler.prototype.startTime_;
+
+
+/**
+ * The time of the touchend event.
+ * @type {number|undefined}
+ * @private
+ */
+TouchHandler.prototype.endTime_;
+
+
+/**
+ * @type {number|undefined}
+ * @private
+ */
+TouchHandler.prototype.lastTouchX_;
+
+
+/**
+ * @type {number|undefined}
+ * @private
+ */
+TouchHandler.prototype.lastTouchY_;
+
+
+/**
+ * @type {number|undefined}
+ * @private
+ */
+TouchHandler.prototype.lastMoveX_;
+
+
+/**
+ * @type {number|undefined}
+ * @private
+ */
+TouchHandler.prototype.lastMoveY_;
+
+/**
+ * @type {number|undefined}
+ * @private
+ */
+TouchHandler.prototype.longPressTimeout_;
+
+/**
+ * If defined and true, the next click event should be swallowed
+ * @type {boolean|undefined}
+ * @private
+ */
+TouchHandler.prototype.swallowNextClick_;
+
+/**
+ * Start listenting for events.
+ * @param {boolean=} opt_capture True if the TouchHandler should listen to
+ * during the capture phase.
+ */
+TouchHandler.prototype.enable = function(opt_capture) {
+ var capture = !!opt_capture;
+
+ // Just listen to start events for now. When a touch is occuring we'll want
+ // to be subscribed to move and end events on the document, but we don't want
+ // to incur the cost of lots of no-op handlers on the document.
+ this.events_.add(this.element_, 'touchstart', this.onStart_.bind(this),
+ capture);
+ this.events_.add(this.element_, 'mousedown',
+ this.mouseToTouchCallback_(this.onStart_.bind(this)),
+ capture);
+
+ // If the element is long-pressed, we may need to swallow a click
+ this.events_.add(this.element_, 'click', this.onClick_.bind(this), true);
+};
+
+/**
+ * Stop listening to all events.
+ */
+TouchHandler.prototype.disable = function() {
+ this.stopTouching_();
+ this.events_.removeAll();
+};
+
+/**
+ * Wraps a callback with translations of mouse events to touch events.
+ * NOTE: These types really should be function(Event) but then we couldn't use
+ * this with bind (which operates on any type of function). Doesn't JSDoc
+ * support some sort of polymorphic types?
+ * @param {Function} callback The event callback.
+ * @return {Function} The wrapping callback.
+ * @private
+ */
+TouchHandler.prototype.mouseToTouchCallback_ = function(callback) {
+ return function(e) {
+ // Note that there may be synthesizes mouse events caused by touch events (a
+ // mouseDown after a touch-click). We leave it up to the client to worry
+ // about this if it matters to them (typically a short mouseDown/mouseUp
+ // without a click is no big problem and it's not obvious how we identify
+ // such synthesized events in a general way).
+ var touch = {
+ // any fixed value will do for the identifier - there will only
+ // ever be a single active 'touch' when using the mouse.
+ identifier: 0,
+ clientX: e.clientX,
+ clientY: e.clientY,
+ target: e.target
+ };
+ e.touches = [];
+ e.targetTouches = [];
+ e.changedTouches = [touch];
+ if (e.type != 'mouseup') {
+ e.touches[0] = touch;
+ e.targetTouches[0] = touch;
+ }
+ callback(e);
+ };
+};
+
+/**
+ * Is the touch manager currently tracking touch moves to detect a drag?
+ * @return {boolean|undefined} True if currently tracking.
+ */
+TouchHandler.prototype.isTracking = function() {
+ return this.tracking_;
+};
+
+
+/**
+ * Begin tracking the touchable element, it is eligible for dragging.
+ * @private
+ */
+TouchHandler.prototype.beginTracking_ = function() {
+ this.tracking_ = true;
+};
+
+
+/**
+ * Stop tracking the touchable element, it is no longer dragging.
+ * @private
+ */
+TouchHandler.prototype.endTracking_ = function() {
+ this.tracking_ = false;
+ this.dragging_ = false;
+ this.totalMoveY_ = 0;
+ this.totalMoveX_ = 0;
+};
+
+
+/**
+ * Reset the touchable element as if we never saw the touchStart
+ * Doesn't dispatch any end events - be careful of existing listeners.
+ */
+TouchHandler.prototype.cancelTouch = function() {
+ this.stopTouching_();
+ this.endTracking_();
+ // If clients needed to be aware of this, we could fire a cancel event here.
+};
+
+/**
+ * Record that touching has stopped
+ * @private
+ */
+TouchHandler.prototype.stopTouching_ = function() {
+ // Mark as no longer being touched
+ this.activeTouch_ = undefined;
+
+ // If we're waiting for a long press, stop
+ window.clearTimeout(this.longPressTimeout_);
+
+ // Stop listening for move/end events until there's another touch.
+ // We don't want to leave handlers piled up on the document.
+ // Note that there's no harm in removing handlers that weren't added, so
+ // rather than track whether we're using mouse or touch we do both.
+ this.events_.remove(document, 'touchmove');
+ this.events_.remove(document, 'touchend');
+ this.events_.remove(document, 'touchcancel');
+ this.events_.remove(document, 'mousemove');
+ this.events_.remove(document, 'mouseup');
+};
+
+/**
+ * Touch start handler.
+ * @param {!TouchEvent} e The touchstart event.
+ * @private
+ */
+TouchHandler.prototype.onStart_ = function(e) {
+ // Only process single touches. If there is already a touch happening, or
+ // two simultaneous touches then just ignore them.
+ if (e.touches.length > 1) {
+ // Note that we could cancel an active touch here. That would make
+ // simultaneous touch behave similar to near-simultaneous. However, if the
+ // user is dragging something, an accidental second touch could be quite
+ // disruptive if it cancelled their drag. Better to just ignore it.
+ return;
+ }
+
+ // It's still possible there could be an active "touch" if the user is
+ // simultaneously using a mouse and a touch input.
+ if (this.activeTouch_ !== undefined) {
+ return;
+ }
+
+ var touch = e.targetTouches[0];
+ this.activeTouch_ = touch.identifier;
+
+ // We've just started touching so shouldn't swallow any upcoming click
+ if (this.swallowNextClick_) {
+ this.swallowNextClick_ = false;
+ }
+
+ // Sign up for end/cancel notifications for this touch.
+ // Note that we do this on the document so that even if the user drags their
+ // finger off the element, we'll still know what they're doing.
+ if (e.type == 'mousedown') {
+ this.events_.add(document, 'mouseup',
+ this.mouseToTouchCallback_(this.onEnd_.bind(this)), false);
+ } else {
+ this.events_.add(document, 'touchend', this.onEnd_.bind(this), false);
+ this.events_.add(document, 'touchcancel', this.onEnd_.bind(this), false);
+ }
+
+ // This timeout is cleared on touchEnd and onDrag
+ // If we invoke the function then we have a real long press
+ window.clearTimeout(this.longPressTimeout_);
+ this.longPressTimeout_ = window.setTimeout(
+ this.onLongPress_.bind(this),
+ TouchHandler.TIME_FOR_LONG_PRESS_);
+
+ // Dispatch the TOUCH_START event
+ if (!this.dispatchEvent_(TouchHandler.EventType.TOUCH_START, touch)) {
+ // Dragging was not enabled, nothing more to do
+ return;
+ }
+
+ // We want dragging notifications
+ if (e.type == 'mousedown') {
+ this.events_.add(document, 'mousemove',
+ this.mouseToTouchCallback_(this.onMove_.bind(this)), false);
+ } else {
+ this.events_.add(document, 'touchmove', this.onMove_.bind(this), false);
+ }
+
+ this.startTouchX_ = this.lastTouchX_ = touch.clientX;
+ this.startTouchY_ = this.lastTouchY_ = touch.clientY;
+ this.startTime_ = e.timeStamp;
+
+ this.recentTouchesX_ = [];
+ this.recentTouchesY_ = [];
+ this.recentTouchesX_.push(touch.clientX, e.timeStamp);
+ this.recentTouchesY_.push(touch.clientY, e.timeStamp);
+
+ this.beginTracking_();
+};
+
+/**
+ * Given a list of Touches, find the one matching our activeTouch identifier.
+ * Note that Chrome currently always uses 0 as the identifier. In that case
+ * we'll end up always choosing the first element in the list.
+ * @param {TouchList} touches The list of Touch objects to search.
+ * @return {!Touch|undefined} The touch matching our active ID if any.
+ * @private
+ */
+TouchHandler.prototype.findActiveTouch_ = function(touches) {
+ assert(this.activeTouch_ !== undefined, 'Expecting an active touch');
+ // A TouchList isn't actually an array, so we shouldn't use
+ // Array.prototype.filter/some, etc.
+ for (var i = 0; i < touches.length; i++) {
+ if (touches[i].identifier == this.activeTouch_) {
+ return touches[i];
+ }
+ }
+ return undefined;
+};
+
+/**
+ * Touch move handler.
+ * @param {!TouchEvent} e The touchmove event.
+ * @private
+ */
+TouchHandler.prototype.onMove_ = function(e) {
+ if (!this.tracking_) {
+ return;
+ }
+
+ // Our active touch should always be in the list of touches still active
+ assert(this.findActiveTouch_(e.touches), 'Missing touchEnd');
+
+ var that = this;
+ var touch = this.findActiveTouch_(e.changedTouches);
+ if (!touch) {
+ return;
+ }
+
+ var clientX = touch.clientX;
+ var clientY = touch.clientY;
+
+ var moveX = this.lastTouchX_ - clientX;
+ var moveY = this.lastTouchY_ - clientY;
+ this.totalMoveX_ += Math.abs(moveX);
+ this.totalMoveY_ += Math.abs(moveY);
+ this.lastTouchX_ = clientX;
+ this.lastTouchY_ = clientY;
+
+ if (!this.dragging_ && (this.totalMoveY_ >
+ TouchHandler.MIN_TRACKING_FOR_DRAG_ ||
+ this.totalMoveX_ >
+ TouchHandler.MIN_TRACKING_FOR_DRAG_)) {
+ // If we're waiting for a long press, stop
+ window.clearTimeout(this.longPressTimeout_);
+
+ // Dispatch the DRAG_START event and record whether dragging should be
+ // allowed or not. Note that this relies on the current value of
+ // startTouchX/Y - handlers may use the initial drag delta to determine
+ // if dragging should be permitted.
+ this.dragging_ = this.dispatchEvent_(
+ TouchHandler.EventType.DRAG_START, touch);
+
+ if (this.dragging_) {
+ // Update the start position here so that drag deltas have better values
+ // but don't touch the recent positions so that velocity calculations can
+ // still use touchstart position in the time and distance delta.
+ this.startTouchX_ = clientX;
+ this.startTouchY_ = clientY;
+ this.startTime_ = e.timeStamp;
+ } else {
+ this.endTracking_();
+ }
+ }
+
+ if (this.dragging_) {
+ this.dispatchEvent_(TouchHandler.EventType.DRAG_MOVE, touch);
+
+ this.removeTouchesInWrongDirection_(this.recentTouchesX_, this.lastMoveX_,
+ moveX);
+ this.removeTouchesInWrongDirection_(this.recentTouchesY_, this.lastMoveY_,
+ moveY);
+ this.removeOldTouches_(this.recentTouchesX_, e.timeStamp);
+ this.removeOldTouches_(this.recentTouchesY_, e.timeStamp);
+ this.recentTouchesX_.push(clientX, e.timeStamp);
+ this.recentTouchesY_.push(clientY, e.timeStamp);
+ }
+
+ this.lastMoveX_ = moveX;
+ this.lastMoveY_ = moveY;
+};
+
+
+/**
+ * Filters the provided recent touches array to remove all touches except the
+ * last if the move direction has changed.
+ * @param {!Array.<number>} recentTouches An array of tuples where the first
+ * item is the x or y component of the recent touch and the second item
+ * is the touch time stamp.
+ * @param {number|undefined} lastMove The x or y component of the previous
+ * move.
+ * @param {number} recentMove The x or y component of the most recent move.
+ * @private
+ */
+TouchHandler.prototype.removeTouchesInWrongDirection_ =
+ function(recentTouches, lastMove, recentMove) {
+ if (lastMove && recentMove && recentTouches.length > 2 &&
+ (lastMove > 0 ^ recentMove > 0)) {
+ recentTouches.splice(0, recentTouches.length - 2);
+ }
+};
+
+
+/**
+ * Filters the provided recent touches array to remove all touches older than
+ * the max tracking time or the 5th most recent touch.
+ * @param {!Array.<number>} recentTouches An array of tuples where the first
+ * item is the x or y component of the recent touch and the second item
+ * is the touch time stamp.
+ * @param {number} recentTime The time of the most recent event.
+ * @private
+ */
+TouchHandler.prototype.removeOldTouches_ =
+ function(recentTouches, recentTime) {
+ while (recentTouches.length && recentTime - recentTouches[1] >
+ TouchHandler.MAX_TRACKING_TIME_ ||
+ recentTouches.length >
+ TouchHandler.MAX_TRACKING_TOUCHES_ * 2) {
+ recentTouches.splice(0, 2);
+ }
+};
+
+/**
+ * Touch end handler.
+ * @param {!TouchEvent} e The touchend event.
+ * @private
+ */
+TouchHandler.prototype.onEnd_ = function(e) {
+ var that = this;
+ assert(this.activeTouch_ !== undefined, 'Expect to already be touching');
+
+ // If the touch we're tracking isn't changing here, ignore this touch end.
+ var touch = this.findActiveTouch_(e.changedTouches);
+ if (!touch) {
+ // In most cases, our active touch will be in the 'touches' collection,
+ // but we can't assert that because occasionally two touchend events can
+ // occur at almost the same time with both having empty 'touches' lists.
+ // I.e., 'touches' seems like it can be a bit more up-to-date than the
+ // current event.
+ return;
+ }
+
+ // This is touchEnd for the touch we're monitoring
+ assert(!this.findActiveTouch_(e.touches),
+ 'Touch ended also still active');
+
+ // Indicate that touching has finished
+ this.stopTouching_();
+
+ if (this.tracking_) {
+ var clientX = touch.clientX;
+ var clientY = touch.clientY;
+
+ if (this.dragging_) {
+ this.endTime_ = e.timeStamp;
+ this.endTouchX_ = clientX;
+ this.endTouchY_ = clientY;
+
+ this.removeOldTouches_(this.recentTouchesX_, e.timeStamp);
+ this.removeOldTouches_(this.recentTouchesY_, e.timeStamp);
+
+ this.dispatchEvent_(TouchHandler.EventType.DRAG_END, touch);
+
+ // Note that in some situations we can get a click event here as well.
+ // For now this isn't a problem, but we may want to consider having some
+ // logic that hides clicks that appear to be caused by a touchEnd used for
+ // dragging.
+ }
+
+ this.endTracking_();
+ }
+
+ // Note that we dispatch the touchEnd event last so that events at different
+ // levels of semantics nest nicely (similar to how DOM drag-and-drop events
+ // are nested inside of the mouse events that trigger them).
+ this.dispatchEvent_(TouchHandler.EventType.TOUCH_END, touch);
+};
+
+
+/**
+ * Get end velocity of the drag. This method is specific to drag behavior, so if
+ * touch behavior and drag behavior is split then this should go with drag
+ * behavior. End velocity is defined as deltaXY / deltaTime where deltaXY is
+ * the difference between endPosition and the oldest recent position, and
+ * deltaTime is the difference between endTime and the oldest recent time stamp.
+ * @return {Object} The x and y velocity.
+ */
+TouchHandler.prototype.getEndVelocity = function() {
+ // Note that we could move velocity to just be an end-event parameter.
+ var velocityX = this.recentTouchesX_.length ?
+ (this.endTouchX_ - this.recentTouchesX_[0]) /
+ (this.endTime_ - this.recentTouchesX_[1]) : 0;
+ var velocityY = this.recentTouchesY_.length ?
+ (this.endTouchY_ - this.recentTouchesY_[0]) /
+ (this.endTime_ - this.recentTouchesY_[1]) : 0;
+
+ velocityX = this.correctVelocity_(velocityX);
+ velocityY = this.correctVelocity_(velocityY);
+
+ return {
+ x: velocityX,
+ y: velocityY
+ };
+};
+
+
+/**
+ * Correct erroneous velocities by capping the velocity if we think it's too
+ * high, or setting it to a default velocity if know that the event data is bad.
+ * @param {number} velocity The x or y velocity component.
+ * @return {number} The corrected velocity.
+ * @private
+ */
+TouchHandler.prototype.correctVelocity_ = function(velocity) {
+ var absVelocity = Math.abs(velocity);
+
+ // We add to recent touches for each touchstart and touchmove. If we have
+ // fewer than 3 touches (6 entries), we assume that the thread was blocked for
+ // the duration of the drag and we received events in quick succession with
+ // the wrong time stamps.
+ if (absVelocity > TouchHandler.MAXIMUM_VELOCITY_) {
+ absVelocity = this.recentTouchesY_.length < 3 ?
+ TouchHandler.VELOCITY_FOR_INCORRECT_EVENTS_ :
+ TouchHandler.MAXIMUM_VELOCITY_;
+ }
+ return absVelocity * (velocity < 0 ? -1 : 1);
+};
+
+
+/**
+ * Handler when an element has been pressed for a long time
+ * @private
+ */
+TouchHandler.prototype.onLongPress_ = function() {
+ // Swallow any click that occurs on this element without an intervening touch
+ // start event. This simple click-busting technique should be sufficient here
+ // since a real click should have a touchstart first.
+ this.swallowNextClick_ = true;
+
+ // Dispatch to the LONG_PRESS
+ this.dispatchEventXY_(TouchHandler.EventType.LONG_PRESS,
+ /** @type {number} */ (this.startTouchX_),
+ /** @type {number} */ (this.startTouchY_));
+};
+
+/**
+ * Click handler - used to swallow clicks after a long-press
+ * @param {!Event} e The click event.
+ * @private
+ */
+TouchHandler.prototype.onClick_ = function(e) {
+ if (this.swallowNextClick_) {
+ e.preventDefault();
+ e.stopPropagation();
+ this.swallowNextClick_ = false;
+ }
+};
+
+/**
+ * Dispatch a TouchHandler event to the element
+ * @param {string} eventType The event to dispatch.
+ * @param {Touch} touch The touch triggering this event.
+ * @return {boolean|undefined} The value of detail.enableDrag after dispatching
+ * the event.
+ * @private
+ */
+TouchHandler.prototype.dispatchEvent_ = function(eventType, touch) {
+ return this.dispatchEventXY_(eventType, touch.clientX, touch.clientY);
+};
+
+/**
+ * Dispatch a TouchHandler event to the element
+ * @param {string} eventType The event to dispatch.
+ @param {number} clientX The X location for the event.
+ @param {number} clientY The Y location for the event.
+ * @return {boolean|undefined} The value of detail.enableDrag after dispatching
+ * the event.
+ * @private
+ */
+TouchHandler.prototype.dispatchEventXY_ =
+ function(eventType, clientX, clientY) {
+ var event = document.createEvent('CustomEvent');
+ var detail = new TouchHandler.EventDetail(clientX, clientY);
+
+ // Set enableDrag as when it can be overridden
+ if (eventType == TouchHandler.EventType.TOUCH_START) {
+ detail.enableDrag = false;
+ } else if (eventType == TouchHandler.EventType.DRAG_START) {
+ detail.enableDrag = true;
+ }
+
+ var isDrag = (eventType == TouchHandler.EventType.DRAG_START ||
+ eventType == TouchHandler.EventType.DRAG_MOVE ||
+ eventType == TouchHandler.EventType.DRAG_END);
+ if (isDrag) {
+ detail.dragDeltaX = clientX - this.startTouchX_;
+ detail.dragDeltaY = clientY - this.startTouchY_;
+ }
+
+ // Drag events don't bubble - we're really just dragging the element,
+ // not affecting its parent at all.
+ var bubbles = !isDrag;
+
+ event.initCustomEvent(eventType, bubbles, /*cancelable*/ true, detail);
arv (Not doing code reviews) 2011/03/10 19:25:59 var event = new cr.Event(eventType, bubbles, true)
+ event.sender = this;
+ this.element_.dispatchEvent(event);
+ return detail.enableDrag;
+};
+

Powered by Google App Engine
This is Rietveld 408576698