ashatora/openlayers
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Made Tile.Image.IFrame an addin which will be used only if a layer is configured with the maxGetUrlLength option. This deprecates Layer.WMS.Post. r=tschaub (closes #2824)

Browse Source 
git-svn-id: http://svn.openlayers.org/trunk/openlayers@10755 dc9f47b5-9b13-0410-9fdd-eb0c1a62fdaf
This commit is contained in:
ahocevar
2010-09-16 21:54:22 +00:00
parent 1284b71bbc
commit ce90aebfd0
11 changed files with 300 additions and 224 deletions
Download Patch File Download Diff File Expand all files Collapse all files
lib/OpenLayers/Layer/Grid.js
+6
View File
@@ -25,6 +25,12 @@ OpenLayers.Layer.Grid = OpenLayers.Class(OpenLayers.Layer.HTTPRequest, {
*/
tileSize: null,
/** APIProperty: tileOptions
* {Object} optional configuration options for <OpenLayers.Tile> instances
* created by this Layer, if supported by the tile class.
*/
tileOptions: null,
/**
* Property: grid
* {Array(Array(<OpenLayers.Tile>))} This is an array of rows, each row is
lib/OpenLayers/Layer/WMS.js
+1 -1
View File
@@ -215,7 +215,7 @@ OpenLayers.Layer.WMS = OpenLayers.Class(OpenLayers.Layer.Grid, {
*/
addTile:function(bounds,position) {
return new OpenLayers.Tile.Image(this, position, bounds,
null, this.tileSize);
null, this.tileSize, this.tileOptions);
},
/**
lib/OpenLayers/Layer/WMS/Post.js
+16 -12
View File
@@ -15,17 +15,15 @@
* Web Mapping Services via HTTP-POST (application/x-www-form-urlencoded).
* Create a new WMS layer with the <OpenLayers.Layer.WMS.Post> constructor.
*
* *Deprecated*. Instead of this layer, use <OpenLayers.Layer.WMS> with
* <OpenLayers.Tile.Image.maxGetUrlLength> configured in the layer's
* <OpenLayers.Layer.WMS.tileOptions>.
*
* Inherits from:
* - <OpenLayers.Layer.WMS>
*/
OpenLayers.Layer.WMS.Post = OpenLayers.Class(OpenLayers.Layer.WMS, {
/**
* Property: tileClass
* {Object} Class, used to create tiles.
*/
tileClass: null,
/**
* APIProperty: unsupportedBrowsers
* {Array} Array with browsers, which should use the HTTP-GET protocol
@@ -46,6 +44,12 @@ OpenLayers.Layer.WMS.Post = OpenLayers.Class(OpenLayers.Layer.WMS, {
* possible to modify the initialized tiles (iframes)
*/
SUPPORTED_TRANSITIONS: [],
/**
* Property: usePost
* {Boolean}
*/
usePost: null,
/**
* Constructor: OpenLayers.Layer.WMS.Post
@@ -72,10 +76,8 @@ OpenLayers.Layer.WMS.Post = OpenLayers.Class(OpenLayers.Layer.WMS, {
newArguments.push(name, url, params, options);
OpenLayers.Layer.WMS.prototype.initialize.apply(this, newArguments);
this.tileClass = OpenLayers.Util.indexOf(
this.unsupportedBrowsers, OpenLayers.Util.getBrowserName()) != -1
? OpenLayers.Tile.Image
: OpenLayers.Tile.Image.IFrame;
this.usePost = OpenLayers.Util.indexOf(
this.unsupportedBrowsers, OpenLayers.Util.getBrowserName()) == -1;
},
/**
@@ -91,8 +93,10 @@ OpenLayers.Layer.WMS.Post = OpenLayers.Class(OpenLayers.Layer.WMS, {
* {<OpenLayers.Tile.Image.IFrame>} The added OpenLayers.Tile.Image.IFrame
*/
addTile: function(bounds,position) {
return new this.tileClass(
this, position, bounds, null, this.tileSize);
return new OpenLayers.Tile.Image(
this, position, bounds, null, this.tileSize, {
maxGetUrlLength: this.usePost ? 0 : null
});
},
CLASS_NAME: 'OpenLayers.Layer.WMS.Post'
lib/OpenLayers/Tile.js
+4 -1
View File
@@ -94,8 +94,9 @@ OpenLayers.Tile = OpenLayers.Class({
* bounds - {<OpenLayers.Bounds>}
* url - {<String>}
* size - {<OpenLayers.Size>}
* options - {Object}
*/
initialize: function(layer, position, bounds, url, size) {
initialize: function(layer, position, bounds, url, size, options) {
this.layer = layer;
this.position = position.clone();
this.bounds = bounds.clone();
@@ -106,6 +107,8 @@ OpenLayers.Tile = OpenLayers.Class({
this.id = OpenLayers.Util.createUniqueID("Tile_");
this.events = new OpenLayers.Events(this, null, this.EVENT_TYPES);
OpenLayers.Util.extend(this, options);
},
/**
lib/OpenLayers/Tile/Image.js
+74 -39
View File
@@ -76,7 +76,24 @@ OpenLayers.Tile.Image = OpenLayers.Class(OpenLayers.Tile, {
* effects when the tile is moved or changes resolution.
*/
backBufferTile: null,
/**
* APIProperty: maxGetUrlLength
* {Number} If set, requests that would result in GET urls with more
* characters than the number provided will be made using form-encoded
* HTTP POST. It is good practice to avoid urls that are longer than 2048
* characters.
*
* Caution:
* Older versions of Gecko based browsers (e.g. Firefox < 3.5) and
* Opera < 10.0 do not fully support this option.
*
* Note:
* Do not use this option for layers that have a transitionEffect
* configured - IFrame tiles from POST requests can not be resized.
*/
maxGetUrlLength: null,
/** TBD 3.0 - reorder the parameters to the init function to remove
* URL. the getUrl() function on the layer gets called on
* each draw(), so no need to specify it here.
@@ -90,9 +107,14 @@ OpenLayers.Tile.Image = OpenLayers.Class(OpenLayers.Tile, {
* bounds - {<OpenLayers.Bounds>}
* url - {<String>} Deprecated. Remove me in 3.0.
* size - {<OpenLayers.Size>}
* options - {Object}
*/
initialize: function(layer, position, bounds, url, size) {
OpenLayers.Tile.prototype.initialize.apply(this, arguments);
initialize: function(layer, position, bounds, url, size, options) {
options = options || {};
if (options.maxGetUrlLength !== null) {
OpenLayers.Util.applyDefaults(options, OpenLayers.Tile.Image.IFrame);
}
OpenLayers.Tile.prototype.initialize.apply(this, [layer, position, bounds, url, size, options]);
this.url = url; //deprecated remove me
@@ -100,7 +122,7 @@ OpenLayers.Tile.Image = OpenLayers.Class(OpenLayers.Tile, {
this.frame.style.overflow = 'hidden';
this.frame.style.position = 'absolute';
this.layerAlphaHack = this.layer.alpha && OpenLayers.Util.alphaHack();
this.layerAlphaHack = this.layer.alpha && OpenLayers.Util.alphaHack();
},
/**
@@ -109,22 +131,7 @@ OpenLayers.Tile.Image = OpenLayers.Class(OpenLayers.Tile, {
*/
destroy: function() {
if (this.imgDiv != null) {
if (this.layerAlphaHack) {
// unregister the "load" handler
OpenLayers.Event.stopObservingElement(this.imgDiv.childNodes[0]);
}
// unregister the "load" and "error" handlers. Only the "error" handler if
// this.layerAlphaHack is true.
OpenLayers.Event.stopObservingElement(this.imgDiv);
if (this.imgDiv.parentNode == this.frame) {
this.frame.removeChild(this.imgDiv);
this.imgDiv.map = null;
}
this.imgDiv.urls = null;
// abort any currently loading image
this.imgDiv.src = OpenLayers.Util.getImagesLocation() + "blank.gif";
this.removeImgDiv();
}
this.imgDiv = null;
if ((this.frame != null) && (this.frame.parentNode == this.layer.div)) {
@@ -142,7 +149,7 @@ OpenLayers.Tile.Image = OpenLayers.Class(OpenLayers.Tile, {
OpenLayers.Tile.prototype.destroy.apply(this, arguments);
},
/**
* Method: clone
*
@@ -281,13 +288,8 @@ OpenLayers.Tile.Image = OpenLayers.Class(OpenLayers.Tile, {
* position it correctly, and set its url.
*/
renderTile: function() {
if (this.imgDiv == null) {
this.initImgDiv();
}
this.imgDiv.viewRequestID = this.layer.map.viewRequestID;
if (this.layer.async) {
this.initImgDiv();
// Asyncronous image requests call the asynchronous getURL method
// on the layer to fetch an image that covers 'this.bounds', in the scope of
// 'this', setting the 'url' property of the layer itself, and running
@@ -297,12 +299,9 @@ OpenLayers.Tile.Image = OpenLayers.Class(OpenLayers.Tile, {
// syncronous image requests get the url and position the frame immediately,
// and don't wait for an image request to come back.
// needed for changing to a different server for onload error
if (this.layer.url instanceof Array) {
this.imgDiv.urls = this.layer.url.slice();
}
this.url = this.layer.getURL(this.bounds);
this.initImgDiv();
// position the frame immediately
this.positionImage();
@@ -356,10 +355,12 @@ OpenLayers.Tile.Image = OpenLayers.Class(OpenLayers.Tile, {
* Creates the imgDiv property on the tile.
*/
initImgDiv: function() {
if (this.imgDiv) {
return;
}
var offset = this.layer.imageOffset;
var size = this.layer.getImageSize(this.bounds);
if (this.layerAlphaHack) {
this.imgDiv = OpenLayers.Util.createAlphaImageDiv(null,
offset,
@@ -380,7 +381,12 @@ OpenLayers.Tile.Image = OpenLayers.Class(OpenLayers.Tile, {
null,
true);
}
// needed for changing to a different server for onload error
if (this.layer.url instanceof Array) {
this.imgDiv.urls = this.layer.url.slice();
}
this.imgDiv.className = 'olTileImage';
/* checkImgURL used to be used to called as a work around, but it
@@ -396,7 +402,7 @@ OpenLayers.Tile.Image = OpenLayers.Class(OpenLayers.Tile, {
this.layer.div.appendChild(this.frame);
if(this.layer.opacity != null) {
OpenLayers.Util.modifyDOMElement(this.imgDiv, null, null, null,
null, null, null,
this.layer.opacity);
@@ -408,7 +414,7 @@ OpenLayers.Tile.Image = OpenLayers.Class(OpenLayers.Tile, {
//bind a listener to the onload of the image div so that we
// can register when a tile has finished loading.
var onload = function() {
//normally isLoading should always be true here but there are some
// right funky conditions where loading and then reloading a tile
// with the same url *really*fast*. this check prevents sending
@@ -419,7 +425,7 @@ OpenLayers.Tile.Image = OpenLayers.Class(OpenLayers.Tile, {
this.events.triggerEvent("loadend");
}
};
if (this.layerAlphaHack) {
OpenLayers.Event.observe(this.imgDiv.childNodes[0], 'load',
OpenLayers.Function.bind(onload, this));
@@ -427,7 +433,7 @@ OpenLayers.Tile.Image = OpenLayers.Class(OpenLayers.Tile, {
OpenLayers.Event.observe(this.imgDiv, 'load',
OpenLayers.Function.bind(onload, this));
}
// Bind a listener to the onerror of the image div so that we
// can registere when a tile has finished loading with errors.
@@ -444,6 +450,35 @@ OpenLayers.Tile.Image = OpenLayers.Class(OpenLayers.Tile, {
};
OpenLayers.Event.observe(this.imgDiv, "error",
OpenLayers.Function.bind(onerror, this));
this.imgDiv.viewRequestID = this.layer.map.viewRequestID;
},
/**
* Method: removeImgDiv
* Removes the imgDiv from the DOM and stops listening to events on it.
*/
removeImgDiv: function() {
// unregister the "load" and "error" handlers. Only the "error" handler if
// this.layerAlphaHack is true.
OpenLayers.Event.stopObservingElement(this.imgDiv);
if (this.imgDiv.parentNode == this.frame) {
this.frame.removeChild(this.imgDiv);
this.imgDiv.map = null;
}
this.imgDiv.urls = null;
var child = this.imgDiv.firstChild;
//check for children (alphaHack img or IFrame)
if (child) {
OpenLayers.Event.stopObservingElement(child);
this.imgDiv.removeChild(child);
delete child;
} else {
// abort any currently loading image
this.imgDiv.src = OpenLayers.Util.getImagesLocation() + "blank.gif";
}
},
/**
lib/OpenLayers/Tile/Image/IFrame.js
+80 -90
View File
@@ -9,87 +9,49 @@
*/
/**
* Class: OpenLayers.Tile.Image.IFrame
* Instances of OpenLayers.Tile.Image.IFrame are used to manage the image tiles
* used by Layer.WMS.Post loaded via HTTP-POST-protocol. Create a new image
* tile with the <OpenLayers.Tile.Image.IFrame> constructor.
* Constant: OpenLayers.Tile.Image.IFrame
* Mixin for tiles that use form-encoded POST requests to get images from
* remote services. Images will be loaded using HTTP-POST into an IFrame.
*
* This mixin will be applied to <OpenLayers.Tile.Image> instances
* configured with <OpenLayers.Tile.Image.allowPost> or
* <OpenLayers.Tile.Image.enforcePost> set to true.
*
* Inherits from:
* - <OpenLayers.Tile.Image>
*/
OpenLayers.Tile.Image.IFrame = OpenLayers.Class(OpenLayers.Tile.Image, {
OpenLayers.Tile.Image.IFrame = {
/**
* Property: layerAlphaHack
* {Boolean} Always false for an instance.
*/
/**
* Constructor: OpenLayers.Tile.Image.IFrame
* Constructor for a new <OpenLayers.Tile.Image.IFrame> instance.
*
* Parameters:
* layer - {<OpenLayers.Layer>} layer that the tile will go in.
* position - {<OpenLayers.Pixel>}
* bounds - {<OpenLayers.Bounds>}
* size - {<OpenLayers.Size>}
*/
initialize: function(layer, position, bounds, url, size) {
OpenLayers.Tile.Image.prototype.initialize.apply(this, arguments);
this.layerAlphaHack = false;
},
/**
* Method: destroy
* nullify references to prevent circular references and memory leaks
*/
destroy: function() {
if(this.imgDiv != null) {
// unregister the "load" handler
OpenLayers.Event.stopObservingElement(this.imgDiv.firstChild);
}
OpenLayers.Tile.Image.prototype.destroy.apply(this, arguments);
},
* Property: useIFrame
* {Boolean} true if we are currently using an IFrame to render POST
* responses, false if we are using an img element to render GET responses.
*/
useIFrame: null,
/**
* Method: clear
* Removes the iframe from DOM (avoids back-button problems).
*/
clear: function() {
if(this.imgDiv) {
var iFrame = this.imgDiv.firstChild;
OpenLayers.Event.stopObservingElement(iFrame);
this.imgDiv.removeChild(iFrame);
if (this.useIFrame) {
if (this.imgDiv) {
var iFrame = this.imgDiv.firstChild;
OpenLayers.Event.stopObservingElement(iFrame);
this.imgDiv.removeChild(iFrame);
delete iFrame;
}
} else {
OpenLayers.Tile.Image.prototype.clear.apply(this, arguments)
}
},
/**
* Method: clone
*
* Parameters:
* obj - {<OpenLayers.Tile.Image.IFrame>} The tile to be cloned
*
* Returns:
* {<OpenLayers.Tile.Image.IFrame>} An exact clone of this
* <OpenLayers.Tile.Image.IFrame>
*/
clone: function (obj) {
if (obj == null) {
obj = new OpenLayers.Tile.Image.IFrame(
this.layer, this.position, this.bounds, this.url, this.size);
}
//pick up properties from superclass
obj = OpenLayers.Tile.Image.prototype.clone.apply(this, [obj]);
return obj;
},
/**
* Method: renderTile
*/
renderTile: function() {
if(OpenLayers.Tile.Image.prototype.renderTile.apply(this, arguments)) {
if (OpenLayers.Tile.Image.prototype.renderTile.apply(this, arguments) &&
this.useIFrame) {
// create a html form and add it temporary to the layer div
var form = this.createRequestForm();
this.imgDiv.appendChild(form);
@@ -97,7 +59,9 @@ OpenLayers.Tile.Image.IFrame = OpenLayers.Class(OpenLayers.Tile.Image, {
// submit the form (means fetching the image)
form.submit();
this.imgDiv.removeChild(form);
delete form;
}
return true;
},
/**
@@ -105,24 +69,57 @@ OpenLayers.Tile.Image.IFrame = OpenLayers.Class(OpenLayers.Tile.Image, {
* Creates the imgDiv property on the tile.
*/
initImgDiv: function() {
this.imgDiv = this.createImgDiv();
OpenLayers.Util.modifyDOMElement(this.imgDiv, this.id, null,
this.layer.getImageSize(), "relative");
this.imgDiv.className = 'olTileImage';
this.frame.appendChild(this.imgDiv);
this.layer.div.appendChild(this.frame);
if(this.layer.opacity != null) {
OpenLayers.Util.modifyDOMElement(this.imgDiv, null, null, null,
null, null, null,
this.layer.opacity);
this.useIFrame = this.maxGetUrlLength !== null && !this.layer.async &&
this.url.length > this.maxGetUrlLength;
if (this.imgDiv != null) {
var nodeName = this.imgDiv.nodeName.toLowerCase();
if ((this.useIFrame && nodeName == "img") ||
(!this.useIFrame && nodeName == "div")) {
// switch between get and post
this.removeImgDiv();
delete this.imgDiv;
} else {
return;
}
}
if (this.useIFrame) {
var eventPane = document.createElement("div");
// we need this reference to check back the viewRequestID
this.imgDiv.map = this.layer.map;
if(OpenLayers.Util.getBrowserName() == "msie") {
// IE cannot handle events on elements without backgroundcolor. So we
// use this little hack to make elements transparent
eventPane.style.backgroundColor = '#FFFFFF';
eventPane.style.filter = 'chroma(color=#FFFFFF)';
}
OpenLayers.Util.modifyDOMElement(eventPane, null,
new OpenLayers.Pixel(0,0), this.layer.getImageSize(), "absolute");
this.imgDiv = document.createElement("div");
this.imgDiv.appendChild(eventPane);
OpenLayers.Util.modifyDOMElement(this.imgDiv, this.id, null,
this.layer.getImageSize(), "relative");
this.imgDiv.className = 'olTileImage';
this.frame.appendChild(this.imgDiv);
this.layer.div.appendChild(this.frame);
if(this.layer.opacity != null) {
OpenLayers.Util.modifyDOMElement(this.imgDiv, null, null, null,
null, null, null,
this.layer.opacity);
}
// we need this reference to check back the viewRequestID
this.imgDiv.map = this.layer.map;
this.imgDiv.viewRequestID = this.layer.map.viewRequestID;
} else {
OpenLayers.Tile.Image.prototype.initImgDiv.apply(this, arguments);
}
},
/**
@@ -238,13 +235,9 @@ OpenLayers.Tile.Image.IFrame = OpenLayers.Class(OpenLayers.Tile.Image, {
// adding all parameters in layer params as hidden fields to the html
// form element
var imageSize = this.layer.getImageSize();
var params = OpenLayers.Util.extend(
{
"BBOX": this.encodeBBOX ? this.bounds.toBBOX() :
this.bounds.toArray(),
"WIDTH": imageSize.w,
"HEIGHT": imageSize.h
}, this.layer.params);
var params = OpenLayers.Util.getParameters(
this.url.substr(this.layer.url.length)
);
for(var par in params) {
var field = document.createElement('input');
@@ -255,8 +248,5 @@ OpenLayers.Tile.Image.IFrame = OpenLayers.Class(OpenLayers.Tile.Image, {
}
return form;
},
CLASS_NAME: "OpenLayers.Tile.Image.IFrame"
}
);
}
}