From 720c49c040c6feab997ceabd8e4633f7013cec0e Mon Sep 17 00:00:00 2001 From: ahocevar Date: Sun, 29 Jan 2012 15:15:57 +0100 Subject: [PATCH] Re-introducing tileLoadingDelay. Only use it if no native requestAnimationFrame function is available. This should improve performance on mobile devices. --- lib/OpenLayers/Animation.js | 11 ++++++++ lib/OpenLayers/Layer/Grid.js | 51 +++++++++++++++++++++++++++++++++--- lib/OpenLayers/Tile/Image.js | 1 + tests/Animation.html | 3 ++- tests/Layer/Grid.html | 29 ++++++++++++++++++-- 5 files changed, 89 insertions(+), 6 deletions(-) diff --git a/lib/OpenLayers/Animation.js b/lib/OpenLayers/Animation.js index 66edc2ec5d..1a1f906321 100644 --- a/lib/OpenLayers/Animation.js +++ b/lib/OpenLayers/Animation.js @@ -15,6 +15,16 @@ */ OpenLayers.Animation = (function(window) { + /** + * Property: isNative + * {Boolean} true if a native requestAnimationFrame function is available + */ + var isNative = !!(window.requestAnimationFrame || + window.webkitRequestAnimationFrame || + window.mozRequestAnimationFrame || + window.oRequestAnimationFrame || + window.msRequestAnimationFrame); + /** * Function: requestFrame * Schedule a function to be called at the next available animation frame. @@ -89,6 +99,7 @@ OpenLayers.Animation = (function(window) { } return { + isNative: isNative, requestFrame: requestFrame, start: start, stop: stop diff --git a/lib/OpenLayers/Layer/Grid.js b/lib/OpenLayers/Layer/Grid.js index fdffa7106b..f4cc52ba38 100644 --- a/lib/OpenLayers/Layer/Grid.js +++ b/lib/OpenLayers/Layer/Grid.js @@ -97,6 +97,14 @@ OpenLayers.Layer.Grid = OpenLayers.Class(OpenLayers.Layer.HTTPRequest, { */ numLoadingTiles: 0, + /** + * APIProperty: tileLoadingDelay + * {Integer} Number of milliseconds before we shift and load + * tiles when panning. Ignored if is + * true. Default is 85. + */ + tileLoadingDelay: 85, + /** * Property: serverResolutions * {Array(Number}} This property is documented in subclasses as @@ -104,9 +112,23 @@ OpenLayers.Layer.Grid = OpenLayers.Class(OpenLayers.Layer.HTTPRequest, { */ serverResolutions: null, + /** + * Property: moveTimerId + * {Number} The id of the timer. + */ + moveTimerId: null, + + /** + * Property: deferMoveGriddedTiles + * {Function} A function that defers execution of by + * . If is true, this + * is null and unused. + */ + deferMoveGriddedTiles: null, + /** * Property: tileQueueId - * {Number} - The id of the animation. + * {Number} The id of the animation. */ tileQueueId: null, @@ -115,7 +137,7 @@ OpenLayers.Layer.Grid = OpenLayers.Class(OpenLayers.Layer.HTTPRequest, { * {Array()} Tiles queued for drawing. */ tileQueue: null, - + /** * Property: backBuffer * {DOMElement} The back buffer. @@ -187,6 +209,13 @@ OpenLayers.Layer.Grid = OpenLayers.Class(OpenLayers.Layer.HTTPRequest, { arguments); this.grid = []; this.tileQueue = []; + + if (!OpenLayers.Animation.isNative) { + this.deferMoveGriddedTiles = OpenLayers.Function.bind(function() { + this.moveGriddedTiles(true); + this.moveTimerId = null; + }, this); + } }, /** @@ -197,6 +226,9 @@ OpenLayers.Layer.Grid = OpenLayers.Class(OpenLayers.Layer.HTTPRequest, { * map - {} The map. */ removeMap: function(map) { + if (this.moveTimerId !== null) { + window.clearTimeout(this.moveTimerId); + } this.clearTileQueue(); if(this.backBufferTimerId !== null) { window.clearTimeout(this.backBufferTimerId); @@ -984,8 +1016,21 @@ OpenLayers.Layer.Grid = OpenLayers.Class(OpenLayers.Layer.HTTPRequest, { /** * Method: moveGriddedTiles + * + * Parameter: + * deferred - {Boolean} true if this is a deferred call that should not + * be delayed. */ - moveGriddedTiles: function() { + moveGriddedTiles: function(deferred) { + if (!deferred && !OpenLayers.Animation.isNative) { + if (this.moveTimerId != null) { + window.clearTimeout(this.moveTimerId); + } + this.moveTimerId = window.setTimeout( + this.deferMoveGriddedTiles, this.tileLoadingDelay + ); + return; + } var buffer = this.buffer || 1; var scale = this.getResolutionScale(); while(true) { diff --git a/lib/OpenLayers/Tile/Image.js b/lib/OpenLayers/Tile/Image.js index 54e869a191..596e6d356a 100644 --- a/lib/OpenLayers/Tile/Image.js +++ b/lib/OpenLayers/Tile/Image.js @@ -6,6 +6,7 @@ /** * @requires OpenLayers/Tile.js + * @requires OpenLayers/Animation.js */ /** diff --git a/tests/Animation.html b/tests/Animation.html index 7215284ae7..75cd4434f8 100644 --- a/tests/Animation.html +++ b/tests/Animation.html @@ -15,7 +15,8 @@