Additional patches for keyboard accessibility

This commit is contained in:
thatcher 2012-03-20 21:58:23 -04:00
parent 825023aaf6
commit 94247b7225
4 changed files with 54 additions and 38 deletions

View File

@ -6,7 +6,7 @@
PROJECT: openseadragon PROJECT: openseadragon
BUILD_MAJOR: 0 BUILD_MAJOR: 0
BUILD_MINOR: 9 BUILD_MINOR: 9
BUILD_ID: 36 BUILD_ID: 37
BUILD: ${PROJECT}.${BUILD_MAJOR}.${BUILD_MINOR}.${BUILD_ID} BUILD: ${PROJECT}.${BUILD_MAJOR}.${BUILD_MINOR}.${BUILD_ID}
VERSION: ${BUILD_MAJOR}.${BUILD_MINOR}.${BUILD_ID} VERSION: ${BUILD_MAJOR}.${BUILD_MINOR}.${BUILD_ID}

View File

@ -1,5 +1,5 @@
/** /**
* @version OpenSeadragon 0.9.36 * @version OpenSeadragon 0.9.37
* *
* @fileOverview * @fileOverview
* <h2> * <h2>
@ -2205,13 +2205,14 @@ $.EventHandler.prototype = {
* @inner * @inner
*/ */
function onKeyPress( tracker, event ){ function onKeyPress( tracker, event ){
//console.log( "keypress %s", event.keyCode ); //console.log( "keypress %s %s %s %s %s", event.keyCode, event.charCode, event.ctrlKey, event.shiftKey, event.altKey );
var propagate; var propagate;
if ( tracker.keyHandler ) { if ( tracker.keyHandler ) {
try { try {
propagate = tracker.keyHandler( propagate = tracker.keyHandler(
tracker, tracker,
event.keyCode event.keyCode ? event.keyCode : event.charCode,
event.shiftKey
); );
if( !propagate ){ if( !propagate ){
$.cancelEvent( event ); $.cancelEvent( event );
@ -4205,9 +4206,10 @@ $.Navigator = function( options ){
style.position = 'relative'; style.position = 'relative';
style.top = '0px'; style.top = '0px';
style.left = '0px'; style.left = '0px';
style.border = '1px solid #900'; style.fontSize = '0px';
style.border = '2px solid #900';
//TODO: IE doesnt like this property being set //TODO: IE doesnt like this property being set
//style.outline = '2px auto #900'; try{ style.outline = '2px auto #900'; }catch(e){/*ignore*/}
style.background = 'transparent'; style.background = 'transparent';
style.float = 'left'; //Webkit style.float = 'left'; //Webkit
style.cssFloat = 'left'; //Firefox style.cssFloat = 'left'; //Firefox
@ -4222,7 +4224,7 @@ $.Navigator = function( options ){
focusHandler: function(){ focusHandler: function(){
_this.viewer.setControlsEnabled( true ); _this.viewer.setControlsEnabled( true );
(function( style ){ (function( style ){
style.border = '1px solid #437AB2'; style.border = '2px solid #437AB2';
style.outline = '2px auto #437AB2'; style.outline = '2px auto #437AB2';
}( this.element.style )); }( this.element.style ));
@ -4230,20 +4232,35 @@ $.Navigator = function( options ){
blurHandler: function(){ blurHandler: function(){
_this.viewer.setControlsEnabled( false ); _this.viewer.setControlsEnabled( false );
(function( style ){ (function( style ){
style.border = '1px solid #900'; style.border = '2px solid #900';
style.outline = '2px auto #900'; style.outline = '2px auto #900';
}( this.element.style )); }( this.element.style ));
}, },
keyHandler: function(tracker, keyCode){ keyHandler: function(tracker, keyCode, shiftKey){
//console.log( keyCode ); //console.log( keyCode );
switch( keyCode ){ switch( keyCode ){
case 61://=|+
_this.viewer.viewport.zoomBy(1.1);
return false;
case 45://-|_
_this.viewer.viewport.zoomBy(0.9);
return false;
case 48://0|)
_this.viewer.viewport.goHome();
return false;
case 119://w case 119://w
case 87://W
case 38://up arrow case 38://up arrow
_this.viewer.viewport.panBy(new $.Point(0, -0.05)); shiftKey ?
_this.viewer.viewport.zoomBy(1.1):
_this.viewer.viewport.panBy(new $.Point(0, -0.05));
return false; return false;
case 115://s case 115://s
case 83://S
case 40://down arrow case 40://down arrow
_this.viewer.viewport.panBy(new $.Point(0, 0.05)); shiftKey ?
_this.viewer.viewport.zoomBy(0.9):
_this.viewer.viewport.panBy(new $.Point(0, 0.05));
return false; return false;
case 97://a case 97://a
case 37://left arrow case 37://left arrow
@ -4253,15 +4270,6 @@ $.Navigator = function( options ){
case 39://right arrow case 39://right arrow
_this.viewer.viewport.panBy(new $.Point(0.05, 0)); _this.viewer.viewport.panBy(new $.Point(0.05, 0));
return false; return false;
case 61://=|+
_this.viewer.viewport.zoomBy(1.1);
return false;
case 45://-|_
_this.viewer.viewport.zoomBy(0.9);
return false;
case 48://0|)
_this.viewer.viewport.goHome();
return false;
default: default:
//console.log( 'navigator keycode %s', keyCode ); //console.log( 'navigator keycode %s', keyCode );
return true; return true;

View File

@ -528,13 +528,14 @@
* @inner * @inner
*/ */
function onKeyPress( tracker, event ){ function onKeyPress( tracker, event ){
//console.log( "keypress %s", event.keyCode ); //console.log( "keypress %s %s %s %s %s", event.keyCode, event.charCode, event.ctrlKey, event.shiftKey, event.altKey );
var propagate; var propagate;
if ( tracker.keyHandler ) { if ( tracker.keyHandler ) {
try { try {
propagate = tracker.keyHandler( propagate = tracker.keyHandler(
tracker, tracker,
event.keyCode event.keyCode ? event.keyCode : event.charCode,
event.shiftKey
); );
if( !propagate ){ if( !propagate ){
$.cancelEvent( event ); $.cancelEvent( event );

View File

@ -54,9 +54,10 @@ $.Navigator = function( options ){
style.position = 'relative'; style.position = 'relative';
style.top = '0px'; style.top = '0px';
style.left = '0px'; style.left = '0px';
style.border = '1px solid #900'; style.fontSize = '0px';
style.border = '2px solid #900';
//TODO: IE doesnt like this property being set //TODO: IE doesnt like this property being set
//style.outline = '2px auto #900'; try{ style.outline = '2px auto #900'; }catch(e){/*ignore*/}
style.background = 'transparent'; style.background = 'transparent';
style.float = 'left'; //Webkit style.float = 'left'; //Webkit
style.cssFloat = 'left'; //Firefox style.cssFloat = 'left'; //Firefox
@ -71,7 +72,7 @@ $.Navigator = function( options ){
focusHandler: function(){ focusHandler: function(){
_this.viewer.setControlsEnabled( true ); _this.viewer.setControlsEnabled( true );
(function( style ){ (function( style ){
style.border = '1px solid #437AB2'; style.border = '2px solid #437AB2';
style.outline = '2px auto #437AB2'; style.outline = '2px auto #437AB2';
}( this.element.style )); }( this.element.style ));
@ -79,20 +80,35 @@ $.Navigator = function( options ){
blurHandler: function(){ blurHandler: function(){
_this.viewer.setControlsEnabled( false ); _this.viewer.setControlsEnabled( false );
(function( style ){ (function( style ){
style.border = '1px solid #900'; style.border = '2px solid #900';
style.outline = '2px auto #900'; style.outline = '2px auto #900';
}( this.element.style )); }( this.element.style ));
}, },
keyHandler: function(tracker, keyCode){ keyHandler: function(tracker, keyCode, shiftKey){
//console.log( keyCode ); //console.log( keyCode );
switch( keyCode ){ switch( keyCode ){
case 61://=|+
_this.viewer.viewport.zoomBy(1.1);
return false;
case 45://-|_
_this.viewer.viewport.zoomBy(0.9);
return false;
case 48://0|)
_this.viewer.viewport.goHome();
return false;
case 119://w case 119://w
case 87://W
case 38://up arrow case 38://up arrow
_this.viewer.viewport.panBy(new $.Point(0, -0.05)); shiftKey ?
_this.viewer.viewport.zoomBy(1.1):
_this.viewer.viewport.panBy(new $.Point(0, -0.05));
return false; return false;
case 115://s case 115://s
case 83://S
case 40://down arrow case 40://down arrow
_this.viewer.viewport.panBy(new $.Point(0, 0.05)); shiftKey ?
_this.viewer.viewport.zoomBy(0.9):
_this.viewer.viewport.panBy(new $.Point(0, 0.05));
return false; return false;
case 97://a case 97://a
case 37://left arrow case 37://left arrow
@ -102,15 +118,6 @@ $.Navigator = function( options ){
case 39://right arrow case 39://right arrow
_this.viewer.viewport.panBy(new $.Point(0.05, 0)); _this.viewer.viewport.panBy(new $.Point(0.05, 0));
return false; return false;
case 61://=|+
_this.viewer.viewport.zoomBy(1.1);
return false;
case 45://-|_
_this.viewer.viewport.zoomBy(0.9);
return false;
case 48://0|)
_this.viewer.viewport.goHome();
return false;
default: default:
//console.log( 'navigator keycode %s', keyCode ); //console.log( 'navigator keycode %s', keyCode );
return true; return true;