mirror/openseadragon
1
0
Fork 0
mirror of https://github.com/openseadragon/openseadragon.git synced 2025-01-19 17:21:50 +03:00
Code Issues Projects Releases Wiki Activity

Add test for fixed overlay + update doc

Browse Source
This commit is contained in:
Antoine Vandecreme 2014-02-05 14:57:47 -05:00
parent db98e4c34e
commit aaad805727
2 changed files with 93 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
src/overlay.js
View File

@ -35,7 +35,8 @@
(function( $ ){
/**
* An enumeration of positions that an overlay may be assigned relative to the viewport.
* An enumeration of positions that an overlay may be assigned relative to
* the viewport.
* @member OverlayPlacement
* @memberof OpenSeadragon
* @static
@ -69,8 +70,14 @@
* @memberof OpenSeadragon
* @param {Object} options
* @param {Element} options.element
* @param {OpenSeadragon.Point|OpenSeadragon.Rect} options.location
* @param {OpenSeadragon.OverlayPlacement} options.placement - Only used if location is an {@link OpenSeadragon.Point}.
* @param {OpenSeadragon.Point|OpenSeadragon.Rect} options.location - The
* location of the overlay on the image. If a {@link OpenSeadragon.Point}
* is specified, the overlay will keep a constant size independently of the
* zoom. It a {@link OpenSeadragon.Rect} is specified, the overlay size will
* be adjusted when the zoom changes.
* @param {OpenSeadragon.OverlayPlacement} [options.placement=OpenSeadragon.OverlayPlacement.TOP_LEFT]
* Relative position to the viewport.
* Only used if location is a {@link OpenSeadragon.Point}.
* @param {OpenSeadragon.Overlay.OnDrawCallback} options.onDraw
*/
$.Overlay = function( element, location, placement ) {
@ -86,9 +93,9 @@
*/
var options;
if( $.isPlainObject( element ) ){
if ( $.isPlainObject( element ) ) {
options = element;
} else{
} else {
options = {
element: element,
location: location,

84
test/overlays.js
View File

@ -1,12 +1,14 @@
/* global QUnit, module, Util, $, console, test, asyncTest, start, ok, equal */
( function() {
var debug = false,
viewer;
var viewer;
module( "Overlays", {
setup: function() {
var example = $( '<div id="example-overlays"></div>' ).appendTo( "#qunit-fixture" );
var fixedOverlay = $( '<div id="fixed-overlay"></div>' ).appendTo(example);
fixedOverlay.width(70);
fixedOverlay.height(60);
testLog.reset();
},
@ -227,7 +229,11 @@
width: 124,
height: 132,
id: "overlay"
} ]
}, {
px: 400,
py: 500,
id: "fixed-overlay"
}]
} );
function checkOverlayPosition( contextMessage ) {
@ -244,6 +250,16 @@
var expectedHeight = Math.ceil( 132 * zoom );
equal( $( "#overlay" ).width(), expectedWidth, "Width mismatch " + contextMessage );
equal( $( "#overlay" ).height( ), expectedHeight, "Height mismatch " + contextMessage );
expPosition = viewport.imageToViewerElementCoordinates(
new OpenSeadragon.Point( 400, 500 ) ).apply( Math.floor );
actPosition = $( "#fixed-overlay" ).position();
equal( actPosition.left, expPosition.x, "Fixed overlay X position mismatch " + contextMessage );
equal( actPosition.top, expPosition.y, "Fixed overlay Y position mismatch " + contextMessage );
equal( $( "#fixed-overlay" ).width(), 70, "Fixed overlay width mismatch " + contextMessage );
equal( $( "#fixed-overlay" ).height( ), 60, "Fixed overlay height mismatch " + contextMessage );
}
waitForViewer( function() {
@ -263,4 +279,66 @@
} );
} );
asyncTest( 'Overlays size in points', function() {
viewer = OpenSeadragon( {
id: 'example-overlays',
prefixUrl: '/build/openseadragon/images/',
tileSources: [ '/test/data/testpattern.dzi', '/test/data/testpattern.dzi' ],
springStiffness: 100, // Faster animation = faster tests
overlays: [ {
x: 0.2,
y: 0.1,
width: 0.5,
height: 0.1,
id: "overlay"
},{
x: 0.5,
y: 0.6,
id: "fixed-overlay"
} ]
} );
function checkOverlayPosition( contextMessage ) {
var viewport = viewer.viewport;
var expPosition = viewport.viewportToViewerElementCoordinates(
new OpenSeadragon.Point( 0.2, 0.1 ) ).apply( Math.floor );
var actPosition = $( "#overlay" ).position();
equal( actPosition.left, expPosition.x, "X position mismatch " + contextMessage );
equal( actPosition.top, expPosition.y, "Y position mismatch " + contextMessage );
var expectedSize = viewport.deltaPixelsFromPoints(
new OpenSeadragon.Point(0.5, 0.1));
equal( $( "#overlay" ).width(), expectedSize.x, "Width mismatch " + contextMessage );
equal( $( "#overlay" ).height( ), expectedSize.y, "Height mismatch " + contextMessage );
expPosition = viewport.viewportToViewerElementCoordinates(
new OpenSeadragon.Point( 0.5, 0.6 ) ).apply( Math.floor );
actPosition = $( "#fixed-overlay" ).position();
equal( actPosition.left, expPosition.x, "Fixed overlay X position mismatch " + contextMessage );
equal( actPosition.top, expPosition.y, "Fixed overlay Y position mismatch " + contextMessage );
equal( $( "#fixed-overlay" ).width(), 70, "Fixed overlay width mismatch " + contextMessage );
equal( $( "#fixed-overlay" ).height( ), 60, "Fixed overlay height mismatch " + contextMessage );
}
waitForViewer( function() {
checkOverlayPosition( "after opening using viewport coordinates" );
viewer.viewport.zoomBy( 1.1 ).panBy( new OpenSeadragon.Point( 0.1, 0.2 ) );
waitForViewer( function() {
checkOverlayPosition( "after zoom and pan using viewport coordinates" );
viewer.viewport.goHome();
waitForViewer( function() {
checkOverlayPosition( "after goHome using viewport coordinates" );
start();
} );
} );
} );
} );
} )();