Merge pull request #127 from elemoine/tile-fade-in

CSS-based tile animation
This commit is contained in:
Éric Lemoine
2012-01-17 21:06:11 -08:00
14 changed files with 261 additions and 126 deletions
+30 -5
View File
@@ -145,6 +145,14 @@ OpenLayers.Layer.Grid = OpenLayers.Class(OpenLayers.Layer.HTTPRequest, {
*/
backBufferLonLat: null,
/**
* Property; backBufferTimerId
* {Number} The id of the back buffer timer. This timer is used to
* delay the removal of the back buffer, thereby preventing
* flash effects caused by tile animation.
*/
backBufferTimerId: null,
/**
* Register a listener for a particular event with the following syntax:
* (code)
@@ -197,6 +205,10 @@ OpenLayers.Layer.Grid = OpenLayers.Class(OpenLayers.Layer.HTTPRequest, {
window.clearTimeout(this.timerId);
this.timerId = null;
}
if(this.backBufferTimerId !== null) {
window.clearTimeout(this.backBufferTimerId);
this.backBufferTimerId = null;
}
},
/**
@@ -204,9 +216,8 @@ OpenLayers.Layer.Grid = OpenLayers.Class(OpenLayers.Layer.HTTPRequest, {
* Deconstruct the layer and clear the grid.
*/
destroy: function() {
this.removeBackBuffer();
this.clearGrid();
// clearGrid should remove any back buffer from the layer,
// so no need to call removeBackBuffer here
this.grid = null;
this.tileSize = null;
@@ -455,6 +466,9 @@ OpenLayers.Layer.Grid = OpenLayers.Class(OpenLayers.Layer.HTTPRequest, {
* resolution - {Number} The resolution to transition to.
*/
applyBackBuffer: function(resolution) {
if(this.backBufferTimerId !== null) {
this.removeBackBuffer();
}
var backBuffer = this.backBuffer;
if(!backBuffer) {
backBuffer = this.createBackBuffer();
@@ -530,10 +544,14 @@ OpenLayers.Layer.Grid = OpenLayers.Class(OpenLayers.Layer.HTTPRequest, {
* Remove back buffer from DOM.
*/
removeBackBuffer: function() {
if(this.backBuffer && this.backBuffer.parentNode) {
if(this.backBuffer) {
this.div.removeChild(this.backBuffer);
this.backBuffer = null;
this.backBufferResolution = null;
if(this.backBufferTimerId !== null) {
window.clearTimeout(this.backBufferTimerId);
this.backBufferTimerId = null;
}
}
},
@@ -937,8 +955,15 @@ OpenLayers.Layer.Grid = OpenLayers.Class(OpenLayers.Layer.HTTPRequest, {
//if that was the last tile, then trigger a 'loadend' on the layer
if (this.numLoadingTiles == 0) {
this.events.triggerEvent("loadend");
this.removeBackBuffer();
}
if(this.backBuffer) {
// the removal of the back buffer is delayed to prevent flash
// effects due to the animation of tile displaying
this.backBufferTimerId = window.setTimeout(
OpenLayers.Function.bind(this.removeBackBuffer, this),
2500
);
}
}
};
tile.events.register("loadend", this, tile.onLoadEnd);
tile.events.register("unload", this, tile.onLoadEnd);