Adding handlers to zoom in/out on scrollwheel event.

Questions:
- Is deltaY the correct field in which to store this event value?
- Is the 'wheel' addEventListener hook broken in the first place? Doesn't work for me on OSX, but might be working in Windows/Linux and don't know if this change would break it for those.
- It is necessary to cancel event bubbling for the onmousewheel event?
Review URL: http://codereview.chromium.org/2456004

git-svn-id: svn://svn.chromium.org/chrome/trunk/src@49305 0039d316-1c4b-4281-b951-d872f2087c98

1 files changed, 27 insertions, 4 deletions

diff --git a/o3d/samples/o3d-webgl/client.js b/o3d/samples/o3d-webgl/client.js
index 9d846c1..b585b72 100644
--- a/o3d/samples/o3d-webgl/client.js
+++ b/o3d/samples/o3d-webgl/client.js
@@ -840,17 +840,23 @@ o3d.Client.getRelativeCoordinates_ = function(eventInfo, opt_reference) {
  * Wraps a user's event callback with one that properly computes
  * relative coordinates for the event.
  * @param {!o3d.EventCallback} handler Function to call on event.
+ * @param {boolean} doCancelEvent If event should be canceled after callback.
  * @return {!o3d.EventCallback} Wrapped handler function.
  * @private
  */
-o3d.Client.wrapEventCallback_ = function(handler) {
+o3d.Client.wrapEventCallback_ = function(handler, doCancelEvent) {
   return function(event) {
     event = o3d.Client.getEvent_(event);
     var info = o3d.Client.getEventInfo_(event);
     var relativeCoords = o3d.Client.getRelativeCoordinates_(info);
     event.x = relativeCoords.x;
     event.y = relativeCoords.y;
+    // Invert value to meet contract for deltaY. @see event.js.
+    event.deltaY = -info.wheel;
     handler(event);
+    if (doCancelEvent) {
+      o3djs.event.cancel(event);
+    }
   };
 };
 
@@ -869,13 +875,20 @@ o3d.Client.prototype.setEventCallback =
   var listener = this.gl.hack_canvas;
   // TODO(petersont): Figure out a way for a canvas to listen to a key event
   // directly.
+
+  var isWheelEvent = type == 'wheel';
   var forKeyEvent = type.substr(0, 3) == 'key';
   if (forKeyEvent) {
     listener = document;
   } else {
-    handler = o3d.Client.wrapEventCallback_(handler);
+    handler = o3d.Client.wrapEventCallback_(handler, isWheelEvent);
+  }
+  if (isWheelEvent) {
+    listener.addEventListener('DOMMouseScroll', handler, true);
+    listener.addEventListener('mousewheel', handler, true);
+  } else {
+    listener.addEventListener(type, handler, true);
   }
-  listener.addEventListener(type, handler, true);
 };
 
 
@@ -885,11 +898,21 @@ o3d.Client.prototype.setEventCallback =
  */
 o3d.Client.prototype.clearEventCallback =
     function(type) {
+  //TODO(petersont): Same as TODO in setEventCallback above.
+  var listener = this.gl.hack_canvas;
+
+  var isWheelEvent = type == 'wheel';
   var forKeyEvent = type.substr(0, 3) == 'key';
   if (forKeyEvent) {
     listener = document;
   }
-  listener.removeEventListener(type);
+
+  if (isWheelEvent) {
+    listener.removeEventListener('DOMMouseScroll');
+    listener.removeEventListener('mousewheel');
+  } else {
+    listener.removeEventListener(type);
+  }
 };