From 24be6a52edb0bc375f935c0e4891b56b32a68526 Mon Sep 17 00:00:00 2001 From: Larissa Smith Date: Thu, 20 Aug 2015 10:25:57 -0600 Subject: [PATCH 1/4] Added autoRefigureSizes flag for disabling calls to _figureSizes during bounds-change event handlers. This improves performance when a lot of bounds-change events are fired in quick succession. Used flag to optimize world._arrange. --- src/world.js | 20 +++++++++++++++++++- 1 file changed, 19 insertions(+), 1 deletion(-) diff --git a/src/world.js b/src/world.js index 73b28a67..4cfe76ce 100644 --- a/src/world.js +++ b/src/world.js @@ -52,8 +52,11 @@ $.World = function( options ) { this.viewer = options.viewer; this._items = []; this._needsDraw = false; + this._autoRefigureSizes = true; this._delegatedFigureSizes = function(event) { - _this._figureSizes(); + if (this._autoRefigureSizes) { + _this._figureSizes(); + } }; this._figureSizes(); @@ -275,6 +278,17 @@ $.extend( $.World.prototype, $.EventSource.prototype, /** @lends OpenSeadragon.W return this._contentFactor; }, + /** + * As a performance optimization, setting this flag to false allows the bounds-change event handler + * on tiledImages to skip calls to _figureSizes. If a lot of images are going to be positioned in + * rapid succession, this is a good idea. _figuresSizes only needs to be called once when the + * positioning is done. + * @param {Boolean} [value] The value to which to set autoRefigureSizes. + */ + setAutoRefigureSizes: function(value) { + this._autoRefigureSizes = value; + }, + /** * Arranges all of the TiledImages with the specified settings. * @param {Object} options - Specifies how to arrange. @@ -304,6 +318,8 @@ $.extend( $.World.prototype, $.EventSource.prototype, /** @lends OpenSeadragon.W var x = 0; var y = 0; var item, box, width, height, position; + + this.setAutoRefigureSizes(false); for (var i = 0; i < this._items.length; i++) { if (i && (i % wrap) === 0) { if (layout === 'horizontal') { @@ -336,6 +352,8 @@ $.extend( $.World.prototype, $.EventSource.prototype, /** @lends OpenSeadragon.W y += increment; } } + this.setAutoRefigureSizes(true); + this._figureSizes(); }, // private From 2c6dfb1b0b0eb56cdbe67d0e5f8a10ceccc445b9 Mon Sep 17 00:00:00 2001 From: Larissa Smith Date: Tue, 1 Sep 2015 10:48:41 -0600 Subject: [PATCH 2/4] Changed this to _this and added documentation on setAutoRefigureSizes. --- src/world.js | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/src/world.js b/src/world.js index 4cfe76ce..c272ff14 100644 --- a/src/world.js +++ b/src/world.js @@ -54,7 +54,7 @@ $.World = function( options ) { this._needsDraw = false; this._autoRefigureSizes = true; this._delegatedFigureSizes = function(event) { - if (this._autoRefigureSizes) { + if (_this._autoRefigureSizes) { _this._figureSizes(); } }; @@ -282,7 +282,8 @@ $.extend( $.World.prototype, $.EventSource.prototype, /** @lends OpenSeadragon.W * As a performance optimization, setting this flag to false allows the bounds-change event handler * on tiledImages to skip calls to _figureSizes. If a lot of images are going to be positioned in * rapid succession, this is a good idea. _figuresSizes only needs to be called once when the - * positioning is done. + * positioning is done. _autoRefigureSizes should be set back to true when finished, or the system + * may behave oddly, * @param {Boolean} [value] The value to which to set autoRefigureSizes. */ setAutoRefigureSizes: function(value) { From 60f114daf1892341d32d2d4c16b81ad9845fa752 Mon Sep 17 00:00:00 2001 From: Larissa Smith Date: Fri, 11 Sep 2015 15:35:36 -0600 Subject: [PATCH 3/4] If autoRefigureSizes is set to true and bounds-change events have been skipped, call _figureSizes automatically. --- src/world.js | 13 +++++++++---- 1 file changed, 9 insertions(+), 4 deletions(-) diff --git a/src/world.js b/src/world.js index c272ff14..84c28c31 100644 --- a/src/world.js +++ b/src/world.js @@ -53,9 +53,12 @@ $.World = function( options ) { this._items = []; this._needsDraw = false; this._autoRefigureSizes = true; + this._needsSizesFigured = false; this._delegatedFigureSizes = function(event) { if (_this._autoRefigureSizes) { _this._figureSizes(); + } else { + _this._needsSizesFigured = true; } }; @@ -281,13 +284,16 @@ $.extend( $.World.prototype, $.EventSource.prototype, /** @lends OpenSeadragon.W /** * As a performance optimization, setting this flag to false allows the bounds-change event handler * on tiledImages to skip calls to _figureSizes. If a lot of images are going to be positioned in - * rapid succession, this is a good idea. _figuresSizes only needs to be called once when the - * positioning is done. _autoRefigureSizes should be set back to true when finished, or the system - * may behave oddly, + * rapid succession, this is a good idea. _autoRefigureSizes should be set back to true when finished, + * or the system may behave oddly, * @param {Boolean} [value] The value to which to set autoRefigureSizes. */ setAutoRefigureSizes: function(value) { this._autoRefigureSizes = value; + if (value & this._needsSizesFigured) { + this._figureSizes(); + this._needsSizesFigured = false; + } }, /** @@ -354,7 +360,6 @@ $.extend( $.World.prototype, $.EventSource.prototype, /** @lends OpenSeadragon.W } } this.setAutoRefigureSizes(true); - this._figureSizes(); }, // private From 3fd51d81d7b60fce3d58f215870b5aabd95c7c19 Mon Sep 17 00:00:00 2001 From: Larissa Smith Date: Mon, 14 Sep 2015 16:14:32 -0600 Subject: [PATCH 4/4] Updated comments on setAutoRefigureSizes to eliminate reference to private variables and functions. --- src/world.js | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/src/world.js b/src/world.js index 84c28c31..277a6068 100644 --- a/src/world.js +++ b/src/world.js @@ -283,10 +283,10 @@ $.extend( $.World.prototype, $.EventSource.prototype, /** @lends OpenSeadragon.W /** * As a performance optimization, setting this flag to false allows the bounds-change event handler - * on tiledImages to skip calls to _figureSizes. If a lot of images are going to be positioned in - * rapid succession, this is a good idea. _autoRefigureSizes should be set back to true when finished, - * or the system may behave oddly, - * @param {Boolean} [value] The value to which to set autoRefigureSizes. + * on tiledImages to skip calculations on the world bounds. If a lot of images are going to be positioned in + * rapid succession, this is a good idea. When finished, setAutoRefigureSizes should be called with true + * or the system may behave oddly. + * @param {Boolean} [value] The value to which to set the flag. */ setAutoRefigureSizes: function(value) { this._autoRefigureSizes = value;