mirror/openseadragon
1
0
Fork 0
mirror of https://github.com/openseadragon/openseadragon.git synced 2025-04-18 08:31:00 +00:00
Code Issues Projects Releases Wiki Activity

Merge 6285a779f3 into 0b366d7b42

Browse source
This commit is contained in:
houseofyin 2013-05-14 09:24:28 -07:00
commit 17ca475566
4 changed files with 324 additions and 50 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

89
src/button.js
View file

@ -175,41 +175,81 @@ $.Button = function( options ) {
clickTimeThreshold: this.clickTimeThreshold,
clickDistThreshold: this.clickDistThreshold,
enterHandler: function( tracker, position, buttonDownElement, buttonDownAny ) {
enterHandler: function( tracker, position, buttonDownElement, buttonDownAny, event ) {
if ( buttonDownElement ) {
inTo( _this, $.ButtonState.DOWN );
_this.raiseEvent( "onEnter", _this );
_this.raiseEvent( "enter", {
button: _this,
tracker: tracker,
position: position,
buttonDownElement: buttonDownElement,
buttonDownAny: buttonDownAny,
originalEvent: event
});
} else if ( !buttonDownAny ) {
inTo( _this, $.ButtonState.HOVER );
}
},
focusHandler: function( tracker, position, buttonDownElement, buttonDownAny ) {
this.enterHandler( tracker, position, buttonDownElement, buttonDownAny );
_this.raiseEvent( "onFocus", _this );
focusHandler: function( tracker, position, buttonDownElement, buttonDownAny, event ) {
this.enterHandler( tracker, position, buttonDownElement, buttonDownAny, event );
_this.raiseEvent( "focus", {
button: _this,
tracker: tracker,
position: position,
buttonDownElement: buttonDownElement,
buttonDownAny: buttonDownAny,
originalEvent: event
});
},
exitHandler: function( tracker, position, buttonDownElement, buttonDownAny ) {
exitHandler: function( tracker, position, buttonDownElement, buttonDownAny, event ) {
outTo( _this, $.ButtonState.GROUP );
if ( buttonDownElement ) {
_this.raiseEvent( "onExit", _this );
_this.raiseEvent( "exit", {
button: _this,
tracker: tracker,
position: position,
buttonDownElement: buttonDownElement,
buttonDownAny: buttonDownAny,
originalEvent: event
});
}
},
blurHandler: function( tracker, position, buttonDownElement, buttonDownAny ) {
this.exitHandler( tracker, position, buttonDownElement, buttonDownAny );
_this.raiseEvent( "onBlur", _this );
blurHandler: function( tracker, position, buttonDownElement, buttonDownAny, event ) {
this.exitHandler( tracker, position, buttonDownElement, buttonDownAny, event );
_this.raiseEvent( "blur", {
button: _this,
tracker: tracker,
position: position,
buttonDownElement: buttonDownElement,
buttonDownAny: buttonDownAny,
originalEvent: event
});
},
pressHandler: function( tracker, position ) {
pressHandler: function( tracker, position, event ) {
inTo( _this, $.ButtonState.DOWN );
_this.raiseEvent( "onPress", _this );
_this.raiseEvent( "press", {
button: _this,
tracker: tracker,
position: position,
originalEvent: event
});
},
releaseHandler: function( tracker, position, insideElementPress, insideElementRelease ) {
releaseHandler: function( tracker, position, insideElementPress, insideElementRelease, event ) {
if ( insideElementPress && insideElementRelease ) {
outTo( _this, $.ButtonState.HOVER );
_this.raiseEvent( "onRelease", _this );
_this.raiseEvent( "release", {
button: _this,
tracker: tracker,
position: position,
insideElementPress: insideElementPress,
insideElementRelease: insideElementRelease,
originalEvent: event
});
} else if ( insideElementPress ) {
outTo( _this, $.ButtonState.GROUP );
} else {
@ -217,17 +257,28 @@ $.Button = function( options ) {
}
},
clickHandler: function( tracker, position, quick, shift ) {
clickHandler: function( tracker, position, quick, shift, event ) {
if ( quick ) {
_this.raiseEvent("onClick", _this);
_this.raiseEvent("click", {
button: _this,
tracker: tracker,
position: position,
quick: quick,
shift: shift,
originalEvent: event
});
}
},
keyHandler: function( tracker, key ){
keyHandler: function( tracker, key, event ){
//console.log( "%s : handling key %s!", _this.tooltip, key);
if( 13 === key ){
_this.raiseEvent( "onClick", _this );
_this.raiseEvent( "onRelease", _this );
_this.raiseEvent( "keypress", {
button: _this,
tracker: tracker,
key: key,
originalEvent: event
});
return false;
}
return true;

56
src/mousetracker.js
View file

@ -210,6 +210,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(){},
@ -226,6 +228,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(){},
@ -237,6 +241,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(){},
@ -254,6 +260,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(){},
@ -269,6 +277,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(){},
@ -285,6 +295,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(){},
@ -301,6 +313,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(){},
@ -314,6 +328,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(){},
@ -555,7 +571,8 @@
propagate = tracker.keyHandler(
tracker,
event.keyCode ? event.keyCode : event.charCode,
event.shiftKey
event.shiftKey,
event
);
if( !propagate ){
$.cancelEvent( event );
@ -602,7 +619,8 @@
tracker,
getMouseRelative( event, tracker.element ),
delegate.buttonDown,
IS_BUTTON_DOWN
IS_BUTTON_DOWN,
event
);
if( propagate === false ){
$.cancelEvent( event );
@ -649,7 +667,8 @@
tracker,
getMouseRelative( event, tracker.element ),
delegate.buttonDown,
IS_BUTTON_DOWN
IS_BUTTON_DOWN,
event
);
if( propagate === false ){
@ -682,7 +701,8 @@
if ( tracker.pressHandler ) {
propagate = tracker.pressHandler(
tracker,
getMouseRelative( event, tracker.element )
getMouseRelative( event, tracker.element ),
event
);
if( propagate === false ){
$.cancelEvent( event );
@ -717,7 +737,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 ] );
}
@ -765,7 +794,8 @@
tracker,
getMouseRelative( event, tracker.element ),
insideElementPress,
insideElementRelease
insideElementRelease,
event
);
if( propagate === false ){
$.cancelEvent( event );
@ -789,6 +819,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 ] );
}
@ -897,7 +928,8 @@
tracker,
getMouseRelative( event, tracker.element ),
nDelta,
event.shiftKey
event.shiftKey,
event
);
if( propagate === false ){
$.cancelEvent( event );
@ -931,7 +963,8 @@
tracker,
getMouseRelative( event, tracker.element ),
quick,
event.shiftKey
event.shiftKey,
event
);
if( propagate === false ){
$.cancelEvent( event );
@ -961,7 +994,8 @@
tracker,
getMouseRelative( event, tracker.element ),
delta,
event.shiftKey
event.shiftKey,
event
);
if( propagate === false ){
$.cancelEvent( event );
@ -983,7 +1017,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 ){
@ -998,6 +1032,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,

49
src/viewer.js
View file

@ -1249,7 +1249,7 @@ function onBlur(){
}
function onCanvasClick( tracker, position, quick, shift ) {
function onCanvasClick( tracker, position, quick, shift, event ) {
var zoomPreClick,
factor;
if ( this.viewport && quick ) { // ignore clicks where mouse moved
@ -1261,15 +1261,16 @@ function onCanvasClick( tracker, position, quick, shift ) {
);
this.viewport.applyConstraints();
}
this.raiseEvent( 'canvas-click', {
this.raiseEvent( 'click', {
tracker: tracker,
position: position,
quick: quick,
shift: shift
shift: shift,
originalEvent: event
});
}
function onCanvasDrag( tracker, position, delta, shift ) {
function onCanvasDrag( tracker, position, delta, shift, event ) {
if ( this.viewport ) {
if( !this.panHorizontal ){
delta.x = 0;
@ -1286,27 +1287,29 @@ function onCanvasDrag( tracker, position, delta, shift ) {
this.viewport.applyConstraints();
}
}
this.raiseEvent( 'canvas-click', {
this.raiseEvent( 'drag', {
tracker: tracker,
position: position,
delta: delta,
shift: shift
shift: shift,
originalEvent: event
});
}
function onCanvasRelease( tracker, position, insideElementPress, insideElementRelease ) {
function onCanvasRelease( tracker, position, insideElementPress, insideElementRelease, event ) {
if ( insideElementPress && this.viewport ) {
this.viewport.applyConstraints();
}
this.raiseEvent( 'canvas-release', {
this.raiseEvent( 'release', {
tracker: tracker,
position: position,
insideElementPress: insideElementPress,
insideElementRelease: insideElementRelease
insideElementRelease: insideElementRelease,
originalEvent: event
});
}
function onCanvasScroll( tracker, position, scroll, shift ) {
function onCanvasScroll( tracker, position, scroll, shift, event ) {
var factor;
if ( this.viewport ) {
factor = Math.pow( this.zoomPerScroll, scroll );
@ -1316,54 +1319,58 @@ function onCanvasScroll( tracker, position, scroll, shift ) {
);
this.viewport.applyConstraints();
}
this.raiseEvent( 'canvas-scroll', {
this.raiseEvent( 'scroll', {
tracker: tracker,
position: position,
scroll: scroll,
shift: shift
shift: shift,
originalEvent: event
});
//cancels event
return false;
}
function onContainerExit( tracker, position, buttonDownElement, buttonDownAny ) {
function onContainerExit( tracker, position, buttonDownElement, buttonDownAny, event ) {
if ( !buttonDownElement ) {
THIS[ this.hash ].mouseInside = false;
if ( !THIS[ this.hash ].animating ) {
beginControlsAutoHide( this );
}
}
this.raiseEvent( 'container-exit', {
this.raiseEvent( 'exit', {
tracker: tracker,
position: position,
buttonDownElement: buttonDownElement,
buttonDownAny: buttonDownAny
buttonDownAny: buttonDownAny,
originalEvent: event
});
}
function onContainerRelease( tracker, position, insideElementPress, insideElementRelease ) {
function onContainerRelease( tracker, position, insideElementPress, insideElementRelease, event ) {
if ( !insideElementRelease ) {
THIS[ this.hash ].mouseInside = false;
if ( !THIS[ this.hash ].animating ) {
beginControlsAutoHide( this );
}
}
this.raiseEvent( 'container-release', {
this.raiseEvent( 'release', {
tracker: tracker,
position: position,
insideElementPress: insideElementPress,
insideElementRelease: insideElementRelease
insideElementRelease: insideElementRelease,
originalEvent: event
});
}
function onContainerEnter( tracker, position, buttonDownElement, buttonDownAny ) {
function onContainerEnter( tracker, position, buttonDownElement, buttonDownAny, event ) {
THIS[ this.hash ].mouseInside = true;
abortControlsAutoHide( this );
this.raiseEvent( 'container-enter', {
this.raiseEvent( 'enter', {
tracker: tracker,
position: position,
buttonDownElement: buttonDownElement,
buttonDownAny: buttonDownAny
buttonDownAny: buttonDownAny,
originalEvent: event
});
}

180
test/demo.html Normal file
View file

@ -0,0 +1,180 @@
<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 logMessage(){
screenConsole.innerHTML = demoMessageLog.replace(/\n/g, '<br />');
}
viewer.addHandler("click", function( event ){
demoMessageLog += "Additional clickHandler\n" +
" tracker:" + event.tracker + "\n" +
" position:" + event.position + "\n" +
" delta:" + event.delta + "\n" +
" shift:" + event.shift + "\n" +
" originalEvent:" + event.originalEvent + "\n\n";
checkIfEventWasPassed( event.originalEvent );
logMessage();
});
viewer.addHandler("press", function( event ){
demoMessageLog += "Additional pressHandler\n" +
" tracker:" + event.tracker + "\n" +
" position:" + event.position + "\n" +
" originalEvent:" + event.originalEvent + "\n\n";
checkIfEventWasPassed( event.originalEvent );
logMessage();
});
viewer.addHandler("release", function( event ){
demoMessageLog += "Additional releaseHandler\n" +
" tracker:" + event.tracker + "\n" +
" position:" + event.position + "\n" +
" buttonDown:" + event.buttonDown + "\n" +
" insideElementRelease:" + event.insideElementRelease + "\n" +
" originalEvent:" + event.originalEvent + "\n\n";
checkIfEventWasPassed( event.originalEvent );
logMessage();
});
viewer.addHandler("keypress", function( event ){
demoMessageLog += "Additional keyHandler\n" +
" tracker:" + event.tracker + "\n" +
" keycode:" + event.keycode + "\n" +
" shift:" + event.shift + "\n" +
" originalEvent:" + event.originalEvent + "\n\n";
checkIfEventWasPassed( event.originalEvent );
logMessage();
});
viewer.addHandler("drag", function( event ){
demoMessageLog += "Additional dragHandler\n" +
" tracker:" + event.tracker + "\n" +
" position:" + event.position + "\n" +
" delta:" + event.delta + "\n" +
" shift:" + event.shift + "\n" +
" originalEvent:" + event.originalEvent + "\n\n";
checkIfEventWasPassed( event.originalEvent );
logMessage();
});
viewer.addHandler("scroll", function( event ){
demoMessageLog += "Additional scrollHandler\n" +
" tracker:" + event.tracker + "\n" +
" position:" + event.position + "\n" +
" scroll:" + event.scroll + "\n" +
" shift:" + event.shift + "\n" +
" originalEvent:" + event.originalEvent + "\n\n";
checkIfEventWasPassed( event.originalEvent );
logMessage();
});
viewer.addHandler("enter", function( event ){
demoMessageLog += "Additional enterHandler\n" +
" tracker:" + event.tracker + "\n" +
" position:" + event.position + "\n" +
" buttonDown:" + event.buttonDown + "\n" +
" buttonDownAny:" + event..buttonDownAny + "\n" +
" originalEvent:" + event.originalEvent + "\n\n";
checkIfEventWasPassed( event.originalEvent );
logMessage();
});
viewer.addHandler("exit", function( event ){
demoMessageLog += "Additional exitHandler\n" +
" tracker:" + event.tracker + "\n" +
" position:" + event.position + "\n" +
" buttonDown:" + event.buttonDown + "\n" +
" buttonDownAny:" + event.buttonDownAny + "\n" +
" originalEvent:" + event.originalEvent + "\n\n";
checkIfEventWasPassed( event.originalEvent );
logMessage();
});
viewer.addHandler("focus", function( event ){
demoMessageLog += "Additional focusHandler\n" +
" tracker:" + event.tracker + "\n" +
" originalEvent:" + event.originalEvent + "\n\n";
checkIfEventWasPassed( event.originalEvent );
logMessage();
});
viewer.addHandler("blur", function( event ){
demoMessageLog += "Additional blurHandler\n" +
" tracker:" + event.tracker + "\n" +
" originalEvent:" + event.originalEvent + "\n\n";
checkIfEventWasPassed( event.originalEvent );
logMessage();
});
</script>
</body>
</html>