diff --git a/changelog.txt b/changelog.txt index 018510e9..b201bbf5 100644 --- a/changelog.txt +++ b/changelog.txt @@ -11,6 +11,7 @@ OPENSEADRAGON CHANGELOG * You can now provide an element for the navigator (as an alternative to an ID) (#1303 @cameronbaney, #2166 #2175 @joedf) * Now supporting IIIF "id" and "identifier" in addition to "@id" (#2173 @ahankinson) * We now delegate tile fetching and caching to the TileSource, to allow for custom tile formats (#2148 @Aiosa) +* Added support for dynamic URLs from tile sources (#2247 @JohnReagan) * The viewer now emits before-destroy and destroy events (#2239 @pearcetm) * Improved documentation (#2211 @shyamkumaryadav) * Fixed: Cropping tiled images with polygons was broken (#2183 @altert) diff --git a/src/tile.js b/src/tile.js index 81bc8999..33e0cee4 100644 --- a/src/tile.js +++ b/src/tile.js @@ -44,7 +44,7 @@ * coordinates. * @param {Boolean} exists Is this tile a part of a sparse image? ( Also has * this tile failed to load? ) - * @param {String} url The URL of this tile's image. + * @param {String|() => String} url The URL of this tile's image or a function that returns a url. * @param {CanvasRenderingContext2D} context2D The context2D of this tile if it * is provided directly by the tile source. * @param {Boolean} loadWithAjax Whether this tile image should be loaded with an AJAX request . @@ -95,11 +95,13 @@ $.Tile = function(level, x, y, bounds, exists, url, context2D, loadWithAjax, aja */ this.exists = exists; /** - * The URL of this tile's image. - * @member {String} url + * Private property to hold string url or url retriever function. + * Consumers should access via Tile.getUrl() + * @private + * @member {String|() => String} url * @memberof OpenSeadragon.Tile# */ - this.url = url; + this._url = url; /** * Post parameters for this tile. For example, it can be an URL-encoded string * in k1=v1&k2=v2... format, or a JSON, or a FormData instance... or null if no POST request used @@ -269,7 +271,7 @@ $.Tile.prototype = { _hasTransparencyChannel: function() { console.warn("Tile.prototype._hasTransparencyChannel() has been " + "deprecated and will be removed in the future. Use TileSource.prototype.hasTransparency() instead."); - return !!this.context2D || this.url.match('.png'); + return !!this.context2D || this.getUrl().match('.png'); }, /** @@ -342,6 +344,18 @@ $.Tile.prototype = { return this.getImage(); }, + /** + * The URL of this tile's image. + * @member {String} url + * @memberof OpenSeadragon.Tile# + * @deprecated + * @returns {String} + */ + get url() { + $.console.error("[Tile.url] property has been deprecated. Use [Tile.prototype.getUrl] instead."); + return this.getUrl(); + }, + /** * Get the Image object for this tile. * @returns {Image} @@ -350,6 +364,18 @@ $.Tile.prototype = { return this.cacheImageRecord.getImage(); }, + /** + * Get the url string for this tile. + * @returns {String} + */ + getUrl: function() { + if (typeof this._url === 'function') { + return this._url(); + } + + return this._url; + }, + /** * Get the CanvasRenderingContext2D instance for tile image data drawn * onto Canvas if enabled and available diff --git a/src/tiledimage.js b/src/tiledimage.js index 2715730a..cbcdfc92 100644 --- a/src/tiledimage.js +++ b/src/tiledimage.js @@ -1480,7 +1480,7 @@ $.extend($.TiledImage.prototype, $.EventSource.prototype, /** @lends OpenSeadrag bounds, sourceBounds, exists, - url, + urlOrGetter, post, ajaxHeaders, context2D, @@ -1501,7 +1501,7 @@ $.extend($.TiledImage.prototype, $.EventSource.prototype, /** @lends OpenSeadrag bounds = this.getTileBounds( level, x, y ); sourceBounds = tileSource.getTileBounds( level, xMod, yMod, true ); exists = tileSource.tileExists( level, xMod, yMod ); - url = tileSource.getTileUrl( level, xMod, yMod ); + urlOrGetter = tileSource.getTileUrl( level, xMod, yMod ); post = tileSource.getTilePostData( level, xMod, yMod ); // Headers are only applicable if loadTilesWithAjax is set @@ -1524,13 +1524,13 @@ $.extend($.TiledImage.prototype, $.EventSource.prototype, /** @lends OpenSeadrag y, bounds, exists, - url, + urlOrGetter, context2D, this.loadTilesWithAjax, ajaxHeaders, sourceBounds, post, - tileSource.getTileHashKey(level, xMod, yMod, url, ajaxHeaders, post) + tileSource.getTileHashKey(level, xMod, yMod, urlOrGetter, ajaxHeaders, post) ); if (this.getFlip()) { @@ -1569,7 +1569,7 @@ $.extend($.TiledImage.prototype, $.EventSource.prototype, /** @lends OpenSeadrag var _this = this; tile.loading = true; this._imageLoader.addJob({ - src: tile.url, + src: tile.getUrl(), tile: tile, source: this.source, postData: tile.postData, @@ -1598,7 +1598,7 @@ $.extend($.TiledImage.prototype, $.EventSource.prototype, /** @lends OpenSeadrag */ _onTileLoad: function( tile, time, data, errorMsg, tileRequest ) { if ( !data ) { - $.console.error( "Tile %s failed to load: %s - error: %s", tile, tile.url, errorMsg ); + $.console.error( "Tile %s failed to load: %s - error: %s", tile, tile.getUrl(), errorMsg ); /** * Triggered when a tile fails to load. * @@ -1624,7 +1624,7 @@ $.extend($.TiledImage.prototype, $.EventSource.prototype, /** @lends OpenSeadrag } if ( time < this.lastResetTime ) { - $.console.warn( "Ignoring tile %s loaded before reset: %s", tile, tile.url ); + $.console.warn( "Ignoring tile %s loaded before reset: %s", tile, tile.getUrl() ); tile.loading = false; return; } @@ -1669,7 +1669,7 @@ $.extend($.TiledImage.prototype, $.EventSource.prototype, /** @lends OpenSeadrag tile.loading = false; tile.loaded = true; tile.hasTransparency = _this.source.hasTransparency( - tile.context2D, tile.url, tile.ajaxHeaders, tile.postData + tile.context2D, tile.getUrl(), tile.ajaxHeaders, tile.postData ); if (!tile.context2D) { _this._tileCache.cacheTile({ @@ -1852,7 +1852,7 @@ $.extend($.TiledImage.prototype, $.EventSource.prototype, /** @lends OpenSeadrag useSketch = this.opacity < 1 || (this.compositeOperation && this.compositeOperation !== 'source-over') || (!this._isBottomItem() && - this.source.hasTransparency(tile.context2D, tile.url, tile.ajaxHeaders, tile.postData)); + this.source.hasTransparency(tile.context2D, tile.getUrl(), tile.ajaxHeaders, tile.postData)); } var sketchScale; diff --git a/src/tilesource.js b/src/tilesource.js index 604308ff..7875d23a 100644 --- a/src/tilesource.js +++ b/src/tilesource.js @@ -618,6 +618,7 @@ $.TileSource.prototype = { * @param {Number} level * @param {Number} x * @param {Number} y + * @returns {String|() => string} url - A string for the url or a function that returns a url string. * @throws {Error} */ getTileUrl: function( level, x, y ) { diff --git a/test/modules/drawer.js b/test/modules/drawer.js index 4fd1a29f..e39b48b5 100644 --- a/test/modules/drawer.js +++ b/test/modules/drawer.js @@ -21,6 +21,7 @@ // ---------- var createViewer = function(options) { options = options || {}; + // eslint-disable-next-line new-cap viewer = OpenSeadragon(OpenSeadragon.extend({ id: 'example', prefixUrl: '/build/openseadragon/images/', @@ -45,7 +46,7 @@ }); viewer.addHandler('open', function handler(event) { - viewer.viewport.setRotation(30, true); + viewer.viewport.setRotation(30, null, true); Util.spyOnce(viewer.drawer.context, 'rotate', function() { assert.ok(true, 'drawing with new rotation'); done(); diff --git a/test/modules/events.js b/test/modules/events.js index f8173976..010b08b9 100644 --- a/test/modules/events.js +++ b/test/modules/events.js @@ -9,6 +9,7 @@ testLog.reset(); + // eslint-disable-next-line new-cap viewer = OpenSeadragon( { id: 'eventsexample', prefixUrl: '/build/openseadragon/images/', @@ -194,13 +195,13 @@ var simulateEnter = function (x, y) { simEvent.clientX = offset.left + x; - simEvent.clientY = offset.top + y; + simEvent.clientY = offset.top + y; $canvas.simulate( 'mouseenter', simEvent ); }; var simulateLeave = function (x, y) { simEvent.clientX = offset.left + x; - simEvent.clientY = offset.top + y; + simEvent.clientY = offset.top + y; simEvent.relatedTarget = document.body; $canvas.simulate( 'mouseleave', simEvent ); }; @@ -215,28 +216,28 @@ var simulateDown = function (x, y) { simEvent.button = 0; simEvent.clientX = offset.left + x; - simEvent.clientY = offset.top + y; + simEvent.clientY = offset.top + y; $canvas.simulate( 'mousedown', simEvent ); }; var simulateUp = function (x, y) { simEvent.button = 0; simEvent.clientX = offset.left + x; - simEvent.clientY = offset.top + y; + simEvent.clientY = offset.top + y; $canvas.simulate( 'mouseup', simEvent ); }; var simulateNonPrimaryDown = function (x, y, button) { simEvent.button = button; simEvent.clientX = offset.left + x; - simEvent.clientY = offset.top + y; + simEvent.clientY = offset.top + y; $canvas.simulate( 'mousedown', simEvent ); }; var simulateNonPrimaryUp = function (x, y, button) { simEvent.button = button; simEvent.clientX = offset.left + x; - simEvent.clientY = offset.top + y; + simEvent.clientY = offset.top + y; $canvas.simulate( 'mouseup', simEvent ); }; @@ -680,7 +681,7 @@ // start-end-end (multi-touch start event) reset(); - touches = TouchUtil.start( [0,0], [20,20] ); + touches = TouchUtil.start( [0, 0], [20, 20] ); assessTouchExpectations({ description: 'start-end-end (multi-touch start event) [capture]: ', captureCount: 2, @@ -790,7 +791,7 @@ "Zoom should not be prevented"); Util.assertRectangleEquals( assert, - new OpenSeadragon.Rect(-249.5, -0.25, 500, 0.5), + new OpenSeadragon.Rect(-384.5, -0.25, 500, 0.5), bounds, epsilon, 'Pan should not be prevented'); @@ -813,13 +814,13 @@ var simulateEnter = function (x, y) { simEvent.clientX = offset.left + x; - simEvent.clientY = offset.top + y; + simEvent.clientY = offset.top + y; $canvas.simulate( 'mouseenter', simEvent ); }; var simulateLeave = function (x, y) { simEvent.clientX = offset.left + x; - simEvent.clientY = offset.top + y; + simEvent.clientY = offset.top + y; simEvent.relatedTarget = document.body; $canvas.simulate( 'mouseleave', simEvent ); }; @@ -827,14 +828,14 @@ var simulateDown = function (x, y) { simEvent.button = 0; simEvent.clientX = offset.left + x; - simEvent.clientY = offset.top + y; + simEvent.clientY = offset.top + y; $canvas.simulate( 'mousedown', simEvent ); }; var simulateUp = function (x, y) { simEvent.button = 0; simEvent.clientX = offset.left + x; - simEvent.clientY = offset.top + y; + simEvent.clientY = offset.top + y; $canvas.simulate( 'mouseup', simEvent ); }; @@ -912,50 +913,6 @@ dragEndsExpected = 1, releasesExpected = 1; - var onOpen = function ( ) { - viewer.removeHandler( 'open', onOpen ); - - viewer.addHandler( 'canvas-drag', onEventSourceDrag ); - viewer.addHandler( 'canvas-drag-end', onEventSourceDragEnd ); - viewer.addHandler( 'canvas-release', onEventSourceRelease ); - viewer.addHandler( 'canvas-click', onEventSourceClick ); - - mouseTracker = new OpenSeadragon.MouseTracker( { - element: $canvas[0], - userData: userData, - clickTimeThreshold: OpenSeadragon.DEFAULT_SETTINGS.clickTimeThreshold, - clickDistThreshold: OpenSeadragon.DEFAULT_SETTINGS.clickDistThreshold, - dblClickTimeThreshold: OpenSeadragon.DEFAULT_SETTINGS.dblClickTimeThreshold, - dblClickDistThreshold: OpenSeadragon.DEFAULT_SETTINGS.dblClickDistThreshold, - focusHandler: onMouseTrackerFocus, - blurHandler: onMouseTrackerBlur, - enterHandler: onMouseTrackerEnter, - pressHandler: onMouseTrackerPress, - moveHandler: onMouseTrackerMove, - dragHandler: onMouseTrackerDrag, - dragEndHandler: onMouseTrackerDragEnd, - releaseHandler: onMouseTrackerRelease, - clickHandler: onMouseTrackerClick, - leaveHandler: onMouseTrackerLeave - } ); - - var event = { - clientX:1, - clientY:1 - }; - - $canvas.simulate( 'focus', event ); - Util.simulateViewerClickWithDrag( { - viewer: viewer, - widthFactor: 0.25, - heightFactor: 0.25, - dragCount: dragCount, - dragDx: 1, - dragDy: 1 - } ); - $canvas.simulate( 'blur', event ); - }; - var checkOriginalEventReceivedViewer = function ( event ) { eventsHandledViewer++; //TODO Provide a better check for the original event...simulate doesn't currently extend the object @@ -1055,6 +1012,50 @@ done(); }; + var onOpen = function ( ) { + viewer.removeHandler( 'open', onOpen ); + + viewer.addHandler( 'canvas-drag', onEventSourceDrag ); + viewer.addHandler( 'canvas-drag-end', onEventSourceDragEnd ); + viewer.addHandler( 'canvas-release', onEventSourceRelease ); + viewer.addHandler( 'canvas-click', onEventSourceClick ); + + mouseTracker = new OpenSeadragon.MouseTracker( { + element: $canvas[0], + userData: userData, + clickTimeThreshold: OpenSeadragon.DEFAULT_SETTINGS.clickTimeThreshold, + clickDistThreshold: OpenSeadragon.DEFAULT_SETTINGS.clickDistThreshold, + dblClickTimeThreshold: OpenSeadragon.DEFAULT_SETTINGS.dblClickTimeThreshold, + dblClickDistThreshold: OpenSeadragon.DEFAULT_SETTINGS.dblClickDistThreshold, + focusHandler: onMouseTrackerFocus, + blurHandler: onMouseTrackerBlur, + enterHandler: onMouseTrackerEnter, + pressHandler: onMouseTrackerPress, + moveHandler: onMouseTrackerMove, + dragHandler: onMouseTrackerDrag, + dragEndHandler: onMouseTrackerDragEnd, + releaseHandler: onMouseTrackerRelease, + clickHandler: onMouseTrackerClick, + leaveHandler: onMouseTrackerLeave + } ); + + var event = { + clientX: 1, + clientY: 1 + }; + + $canvas.simulate( 'focus', event ); + Util.simulateViewerClickWithDrag( { + viewer: viewer, + widthFactor: 0.25, + heightFactor: 0.25, + dragCount: dragCount, + dragDx: 1, + dragDy: 1 + } ); + $canvas.simulate( 'blur', event ); + }; + viewer.addHandler( 'open', onOpen ); viewer.open( '/test/data/testpattern.dzi' ); } ); diff --git a/test/modules/navigator.js b/test/modules/navigator.js index e55c5400..e4636108 100644 --- a/test/modules/navigator.js +++ b/test/modules/navigator.js @@ -1,4 +1,5 @@ -/* global QUnit, module, Util, $, console */ +/* eslint-disable new-cap */ +/* global QUnit, Util, $ */ (function () { var debug = false, @@ -463,7 +464,7 @@ } else { // Navigator hosted in viewer - if (seadragonProperties.navigatorPosition && seadragonProperties.navigatorPosition == 'ABSOLUTE') { + if (seadragonProperties.navigatorPosition && seadragonProperties.navigatorPosition === 'ABSOLUTE') { // Navigator positioned 'ABSOLUTE'...size shouldn't change assessNavigatorSize( diff --git a/test/modules/tilesource-dynamic-url.js b/test/modules/tilesource-dynamic-url.js new file mode 100644 index 00000000..d7678805 --- /dev/null +++ b/test/modules/tilesource-dynamic-url.js @@ -0,0 +1,199 @@ +/* global QUnit, testLog, Util */ + +//Testing of TileSource with getTileUrl that returns a function + +(function() { + var ASSERT = null; + var DYNAMIC_URL = ""; + var viewer = null; + var OriginalAjax = OpenSeadragon.makeAjaxRequest; + var OriginalTile = OpenSeadragon.Tile; + // These variables allow tracking when the first request for data has finished + var firstUrlPromise = null; + var isFirstUrlPromiseResolved = false; + var firstUrlPromiseResolver = null; + + /** + * Set up shared variables for test + */ + var configure = function(assert, url) { + ASSERT = assert; + DYNAMIC_URL = url; + firstUrlPromise = new Promise(resolve => { + firstUrlPromiseResolver = () => { + isFirstUrlPromiseResolved = true; + resolve(); + }; + }); + }; + + QUnit.module('TileSourceDynamicUrl', { + beforeEach: function () { + testLog.reset(); + $("#qunit-fixture").html("
"); + + // Add test tile source to OSD + OpenSeadragon.DynamicUrlTestTileSource = function(options) { + OpenSeadragon.TileSource.apply(this, [options]); + }; + + OpenSeadragon.extend( OpenSeadragon.DynamicUrlTestTileSource.prototype, OpenSeadragon.TileSource.prototype, { + supports: function(_data, url){ + return url.indexOf('dynamic') !== -1; + }, + + configure: function(_data, url, postData){ + //some default data to trigger painting + return { + postData: postData, + tilesUrl: url, + fileFormat: "jpg", + sizeData: {Width: 55, Height: 55}, + width: 55, + height: 55, + tileSize: 55, + tileOverlap: 55, + minLevel: 1, + maxLevel: 1, + displayRects: [] + }; + }, + + // getTileUrl return a function that must be called by Tile.getUrl + getTileUrl: function(_level, _x, _y) { + // Assert that custom tile source is called correctly + ASSERT.ok(true, 'DynamicUrlTileSource.getTileUrl called'); + return () => DYNAMIC_URL; + }, + + tileExists: function (_level, _x, _y) { + return true; + } + }); + + var hasCompletedImageInfoRequest = false; + OpenSeadragon.makeAjaxRequest = function(url, onSuccess, onError) { + // Note that our preferred API is that you pass in a single object; the named + // arguments are for legacy support. + if( $.isPlainObject(url)){ + onSuccess = url.success; + onError = url.error; + withCredentials = url.withCredentials; + headers = url.headers; + responseType = url.responseType || null; + postData = url.postData || null; + options = url; //save original stuff + url = url.url; + } + + //first AJAX firing is the image info getter, second is the first tile request: can exit + if (hasCompletedImageInfoRequest) { + // Assert dynamic url from tileSource is called + ASSERT.equal(url, DYNAMIC_URL, 'Called dynamic url correctly: ' + DYNAMIC_URL); + // If we've only queried for one url, resolve that promise to set up second query + // Otherwise close viewer + if (isFirstUrlPromiseResolved) { + viewer.close(); + } else { + firstUrlPromiseResolver(); + } + + return null; + } + + hasCompletedImageInfoRequest = true; + + var request = Promise.resolve(url); + //some required properties to pass through processResponse(...) + request.responseText = "some text"; + request.status = 200; + + onSuccess(request); + return request; + }; + + // Override Tile to ensure getUrl is called successfully. + var Tile = function(...params) { + OriginalTile.apply(this, params); + }; + + OpenSeadragon.extend( Tile.prototype, OpenSeadragon.Tile.prototype, { + getUrl: function() { + ASSERT.ok(true, 'Tile.getUrl called'); + return OriginalTile.prototype.getUrl.apply(this); + } + }); + OpenSeadragon.Tile = Tile; + }, + + afterEach: function () { + ASSERT = null; + + if (viewer && viewer.close) { + viewer.close(); + } + viewer = null; + + OpenSeadragon.makeAjaxRequest = OriginalAjax; + OpenSeadragon.Tile = OriginalTile; + } + }); + + + /** + * Create viewer for test + */ + var testUrlCall = function(tileSourceUrl) { + var timeWatcher = Util.timeWatcher(ASSERT, 7000); + + viewer = OpenSeadragon({ + id: 'example', + prefixUrl: '/build/openseadragon/images/', + tileSources: tileSourceUrl, + loadTilesWithAjax: true, + }); + + var failHandler = function (event) { + testPostData(event.postData, "event: 'open-failed'"); + viewer.removeHandler('open-failed', failHandler); + viewer.close(); + }; + viewer.addHandler('open-failed', failHandler); + + var readyHandler = function (event) { + //relies on Tilesource contructor extending itself with options object + testPostData(event.postData, "event: 'ready'"); + viewer.removeHandler('ready', readyHandler); + }; + viewer.addHandler('ready', readyHandler); + + + var openHandler = function(_event) { + viewer.removeHandler('open', openHandler); + ASSERT.ok(true, 'Open event was sent'); + viewer.addHandler('close', closeHandler); + viewer.world.draw(); + }; + + var closeHandler = function(_event) { + viewer.removeHandler('close', closeHandler); + $('#example').empty(); + ASSERT.ok(true, 'Close event was sent'); + timeWatcher.done(); + }; + viewer.addHandler('open', openHandler); + + return viewer; + }; + + // ---------- + QUnit.test('TileSource.getTileUrl supports returning a function', function(assert) { + configure(assert, 'dynamicUrl'); + const viewer = testUrlCall('dynamicUrl'); + firstUrlPromise.then(() => { + // after querying with first dynamic url, update the url and trigger new request + DYNAMIC_URL = 'dyanmicUrl2'; + delete viewer.world.getItemAt(0).tilesMatrix[1][0][0]; + }) + }); +})(); diff --git a/test/modules/units.js b/test/modules/units.js index 46e27ec2..9f350130 100644 --- a/test/modules/units.js +++ b/test/modules/units.js @@ -1,3 +1,4 @@ +/* eslint-disable camelcase */ /* global QUnit, $, Util, testLog */ (function () { @@ -10,6 +11,7 @@ testLog.reset(); + // eslint-disable-next-line new-cap viewer = OpenSeadragon({ id: 'unitsexample', prefixUrl: '/build/openseadragon/images/', @@ -210,13 +212,13 @@ checkPoint(assert, ' after zoom and pan'); //Restore rotation - viewer.viewport.setRotation(0, true); + viewer.viewport.setRotation(0, null, true); done(); }); viewer.viewport.zoomTo(0.8).panTo(new OpenSeadragon.Point(0.1, 0.2)); }); - viewer.viewport.setRotation(45, true); + viewer.viewport.setRotation(45, null, true); viewer.open([{ tileSource: "/test/data/testpattern.dzi" }, { diff --git a/test/modules/viewport.js b/test/modules/viewport.js index 59597060..1e4c91f8 100644 --- a/test/modules/viewport.js +++ b/test/modules/viewport.js @@ -1,4 +1,5 @@ -/* global QUnit, $, Util, testLog, console */ +/* eslint-disable new-cap */ +/* global QUnit, $, Util, testLog */ (function () { var viewer; @@ -58,7 +59,8 @@ // values for zoom levels, and reopen the viewer for each iteration. var reopenViewerHelper = function(assert, config) { var done = assert.async(); - var expected, level, actual, i = 0; + var expected, level, actual; + var i = 0; var openHandler = function(event) { var viewport = viewer.viewport; expected = config.processExpected(level, expected); @@ -245,7 +247,7 @@ function openHandler() { viewer.removeHandler('open', openHandler); var viewport = viewer.viewport; - viewport.setRotation(-675, true); + viewport.setRotation(-675, null, true); Util.assertRectangleEquals( assert, viewport.getHomeBoundsNoRotate(), @@ -267,7 +269,7 @@ function openHandler() { viewer.removeHandler('open', openHandler); var viewport = viewer.viewport; - viewport.setRotation(-675, true); + viewport.setRotation(-675, null, true); Util.assertRectangleEquals( assert, viewport.getHomeBounds(), @@ -516,7 +518,7 @@ var bounds = viewport.getBounds(); Util.assertRectangleEquals( assert, - new OpenSeadragon.Rect(-0.5, 1, 2, 2), + new OpenSeadragon.Rect(0, 1, 2, 2), bounds, EPSILON, "Viewport.applyConstraints should move viewport to the center, not to a side."); @@ -531,14 +533,14 @@ var openHandler = function() { viewer.removeHandler('open', openHandler); var viewport = viewer.viewport; - viewport.setRotation(45, true); + viewport.setRotation(45, null, true); viewport.fitBounds(new OpenSeadragon.Rect(1, 1, 1, 1), true); viewport.applyConstraints(true); var bounds = viewport.getBounds(); Util.assertRectangleEquals( assert, + new OpenSeadragon.Rect(1.2071067811865466, 0.20710678118654746, Math.sqrt(2), Math.sqrt(2), 45), bounds, - new OpenSeadragon.Rect(1, 0, Math.sqrt(2), Math.sqrt(2), 45), EPSILON, "Viewport.applyConstraints with rotation should move viewport."); @@ -555,15 +557,15 @@ var viewport = viewer.viewport; viewport.setFlip(true); - viewport.setRotation(45, true); + viewport.setRotation(45, null, true); viewport.fitBounds(new OpenSeadragon.Rect(1, 1, 1, 1), true); viewport.applyConstraints(true); var bounds = viewport.getBounds(); Util.assertRectangleEquals( assert, + new OpenSeadragon.Rect(1.2071067811865466, 0.20710678118654746, Math.sqrt(2), Math.sqrt(2), 45), bounds, - new OpenSeadragon.Rect(1, 0, Math.sqrt(2), Math.sqrt(2), 45), EPSILON, "Viewport.applyConstraints flipped and with rotation should move viewport."); @@ -657,7 +659,7 @@ var openHandler = function(event) { viewer.removeHandler('open', openHandler); var viewport = viewer.viewport; - viewport.setRotation(45, true); + viewport.setRotation(45, null, true); for(var i = 0; i < testRectsFitBounds.length; i++){ var rect = testRectsFitBounds[i]; @@ -1064,20 +1066,20 @@ var viewport = viewer.viewport; assert.propEqual(viewport.getRotation, 0, "Original rotation should be 0 degrees"); - viewport.setRotation(90, true); + viewport.setRotation(90, null, true); assert.propEqual(viewport.getRotation, 90, "Rotation should be 90 degrees"); - viewport.setRotation(-75, true); + viewport.setRotation(-75, null, true); assert.propEqual(viewport.getRotation, -75, "Rotation should be -75 degrees"); - viewport.setRotation(0, true); + viewport.setRotation(0, null, true); assert.strictEqual(viewport.getRotation(true), 0, 'viewport has default current rotation'); assert.strictEqual(viewport.getRotation(false), 0, 'viewport has default target rotation'); - viewport.setRotation(400); + viewport.setRotation(33); assert.strictEqual(viewport.getRotation(true), 0, 'current rotation is not changed'); - assert.strictEqual(viewport.getRotation(false), 400, 'target rotation is set correctly'); + assert.strictEqual(viewport.getRotation(false), 33, 'target rotation is set correctly'); - viewport.setRotation(200, true); + viewport.setRotation(200, null, true); assert.strictEqual(viewport.getRotation(true), 200, 'current rotation is set correctly'); assert.strictEqual(viewport.getRotation(false), 200, 'target rotation is set correctly'); @@ -1097,9 +1099,9 @@ viewport.setFlip(true); assert.propEqual(viewport.getRotation, 0, "Original flipped rotation should be 0 degrees"); - viewport.setRotation(90, true); + viewport.setRotation(90, null, true); assert.propEqual(viewport.getRotation, 90, "Flipped rotation should be 90 degrees"); - viewport.setRotation(-75, true); + viewport.setRotation(-75, null, true); assert.propEqual(viewport.getRotation, -75, "Flipped rotation should be -75 degrees"); done(); @@ -1116,9 +1118,9 @@ var viewport = viewer.viewport; for(var i = 0; i < testPoints.length; i++){ - var new_size = testPoints[i].times(viewer.source.dimensions.x); - viewport.resize(new_size); - assert.propEqual(viewport.getContainerSize(), new_size, "Viewport resized successfully."); + var newSize = testPoints[i].times(viewer.source.dimensions.x); + viewport.resize(newSize); + assert.propEqual(viewport.getContainerSize(), newSize, "Viewport resized successfully."); } done(); }; @@ -1272,12 +1274,12 @@ loopingTestHelper(assert, { testArray: testPoints, getOrig: function(el, viewport) { - var window_boundary = Math.min(window.innerWidth, window.innerHeight); - return el.times(window_boundary); + var windowBoundary = Math.min(window.innerWidth, window.innerHeight); + return el.times(windowBoundary); }, getExpected: function(orig, viewport) { - var pos_point = OpenSeadragon.getElementOffset(viewer.element); - return orig.minus(pos_point).divide(viewport.getContainerSize().x * ZOOM_FACTOR).plus(VIEWER_PADDING); + var posPoint = OpenSeadragon.getElementOffset(viewer.element); + return orig.minus(posPoint).divide(viewport.getContainerSize().x * ZOOM_FACTOR).plus(VIEWER_PADDING); }, method: 'windowToViewportCoordinates' }); @@ -1290,8 +1292,8 @@ return el.times(viewer.source.dimensions.x); }, getExpected: function(orig, viewport) { - var pos_point = OpenSeadragon.getElementOffset(viewer.element); - return orig.plus(pos_point).minus(VIEWER_PADDING.times(viewport.getContainerSize().x * ZOOM_FACTOR)); + var posPoint = OpenSeadragon.getElementOffset(viewer.element); + return orig.plus(posPoint).minus(VIEWER_PADDING.times(viewport.getContainerSize().x * ZOOM_FACTOR)); }, method: 'imageToWindowCoordinates' }); @@ -1301,12 +1303,12 @@ loopingTestHelper(assert, { testArray: testPoints, getOrig: function(el, viewport) { - var window_boundary = Math.min(window.innerWidth, window.innerHeight); - return el.times(window_boundary); + var windowBoundary = Math.min(window.innerWidth, window.innerHeight); + return el.times(windowBoundary); }, getExpected: function(orig, viewport) { - var pos_point = OpenSeadragon.getElementOffset(viewer.element); - return orig.minus(pos_point).divide(viewport.getContainerSize().x * ZOOM_FACTOR).plus(VIEWER_PADDING); + var posPoint = OpenSeadragon.getElementOffset(viewer.element); + return orig.minus(posPoint).divide(viewport.getContainerSize().x * ZOOM_FACTOR).plus(VIEWER_PADDING); }, method: 'windowToViewportCoordinates' }); @@ -1319,8 +1321,8 @@ return el.times(viewer.source.dimensions.x); }, getExpected: function(orig, viewport) { - var pos_point = OpenSeadragon.getElementOffset(viewer.element); - return orig.minus(VIEWER_PADDING).times(viewport.getContainerSize().x * ZOOM_FACTOR).plus(pos_point); + var posPoint = OpenSeadragon.getElementOffset(viewer.element); + return orig.minus(VIEWER_PADDING).times(viewport.getContainerSize().x * ZOOM_FACTOR).plus(posPoint); }, method: 'viewportToWindowCoordinates' }); diff --git a/test/test.html b/test/test.html index b113626d..7a1a6b1a 100644 --- a/test/test.html +++ b/test/test.html @@ -47,8 +47,9 @@ + - +