mirror/openseadragon
1
0
Fork 0
mirror of https://github.com/openseadragon/openseadragon.git synced 2024-11-26 07:06:10 +03:00
Code Issues Projects Releases Wiki Activity

cleaning up event names, reducing demo cases to just addHandler interface, normalizing event data to express more idiomatic javascript pattern of passing object instead of invoking callback with positional parameters

Browse Source
This commit is contained in:
thatcher 2013-03-06 17:34:12 -05:00
parent a432a38d3d
commit 6285a779f3
3 changed files with 218 additions and 276 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

89
src/button.js
View File

@ -141,41 +141,81 @@ $.Button = function( options ) {
clickTimeThreshold: this.clickTimeThreshold, clickTimeThreshold: this.clickTimeThreshold,
clickDistThreshold: this.clickDistThreshold, clickDistThreshold: this.clickDistThreshold,
enterHandler: function( tracker, position, buttonDownElement, buttonDownAny ) { enterHandler: function( tracker, position, buttonDownElement, buttonDownAny, event ) {
if ( buttonDownElement ) { if ( buttonDownElement ) {
inTo( _this, $.ButtonState.DOWN ); 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 ) { } else if ( !buttonDownAny ) {
inTo( _this, $.ButtonState.HOVER ); inTo( _this, $.ButtonState.HOVER );
} }
}, },
focusHandler: function( tracker, position, buttonDownElement, buttonDownAny ) { focusHandler: function( tracker, position, buttonDownElement, buttonDownAny, event ) {
this.enterHandler( tracker, position, buttonDownElement, buttonDownAny ); this.enterHandler( tracker, position, buttonDownElement, buttonDownAny, event );
_this.raiseEvent( "onFocus", _this ); _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 ); outTo( _this, $.ButtonState.GROUP );
if ( buttonDownElement ) { 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 ) { blurHandler: function( tracker, position, buttonDownElement, buttonDownAny, event ) {
this.exitHandler( tracker, position, buttonDownElement, buttonDownAny ); this.exitHandler( tracker, position, buttonDownElement, buttonDownAny, event );
_this.raiseEvent( "onBlur", _this ); _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 ); 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 ) { if ( insideElementPress && insideElementRelease ) {
outTo( _this, $.ButtonState.HOVER ); 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 ) { } else if ( insideElementPress ) {
outTo( _this, $.ButtonState.GROUP ); outTo( _this, $.ButtonState.GROUP );
} else { } else {
@ -183,17 +223,28 @@ $.Button = function( options ) {
} }
}, },
clickHandler: function( tracker, position, quick, shift ) { clickHandler: function( tracker, position, quick, shift, event ) {
if ( quick ) { 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); //console.log( "%s : handling key %s!", _this.tooltip, key);
if( 13 === key ){ if( 13 === key ){
_this.raiseEvent( "onClick", _this ); _this.raiseEvent( "keypress", {
_this.raiseEvent( "onRelease", _this ); button: _this,
tracker: tracker,
key: key,
originalEvent: event
});
return false; return false;
} }
return true; return true;

49
src/viewer.js
View File

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

264
test/demo.html
View File

@ -55,240 +55,124 @@
var demoMessageLog = ""; var demoMessageLog = "";
var screenConsole = document.getElementById('consolelog'); var screenConsole = document.getElementById('consolelog');
function checkIfEventWasPassed(event) function checkIfEventWasPassed(event){
{ if(typeof event === 'undefined'){
if(typeof event === 'undefined')
{
demoMessageLog += "PROBLEM EVENT WAS UNDEFINED:" + event + "\n\n"; demoMessageLog += "PROBLEM EVENT WAS UNDEFINED:" + event + "\n\n";
} }
} }
function updateDebugMessageOnScreenConsole() function logMessage(){
{
screenConsole.innerHTML = demoMessageLog.replace(/\n/g, '<br />'); 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( event ){
viewer.addHandler("click", function(tracker, position, delta, shift,event)
{
demoMessageLog += "Additional clickHandler\n" + demoMessageLog += "Additional clickHandler\n" +
" tracker:" + tracker + "\n" + " tracker:" + event.tracker + "\n" +
" position:" + position + "\n" + " position:" + event.position + "\n" +
" delta:" + delta + "\n" + " delta:" + event.delta + "\n" +
" shift:" + shift + "\n" + " shift:" + event.shift + "\n" +
" event:" + event + "\n\n"; " originalEvent:" + event.originalEvent + "\n\n";
checkIfEventWasPassed(event); checkIfEventWasPassed( event.originalEvent );
updateDebugMessageOnScreenConsole(); logMessage();
}); });
viewer.innerTracker.pressHandler = function(tracker, position, event) viewer.addHandler("press", function( 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" + demoMessageLog += "Additional pressHandler\n" +
" tracker:" + tracker + "\n" + " tracker:" + event.tracker + "\n" +
" position:" + position + "\n" + " position:" + event.position + "\n" +
" event:" + event + "\n\n"; " originalEvent:" + event.originalEvent + "\n\n";
checkIfEventWasPassed(event); checkIfEventWasPassed( event.originalEvent );
updateDebugMessageOnScreenConsole(); logMessage();
}); });
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) viewer.addHandler("release", function( event ){
{
demoMessageLog += "Additional releaseHandler\n" + demoMessageLog += "Additional releaseHandler\n" +
" tracker:" + tracker + "\n" + " tracker:" + event.tracker + "\n" +
" position:" + position + "\n" + " position:" + event.position + "\n" +
" buttonDown:" + buttonDown + "\n" + " buttonDown:" + event.buttonDown + "\n" +
" insideElementRelease:" + insideElementRelease + "\n" + " insideElementRelease:" + event.insideElementRelease + "\n" +
" event:" + event + "\n\n"; " originalEvent:" + event.originalEvent + "\n\n";
checkIfEventWasPassed(event); checkIfEventWasPassed( event.originalEvent );
updateDebugMessageOnScreenConsole(); logMessage();
}); });
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) viewer.addHandler("keypress", function( event ){
{
demoMessageLog += "Additional keyHandler\n" + demoMessageLog += "Additional keyHandler\n" +
" tracker:" + tracker + "\n" + " tracker:" + event.tracker + "\n" +
" keycode:" + keycode + "\n" + " keycode:" + event.keycode + "\n" +
" shift:" + shift + "\n" + " shift:" + event.shift + "\n" +
" event:" + event + "\n\n"; " originalEvent:" + event.originalEvent + "\n\n";
checkIfEventWasPassed(event); checkIfEventWasPassed( event.originalEvent );
updateDebugMessageOnScreenConsole(); logMessage();
}); });
viewer.innerTracker.dragHandler = function(tracker, position, delta, shift,event) viewer.addHandler("drag", function( 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" + demoMessageLog += "Additional dragHandler\n" +
" tracker:" + tracker + "\n" + " tracker:" + event.tracker + "\n" +
" position:" + position + "\n" + " position:" + event.position + "\n" +
" delta:" + delta + "\n" + " delta:" + event.delta + "\n" +
" shift:" + shift + "\n" + " shift:" + event.shift + "\n" +
" event:" + event + "\n\n"; " originalEvent:" + event.originalEvent + "\n\n";
checkIfEventWasPassed(event); checkIfEventWasPassed( event.originalEvent );
updateDebugMessageOnScreenConsole(); logMessage();
}); });
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) viewer.addHandler("scroll", function( event ){
{
demoMessageLog += "Additional scrollHandler\n" + demoMessageLog += "Additional scrollHandler\n" +
" tracker:" + tracker + "\n" + " tracker:" + event.tracker + "\n" +
" position:" + position + "\n" + " position:" + event.position + "\n" +
" scroll:" + scroll + "\n" + " scroll:" + event.scroll + "\n" +
" shift:" + shift + "\n" + " shift:" + event.shift + "\n" +
" event:" + event + "\n\n"; " originalEvent:" + event.originalEvent + "\n\n";
checkIfEventWasPassed(event); checkIfEventWasPassed( event.originalEvent );
updateDebugMessageOnScreenConsole(); logMessage();
}); });
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) viewer.addHandler("enter", function( event ){
{
demoMessageLog += "Additional enterHandler\n" + demoMessageLog += "Additional enterHandler\n" +
" tracker:" + tracker + "\n" + " tracker:" + event.tracker + "\n" +
" position:" + position + "\n" + " position:" + event.position + "\n" +
" buttonDown:" + buttonDown + "\n" + " buttonDown:" + event.buttonDown + "\n" +
" buttonDownAny:" + buttonDownAny + "\n" + " buttonDownAny:" + event..buttonDownAny + "\n" +
" event:" + event + "\n\n"; " originalEvent:" + event.originalEvent + "\n\n";
checkIfEventWasPassed(event); checkIfEventWasPassed( event.originalEvent );
updateDebugMessageOnScreenConsole(); logMessage();
}); });
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) viewer.addHandler("exit", function( event ){
{
demoMessageLog += "Additional exitHandler\n" + demoMessageLog += "Additional exitHandler\n" +
" tracker:" + tracker + "\n" + " tracker:" + event.tracker + "\n" +
" position:" + position + "\n" + " position:" + event.position + "\n" +
" buttonDown:" + buttonDown + "\n" + " buttonDown:" + event.buttonDown + "\n" +
" buttonDownAny:" + buttonDownAny + "\n" + " buttonDownAny:" + event.buttonDownAny + "\n" +
" event:" + event + "\n\n"; " originalEvent:" + event.originalEvent + "\n\n";
checkIfEventWasPassed(event); checkIfEventWasPassed( event.originalEvent );
updateDebugMessageOnScreenConsole(); logMessage();
}); });
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) viewer.addHandler("focus", function( event ){
{
demoMessageLog += "Additional focusHandler\n" + demoMessageLog += "Additional focusHandler\n" +
" tracker:" + tracker + "\n" + " tracker:" + event.tracker + "\n" +
" event:" + event + "\n\n"; " originalEvent:" + event.originalEvent + "\n\n";
checkIfEventWasPassed(event); checkIfEventWasPassed( event.originalEvent );
updateDebugMessageOnScreenConsole(); logMessage();
}); });
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) viewer.addHandler("blur", function( event ){
{
demoMessageLog += "Additional blurHandler\n" + demoMessageLog += "Additional blurHandler\n" +
" tracker:" + tracker + "\n" + " tracker:" + event.tracker + "\n" +
" event:" + event + "\n\n"; " originalEvent:" + event.originalEvent + "\n\n";
checkIfEventWasPassed(event); checkIfEventWasPassed( event.originalEvent );
updateDebugMessageOnScreenConsole(); logMessage();
}); });
</script> </script>