diff --git a/lib/OpenLayers/Layer/WMS/Untiled.js b/lib/OpenLayers/Layer/WMS/Untiled.js index a776f4fb08..93fa34a9e0 100644 --- a/lib/OpenLayers/Layer/WMS/Untiled.js +++ b/lib/OpenLayers/Layer/WMS/Untiled.js @@ -22,8 +22,8 @@ OpenLayers.Layer.WMS.Untiled.prototype = format: "image/jpeg" }, - /** @type DOMElement */ - imgDiv: null, + /** @type OpenLayers.Tile.Image */ + tile: null, /** @@ -62,7 +62,8 @@ OpenLayers.Layer.WMS.Untiled.prototype = * */ destroy: function() { - this.imgDiv = null; + this.tile.destroy(); + this.tile = null; OpenLayers.Layer.HTTPRequest.prototype.destroy.apply(this, arguments); }, @@ -96,7 +97,6 @@ OpenLayers.Layer.WMS.Untiled.prototype = */ setMap: function(map) { OpenLayers.Layer.HTTPRequest.prototype.setMap.apply(this, arguments); - this.loadImageDiv(); }, /** When it is not a dragging move (ie when done dragging) @@ -107,61 +107,66 @@ OpenLayers.Layer.WMS.Untiled.prototype = * @param {Boolean} dragging */ moveTo:function(bounds, zoomChanged, dragging) { - - if (!dragging || zoomChanged) { + OpenLayers.Layer.HTTPRequest.prototype.moveTo.apply(this,arguments); - if (bounds == null) { - bounds = this.map.getExtent(); + if (!bounds == null) { + bounds = this.map.getExtent(); + } + + var firstRendering = (this.tile == null); + + //does the new bounds to which we need to move fall outside of the + // current tile's bounds? + var outOfBounds = (!firstRendering && + !this.tile.bounds.containsBounds(bounds)); + + if ( zoomChanged || firstRendering || (!dragging && outOfBounds) ) { + + //clear out the old tile + if (this.tile) { + this.tile.clear(); } - - var size = this.map.getSize().clone(); - // get the url - var url = this.getFullRequestString( {BBOX: bounds.toBBOX(), - WIDTH: size.w, - HEIGHT: size.h} ); - + //determine new tile bounds + var center = bounds.getCenterLonLat(); + var tileBounds = + new OpenLayers.Bounds(center.lon - bounds.getWidth(), + center.lat - bounds.getHeight(), + center.lon + bounds.getWidth(), + center.lat + bounds.getHeight()); - // always position at upper left corner of current viewspace - var tl = new OpenLayers.Pixel(0,0); - var pos = this.map.getLayerPxFromViewPortPx(tl); + //determine new tile size + var tileSize = this.map.getSize(); + tileSize.w = tileSize.w * 2; + tileSize.h = tileSize.h * 2; - // first hide before all modifications - Element.hide(this.imgDiv); - - // update div - var img = this.imgDiv; - if (this.params.TRANSPARENT == 'true') { - OpenLayers.Util.modifyAlphaImageDiv(this.imgDiv, - null, - pos, - size, - url); - img = this.imgDiv.childNodes[0]; + //formulate request url string + var url = this.getURL(tileBounds); + + //determine new position (upper left corner of new bounds) + var ul = new OpenLayers.LonLat(tileBounds.left, tileBounds.top); + var pos = this.map.getLayerPxFromLonLat(ul); + + if (!this.tile) { + this.tile = new OpenLayers.Tile.Image(this, pos, tileBounds, + url, tileSize); + this.tile.draw(); } else { - OpenLayers.Util.modifyDOMElement(this.imgDiv, - null, - pos, - size); - this.imgDiv.src = url; - } + this.tile.moveTo(tileBounds, pos); + } - // wait until image is done loading to show again - Event.observe(img, - "load", - this.showDiv.bindAsEventListener(this)); } }, - /** Helper function that allows us to first hide the imgDiv, then make all - * the changes (position, size, url). Then when the url is done loading, - * we call this function to show the imgDiv. - * - * @private - */ - showDiv: function() { - Element.show(this.imgDiv); + getURL: function(bounds) { + var tileSize = this.map.getSize(); + tileSize.w = tileSize.w * 2; + tileSize.h = tileSize.h * 2; + return this.getFullRequestString( {'BBOX': bounds.toBBOX(), + 'WIDTH': tileSize.w, + 'HEIGHT': tileSize.h} ); }, + /** Once HTTPRequest has updated the url, reload the image div * @param {String} newUrl @@ -201,48 +206,6 @@ OpenLayers.Layer.WMS.Untiled.prototype = this, arguments); }, - /** This function first removes the previous image div, then adds a new - * one according to the transparency property. - * - * @private - */ - loadImageDiv: function() { - - var size = this.map.getSize().clone(); - var bounds = this.map.getExtent(); - - var url = ""; - if (bounds != null) { - url = this.getFullRequestString( {BBOX: bounds.toBBOX(), - WIDTH: size.w, - HEIGHT: size.h} ); - } - - //clear previous wms image (removes imgDiv) - this.div.innerHTML = ""; - - //always position at upper left corner of current viewspace - var tl = new OpenLayers.Pixel(0,0); - var pos = this.map.getLayerPxFromViewPortPx(tl); - - //create div - if (this.params.TRANSPARENT == 'true') { - this.imgDiv = OpenLayers.Util.createAlphaImageDiv(null, - pos, - size, - url, - "absolute"); - } else { - this.imgDiv = OpenLayers.Util.createImage(null, - pos, - size, - url, - "absolute"); - } - - this.div.appendChild(this.imgDiv); - }, - /** @final @type String */ CLASS_NAME: "OpenLayers.Layer.WMS.Untiled" });