From 6049a7ecef5e1ab09057fa464aa960d2ece56e02 Mon Sep 17 00:00:00 2001 From: Mark Salsbery Date: Wed, 28 Aug 2013 11:33:41 -0700 Subject: [PATCH 1/7] Unit tests for canvas drag, release, click events Added test for canvas-drag, canvas-release, and canvas-click events --- test/events.js | 42 ++++++++++++++- test/test.js | 144 +++++++++++++++++++++++++++++++------------------ 2 files changed, 133 insertions(+), 53 deletions(-) diff --git a/test/events.js b/test/events.js index 31fa9dd1..92f1cd81 100644 --- a/test/events.js +++ b/test/events.js @@ -5,12 +5,12 @@ module( 'Events', { setup: function () { - var example = $( '
' ).appendTo( "#qunit-fixture" ); + var example = $( '
' ).appendTo( "#qunit-fixture" ); testLog.reset(); viewer = OpenSeadragon( { - id: 'example', + id: 'eventsexample', prefixUrl: '/build/openseadragon/images/', springStiffness: 100 // Faster animation = faster tests } ); @@ -60,4 +60,42 @@ viewer.open( '/test/data/testpattern.dzi' ); } ); + // ---------- + asyncTest( 'canvas-drag canvas-release canvas-click', function () { + var dragMoves = 10; + var dragMovesHandled = 0; + + var openHandler = function ( eventSender, eventData ) { + viewer.removeHandler( 'open', openHandler ); + + viewer.addHandler( 'canvas-drag', canvasDragHandler ); + viewer.addHandler( 'canvas-release', canvasReleaseHandler ); + viewer.addHandler( 'canvas-click', canvasClickHandler ); + + Util.simulateViewerDrag( viewer, 0.25, 0.25, 1, 1, dragMoves ); + }; + + var canvasDragHandler = function ( eventSender, eventData ) { + dragMovesHandled += 1; + ok( true, 'canvas-drag event handled' ); + }; + + var canvasReleaseHandler = function ( eventSender, eventData ) { + ok( true, 'canvas-release event handled' ); + }; + + var canvasClickHandler = function ( eventSender, eventData ) { + viewer.removeHandler( 'canvas-drag', canvasDragHandler ); + viewer.removeHandler( 'canvas-release', canvasReleaseHandler ); + viewer.removeHandler( 'canvas-click', canvasClickHandler ); + ok( true, 'canvas-click event handled' ); + equal( dragMovesHandled, dragMoves, 'canvas-drag event count matches mousemove count' ); + viewer.close(); + start(); + }; + + viewer.addHandler( 'open', openHandler ); + viewer.open( '/test/data/testpattern.dzi' ); + } ); + } )(); diff --git a/test/test.js b/test/test.js index 37b7a075..a3696998 100644 --- a/test/test.js +++ b/test/test.js @@ -1,67 +1,109 @@ /* global module, asyncTest, $, ok, equal, notEqual, start, test, Util */ -(function() { +(function () { // ---------- window.Util = { // ---------- - simulateViewerClick: function(viewer, widthFactor, heightFactor) { - if (widthFactor === undefined) { + simulateViewerClick: function ( viewer, widthFactor, heightFactor ) { + if ( widthFactor === undefined ) { widthFactor = 0.5; } //TODO Redefine to be the middle by default - if (heightFactor === undefined) { + if ( heightFactor === undefined ) { heightFactor = 0.5; } - widthFactor = Math.min(1, Math.max(0, widthFactor)); + widthFactor = Math.min( 1, Math.max( 0, widthFactor ) ); //TODO Fix this. The max height should be 1/AR - heightFactor = Math.min(1, Math.max(0, heightFactor)); + heightFactor = Math.min( 1, Math.max( 0, heightFactor ) ); - var $canvas = $(viewer.element).find('.openseadragon-canvas').not('.navigator .openseadragon-canvas'); + var $canvas = $( viewer.element ).find( '.openseadragon-canvas' ).not( '.navigator .openseadragon-canvas' ); var offset = $canvas.offset(); var event = { - clientX: offset.left + Math.floor($canvas.width() * widthFactor), - clientY: offset.top + Math.floor($canvas.height() * heightFactor) + clientX: offset.left + Math.floor( $canvas.width() * widthFactor ), + clientY: offset.top + Math.floor( $canvas.height() * heightFactor ) }; $canvas - .simulate('mouseover', event) - .simulate('mousedown', event) - .simulate('mouseup', event); + .simulate( 'mouseover', event ) + .simulate( 'mousedown', event ) + .simulate( 'mouseup', event ); + }, + + simulateViewerDrag: function ( viewer, widthFactor, heightFactor, dx, dy, movecount ) { + dx = dx || 1; + dy = dy || 1; + + movecount = movecount || 5; + if ( movecount < 1 ) { + movecount = 1; + } + + if ( widthFactor === undefined ) { + widthFactor = 0.5; + } + + //TODO Redefine to be the middle by default + if ( heightFactor === undefined ) { + heightFactor = 0.5; + } + + widthFactor = Math.min( 1, Math.max( 0, widthFactor ) ); + //TODO Fix this. The max height should be 1/AR + heightFactor = Math.min( 1, Math.max( 0, heightFactor ) ); + + var $canvas = $( viewer.element ).find( '.openseadragon-canvas' ).not( '.navigator .openseadragon-canvas' ); + var offset = $canvas.offset(); + var event = { + clientX: offset.left + Math.floor( $canvas.width() * widthFactor ), + clientY: offset.top + Math.floor( $canvas.height() * heightFactor ) + }; + + $canvas + .simulate( 'mouseover', event ) + .simulate( 'mousedown', event ); + for ( var i = 0; i < movecount; i++ ) { + event.clientX += dx; + event.clientY += dy; + $canvas + .simulate( "mousemove", event ); + } + $canvas + .simulate( 'mouseup', event ); }, initializeTestDOM: function () { - $("#qunit-fixture") - .append('
') - .append('
') - .append('
'); + $( "#qunit-fixture" ) + .append( '
' ) + .append( '
' ) + .append( '
' ); }, - equalsWithVariance: function (value1, value2, variance) { - return Math.abs(value1 - value2) <= variance; + equalsWithVariance: function ( value1, value2, variance ) { + return Math.abs( value1 - value2 ) <= variance; }, - assessNumericValue: function (value1, value2, variance, message) { - ok(Util.equalsWithVariance(value1, value2, variance), message + " Expected:" + value1 + " Found: " + value2 + " Variance: " + variance); + assessNumericValue: function ( value1, value2, variance, message ) { + ok( Util.equalsWithVariance( value1, value2, variance ), message + " Expected:" + value1 + " Found: " + value2 + " Variance: " + variance ); }, - timeWatcher: function(time) { + timeWatcher: function ( time ) { time = time || 2000; var finished = false; - setTimeout(function() { - if (!finished) { + setTimeout( function () { + if ( !finished ) { finished = true; - ok(false, 'finishes in ' + time + 'ms'); + ok( false, 'finishes in ' + time + 'ms' ); start(); } - }, time); + }, time ); return { - done: function() { - if (!finished) { + done: function () { + if ( !finished ) { finished = true; start(); } @@ -72,42 +114,42 @@ }; /* - Test console log capture + Test console log capture - 1. Only the OpenSeadragon.console logger is touched - 2. All log messages are stored in window.testLog in arrays keyed on the logger name (e.g. log, - warning, error, etc.) as JSON-serialized strings to simplify comparisons - 3. The captured log arrays have a custom contains() method for ease of testing - 4. testLog.reset() will clear all of the message arrays, intended for use in test setup routines - */ + 1. Only the OpenSeadragon.console logger is touched + 2. All log messages are stored in window.testLog in arrays keyed on the logger name (e.g. log, + warning, error, etc.) as JSON-serialized strings to simplify comparisons + 3. The captured log arrays have a custom contains() method for ease of testing + 4. testLog.reset() will clear all of the message arrays, intended for use in test setup routines + */ var testConsole = window.testConsole = {}, testLog = window.testLog = { - log: [], - debug: [], - info: [], - warn: [], - error: [], + log: [], + debug: [], + info: [], + warn: [], + error: [], reset: function () { - for (var i in testLog) { - if (testLog.hasOwnProperty(i) && 'length' in testLog[i] && 'push' in testLog[i]) { + for ( var i in testLog ) { + if ( testLog.hasOwnProperty( i ) && 'length' in testLog[i] && 'push' in testLog[i] ) { testLog[i].length = 0; } } } }; - for (var i in testLog) { - if (testLog.hasOwnProperty(i) && testLog[i].push) { - testConsole[i] = (function (arr) { + for ( var i in testLog ) { + if ( testLog.hasOwnProperty( i ) && testLog[i].push ) { + testConsole[i] = ( function ( arr ) { return function () { - var args = Array.prototype.slice.call(arguments, 0); // Coerce to true Array - arr.push(JSON.stringify(args)); // Store as JSON to avoid tedious array-equality tests + var args = Array.prototype.slice.call( arguments, 0 ); // Coerce to true Array + arr.push( JSON.stringify( args ) ); // Store as JSON to avoid tedious array-equality tests }; - })(testLog[i]); + } )( testLog[i] ); - testLog[i].contains = function (needle) { - for (var i = 0; i < this.length; i++) { - if (this[i] == needle) { + testLog[i].contains = function ( needle ) { + for ( var i = 0; i < this.length; i++ ) { + if ( this[i] == needle ) { return true; } } @@ -117,5 +159,5 @@ } OpenSeadragon.console = testConsole; -})(); +} )(); From 1a005573f5dbe6895ea61b70a0f686c8bddff97f Mon Sep 17 00:00:00 2001 From: Mark Salsbery Date: Thu, 29 Aug 2013 13:01:07 -0700 Subject: [PATCH 2/7] Unit tests for canvas drag, release, click events --- test/basic.js | 11 ++++++-- test/events.js | 14 +++++++--- test/test.js | 71 ++++++++++++++++---------------------------------- 3 files changed, 42 insertions(+), 54 deletions(-) diff --git a/test/basic.js b/test/basic.js index 7e0492c0..50e51cab 100644 --- a/test/basic.js +++ b/test/basic.js @@ -160,8 +160,15 @@ }; viewer.addHandler('animationfinish', clickHandler); - Util.simulateViewerClick(viewer, 0.25, 0.25); - }); + Util.simulateViewerClickWithDrag( { + viewer: viewer, + widthFactor: 0.25, + heightFactor: 0.25, + dragCount: 0, + dragDx: 0, + dragDy: 0 + } ); + } ); viewer.open('/test/data/testpattern.dzi'); }); diff --git a/test/events.js b/test/events.js index 92f1cd81..5a77b29a 100644 --- a/test/events.js +++ b/test/events.js @@ -62,7 +62,7 @@ // ---------- asyncTest( 'canvas-drag canvas-release canvas-click', function () { - var dragMoves = 10; + var dragCount = 10; var dragMovesHandled = 0; var openHandler = function ( eventSender, eventData ) { @@ -72,12 +72,18 @@ viewer.addHandler( 'canvas-release', canvasReleaseHandler ); viewer.addHandler( 'canvas-click', canvasClickHandler ); - Util.simulateViewerDrag( viewer, 0.25, 0.25, 1, 1, dragMoves ); + Util.simulateViewerClickWithDrag( { + viewer: viewer, + widthFactor: 0.25, + heightFactor: 0.25, + dragCount: dragCount, + dragDx: 1, + dragDy: 1 + } ); }; var canvasDragHandler = function ( eventSender, eventData ) { dragMovesHandled += 1; - ok( true, 'canvas-drag event handled' ); }; var canvasReleaseHandler = function ( eventSender, eventData ) { @@ -89,7 +95,7 @@ viewer.removeHandler( 'canvas-release', canvasReleaseHandler ); viewer.removeHandler( 'canvas-click', canvasClickHandler ); ok( true, 'canvas-click event handled' ); - equal( dragMovesHandled, dragMoves, 'canvas-drag event count matches mousemove count' ); + equal( dragMovesHandled, dragCount, "'canvas-drag' event count matches 'mousemove' event count" ); viewer.close(); start(); }; diff --git a/test/test.js b/test/test.js index a3696998..def55713 100644 --- a/test/test.js +++ b/test/test.js @@ -5,68 +5,43 @@ // ---------- window.Util = { // ---------- - simulateViewerClick: function ( viewer, widthFactor, heightFactor ) { - if ( widthFactor === undefined ) { - widthFactor = 0.5; + simulateViewerClickWithDrag: function ( args ) { + // args = { viewer, widthFactor, heightFactor, dragCount, dragDx, dragDy } + + if ( args.hasOwnProperty( 'dragCount' ) ) { + args.dragDx = args.dragDx || 1; + args.dragDy = args.dragDy || 1; + } + else { + args.dragCount = 0; + } + + if ( args.widthFactor === undefined ) { + args.widthFactor = 0.5; } //TODO Redefine to be the middle by default - if ( heightFactor === undefined ) { - heightFactor = 0.5; + if ( args.heightFactor === undefined ) { + args.heightFactor = 0.5; } - widthFactor = Math.min( 1, Math.max( 0, widthFactor ) ); + args.widthFactor = Math.min( 1, Math.max( 0, args.widthFactor ) ); //TODO Fix this. The max height should be 1/AR - heightFactor = Math.min( 1, Math.max( 0, heightFactor ) ); + args.heightFactor = Math.min( 1, Math.max( 0, args.heightFactor ) ); - var $canvas = $( viewer.element ).find( '.openseadragon-canvas' ).not( '.navigator .openseadragon-canvas' ); + var $canvas = $( args.viewer.element ).find( '.openseadragon-canvas' ).not( '.navigator .openseadragon-canvas' ); var offset = $canvas.offset(); var event = { - clientX: offset.left + Math.floor( $canvas.width() * widthFactor ), - clientY: offset.top + Math.floor( $canvas.height() * heightFactor ) - }; - - $canvas - .simulate( 'mouseover', event ) - .simulate( 'mousedown', event ) - .simulate( 'mouseup', event ); - }, - - simulateViewerDrag: function ( viewer, widthFactor, heightFactor, dx, dy, movecount ) { - dx = dx || 1; - dy = dy || 1; - - movecount = movecount || 5; - if ( movecount < 1 ) { - movecount = 1; - } - - if ( widthFactor === undefined ) { - widthFactor = 0.5; - } - - //TODO Redefine to be the middle by default - if ( heightFactor === undefined ) { - heightFactor = 0.5; - } - - widthFactor = Math.min( 1, Math.max( 0, widthFactor ) ); - //TODO Fix this. The max height should be 1/AR - heightFactor = Math.min( 1, Math.max( 0, heightFactor ) ); - - var $canvas = $( viewer.element ).find( '.openseadragon-canvas' ).not( '.navigator .openseadragon-canvas' ); - var offset = $canvas.offset(); - var event = { - clientX: offset.left + Math.floor( $canvas.width() * widthFactor ), - clientY: offset.top + Math.floor( $canvas.height() * heightFactor ) + clientX: offset.left + Math.floor( $canvas.width() * args.widthFactor ), + clientY: offset.top + Math.floor( $canvas.height() * args.heightFactor ) }; $canvas .simulate( 'mouseover', event ) .simulate( 'mousedown', event ); - for ( var i = 0; i < movecount; i++ ) { - event.clientX += dx; - event.clientY += dy; + for ( var i = 0; i < args.dragCount; i++ ) { + event.clientX += args.dragDx; + event.clientY += args.dragDy; $canvas .simulate( "mousemove", event ); } From 0bbf6bc58a1957fdfa05fe7c7a2d543f34976096 Mon Sep 17 00:00:00 2001 From: Mark Salsbery Date: Fri, 30 Aug 2013 10:09:22 -0700 Subject: [PATCH 3/7] Unit tests for canvas drag, release, click events --- test/events.js | 32 +++++++++++++++++--------------- 1 file changed, 17 insertions(+), 15 deletions(-) diff --git a/test/events.js b/test/events.js index 5a77b29a..b2e71eb6 100644 --- a/test/events.js +++ b/test/events.js @@ -42,8 +42,8 @@ // ---------- asyncTest( 'addHandler with userData', function () { - var userData = { item1: 'Test user data', item2: Math.random() }; - var originalUserData = { item1: userData.item1, item2: userData.item2 }; + var userData = { item1: 'Test user data', item2: Math.random() }, + originalUserData = { item1: userData.item1, item2: userData.item2 }; var openHandler = function ( eventSender, eventData ) { viewer.removeHandler( 'open', openHandler ); @@ -62,8 +62,10 @@ // ---------- asyncTest( 'canvas-drag canvas-release canvas-click', function () { - var dragCount = 10; - var dragMovesHandled = 0; + var dragCount = 10, + dragMovesHandled = 0, + releasesHandled = 0, + releasesExpected = 1; var openHandler = function ( eventSender, eventData ) { viewer.removeHandler( 'open', openHandler ); @@ -72,30 +74,30 @@ viewer.addHandler( 'canvas-release', canvasReleaseHandler ); viewer.addHandler( 'canvas-click', canvasClickHandler ); - Util.simulateViewerClickWithDrag( { - viewer: viewer, - widthFactor: 0.25, - heightFactor: 0.25, - dragCount: dragCount, - dragDx: 1, - dragDy: 1 + Util.simulateViewerClickWithDrag( { + viewer: viewer, + widthFactor: 0.25, + heightFactor: 0.25, + dragCount: dragCount, + dragDx: 1, + dragDy: 1 } ); }; var canvasDragHandler = function ( eventSender, eventData ) { - dragMovesHandled += 1; + dragMovesHandled++; }; var canvasReleaseHandler = function ( eventSender, eventData ) { - ok( true, 'canvas-release event handled' ); + releasesHandled++; }; var canvasClickHandler = function ( eventSender, eventData ) { viewer.removeHandler( 'canvas-drag', canvasDragHandler ); viewer.removeHandler( 'canvas-release', canvasReleaseHandler ); viewer.removeHandler( 'canvas-click', canvasClickHandler ); - ok( true, 'canvas-click event handled' ); - equal( dragMovesHandled, dragCount, "'canvas-drag' event count matches 'mousemove' event count" ); + equal( dragMovesHandled, dragCount, "'canvas-drag' event count matches 'mousemove' event count (" + dragCount + ")" ); + equal( releasesHandled, releasesExpected, "'canvas-release' event count matches expected (" + releasesExpected + ")" ); viewer.close(); start(); }; From bfa76e471b68bb9a15621bf499bff35beca6ff30 Mon Sep 17 00:00:00 2001 From: Antoine Vandecreme Date: Fri, 30 Aug 2013 13:59:48 -0400 Subject: [PATCH 4/7] Add viewportToImageRectangle method and add support to pass a point to viewportToImageCoordinates and imageToViewportCoordinates --- src/viewport.js | 37 ++++++++++++++++++++++++++++++++++--- 1 file changed, 34 insertions(+), 3 deletions(-) diff --git a/src/viewport.js b/src/viewport.js index 8cc1ef8d..e2638111 100644 --- a/src/viewport.js +++ b/src/viewport.js @@ -726,7 +726,11 @@ $.Viewport.prototype = { * system to image coordinate system */ viewportToImageCoordinates: function(viewerX, viewerY) { - return new $.Point(viewerX * this.contentSize.x, viewerY * this.contentSize.y * this.contentAspectX); + if ( arguments.length == 1 ) { + //they passed a point instead of individual components + return this.viewportToImageCoordinates(viewerX.x, viewerX.y); + } + return new $.Point(viewerX * this.contentSize.x, viewerY * this.contentSize.y * this.contentAspectX); }, /** @@ -734,7 +738,11 @@ $.Viewport.prototype = { * Seajax viewer coordinate system */ imageToViewportCoordinates: function( imageX, imageY ) { - return new $.Point( imageX / this.contentSize.x, imageY / this.contentSize.y / this.contentAspectX); + if ( arguments.length == 1 ) { + //they passed a point instead of individual components + return this.imageToViewportCoordinates(imageX.x, imageX.y); + } + return new $.Point( imageX / this.contentSize.x, imageY / this.contentSize.y / this.contentAspectX); }, /** @@ -746,7 +754,7 @@ $.Viewport.prototype = { var coordA, coordB, rect; - if( arguments.length == 1 ){ + if( arguments.length == 1 ) { //they passed a rectangle instead of individual components rect = imageX; return this.imageToViewportRectangle(rect.x, rect.y, rect.width, rect.height); @@ -763,6 +771,29 @@ $.Viewport.prototype = { coordB.x, coordB.y ); + }, + + /** + * Translates from a rectangle which describes a portion of + * the viewport in point coordinates to image rectangle coordinates. + */ + viewportToImageRectangle: function( viewerX, viewerY, pointWidth, pointHeight ) { + var coordA, + coordB, + rect; + if ( arguments.length == 1 ) { + //they passed a rectangle instead of individual components + rect = viewerX; + return this.viewportToImageRectangle(rect.x, rect.y, rect.width, rect.height); + } + coordA = this.viewportToImageCoordinates(viewerX, viewerY); + coordB = this.viewportToImageCoordinates(pointWidth, pointHeight); + return new $.Rect( + coordA.x, + coordA.y, + coordB.x, + coordB.y + ); } }; From 63af5a69ac1ffdf31566760a6f79183b4a21c5bf Mon Sep 17 00:00:00 2001 From: Antoine Vandecreme Date: Wed, 4 Sep 2013 14:13:25 -0400 Subject: [PATCH 5/7] Add comments and fix indentation --- src/viewport.js | 67 +++++++++++++++++++++++++++++++++++++------------ 1 file changed, 51 insertions(+), 16 deletions(-) diff --git a/src/viewport.js b/src/viewport.js index e2638111..74c9f8aa 100644 --- a/src/viewport.js +++ b/src/viewport.js @@ -722,33 +722,54 @@ $.Viewport.prototype = { }, /** - * Translates from Seajax viewer coordinate - * system to image coordinate system + * Translates from Seajax viewer coordinate system to image coordinate system. + * This method can be called either by passing X,Y coordinates or an + * OpenSeadragon.Point + * @function + * @param {OpenSeadragon.Point} viewerX the point in viewport coordinate system. + * @param {Number} viewerX X coordinate in viewport coordinate system. + * @param {Number} viewerY Y coordinate in viewport coordinate system. + * @return {OpenSeadragon.Point} a point representing the coordinates in the image. */ - viewportToImageCoordinates: function(viewerX, viewerY) { + viewportToImageCoordinates: function( viewerX, viewerY ) { if ( arguments.length == 1 ) { //they passed a point instead of individual components - return this.viewportToImageCoordinates(viewerX.x, viewerX.y); + return this.viewportToImageCoordinates( viewerX.x, viewerX.y ); } - return new $.Point(viewerX * this.contentSize.x, viewerY * this.contentSize.y * this.contentAspectX); + return new $.Point( viewerX * this.contentSize.x, viewerY * this.contentSize.y * this.contentAspectX ); }, /** - * Translates from image coordinate system to - * Seajax viewer coordinate system + * Translates from image coordinate system to Seajax viewer coordinate system + * This method can be called either by passing X,Y coordinates or an + * OpenSeadragon.Point + * @function + * @param {OpenSeadragon.Point} imageX the point in image coordinate system. + * @param {Number} imageX X coordinate in image coordinate system. + * @param {Number} imageY Y coordinate in image coordinate system. + * @return {OpenSeadragon.Point} a point representing the coordinates in the viewport. */ imageToViewportCoordinates: function( imageX, imageY ) { if ( arguments.length == 1 ) { //they passed a point instead of individual components - return this.imageToViewportCoordinates(imageX.x, imageX.y); + return this.imageToViewportCoordinates( imageX.x, imageX.y ); } - return new $.Point( imageX / this.contentSize.x, imageY / this.contentSize.y / this.contentAspectX); + return new $.Point( imageX / this.contentSize.x, imageY / this.contentSize.y / this.contentAspectX ); }, /** - * Translates from a rectangle which describes a portion of - * the image in pixel coordinates to OpenSeadragon viewport - * rectangle coordinates. + * Translates from a rectangle which describes a portion of the image in + * pixel coordinates to OpenSeadragon viewport rectangle coordinates. + * This method can be called either by passing X,Y,width,height or an + * OpenSeadragon.Rect + * @function + * @param {OpenSeadragon.Rect} imageX the rectangle in image coordinate system. + * @param {Number} imageX the X coordinate of the top left corner of the rectangle + * in image coordinate system. + * @param {Number} imageY the Y coordinate of the top left corner of the rectangle + * in image coordinate system. + * @param {Number} pixelWidth the width in pixel of the rectangle. + * @param {Number} pixelHeight the height in pixel of the rectangle. */ imageToViewportRectangle: function( imageX, imageY, pixelWidth, pixelHeight ) { var coordA, @@ -757,7 +778,9 @@ $.Viewport.prototype = { if( arguments.length == 1 ) { //they passed a rectangle instead of individual components rect = imageX; - return this.imageToViewportRectangle(rect.x, rect.y, rect.width, rect.height); + return this.imageToViewportRectangle( + rect.x, rect.y, rect.width, rect.height + ); } coordA = this.imageToViewportCoordinates( imageX, imageY @@ -776,6 +799,16 @@ $.Viewport.prototype = { /** * Translates from a rectangle which describes a portion of * the viewport in point coordinates to image rectangle coordinates. + * This method can be called either by passing X,Y,width,height or an + * OpenSeadragon.Rect + * @function + * @param {OpenSeadragon.Rect} viewerX the rectangle in viewport coordinate system. + * @param {Number} viewerX the X coordinate of the top left corner of the rectangle + * in viewport coordinate system. + * @param {Number} imageY the Y coordinate of the top left corner of the rectangle + * in viewport coordinate system. + * @param {Number} pointWidth the width of the rectangle in viewport coordinate system. + * @param {Number} pointHeight the height of the rectangle in viewport coordinate system. */ viewportToImageRectangle: function( viewerX, viewerY, pointWidth, pointHeight ) { var coordA, @@ -784,10 +817,12 @@ $.Viewport.prototype = { if ( arguments.length == 1 ) { //they passed a rectangle instead of individual components rect = viewerX; - return this.viewportToImageRectangle(rect.x, rect.y, rect.width, rect.height); + return this.viewportToImageRectangle( + rect.x, rect.y, rect.width, rect.height + ); } - coordA = this.viewportToImageCoordinates(viewerX, viewerY); - coordB = this.viewportToImageCoordinates(pointWidth, pointHeight); + coordA = this.viewportToImageCoordinates( viewerX, viewerY ); + coordB = this.viewportToImageCoordinates( pointWidth, pointHeight ); return new $.Rect( coordA.x, coordA.y, From ed8311b5b82a0bdc1f985749226314fc21bf7c73 Mon Sep 17 00:00:00 2001 From: Ian Gilman Date: Thu, 5 Sep 2013 16:24:53 -0700 Subject: [PATCH 6/7] Updated changelog for #212 --- changelog.txt | 1 + 1 file changed, 1 insertion(+) diff --git a/changelog.txt b/changelog.txt index d33d3286..3343c616 100644 --- a/changelog.txt +++ b/changelog.txt @@ -7,6 +7,7 @@ OPENSEADRAGON CHANGELOG * Fixed: LegacyTileSource doesn't fail gracefully when no supported file formats are found (#202) * Added an optional userData argument to EventHandler.addHandler() which is passed unchanged to the handler method (#203) * Fixed AJAX error reporting on IE8 (#208) +* Added viewportToImageRectangle method, and updated imageToViewportRectangle, imageToViewportCoordinates, and viewportToImageCoordinates to be more flexible with params (#212) 0.9.130: From 75ddd299e4a0755f377ebe95a42dfd27835398fc Mon Sep 17 00:00:00 2001 From: Ian Gilman Date: Thu, 5 Sep 2013 16:26:00 -0700 Subject: [PATCH 7/7] Changed Seajax to OpenSeadragon --- src/viewport.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/viewport.js b/src/viewport.js index 74c9f8aa..691851c4 100644 --- a/src/viewport.js +++ b/src/viewport.js @@ -722,7 +722,7 @@ $.Viewport.prototype = { }, /** - * Translates from Seajax viewer coordinate system to image coordinate system. + * Translates from OpenSeadragon viewer coordinate system to image coordinate system. * This method can be called either by passing X,Y coordinates or an * OpenSeadragon.Point * @function @@ -740,7 +740,7 @@ $.Viewport.prototype = { }, /** - * Translates from image coordinate system to Seajax viewer coordinate system + * Translates from image coordinate system to OpenSeadragon viewer coordinate system * This method can be called either by passing X,Y coordinates or an * OpenSeadragon.Point * @function