23 Initial attempt a this feature along with a demo page

src/mousetracker.js

@@ -176,6 +176,8 @@
          *      initiated inside the tracked element, otherwise false.
          * @param {Boolean} buttonDownAny
          *      Was the button down anywhere in the screen during the event.
+         * @param {MouseEvent} event
+         *      The original mouse event that triggered this handler
          */
         enterHandler: function(){},
 
@@ -192,6 +194,8 @@
          *      initiated inside the tracked element, otherwise false.
          * @param {Boolean} buttonDownAny
          *      Was the button down anywhere in the screen during the event.
+         * @param {MouseEvent} event
+         *      The original mouse event that triggered this handler
          */
         exitHandler: function(){},
 
@@ -203,6 +207,8 @@
          *      A reference to the tracker instance.
          * @param {OpenSeadragon.Point} position
          *      The poistion of the event on the screen.
+         * @param {MouseEvent} event
+         *      The original mouse event that triggered this handler
          */
         pressHandler: function(){},
 
@@ -220,6 +226,8 @@
          * @param {Boolean} insideElementRelease
          *      Was the mouse still inside the tracked element when the button
          *      was released.
+         * @param {MouseEvent} event
+         *      The original mouse event that triggered this handler
          */
         releaseHandler: function(){},
 
@@ -235,6 +243,8 @@
          *      The scroll delta for the event.
          * @param {Boolean} shift
          *      Was the shift key being pressed during this event?
+         * @param {MouseEvent} event
+         *      The original mouse event that triggered this handler
          */
         scrollHandler: function(){},
 
@@ -251,6 +261,8 @@
          *      both pased. Useful for ignoring events.
          * @param {Boolean} shift
          *      Was the shift key being pressed during this event?
+         * @param {MouseEvent} event
+         *      The original mouse event that triggered this handler
          */
         clickHandler: function(){},
 
@@ -267,6 +279,8 @@
          *      end drag.  Usefule for ignoring or weighting the events.
          * @param {Boolean} shift
          *      Was the shift key being pressed during this event?
+         * @param {Event} event
+         *      The original mouse or wheel event that triggered this handler
          */
         dragHandler: function(){},
 
@@ -280,6 +294,8 @@
          *      The key code that was pressed.
          * @param {Boolean} shift
          *      Was the shift key being pressed during this event?
+         * @param {MouseEvent} event
+         *      The original mouse event that triggered this handler
          */
         keyHandler: function(){},
 
@@ -521,7 +537,8 @@
             propagate = tracker.keyHandler( 
                 tracker, 
                 event.keyCode ? event.keyCode : event.charCode,
-                event.shiftKey
+                event.shiftKey,
+                event
             );
             if( !propagate ){
                 $.cancelEvent( event );
@@ -568,7 +585,8 @@
                 tracker, 
                 getMouseRelative( event, tracker.element ),
                 delegate.buttonDown, 
-                IS_BUTTON_DOWN
+                IS_BUTTON_DOWN,
+                event
             );
             if( propagate === false ){
                 $.cancelEvent( event );
@@ -615,7 +633,8 @@
                 tracker, 
                 getMouseRelative( event, tracker.element ),
                 delegate.buttonDown, 
-                IS_BUTTON_DOWN
+                IS_BUTTON_DOWN,
+                event
             );
 
             if( propagate === false ){
@@ -648,7 +667,8 @@
         if ( tracker.pressHandler ) {
             propagate = tracker.pressHandler( 
                 tracker, 
-                getMouseRelative( event, tracker.element )
+                getMouseRelative( event, tracker.element ),
+                event
             );
             if( propagate === false ){
                 $.cancelEvent( event );
@@ -683,7 +703,16 @@
             event.targetTouches.length == 1 && 
             event.changedTouches.length == 1 ){
             
-            THIS[ tracker.hash ].lastTouch = event.touches[ 0 ];  
+            THIS[ tracker.hash ].lastTouch = event.touches[ 0 ];
+            
+//DWK So onMouseOver and onMouseDown are both expecting an event for the second
+//DWK parameter.  This is passing a Touch point instead.  Although a Touch
+//DWK object is very similar to an event object that are not identical.  
+//DWK not sure if this is a problem.  May need to include a comment in the
+//DWK API notes, since this object as passed here is getting passed along.
+//DWK Alternately, should there be some way to still pass the original
+//DWK touch event along.
+
             onMouseOver( tracker, event.changedTouches[ 0 ] );
             onMouseDown( tracker, event.touches[ 0 ] );
         }
@@ -731,7 +760,8 @@
                 tracker, 
                 getMouseRelative( event, tracker.element ),
                 insideElementPress, 
-                insideElementRelease
+                insideElementRelease,
+                event
             );
             if( propagate === false ){
                 $.cancelEvent( event );
@@ -755,6 +785,7 @@
             event.changedTouches.length == 1 ){
 
             THIS[ tracker.hash ].lastTouch = null;
+//DWK See comment in onTouchStart            
             onMouseUp( tracker, event.changedTouches[ 0 ] );
             onMouseOut( tracker, event.changedTouches[ 0 ] );
         }
@@ -863,7 +894,8 @@
                 tracker, 
                 getMouseRelative( event, tracker.element ), 
                 nDelta, 
-                event.shiftKey
+                event.shiftKey,
+                event
             );
             if( propagate === false ){
                 $.cancelEvent( event );
@@ -897,7 +929,8 @@
                 tracker, 
                 getMouseRelative( event, tracker.element ),
                 quick, 
-                event.shiftKey
+                event.shiftKey,
+                event
             );
             if( propagate === false ){
                 $.cancelEvent( event );
@@ -927,7 +960,8 @@
                 tracker, 
                 getMouseRelative( event, tracker.element ),
                 delta, 
-                event.shiftKey
+                event.shiftKey,
+                event
             );
             if( propagate === false ){
                 $.cancelEvent( event );
@@ -949,7 +983,7 @@
             event.targetTouches.length === 1 && 
             event.changedTouches.length === 1 && 
             THIS[ tracker.hash ].lastTouch.identifier === event.touches[ 0 ].identifier){
-
+//DWK See comment in onTouchStart
             onMouseMove( tracker, event.touches[ 0 ] );
 
         } else if (  event.touches.length === 2 ){
@@ -964,6 +998,8 @@
             if( Math.abs( THIS[ tracker.hash ].lastPinchDelta - pinchDelta ) > 75 ){
                 //$.console.debug( "pinch delta : " + pinchDelta + " | previous : " + THIS[ tracker.hash ].lastPinchDelta);
 
+//DWK This is a variant on the onTouchStart comment, but instead of a Touch
+//DWK object, a generic object with a handful of properties is passed
                 onMouseWheelSpin( tracker, {
                     shift: false,
                     pageX: THIS[ tracker.hash ].pinchMidpoint.x,

test/demo.html

@@ -0,0 +1,296 @@
+<html>
+    <head>
+    <title>OpenSeadragon Expose Origina Event Demo</title>
+    <script type="text/javascript" src='openseadragon/build/openseadragon/openseadragon.js'></script>
+    <style type="text/css">
+      .openseadragon
+      {
+	  width:      800px;
+	  height:     600px;
+	  border:     1px solid black;
+	  color:      #333; /* text color for messages */
+	  background-color: black;
+      }
+      .openseadragon-small
+      {
+	  width:      40px;
+	  height:     30px;
+	  border:     1px solid black;
+	  color:      #333; /* text color for messages */
+	  background-color: black;
+      }
+      
+    </style>
+</head>
+<body>
+    <div class="demoarea">
+	<div>
+	   Simple demo page to verify that event handlers pass along the original source event
+	</div>
+	<div id="contentDiv" class="openseadragon"></div>
+	<div>
+	    <span id='consolelog'></span>
+	</div>
+    </div>
+
+    <script type="text/javascript">
+    var viewer = OpenSeadragon({
+	id:"contentDiv",
+	prefixUrl:"openseadragon/build/openseadragon/images/",
+        tileSources:{
+             Image:{
+		xmlns:"http://schemas.microsoft.com/deepzoom/2008",
+		Url:"example-images/highsmith/highsmith_files/",
+		Format:"jpg",
+		Overlap:"2",
+		TileSize:"256",
+		Size:{  
+		    Height:"9221",
+	            Width:"7026"
+	        }
+            }
+	}
+    });
+
+    var demoMessageLog = "";
+    var screenConsole = document.getElementById('consolelog');
+    
+    function checkIfEventWasPassed(event)
+    {
+        if(typeof event === 'undefined')
+        {
+ 	    demoMessageLog += "PROBLEM EVENT WAS UNDEFINED:" + event + "\n\n";        	
+        }
+    }
+
+    function updateDebugMessageOnScreenConsole()
+    {
+        screenConsole.innerHTML = demoMessageLog.replace(/\n/g, '<br />');
+    }
+
+    viewer.innerTracker.clickHandler = function(tracker, position, delta, shift,event)
+    {
+ 	demoMessageLog += "Altered version of original clickHandler\n" +
+	"    tracker:" + tracker + "\n" +
+	"    position:" + position + "\n" +
+	"    delta:" + delta + "\n" +
+	"    shift:" + shift + "\n" +
+	"    event:" + event + "\n\n";
+	checkIfEventWasPassed(event);
+	updateDebugMessageOnScreenConsole();
+
+    }
+    
+    viewer.addHandler("click",  function(tracker, position, delta, shift,event)
+    {
+      demoMessageLog += "Additional clickHandler\n" +
+	  "    tracker:" + tracker + "\n" +
+	  "    position:" + position + "\n" +
+	  "    delta:" + delta + "\n" +
+	  "    shift:" + shift + "\n" +
+	  "    event:" + event + "\n\n";
+      checkIfEventWasPassed(event);
+      updateDebugMessageOnScreenConsole();
+     });
+
+    viewer.innerTracker.pressHandler = function(tracker, position, event)
+    {
+	demoMessageLog += "Altered version of original pressHandler\n" +
+	"    tracker:" + tracker + "\n" +
+	"    position:" + position + "\n" +
+	"    event:" + event + "\n\n";
+	checkIfEventWasPassed(event);
+	updateDebugMessageOnScreenConsole();
+    };
+    viewer.addHandler("press",  function(tracker, position,event)
+    {
+      demoMessageLog += "Additional pressHandler\n" +
+	  "    tracker:" + tracker + "\n" +
+	  "    position:" + position + "\n" +
+	  "    event:" + event + "\n\n";
+      checkIfEventWasPassed(event);
+      updateDebugMessageOnScreenConsole();
+    });
+
+    viewer.innerTracker.releaseHandler = function(tracker, position,buttonDown,insideElementRelease,event)
+    {
+	demoMessageLog += "Altered version of original releaseHandler\n" +
+	"    tracker:" + tracker + "\n" +
+	"    position:" + position + "\n" +
+	"    buttonDown:" + buttonDown + "\n" +
+	"    insideElementRelease:" + insideElementRelease + "\n" +
+	"    event:" + event + "\n\n";
+        checkIfEventWasPassed(event);
+	updateDebugMessageOnScreenConsole();
+    };
+    
+    viewer.addHandler("release",  function(tracker, position ,buttonDown,insideElementRelease,event)
+   {
+      demoMessageLog += "Additional releaseHandler\n" +
+	  "    tracker:" + tracker + "\n" +
+	  "    position:" + position + "\n" +
+	  "    buttonDown:" + buttonDown + "\n" +
+	  "    insideElementRelease:" + insideElementRelease + "\n" +
+	  "    event:" + event + "\n\n";
+      checkIfEventWasPassed(event);
+      updateDebugMessageOnScreenConsole();
+    });
+
+    viewer.innerTracker.keyHandler = function(tracker, keycode, shift,event)
+    {
+	demoMessageLog += "Altered version of original keyHandler\n" +
+	"    tracker:" + tracker + "\n" +
+	"    keycode:" + keycode + "\n" +
+	"    shift:" + shift + "\n" +
+	"    event:" + event + "\n\n";
+        checkIfEventWasPassed(event);
+        updateDebugMessageOnScreenConsole();
+    };
+    
+    viewer.addHandler("keypress",  function(tracker, keycode, shift,event)
+    {
+       demoMessageLog += "Additional keyHandler\n" +
+       "    tracker:" + tracker + "\n" +
+       "    keycode:" + keycode + "\n" +
+       "    shift:" + shift + "\n" +
+       "    event:" + event + "\n\n";
+       checkIfEventWasPassed(event);
+       updateDebugMessageOnScreenConsole();
+    });
+
+
+    viewer.innerTracker.dragHandler = function(tracker, position, delta, shift,event)
+    {
+	demoMessageLog += "Altered version of original dragHandler\n" +
+	"    tracker:" + tracker + "\n" +
+	"    position:" + position + "\n" +
+	"    delta:" + delta + "\n" +
+	"    shift:" + shift + "\n" +
+	"    event:" + event + "\n\n";
+        checkIfEventWasPassed(event);
+	updateDebugMessageOnScreenConsole();
+    };
+    
+    viewer.addHandler("drag",  function(tracker, position, delta, shift,event)
+    {
+      demoMessageLog += "Additional dragHandler\n" +
+	  "   tracker:" + tracker + "\n" +
+	  "   position:" + position + "\n" +
+	  "   delta:" + delta + "\n" +
+	  "   shift:" + shift + "\n" +
+	  "   event:" + event + "\n\n";
+      checkIfEventWasPassed(event);
+      updateDebugMessageOnScreenConsole();
+    });
+
+    viewer.innerTracker.scrollHandler = function(tracker, position, scroll, shift,event)
+    {
+	demoMessageLog += "Altered version of original scrollHandler\n" +
+	"    tracker:" + tracker + "\n" +
+	"    position:" + position + "\n" +
+	"    scroll:" + scroll + "\n" +
+	"    shift:" + shift + "\n" +
+	"    event:" + event + "\n\n";
+        checkIfEventWasPassed(event);
+	updateDebugMessageOnScreenConsole();
+    };
+    
+    viewer.addHandler("scroll",  function(tracker, position, scroll, shift,event)
+    {
+      demoMessageLog += "Additional scrollHandler\n" +
+	  "   tracker:" + tracker + "\n" +
+	  "   position:" + position + "\n" +
+	  "   scroll:" + scroll + "\n" +
+	  "   shift:" + shift + "\n" +
+	  "   event:" + event + "\n\n";
+      checkIfEventWasPassed(event);
+      updateDebugMessageOnScreenConsole();
+    });
+
+    viewer.innerTracker.enterHandler =  function(tracker, position, buttonDown, buttonDownAny,event)
+    {
+	demoMessageLog += "Altered version of original enterHandler\n" +
+	"    tracker:" + tracker + "\n" +
+	"    position:" + position + "\n" +
+	"   buttonDown:" + buttonDown + "\n" +
+	"   buttonDownAny:" + buttonDownAny + "\n" +
+	"    event:" + event + "\n\n";
+        checkIfEventWasPassed(event);
+	updateDebugMessageOnScreenConsole();
+    };
+    
+    viewer.addHandler("enter",  function(tracker, position, buttonDown, buttonDownAny,event)
+    {
+      demoMessageLog += "Additional enterHandler\n" +
+	  "   tracker:" + tracker + "\n" +
+	  "   position:" + position + "\n" +
+	  "   buttonDown:" + buttonDown + "\n" +
+	  "   buttonDownAny:" + buttonDownAny + "\n" +
+	  "   event:" + event + "\n\n";
+      checkIfEventWasPassed(event);
+      updateDebugMessageOnScreenConsole();
+    });
+
+    viewer.innerTracker.exitHandler = function(tracker, position, buttonDown, buttonDownAny,event)
+    {
+	demoMessageLog += "Altered version of original exitHandler\n" +
+	"    tracker:" + tracker + "\n" +
+	"    position:" + position + "\n" +
+	"   buttonDown:" + buttonDown + "\n" +
+	"   buttonDownAny:" + buttonDownAny + "\n" +
+	"    event:" + event + "\n\n";
+        checkIfEventWasPassed(event);
+	updateDebugMessageOnScreenConsole();
+    };
+    
+    viewer.addHandler("exit",  function(tracker, position, buttonDown, buttonDownAny,event)
+    {
+      demoMessageLog += "Additional exitHandler\n" +
+	  "   tracker:" + tracker + "\n" +
+	  "   position:" + position + "\n" +
+	  "   buttonDown:" + buttonDown + "\n" +
+	  "   buttonDownAny:" + buttonDownAny + "\n" +
+	  "   event:" + event + "\n\n";
+      checkIfEventWasPassed(event);
+      updateDebugMessageOnScreenConsole();
+    });
+
+    viewer.innerTracker.focusHandler = function(tracker, event) 
+    {
+	demoMessageLog += "Altered version of original focusHandler\n" +
+	"    tracker:" + tracker + "\n" +
+	"    event:" + event + "\n\n";
+        checkIfEventWasPassed(event);
+	updateDebugMessageOnScreenConsole();
+    };
+	
+    viewer.addHandler("focus",  function(tracker, event)
+    {
+      demoMessageLog += "Additional focusHandler\n" +
+	  "   tracker:" + tracker + "\n" +
+	  "   event:" + event + "\n\n";
+      checkIfEventWasPassed(event);
+      updateDebugMessageOnScreenConsole();
+     });
+
+    viewer.innerTracker.blurHandler = function(tracker, event)
+    {
+       demoMessageLog += "Altered version of original blurHandler\n" +
+	"    tracker:" + tracker + "\n" +
+	"    event:" + event + "\n\n";
+       checkIfEventWasPassed(event);
+       updateDebugMessageOnScreenConsole();
+    };
+    
+    viewer.addHandler("blur",  function(tracker, event)
+    {
+      demoMessageLog += "Additional blurHandler\n" +
+	  "   tracker:" + tracker + "\n" +
+	  "   event:" + event + "\n\n";
+      checkIfEventWasPassed(event);
+      updateDebugMessageOnScreenConsole();
+    });
+
+        </script>
+    </body>
+</html>