mirror of
https://github.com/openseadragon/openseadragon.git
synced 2024-11-22 13:16:10 +03:00
Mousetracker Improvements
1) MouseTracker - Simulated touchenter/touchleave events now bubble to parent element MouseTrackers 2) MouseTracker - Improved multitouch support in enter/exit event handlers 3) MouseTracker - orphaned tracked touch pointers removed (fix for #539) 4) MouseTracker - removed touchenter/touchleave event support since the events don't exist on any known platform and have been removed from the W3C specification 5) Removed Viewer onContainerPress/onContainerRelease handlers (and the associated 'container-release' event ) that were never fired due to the canvas (child) element capturing the DOM events 6) Added 'canvas-enter', 'canvas-exit', and 'canvas-press' events to Viewer 7) ButtonGroup - removed obsolete MouseTracker event handlers
This commit is contained in:
parent
105e1f761e
commit
cb56e352cf
@ -105,22 +105,6 @@ $.ButtonGroup = function( options ) {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
pressHandler: function ( event ) {
|
|
||||||
if ( event.pointerType === 'touch' && !$.MouseTracker.haveTouchEnter ) {
|
|
||||||
var i;
|
|
||||||
for ( i = 0; i < _this.buttons.length; i++ ) {
|
|
||||||
_this.buttons[ i ].notifyGroupEnter();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
releaseHandler: function ( event ) {
|
|
||||||
var i;
|
|
||||||
if ( !event.insideElementReleased || ( event.pointerType === 'touch' && !$.MouseTracker.haveTouchEnter ) ) {
|
|
||||||
for ( i = 0; i < _this.buttons.length; i++ ) {
|
|
||||||
_this.buttons[ i ].notifyGroupExit();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}).setTracking( true );
|
}).setTracking( true );
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -34,6 +34,9 @@
|
|||||||
|
|
||||||
(function ( $ ) {
|
(function ( $ ) {
|
||||||
|
|
||||||
|
// All MouseTracker instances
|
||||||
|
var MOUSETRACKERS = [];
|
||||||
|
|
||||||
// dictionary from hash to private properties
|
// dictionary from hash to private properties
|
||||||
var THIS = {};
|
var THIS = {};
|
||||||
|
|
||||||
@ -103,6 +106,8 @@
|
|||||||
*/
|
*/
|
||||||
$.MouseTracker = function ( options ) {
|
$.MouseTracker = function ( options ) {
|
||||||
|
|
||||||
|
MOUSETRACKERS.push( this );
|
||||||
|
|
||||||
var args = arguments;
|
var args = arguments;
|
||||||
|
|
||||||
if ( !$.isPlainObject( options ) ) {
|
if ( !$.isPlainObject( options ) ) {
|
||||||
@ -199,8 +204,6 @@
|
|||||||
mousemove: function ( event ) { onMouseMove( _this, event ); },
|
mousemove: function ( event ) { onMouseMove( _this, event ); },
|
||||||
mousemovecaptured: function ( event ) { onMouseMoveCaptured( _this, event ); },
|
mousemovecaptured: function ( event ) { onMouseMoveCaptured( _this, event ); },
|
||||||
|
|
||||||
touchenter: function ( event ) { onTouchEnter( _this, event ); },
|
|
||||||
touchleave: function ( event ) { onTouchLeave( _this, event ); },
|
|
||||||
touchstart: function ( event ) { onTouchStart( _this, event ); },
|
touchstart: function ( event ) { onTouchStart( _this, event ); },
|
||||||
touchend: function ( event ) { onTouchEnd( _this, event ); },
|
touchend: function ( event ) { onTouchEnd( _this, event ); },
|
||||||
touchendcaptured: function ( event ) { onTouchEndCaptured( _this, event ); },
|
touchendcaptured: function ( event ) { onTouchEndCaptured( _this, event ); },
|
||||||
@ -255,9 +258,18 @@
|
|||||||
* @function
|
* @function
|
||||||
*/
|
*/
|
||||||
destroy: function () {
|
destroy: function () {
|
||||||
|
var i;
|
||||||
|
|
||||||
stopTracking( this );
|
stopTracking( this );
|
||||||
this.element = null;
|
this.element = null;
|
||||||
|
|
||||||
|
for ( i = 0; i < MOUSETRACKERS.length; i++ ) {
|
||||||
|
if ( MOUSETRACKERS[ i ] === this ) {
|
||||||
|
MOUSETRACKERS.splice( i, 1 );
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
THIS[ this.hash ] = null;
|
THIS[ this.hash ] = null;
|
||||||
delete THIS[ this.hash ];
|
delete THIS[ this.hash ];
|
||||||
},
|
},
|
||||||
@ -312,6 +324,24 @@
|
|||||||
return list;
|
return list;
|
||||||
},
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Returns the total number of pointers currently active on the tracked element.
|
||||||
|
* @function
|
||||||
|
* @returns {Number}
|
||||||
|
*/
|
||||||
|
getActivePointerCount: function () {
|
||||||
|
var delegate = THIS[ this.hash ],
|
||||||
|
i,
|
||||||
|
len = delegate.activePointersLists.length,
|
||||||
|
count = 0;
|
||||||
|
|
||||||
|
for ( i = 0; i < len; i++ ) {
|
||||||
|
count += delegate.activePointersLists[ i ].getLength();
|
||||||
|
}
|
||||||
|
|
||||||
|
return count;
|
||||||
|
},
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Implement or assign implementation to these handlers during or after
|
* Implement or assign implementation to these handlers during or after
|
||||||
* calling the constructor.
|
* calling the constructor.
|
||||||
@ -326,6 +356,8 @@
|
|||||||
* @param {Number} event.buttons
|
* @param {Number} event.buttons
|
||||||
* Current buttons pressed.
|
* Current buttons pressed.
|
||||||
* Combination of bit flags 0: none, 1: primary (or touch contact), 2: secondary, 4: aux (often middle), 8: X1 (often back), 16: X2 (often forward), 32: pen eraser.
|
* Combination of bit flags 0: none, 1: primary (or touch contact), 2: secondary, 4: aux (often middle), 8: X1 (often back), 16: X2 (often forward), 32: pen eraser.
|
||||||
|
* @param {Number} event.pointers
|
||||||
|
* Number of pointers (all types) active in the tracked element.
|
||||||
* @param {Boolean} event.insideElementPressed
|
* @param {Boolean} event.insideElementPressed
|
||||||
* True if the left mouse button is currently being pressed and was
|
* True if the left mouse button is currently being pressed and was
|
||||||
* initiated inside the tracked element, otherwise false.
|
* initiated inside the tracked element, otherwise false.
|
||||||
@ -356,6 +388,8 @@
|
|||||||
* @param {Number} event.buttons
|
* @param {Number} event.buttons
|
||||||
* Current buttons pressed.
|
* Current buttons pressed.
|
||||||
* Combination of bit flags 0: none, 1: primary (or touch contact), 2: secondary, 4: aux (often middle), 8: X1 (often back), 16: X2 (often forward), 32: pen eraser.
|
* Combination of bit flags 0: none, 1: primary (or touch contact), 2: secondary, 4: aux (often middle), 8: X1 (often back), 16: X2 (often forward), 32: pen eraser.
|
||||||
|
* @param {Number} event.pointers
|
||||||
|
* Number of pointers (all types) active in the tracked element.
|
||||||
* @param {Boolean} event.insideElementPressed
|
* @param {Boolean} event.insideElementPressed
|
||||||
* True if the left mouse button is currently being pressed and was
|
* True if the left mouse button is currently being pressed and was
|
||||||
* initiated inside the tracked element, otherwise false.
|
* initiated inside the tracked element, otherwise false.
|
||||||
@ -887,7 +921,6 @@
|
|||||||
} else {
|
} else {
|
||||||
$.MouseTracker.maxTouchPoints = 0;
|
$.MouseTracker.maxTouchPoints = 0;
|
||||||
}
|
}
|
||||||
$.MouseTracker.haveTouchEnter = false;
|
|
||||||
$.MouseTracker.haveMouseEnter = false;
|
$.MouseTracker.haveMouseEnter = false;
|
||||||
} else if ( window.MSPointerEvent ) {
|
} else if ( window.MSPointerEvent ) {
|
||||||
// IE10
|
// IE10
|
||||||
@ -899,7 +932,6 @@
|
|||||||
} else {
|
} else {
|
||||||
$.MouseTracker.maxTouchPoints = 0;
|
$.MouseTracker.maxTouchPoints = 0;
|
||||||
}
|
}
|
||||||
$.MouseTracker.haveTouchEnter = false;
|
|
||||||
$.MouseTracker.haveMouseEnter = false;
|
$.MouseTracker.haveMouseEnter = false;
|
||||||
} else {
|
} else {
|
||||||
// Legacy W3C mouse events
|
// Legacy W3C mouse events
|
||||||
@ -913,19 +945,14 @@
|
|||||||
}
|
}
|
||||||
$.MouseTracker.subscribeEvents.push( "mousedown", "mouseup", "mousemove" );
|
$.MouseTracker.subscribeEvents.push( "mousedown", "mouseup", "mousemove" );
|
||||||
if ( 'ontouchstart' in window ) {
|
if ( 'ontouchstart' in window ) {
|
||||||
// iOS, Android, and other W3c Touch Event implementations (see http://www.w3.org/TR/2011/WD-touch-events-20110505)
|
// iOS, Android, and other W3c Touch Event implementations
|
||||||
|
// (see http://www.w3.org/TR/touch-events/)
|
||||||
|
// (see https://developer.apple.com/library/ios/documentation/AppleApplications/Reference/SafariWebContent/HandlingEvents/HandlingEvents.html)
|
||||||
|
// (see https://developer.apple.com/library/safari/documentation/AppleApplications/Reference/SafariWebContent/HandlingEvents/HandlingEvents.html)
|
||||||
$.MouseTracker.subscribeEvents.push( "touchstart", "touchend", "touchmove", "touchcancel" );
|
$.MouseTracker.subscribeEvents.push( "touchstart", "touchend", "touchmove", "touchcancel" );
|
||||||
if ( 'ontouchenter' in window ) {
|
|
||||||
$.MouseTracker.subscribeEvents.push( "touchenter", "touchleave" );
|
|
||||||
$.MouseTracker.haveTouchEnter = true;
|
|
||||||
} else {
|
|
||||||
$.MouseTracker.haveTouchEnter = false;
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
$.MouseTracker.haveTouchEnter = false;
|
|
||||||
}
|
}
|
||||||
if ( 'ongesturestart' in window ) {
|
if ( 'ongesturestart' in window ) {
|
||||||
// iOS (see https://developer.apple.com/library/safari/documentation/UserExperience/Reference/GestureEventClassReference/GestureEvent/GestureEvent.html)
|
// iOS (see https://developer.apple.com/library/ios/documentation/AppleApplications/Reference/SafariWebContent/HandlingEvents/HandlingEvents.html)
|
||||||
// Subscribe to these to prevent default gesture handling
|
// Subscribe to these to prevent default gesture handling
|
||||||
$.MouseTracker.subscribeEvents.push( "gesturestart", "gesturechange" );
|
$.MouseTracker.subscribeEvents.push( "gesturestart", "gesturechange" );
|
||||||
}
|
}
|
||||||
@ -1822,45 +1849,21 @@
|
|||||||
* @private
|
* @private
|
||||||
* @inner
|
* @inner
|
||||||
*/
|
*/
|
||||||
function onTouchEnter( tracker, event ) {
|
function abortTouchContacts( tracker, event, pointsList ) {
|
||||||
var i,
|
var i,
|
||||||
touchCount = event.changedTouches.length,
|
gPointCount = pointsList.getLength(),
|
||||||
gPoints = [];
|
abortGPoints = [];
|
||||||
|
|
||||||
for ( i = 0; i < touchCount; i++ ) {
|
for ( i = 0; i < gPointCount; i++ ) {
|
||||||
gPoints.push( {
|
abortGPoints.push( pointsList.getByIndex( i ) );
|
||||||
id: event.changedTouches[ i ].identifier,
|
|
||||||
type: 'touch',
|
|
||||||
// isPrimary not set - let the updatePointers functions determine it
|
|
||||||
currentPos: getMouseAbsolute( event.changedTouches[ i ] ),
|
|
||||||
currentTime: $.now()
|
|
||||||
} );
|
|
||||||
}
|
}
|
||||||
|
|
||||||
updatePointersEnter( tracker, event, gPoints );
|
if ( abortGPoints.length > 0 ) {
|
||||||
|
// simulate touchend
|
||||||
|
updatePointersUp( tracker, event, abortGPoints, 0 ); // 0 means primary button press/release or touch contact
|
||||||
|
// simulate touchleave
|
||||||
|
updatePointersExit( tracker, event, abortGPoints );
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
/**
|
|
||||||
* @private
|
|
||||||
* @inner
|
|
||||||
*/
|
|
||||||
function onTouchLeave( tracker, event ) {
|
|
||||||
var i,
|
|
||||||
touchCount = event.changedTouches.length,
|
|
||||||
gPoints = [];
|
|
||||||
|
|
||||||
for ( i = 0; i < touchCount; i++ ) {
|
|
||||||
gPoints.push( {
|
|
||||||
id: event.changedTouches[ i ].identifier,
|
|
||||||
type: 'touch',
|
|
||||||
// isPrimary not set - let the updatePointers functions determine it
|
|
||||||
currentPos: getMouseAbsolute( event.changedTouches[ i ] ),
|
|
||||||
currentTime: $.now()
|
|
||||||
} );
|
|
||||||
}
|
|
||||||
|
|
||||||
updatePointersExit( tracker, event, gPoints );
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
@ -1871,11 +1874,19 @@
|
|||||||
function onTouchStart( tracker, event ) {
|
function onTouchStart( tracker, event ) {
|
||||||
var time,
|
var time,
|
||||||
i,
|
i,
|
||||||
|
j,
|
||||||
touchCount = event.changedTouches.length,
|
touchCount = event.changedTouches.length,
|
||||||
gPoints = [];
|
gPoints = [],
|
||||||
|
parentGPoints,
|
||||||
|
pointsList = tracker.getActivePointersListByType( 'touch' );
|
||||||
|
|
||||||
time = $.now();
|
time = $.now();
|
||||||
|
|
||||||
|
if ( pointsList.getLength() > event.touches.length - touchCount ) {
|
||||||
|
$.console.warn('Tracked touch contact count doesn\'t match event.touches.length. Removing all tracked touch pointers.');
|
||||||
|
abortTouchContacts( tracker, event, pointsList );
|
||||||
|
}
|
||||||
|
|
||||||
for ( i = 0; i < touchCount; i++ ) {
|
for ( i = 0; i < touchCount; i++ ) {
|
||||||
gPoints.push( {
|
gPoints.push( {
|
||||||
id: event.changedTouches[ i ].identifier,
|
id: event.changedTouches[ i ].identifier,
|
||||||
@ -1886,9 +1897,24 @@
|
|||||||
} );
|
} );
|
||||||
}
|
}
|
||||||
|
|
||||||
// simulate touchenter if not natively available
|
// simulate touchenter on our tracked element
|
||||||
if ( !$.MouseTracker.haveTouchEnter ) {
|
|
||||||
updatePointersEnter( tracker, event, gPoints );
|
updatePointersEnter( tracker, event, gPoints );
|
||||||
|
|
||||||
|
// simulate touchenter on our tracked element's tracked ancestor elements
|
||||||
|
for ( i = 0; i < MOUSETRACKERS.length; i++ ) {
|
||||||
|
if ( MOUSETRACKERS[ i ] !== tracker && MOUSETRACKERS[ i ].isTracking() && isParentChild( MOUSETRACKERS[ i ].element, tracker.element ) ) {
|
||||||
|
parentGPoints = [];
|
||||||
|
for ( j = 0; j < touchCount; j++ ) {
|
||||||
|
parentGPoints.push( {
|
||||||
|
id: event.changedTouches[ j ].identifier,
|
||||||
|
type: 'touch',
|
||||||
|
// isPrimary not set - let the updatePointers functions determine it
|
||||||
|
currentPos: getMouseAbsolute( event.changedTouches[ j ] ),
|
||||||
|
currentTime: time
|
||||||
|
} );
|
||||||
|
}
|
||||||
|
updatePointersEnter( MOUSETRACKERS[ i ], event, parentGPoints );
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
if ( updatePointersDown( tracker, event, gPoints, 0 ) ) { // 0 means primary button press/release or touch contact
|
if ( updatePointersDown( tracker, event, gPoints, 0 ) ) { // 0 means primary button press/release or touch contact
|
||||||
@ -1929,8 +1955,10 @@
|
|||||||
function handleTouchEnd( tracker, event ) {
|
function handleTouchEnd( tracker, event ) {
|
||||||
var time,
|
var time,
|
||||||
i,
|
i,
|
||||||
|
j,
|
||||||
touchCount = event.changedTouches.length,
|
touchCount = event.changedTouches.length,
|
||||||
gPoints = [];
|
gPoints = [],
|
||||||
|
parentGPoints;
|
||||||
|
|
||||||
time = $.now();
|
time = $.now();
|
||||||
|
|
||||||
@ -1948,9 +1976,24 @@
|
|||||||
releasePointer( tracker, 'touch' );
|
releasePointer( tracker, 'touch' );
|
||||||
}
|
}
|
||||||
|
|
||||||
// simulate touchleave if not natively available
|
// simulate touchleave on our tracked element
|
||||||
if ( !$.MouseTracker.haveTouchEnter && touchCount > 0 ) {
|
|
||||||
updatePointersExit( tracker, event, gPoints );
|
updatePointersExit( tracker, event, gPoints );
|
||||||
|
|
||||||
|
// simulate touchleave on our tracked element's tracked ancestor elements
|
||||||
|
for ( i = 0; i < MOUSETRACKERS.length; i++ ) {
|
||||||
|
if ( MOUSETRACKERS[ i ] !== tracker && MOUSETRACKERS[ i ].isTracking() && isParentChild( MOUSETRACKERS[ i ].element, tracker.element ) ) {
|
||||||
|
parentGPoints = [];
|
||||||
|
for ( j = 0; j < touchCount; j++ ) {
|
||||||
|
parentGPoints.push( {
|
||||||
|
id: event.changedTouches[ j ].identifier,
|
||||||
|
type: 'touch',
|
||||||
|
// isPrimary not set - let the updatePointers functions determine it
|
||||||
|
currentPos: getMouseAbsolute( event.changedTouches[ j ] ),
|
||||||
|
currentTime: time
|
||||||
|
} );
|
||||||
|
}
|
||||||
|
updatePointersExit( MOUSETRACKERS[ i ], event, parentGPoints );
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
$.cancelEvent( event );
|
$.cancelEvent( event );
|
||||||
@ -2344,6 +2387,7 @@
|
|||||||
pointerType: curGPoint.type,
|
pointerType: curGPoint.type,
|
||||||
position: getPointRelativeToAbsolute( curGPoint.currentPos, tracker.element ),
|
position: getPointRelativeToAbsolute( curGPoint.currentPos, tracker.element ),
|
||||||
buttons: pointsList.buttons,
|
buttons: pointsList.buttons,
|
||||||
|
pointers: tracker.getActivePointerCount(),
|
||||||
insideElementPressed: curGPoint.insideElementPressed,
|
insideElementPressed: curGPoint.insideElementPressed,
|
||||||
buttonDownAny: pointsList.buttons !== 0,
|
buttonDownAny: pointsList.buttons !== 0,
|
||||||
isTouchEvent: curGPoint.type === 'touch',
|
isTouchEvent: curGPoint.type === 'touch',
|
||||||
@ -2407,6 +2451,7 @@
|
|||||||
pointerType: curGPoint.type,
|
pointerType: curGPoint.type,
|
||||||
position: getPointRelativeToAbsolute( curGPoint.currentPos, tracker.element ),
|
position: getPointRelativeToAbsolute( curGPoint.currentPos, tracker.element ),
|
||||||
buttons: pointsList.buttons,
|
buttons: pointsList.buttons,
|
||||||
|
pointers: tracker.getActivePointerCount(),
|
||||||
insideElementPressed: updateGPoint ? updateGPoint.insideElementPressed : false,
|
insideElementPressed: updateGPoint ? updateGPoint.insideElementPressed : false,
|
||||||
buttonDownAny: pointsList.buttons !== 0,
|
buttonDownAny: pointsList.buttons !== 0,
|
||||||
isTouchEvent: curGPoint.type === 'touch',
|
isTouchEvent: curGPoint.type === 'touch',
|
||||||
|
190
src/viewer.js
190
src/viewer.js
@ -389,6 +389,9 @@ $.Viewer = function( options ) {
|
|||||||
dblClickHandler: $.delegate( this, onCanvasDblClick ),
|
dblClickHandler: $.delegate( this, onCanvasDblClick ),
|
||||||
dragHandler: $.delegate( this, onCanvasDrag ),
|
dragHandler: $.delegate( this, onCanvasDrag ),
|
||||||
dragEndHandler: $.delegate( this, onCanvasDragEnd ),
|
dragEndHandler: $.delegate( this, onCanvasDragEnd ),
|
||||||
|
enterHandler: $.delegate( this, onCanvasEnter ),
|
||||||
|
exitHandler: $.delegate( this, onCanvasExit ),
|
||||||
|
pressHandler: $.delegate( this, onCanvasPress ),
|
||||||
releaseHandler: $.delegate( this, onCanvasRelease ),
|
releaseHandler: $.delegate( this, onCanvasRelease ),
|
||||||
nonPrimaryPressHandler: $.delegate( this, onCanvasNonPrimaryPress ),
|
nonPrimaryPressHandler: $.delegate( this, onCanvasNonPrimaryPress ),
|
||||||
nonPrimaryReleaseHandler: $.delegate( this, onCanvasNonPrimaryRelease ),
|
nonPrimaryReleaseHandler: $.delegate( this, onCanvasNonPrimaryRelease ),
|
||||||
@ -403,9 +406,7 @@ $.Viewer = function( options ) {
|
|||||||
dblClickTimeThreshold: this.dblClickTimeThreshold,
|
dblClickTimeThreshold: this.dblClickTimeThreshold,
|
||||||
dblClickDistThreshold: this.dblClickDistThreshold,
|
dblClickDistThreshold: this.dblClickDistThreshold,
|
||||||
enterHandler: $.delegate( this, onContainerEnter ),
|
enterHandler: $.delegate( this, onContainerEnter ),
|
||||||
exitHandler: $.delegate( this, onContainerExit ),
|
exitHandler: $.delegate( this, onContainerExit )
|
||||||
pressHandler: $.delegate( this, onContainerPress ),
|
|
||||||
releaseHandler: $.delegate( this, onContainerRelease )
|
|
||||||
}).setTracking( this.mouseNavEnabled ? true : false ); // always tracking
|
}).setTracking( this.mouseNavEnabled ? true : false ); // always tracking
|
||||||
|
|
||||||
if( this.toolbar ){
|
if( this.toolbar ){
|
||||||
@ -2430,6 +2431,92 @@ function onCanvasDragEnd( event ) {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function onCanvasEnter( event ) {
|
||||||
|
/**
|
||||||
|
* Raised when a pointer enters the {@link OpenSeadragon.Viewer#canvas} element.
|
||||||
|
*
|
||||||
|
* @event canvas-enter
|
||||||
|
* @memberof OpenSeadragon.Viewer
|
||||||
|
* @type {object}
|
||||||
|
* @property {OpenSeadragon.Viewer} eventSource - A reference to the Viewer which raised this event.
|
||||||
|
* @property {OpenSeadragon.MouseTracker} tracker - A reference to the MouseTracker which originated this event.
|
||||||
|
* @property {String} pointerType - "mouse", "touch", "pen", etc.
|
||||||
|
* @property {OpenSeadragon.Point} position - The position of the event relative to the tracked element.
|
||||||
|
* @property {Number} buttons - Current buttons pressed. A combination of bit flags 0: none, 1: primary (or touch contact), 2: secondary, 4: aux (often middle), 8: X1 (often back), 16: X2 (often forward), 32: pen eraser.
|
||||||
|
* @property {Number} pointers - Number of pointers (all types) active in the tracked element.
|
||||||
|
* @property {Boolean} insideElementPressed - True if the left mouse button is currently being pressed and was initiated inside the tracked element, otherwise false.
|
||||||
|
* @property {Boolean} buttonDownAny - Was the button down anywhere in the screen during the event. <span style="color:red;">Deprecated. Use buttons instead.</span>
|
||||||
|
* @property {Object} originalEvent - The original DOM event.
|
||||||
|
* @property {?Object} userData - Arbitrary subscriber-defined object.
|
||||||
|
*/
|
||||||
|
this.raiseEvent( 'canvas-enter', {
|
||||||
|
tracker: event.eventSource,
|
||||||
|
pointerType: event.pointerType,
|
||||||
|
position: event.position,
|
||||||
|
buttons: event.buttons,
|
||||||
|
pointers: event.pointers,
|
||||||
|
insideElementPressed: event.insideElementPressed,
|
||||||
|
buttonDownAny: event.buttonDownAny,
|
||||||
|
originalEvent: event.originalEvent
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
function onCanvasExit( event ) {
|
||||||
|
/**
|
||||||
|
* Raised when a pointer leaves the {@link OpenSeadragon.Viewer#canvas} element.
|
||||||
|
*
|
||||||
|
* @event canvas-exit
|
||||||
|
* @memberof OpenSeadragon.Viewer
|
||||||
|
* @type {object}
|
||||||
|
* @property {OpenSeadragon.Viewer} eventSource - A reference to the Viewer which raised this event.
|
||||||
|
* @property {OpenSeadragon.MouseTracker} tracker - A reference to the MouseTracker which originated this event.
|
||||||
|
* @property {String} pointerType - "mouse", "touch", "pen", etc.
|
||||||
|
* @property {OpenSeadragon.Point} position - The position of the event relative to the tracked element.
|
||||||
|
* @property {Number} buttons - Current buttons pressed. A combination of bit flags 0: none, 1: primary (or touch contact), 2: secondary, 4: aux (often middle), 8: X1 (often back), 16: X2 (often forward), 32: pen eraser.
|
||||||
|
* @property {Number} pointers - Number of pointers (all types) active in the tracked element.
|
||||||
|
* @property {Boolean} insideElementPressed - True if the left mouse button is currently being pressed and was initiated inside the tracked element, otherwise false.
|
||||||
|
* @property {Boolean} buttonDownAny - Was the button down anywhere in the screen during the event. <span style="color:red;">Deprecated. Use buttons instead.</span>
|
||||||
|
* @property {Object} originalEvent - The original DOM event.
|
||||||
|
* @property {?Object} userData - Arbitrary subscriber-defined object.
|
||||||
|
*/
|
||||||
|
this.raiseEvent( 'canvas-exit', {
|
||||||
|
tracker: event.eventSource,
|
||||||
|
pointerType: event.pointerType,
|
||||||
|
position: event.position,
|
||||||
|
buttons: event.buttons,
|
||||||
|
pointers: event.pointers,
|
||||||
|
insideElementPressed: event.insideElementPressed,
|
||||||
|
buttonDownAny: event.buttonDownAny,
|
||||||
|
originalEvent: event.originalEvent
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
function onCanvasPress( event ) {
|
||||||
|
/**
|
||||||
|
* Raised when the primary mouse button is pressed or touch starts on the {@link OpenSeadragon.Viewer#canvas} element.
|
||||||
|
*
|
||||||
|
* @event canvas-press
|
||||||
|
* @memberof OpenSeadragon.Viewer
|
||||||
|
* @type {object}
|
||||||
|
* @property {OpenSeadragon.Viewer} eventSource - A reference to the Viewer which raised this event.
|
||||||
|
* @property {OpenSeadragon.MouseTracker} tracker - A reference to the MouseTracker which originated this event.
|
||||||
|
* @property {String} pointerType - "mouse", "touch", "pen", etc.
|
||||||
|
* @property {OpenSeadragon.Point} position - The position of the event relative to the tracked element.
|
||||||
|
* @property {Boolean} insideElementPressed - True if the left mouse button is currently being pressed and was initiated inside the tracked element, otherwise false.
|
||||||
|
* @property {Boolean} insideElementReleased - True if the cursor still inside the tracked element when the button was released.
|
||||||
|
* @property {Object} originalEvent - The original DOM event.
|
||||||
|
* @property {?Object} userData - Arbitrary subscriber-defined object.
|
||||||
|
*/
|
||||||
|
this.raiseEvent( 'canvas-press', {
|
||||||
|
tracker: event.eventSource,
|
||||||
|
pointerType: event.pointerType,
|
||||||
|
position: event.position,
|
||||||
|
insideElementPressed: event.insideElementPressed,
|
||||||
|
insideElementReleased: event.insideElementReleased,
|
||||||
|
originalEvent: event.originalEvent
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
function onCanvasRelease( event ) {
|
function onCanvasRelease( event ) {
|
||||||
/**
|
/**
|
||||||
* Raised when the primary mouse button is released or touch ends on the {@link OpenSeadragon.Viewer#canvas} element.
|
* Raised when the primary mouse button is released or touch ends on the {@link OpenSeadragon.Viewer#canvas} element.
|
||||||
@ -2439,6 +2526,7 @@ function onCanvasRelease( event ) {
|
|||||||
* @type {object}
|
* @type {object}
|
||||||
* @property {OpenSeadragon.Viewer} eventSource - A reference to the Viewer which raised this event.
|
* @property {OpenSeadragon.Viewer} eventSource - A reference to the Viewer which raised this event.
|
||||||
* @property {OpenSeadragon.MouseTracker} tracker - A reference to the MouseTracker which originated this event.
|
* @property {OpenSeadragon.MouseTracker} tracker - A reference to the MouseTracker which originated this event.
|
||||||
|
* @property {String} pointerType - "mouse", "touch", "pen", etc.
|
||||||
* @property {OpenSeadragon.Point} position - The position of the event relative to the tracked element.
|
* @property {OpenSeadragon.Point} position - The position of the event relative to the tracked element.
|
||||||
* @property {Boolean} insideElementPressed - True if the left mouse button is currently being pressed and was initiated inside the tracked element, otherwise false.
|
* @property {Boolean} insideElementPressed - True if the left mouse button is currently being pressed and was initiated inside the tracked element, otherwise false.
|
||||||
* @property {Boolean} insideElementReleased - True if the cursor still inside the tracked element when the button was released.
|
* @property {Boolean} insideElementReleased - True if the cursor still inside the tracked element when the button was released.
|
||||||
@ -2447,6 +2535,7 @@ function onCanvasRelease( event ) {
|
|||||||
*/
|
*/
|
||||||
this.raiseEvent( 'canvas-release', {
|
this.raiseEvent( 'canvas-release', {
|
||||||
tracker: event.eventSource,
|
tracker: event.eventSource,
|
||||||
|
pointerType: event.pointerType,
|
||||||
position: event.position,
|
position: event.position,
|
||||||
insideElementPressed: event.insideElementPressed,
|
insideElementPressed: event.insideElementPressed,
|
||||||
insideElementReleased: event.insideElementReleased,
|
insideElementReleased: event.insideElementReleased,
|
||||||
@ -2612,8 +2701,36 @@ function onCanvasScroll( event ) {
|
|||||||
return false;
|
return false;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function onContainerEnter( event ) {
|
||||||
|
THIS[ this.hash ].mouseInside = true;
|
||||||
|
abortControlsAutoHide( this );
|
||||||
|
/**
|
||||||
|
* Raised when the cursor enters the {@link OpenSeadragon.Viewer#container} element.
|
||||||
|
*
|
||||||
|
* @event container-enter
|
||||||
|
* @memberof OpenSeadragon.Viewer
|
||||||
|
* @type {object}
|
||||||
|
* @property {OpenSeadragon.Viewer} eventSource - A reference to the Viewer which raised this event.
|
||||||
|
* @property {OpenSeadragon.MouseTracker} tracker - A reference to the MouseTracker which originated this event.
|
||||||
|
* @property {OpenSeadragon.Point} position - The position of the event relative to the tracked element.
|
||||||
|
* @property {Number} buttons - Current buttons pressed. A combination of bit flags 0: none, 1: primary (or touch contact), 2: secondary, 4: aux (often middle), 8: X1 (often back), 16: X2 (often forward), 32: pen eraser.
|
||||||
|
* @property {Boolean} insideElementPressed - True if the left mouse button is currently being pressed and was initiated inside the tracked element, otherwise false.
|
||||||
|
* @property {Boolean} buttonDownAny - Was the button down anywhere in the screen during the event. <span style="color:red;">Deprecated. Use buttons instead.</span>
|
||||||
|
* @property {Object} originalEvent - The original DOM event.
|
||||||
|
* @property {?Object} userData - Arbitrary subscriber-defined object.
|
||||||
|
*/
|
||||||
|
this.raiseEvent( 'container-enter', {
|
||||||
|
tracker: event.eventSource,
|
||||||
|
position: event.position,
|
||||||
|
buttons: event.buttons,
|
||||||
|
insideElementPressed: event.insideElementPressed,
|
||||||
|
buttonDownAny: event.buttonDownAny,
|
||||||
|
originalEvent: event.originalEvent
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
function onContainerExit( event ) {
|
function onContainerExit( event ) {
|
||||||
if ( !event.insideElementPressed ) {
|
if ( event.pointers < 1 ) {
|
||||||
THIS[ this.hash ].mouseInside = false;
|
THIS[ this.hash ].mouseInside = false;
|
||||||
if ( !THIS[ this.hash ].animating ) {
|
if ( !THIS[ this.hash ].animating ) {
|
||||||
beginControlsAutoHide( this );
|
beginControlsAutoHide( this );
|
||||||
@ -2644,71 +2761,6 @@ function onContainerExit( event ) {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
function onContainerPress( event ) {
|
|
||||||
if ( event.pointerType === 'touch' && !$.MouseTracker.haveTouchEnter ) {
|
|
||||||
THIS[ this.hash ].mouseInside = true;
|
|
||||||
abortControlsAutoHide( this );
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function onContainerRelease( event ) {
|
|
||||||
if ( !event.insideElementReleased || ( event.pointerType === 'touch' && !$.MouseTracker.haveTouchEnter ) ) {
|
|
||||||
THIS[ this.hash ].mouseInside = false;
|
|
||||||
if ( !THIS[ this.hash ].animating ) {
|
|
||||||
beginControlsAutoHide( this );
|
|
||||||
}
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
* Raised when the primary mouse button is released or touch ends on the {@link OpenSeadragon.Viewer#container} element.
|
|
||||||
*
|
|
||||||
* @event container-release
|
|
||||||
* @memberof OpenSeadragon.Viewer
|
|
||||||
* @type {object}
|
|
||||||
* @property {OpenSeadragon.Viewer} eventSource - A reference to the Viewer which raised this event.
|
|
||||||
* @property {OpenSeadragon.MouseTracker} tracker - A reference to the MouseTracker which originated this event.
|
|
||||||
* @property {OpenSeadragon.Point} position - The position of the event relative to the tracked element.
|
|
||||||
* @property {Boolean} insideElementPressed - True if the left mouse button is currently being pressed and was initiated inside the tracked element, otherwise false.
|
|
||||||
* @property {Boolean} insideElementReleased - True if the cursor still inside the tracked element when the button was released.
|
|
||||||
* @property {Object} originalEvent - The original DOM event.
|
|
||||||
* @property {?Object} userData - Arbitrary subscriber-defined object.
|
|
||||||
*/
|
|
||||||
this.raiseEvent( 'container-release', {
|
|
||||||
tracker: event.eventSource,
|
|
||||||
position: event.position,
|
|
||||||
insideElementPressed: event.insideElementPressed,
|
|
||||||
insideElementReleased: event.insideElementReleased,
|
|
||||||
originalEvent: event.originalEvent
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
function onContainerEnter( event ) {
|
|
||||||
THIS[ this.hash ].mouseInside = true;
|
|
||||||
abortControlsAutoHide( this );
|
|
||||||
/**
|
|
||||||
* Raised when the cursor enters the {@link OpenSeadragon.Viewer#container} element.
|
|
||||||
*
|
|
||||||
* @event container-enter
|
|
||||||
* @memberof OpenSeadragon.Viewer
|
|
||||||
* @type {object}
|
|
||||||
* @property {OpenSeadragon.Viewer} eventSource - A reference to the Viewer which raised this event.
|
|
||||||
* @property {OpenSeadragon.MouseTracker} tracker - A reference to the MouseTracker which originated this event.
|
|
||||||
* @property {OpenSeadragon.Point} position - The position of the event relative to the tracked element.
|
|
||||||
* @property {Number} buttons - Current buttons pressed. A combination of bit flags 0: none, 1: primary (or touch contact), 2: secondary, 4: aux (often middle), 8: X1 (often back), 16: X2 (often forward), 32: pen eraser.
|
|
||||||
* @property {Boolean} insideElementPressed - True if the left mouse button is currently being pressed and was initiated inside the tracked element, otherwise false.
|
|
||||||
* @property {Boolean} buttonDownAny - Was the button down anywhere in the screen during the event. <span style="color:red;">Deprecated. Use buttons instead.</span>
|
|
||||||
* @property {Object} originalEvent - The original DOM event.
|
|
||||||
* @property {?Object} userData - Arbitrary subscriber-defined object.
|
|
||||||
*/
|
|
||||||
this.raiseEvent( 'container-enter', {
|
|
||||||
tracker: event.eventSource,
|
|
||||||
position: event.position,
|
|
||||||
buttons: event.buttons,
|
|
||||||
insideElementPressed: event.insideElementPressed,
|
|
||||||
buttonDownAny: event.buttonDownAny,
|
|
||||||
originalEvent: event.originalEvent
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
///////////////////////////////////////////////////////////////////////////////
|
///////////////////////////////////////////////////////////////////////////////
|
||||||
// Page update routines ( aka Views - for future reference )
|
// Page update routines ( aka Views - for future reference )
|
||||||
|
@ -21,19 +21,14 @@
|
|||||||
}
|
}
|
||||||
$.MouseTracker.subscribeEvents.push( "mousedown", "mouseup", "mousemove" );
|
$.MouseTracker.subscribeEvents.push( "mousedown", "mouseup", "mousemove" );
|
||||||
if ( 'ontouchstart' in window ) {
|
if ( 'ontouchstart' in window ) {
|
||||||
// iOS, Android, and other W3c Touch Event implementations (see http://www.w3.org/TR/2011/WD-touch-events-20110505)
|
// iOS, Android, and other W3c Touch Event implementations
|
||||||
|
// (see http://www.w3.org/TR/touch-events/)
|
||||||
|
// (see https://developer.apple.com/library/ios/documentation/AppleApplications/Reference/SafariWebContent/HandlingEvents/HandlingEvents.html)
|
||||||
|
// (see https://developer.apple.com/library/safari/documentation/AppleApplications/Reference/SafariWebContent/HandlingEvents/HandlingEvents.html)
|
||||||
$.MouseTracker.subscribeEvents.push( "touchstart", "touchend", "touchmove", "touchcancel" );
|
$.MouseTracker.subscribeEvents.push( "touchstart", "touchend", "touchmove", "touchcancel" );
|
||||||
if ( 'ontouchenter' in window ) {
|
|
||||||
$.MouseTracker.subscribeEvents.push( "touchenter", "touchleave" );
|
|
||||||
$.MouseTracker.haveTouchEnter = true;
|
|
||||||
} else {
|
|
||||||
$.MouseTracker.haveTouchEnter = false;
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
$.MouseTracker.haveTouchEnter = false;
|
|
||||||
}
|
}
|
||||||
if ( 'ongesturestart' in window ) {
|
if ( 'ongesturestart' in window ) {
|
||||||
// iOS (see https://developer.apple.com/library/safari/documentation/UserExperience/Reference/GestureEventClassReference/GestureEvent/GestureEvent.html)
|
// iOS (see https://developer.apple.com/library/ios/documentation/AppleApplications/Reference/SafariWebContent/HandlingEvents/HandlingEvents.html)
|
||||||
// Subscribe to these to prevent default gesture handling
|
// Subscribe to these to prevent default gesture handling
|
||||||
$.MouseTracker.subscribeEvents.push( "gesturestart", "gesturechange" );
|
$.MouseTracker.subscribeEvents.push( "gesturestart", "gesturechange" );
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user