diff --git a/changelog.txt b/changelog.txt index 42227a91..9ef4e2ec 100644 --- a/changelog.txt +++ b/changelog.txt @@ -60,6 +60,12 @@ OPENSEADRAGON CHANGELOG * Requesting keyboard focus when viewer is clicked (#537) * Arrow key navigation fixed across platforms (#565) * Removed textarea element from viewer DOM. Viewer.canvas now handles keyboard navigation (#569) +* Removed 'position' property from MouseTracker keyDownHandler/keyUpHandler/keyHandler functions (#573) +* Fixed pointer event model detection for IE 10 and IE 11 (#571) +* Added setMouseNavEnabled() support to Navigator (#572) +* MouseTracker now defaults to tracking on (#558) +* Removed Viewer focusHandler/onCanvasFocus (#577) +* Added tabIndex option to viewer (#577) 1.2.0: diff --git a/src/button.js b/src/button.js index 104955e0..42f68afc 100644 --- a/src/button.js +++ b/src/button.js @@ -355,7 +355,7 @@ $.Button = function( options ) { return true; } - }).setTracking( true ); + }); outTo( this, $.ButtonState.REST ); }; diff --git a/src/buttongroup.js b/src/buttongroup.js index 7505af0a..49cc9c2e 100644 --- a/src/buttongroup.js +++ b/src/buttongroup.js @@ -105,7 +105,7 @@ $.ButtonGroup = function( options ) { } } }, - }).setTracking( true ); + }); }; $.ButtonGroup.prototype = /** @lends OpenSeadragon.ButtonGroup.prototype */{ diff --git a/src/mousetracker.js b/src/mousetracker.js index 9e8f25ef..ec677fb7 100644 --- a/src/mousetracker.js +++ b/src/mousetracker.js @@ -54,6 +54,9 @@ * @param {Element|String} options.element * A reference to an element or an element id for which the pointer/key * events will be monitored. + * @param {Boolean} [options.startDisabled=false] + * If true, event tracking on the element will not start until + * {@link OpenSeadragon.MouseTracker.setTracking|setTracking} is called. * @param {Number} options.clickTimeThreshold * The number of milliseconds within which a pointer down-up event combination * will be treated as a click gesture. @@ -257,6 +260,9 @@ currentPinchCenter: null }; + if ( !options.startDisabled ) { + this.setTracking( true ); + } }; $.MouseTracker.prototype = /** @lends OpenSeadragon.MouseTracker.prototype */{ @@ -977,7 +983,8 @@ $.MouseTracker.subscribeEvents.push( "MozMousePixelScroll" ); } - if ( window.PointerEvent ) { + // Note: window.navigator.pointerEnable is deprecated on IE 11 and not part of W3C spec. + if ( window.PointerEvent && ( window.navigator.pointerEnabled || $.Browser.vendor !== $.BROWSERS.IE ) ) { // IE11 and other W3C Pointer Event implementations (see http://www.w3.org/TR/pointerevents) $.MouseTracker.havePointerEvents = true; $.MouseTracker.subscribeEvents.push( "pointerover", "pointerout", "pointerdown", "pointerup", "pointermove", "pointercancel" ); @@ -988,7 +995,7 @@ $.MouseTracker.maxTouchPoints = 0; } $.MouseTracker.haveMouseEnter = false; - } else if ( window.MSPointerEvent ) { + } else if ( window.MSPointerEvent && window.navigator.msPointerEnabled ) { // IE10 $.MouseTracker.havePointerEvents = true; $.MouseTracker.subscribeEvents.push( "MSPointerOver", "MSPointerOut", "MSPointerDown", "MSPointerUp", "MSPointerMove", "MSPointerCancel" ); @@ -1518,7 +1525,6 @@ propagate = tracker.keyDownHandler( { eventSource: tracker, - position: getMouseRelative( event, tracker.element ), keyCode: event.keyCode ? event.keyCode : event.charCode, ctrl: event.ctrlKey, shift: event.shiftKey, @@ -1548,7 +1554,6 @@ propagate = tracker.keyUpHandler( { eventSource: tracker, - position: getMouseRelative( event, tracker.element ), keyCode: event.keyCode ? event.keyCode : event.charCode, ctrl: event.ctrlKey, shift: event.shiftKey, @@ -1578,7 +1583,6 @@ propagate = tracker.keyHandler( { eventSource: tracker, - position: getMouseRelative( event, tracker.element ), keyCode: event.keyCode ? event.keyCode : event.charCode, ctrl: event.ctrlKey, shift: event.shiftKey, diff --git a/src/navigator.js b/src/navigator.js index 8f234248..23809e9d 100644 --- a/src/navigator.js +++ b/src/navigator.js @@ -52,8 +52,7 @@ $.Navigator = function( options ){ var viewer = options.viewer, _this = this, viewerSize, - navigatorSize, - unneededElement; + navigatorSize; //We may need to create a new element and id if they did not //provide the id for the existing element @@ -99,6 +98,7 @@ $.Navigator = function( options ){ sizeRatio: $.DEFAULT_SETTINGS.navigatorSizeRatio }, options, { element: this.element, + tabIndex: -1, // No keyboard navigation, omit from tab order //These need to be overridden to prevent recursion since //the navigator is a viewer and a viewer has a navigator showNavigator: false, @@ -168,24 +168,6 @@ $.Navigator = function( options ){ this.displayRegionContainer.style.width = "100%"; this.displayRegionContainer.style.height = "100%"; - this.element.innerTracker = new $.MouseTracker({ - element: this.element, - dragHandler: $.delegate( this, onCanvasDrag ), - clickHandler: $.delegate( this, onCanvasClick ), - releaseHandler: $.delegate( this, onCanvasRelease ), - scrollHandler: $.delegate( this, onCanvasScroll ) - }).setTracking( true ); - - /*this.displayRegion.outerTracker = new $.MouseTracker({ - element: this.container, - clickTimeThreshold: this.clickTimeThreshold, - clickDistThreshold: this.clickDistThreshold, - enterHandler: $.delegate( this, onContainerEnter ), - exitHandler: $.delegate( this, onContainerExit ), - releaseHandler: $.delegate( this, onContainerRelease ) - }).setTracking( this.mouseNavEnabled ? true : false ); // always tracking*/ - - viewer.addControl( this.element, options.controlOptions @@ -214,10 +196,6 @@ $.Navigator = function( options ){ this.displayRegionContainer.appendChild(this.displayRegion); this.element.getElementsByTagName('div')[0].appendChild(this.displayRegionContainer); - unneededElement = this.element.getElementsByTagName('textarea')[0]; - if (unneededElement) { - unneededElement.parentNode.removeChild(unneededElement); - } if (options.navigatorRotate) { options.viewer.addHandler("rotate", function (args) { @@ -227,6 +205,16 @@ $.Navigator = function( options ){ }); } + // Remove the base class' (Viewer's) innerTracker and replace it with our own + this.innerTracker.destroy(); + this.innerTracker = new $.MouseTracker({ + element: this.element, + dragHandler: $.delegate( this, onCanvasDrag ), + clickHandler: $.delegate( this, onCanvasClick ), + releaseHandler: $.delegate( this, onCanvasRelease ), + scrollHandler: $.delegate( this, onCanvasScroll ) + }); + this.addHandler("reset-size", function() { if (_this.viewport) { _this.viewport.goHome(true); diff --git a/src/openseadragon.js b/src/openseadragon.js index 1db57c67..b91d9b99 100644 --- a/src/openseadragon.js +++ b/src/openseadragon.js @@ -130,6 +130,10 @@ * Tile source(s) to open initially. This is a complex parameter; see * {@link OpenSeadragon.Viewer#open} for details. * + * @property {Number} [tabIndex=0] + * Tabbing order index to assign to the viewer element. Positive values are selected in increasing order. When tabIndex is 0 + * source order is used. A negative value omits the viewer from the tabbing order. + * * @property {Array} overlays Array of objects defining permanent overlays of * the viewer. The overlays added via this option and later removed with * {@link OpenSeadragon.Viewer#removeOverlay} will be added back when a new diff --git a/src/referencestrip.js b/src/referencestrip.js index 668e11eb..97833e58 100644 --- a/src/referencestrip.js +++ b/src/referencestrip.js @@ -127,7 +127,7 @@ $.ReferenceStrip = function ( options ) { exitHandler: $.delegate( this, onStripExit ), keyDownHandler: $.delegate( this, onKeyDown ), keyHandler: $.delegate( this, onKeyPress ) - } ).setTracking( true ); + } ); //Controls the position and orientation of the reference strip and sets the //appropriate width and height @@ -215,7 +215,7 @@ $.ReferenceStrip = function ( options ) { viewer.goToPage( page ); } } - } ).setTracking( true ); + } ); this.element.appendChild( element ); @@ -454,8 +454,10 @@ function loadPanels( strip, viewerSize, scroll ) { style.width = ( strip.panelWidth - 4 ) + 'px'; style.height = ( strip.panelHeight - 4 ) + 'px'; + // TODO: What is this for? Future keyboard navigation support? miniViewer.displayRegion.innerTracker = new $.MouseTracker( { - element: miniViewer.displayRegion + element: miniViewer.displayRegion, + startDisabled: true } ); element.getElementsByTagName( 'div' )[0].appendChild( diff --git a/src/viewer.js b/src/viewer.js index b2b0b5a0..06d81968 100644 --- a/src/viewer.js +++ b/src/viewer.js @@ -232,7 +232,7 @@ $.Viewer = function( options ) { style.left = "0px"; }(this.canvas.style)); $.setElementTouchActionNone( this.canvas ); - this.canvas.tabIndex = 0; + this.canvas.tabIndex = options.tabIndex || 0; //the container is created through applying the ControlDock constructor above this.container.className = "openseadragon-container"; @@ -259,11 +259,11 @@ $.Viewer = function( options ) { this.innerTracker = new $.MouseTracker({ element: this.canvas, + startDisabled: this.mouseNavEnabled ? false : true, clickTimeThreshold: this.clickTimeThreshold, clickDistThreshold: this.clickDistThreshold, dblClickTimeThreshold: this.dblClickTimeThreshold, dblClickDistThreshold: this.dblClickDistThreshold, - focusHandler: $.delegate( this, onCanvasFocus ), keyDownHandler: $.delegate( this, onCanvasKeyDown ), keyHandler: $.delegate( this, onCanvasKeyPress ), clickHandler: $.delegate( this, onCanvasClick ), @@ -278,17 +278,18 @@ $.Viewer = function( options ) { nonPrimaryReleaseHandler: $.delegate( this, onCanvasNonPrimaryRelease ), scrollHandler: $.delegate( this, onCanvasScroll ), pinchHandler: $.delegate( this, onCanvasPinch ) - }).setTracking( this.mouseNavEnabled ? true : false ); // default state + }); this.outerTracker = new $.MouseTracker({ element: this.container, + startDisabled: this.mouseNavEnabled ? false : true, clickTimeThreshold: this.clickTimeThreshold, clickDistThreshold: this.clickDistThreshold, dblClickTimeThreshold: this.dblClickTimeThreshold, dblClickDistThreshold: this.dblClickDistThreshold, enterHandler: $.delegate( this, onContainerEnter ), exitHandler: $.delegate( this, onContainerExit ) - }).setTracking( this.mouseNavEnabled ? true : false ); // always tracking + }); if( this.toolbar ){ this.toolbar = new $.ControlDock({ element: this.toolbar }); @@ -2185,13 +2186,6 @@ function onBlur(){ } -function onCanvasFocus( event ) { - if ( !event.preventDefaultAction ) { - var point = $.getElementPosition( this.element ); - window.scrollTo( 0, point.y ); - } -} - function onCanvasKeyDown( event ) { if ( !event.preventDefaultAction && !event.ctrl && !event.alt && !event.meta ) { switch( event.keyCode ){ diff --git a/test/modules/events.js b/test/modules/events.js index 5f850082..677e805f 100644 --- a/test/modules/events.js +++ b/test/modules/events.js @@ -790,7 +790,7 @@ releaseHandler: onMouseTrackerRelease, clickHandler: onMouseTrackerClick, exitHandler: onMouseTrackerExit - } ).setTracking( true ); + } ); var event = { clientX:1,