Re-introducing tileLoadingDelay.

Only use it if no native requestAnimationFrame function is available. This should improve performance on mobile devices.
This commit is contained in:
ahocevar
2012-01-29 15:15:57 +01:00
parent 8efce71271
commit 720c49c040
5 changed files with 89 additions and 6 deletions

View File

@@ -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

View File

@@ -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 <OpenLayers.Animation.isNative> 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 <deferMoveGriddedTiles> timer.
*/
moveTimerId: null,
/**
* Property: deferMoveGriddedTiles
* {Function} A function that defers execution of <moveGriddedTiles> by
* <tileLoadingDelay>. If <OpenLayers.Animation.isNative> is true, this
* is null and unused.
*/
deferMoveGriddedTiles: null,
/**
* Property: tileQueueId
* {Number} - The id of the <drawTileFromQueue> animation.
* {Number} The id of the <drawTileFromQueue> animation.
*/
tileQueueId: null,
@@ -115,7 +137,7 @@ OpenLayers.Layer.Grid = OpenLayers.Class(OpenLayers.Layer.HTTPRequest, {
* {Array(<OpenLayers.Tile>)} 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 - {<OpenLayers.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) {

View File

@@ -6,6 +6,7 @@
/**
* @requires OpenLayers/Tile.js
* @requires OpenLayers/Animation.js
*/
/**

View File

@@ -15,7 +15,8 @@
<script>
function test_all(t) {
t.plan(7);
t.plan(8);
t.ok(OpenLayers.Animation.isNative !== undefined, "isNative is set.");
t.open_window("Animation.html", function(win) {
win.requestFrame(t);
win.start(t);

View File

@@ -213,13 +213,35 @@
function test_Layer_Grid_moveTo(t) {
t.plan(13);
t.plan(17);
var origIsNative = OpenLayers.Animation.isNative;
OpenLayers.Animation.isNative = false;
var map = new OpenLayers.Map('map');
layer = new OpenLayers.Layer.WMS(name, url, params);
layer.destroy = function() {}; //we're going to do funky things with the grid
layer.applyBackBuffer = function() {}; // backbuffering isn't under test here
map.addLayer(layer);
map.setCenter([-10, 0], 5);
var log = [];
layer.deferMoveGriddedTiles = function() {
log.push("deferMoveGriddedTiles");
OpenLayers.Layer.WMS.prototype.deferMoveGriddedTiles.apply(this, arguments);
}
layer.moveGriddedTiles = function() {
log.push("moveGriddedTiles");
OpenLayers.Layer.WMS.prototype.moveGriddedTiles.apply(this, arguments);
}
map.moveTo([5, 0]);
t.eq(log[0], "moveGriddedTiles", "deferred after moveTo");
map.moveTo([0, 0]);
t.eq(log[1], "moveGriddedTiles", "deferred again after another moveTo");
t.eq(log.length, 2, "no tiles loaded yet");
t.delay_call(0.1, function() {
t.eq(log[2], "deferMoveGriddedTiles", "tiles moved after tileLoadingDelay");
});
//make sure null bounds doesnt cause script error.
// no test necessary, just action
@@ -228,7 +250,6 @@
layer.moveTo(); //checks to make sure null bounds doesnt break us
//observing globals
layer.initSingleTile = function(bounds) {
g_WhichFunc = "InitSingle";
@@ -242,6 +263,9 @@
g_WhichFunc = "MoveGridded";
g_Bounds = layer.map.getExtent();
};
layer.deferMoveGriddedTiles = function() {
g_WhichFunc = "DeferMoveGridded";
}
var clearTestBounds = function() {
g_WhichFunc = null;
g_Bounds = null;
@@ -349,6 +373,7 @@
t.ok(g_WhichFunc == "InitGridded", "if tiles drastically out of bounds, we call initGriddedTile()");
t.ok(g_Bounds.equals(b), "if tiles drastically out of bounds, we call initGriddedTile() with correct bounds");
OpenLayers.Animation.isNative = origIsNative;
}
/** THIS WOULD BE WHERE THE TESTS WOULD GO FOR