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

Tile.Image improvements and partial rewrite. Thanks erilem for the excellent collaboration during the review phase. p=me,erilem r=erilem (closes #3419)

Browse Source 
git-svn-id: http://svn.openlayers.org/trunk/openlayers@12241 dc9f47b5-9b13-0410-9fdd-eb0c1a62fdaf
This commit is contained in:
ahocevar
2011-08-13 00:59:01 +00:00
parent a8d3d6a5b4
commit 23c9092201
14 changed files with 737 additions and 792 deletions
Download Patch File Download Diff File Expand all files Collapse all files
tests/Layer/WMS/Post.html
+3 -2
View File
@@ -73,8 +73,9 @@
});
map.addLayer(layer);
var tile2 = layer.addTile(bounds, pixel);
t.ok(
tile2.createIFrame,
tile2.draw();
t.eq(
tile2.useIFrame, true,
"supported browser: tile is created with the Tile.Image.IFrame mixin");
map.destroy();
}
tests/Tile.html
-26
View File
@@ -31,32 +31,6 @@
t.ok( tile.events != null, "tile's events intitialized");
}
function test_Tile_clone (t) {
t.plan( 10 );
var layer = {}; // bogus layer
var position = new OpenLayers.Pixel(10,20);
var bounds = new OpenLayers.Bounds(1,2,3,4);
var url = "bobob";
var size = new OpenLayers.Size(5,6);
tile = new OpenLayers.Tile(layer, position, bounds, url, size);
var clone = tile.clone();
t.ok( clone instanceof OpenLayers.Tile, "OpenLayers.Tile.clone returns Tile object" );
t.eq( clone.layer, layer, "clone.layer set correctly");
t.ok( clone.position.equals(position), "clone.position set correctly");
t.ok( clone.bounds.equals(bounds), "clone.bounds set correctly");
t.eq( clone.url, url, "clone.url set correctly");
t.ok( clone.size.equals(size), "clone.size is set correctly" );
t.ok( clone.id != null, "clone is given an id");
t.ok( clone.id != tile.id, "clone is given a new id");
t.ok(OpenLayers.String.startsWith(clone.id, "Tile_"),
"clone's id starts correctly");
t.ok( clone.events != null, "clone's events intitialized");
}
function test_Tile_destroy(t) {
t.plan( 6 );
tests/Tile/BackBufferable.html
+114
View File
@@ -0,0 +1,114 @@
<html>
<head>
<script src="../OLLoader.js"></script>
<script type="text/javascript">
var tile;
var layer = new OpenLayers.Layer.WMS(
"WMS",
window.location.href + "#",
null,
{transitionEffect: "resize"});
var position = new OpenLayers.Pixel(20,30);
var bounds = new OpenLayers.Bounds(1,2,3,4);
function test_initialize (t) {
t.plan(2);
tile = new OpenLayers.Tile.Image(layer, position, bounds, null);
t.eq(tile.backBufferData, {}, "back buffer data initialized");
t.eq(tile.size.w, 256, "size object with default width created");
}
function test_backBufferMode(t) {
t.plan(4);
var l;
l = new OpenLayers.Layer.WMS('', window.location.href + '#');
tile = new OpenLayers.Tile.Image(l, position, bounds, null);
t.eq(tile.backBufferMode, 0,
'backBufferMode correctly set [tiled]');
l = new OpenLayers.Layer.WMS('', window.location.href + '#',
null, {singleTile: true});
tile = new OpenLayers.Tile.Image(l, position, bounds, null);
t.eq(tile.backBufferMode, 1,
'backBufferMode correctly set [singleTile]');
l = new OpenLayers.Layer.WMS('', window.location.href + '#',
null, {transitionEffect: 'resize'});
tile = new OpenLayers.Tile.Image(l, position, bounds, null);
t.eq(tile.backBufferMode, 2,
'backBufferMode correctly set [tiled, transition]');
l = new OpenLayers.Layer.WMS('', window.location.href + '#',
null, {singleTile: true,
transitionEffect: 'resize'});
tile = new OpenLayers.Tile.Image(l, position, bounds, null);
t.eq(tile.backBufferMode, 3,
'backBufferMode correctly set [singleTile, transition]');
}
function test_setBackBufferData(t) {
t.plan(2);
var map = new OpenLayers.Map("map");
map.addLayer(layer);
map.zoomToMaxExtent();
tile = new OpenLayers.Tile.Image(layer, position, bounds, null);
tile.draw();
// moveTo calls setBackBufferData
tile.moveTo(new OpenLayers.Bounds(1,2,3,4),
new OpenLayers.Pixel(30,40), true);
t.eq(tile.backBufferData.bounds.toString(), bounds.toString(),
"bounds stored correctly");
t.eq(tile.backBufferData.resolution, map.getResolution(),
"resolution stored correctly");
map.removeLayer(layer);
map.destroy();
}
function test_updateBackBuffer(t) {
t.plan(1);
var map = new OpenLayers.Map("map");
map.addLayer(layer);
map.zoomToMaxExtent();
tile = new OpenLayers.Tile.Image(layer, position, bounds, null);
tile.draw();
tile.isLoading = false;
map.zoomIn();
tile.updateBackBuffer();
t.eq(tile.backBufferData.tile.style.width, (layer.tileSize.w*2)+"px",
"backBuffer frame correctly resized");
map.removeLayer(layer);
map.destroy();
}
function test_removeBackBuffer(t) {
t.plan(2);
var map = new OpenLayers.Map("map");
map.addLayer(layer);
map.zoomToMaxExtent();
tile = new OpenLayers.Tile.Image(layer, position, bounds, null);
tile.draw();
tile.isLoading = false;
map.zoomIn();
tile.updateBackBuffer();
var backBuffer = tile.backBufferData.tile;
tile.removeBackBuffer();
t.eq(tile.backBufferData.tile, null,
"backBuffer reference removed");
t.ok(backBuffer.parentNode !== layer.div,
"backBuffer removed from layer");
map.removeLayer(layer);
map.destroy();
}
</script>
</head>
<body>
<div id="map" style="height:550px;width:500px"></div>
</body>
</html>
tests/Tile/Image.html
+30 -35
View File
@@ -62,38 +62,16 @@
map.destroy();
}
function test_Tile_Image_clone (t) {
t.plan( 9 );
var layer = new OpenLayers.Layer.WMS( "OpenLayers WMS",
"http://labs.metacarta.com/wms/vmap0?", {layers: 'basic'});
var position = new OpenLayers.Pixel(20,30);
var bounds = new OpenLayers.Bounds(1,2,3,4);
var url = "http://www.openlayers.org/dev/tests/tileimage";
var size = new OpenLayers.Size(5,6);
tile = new OpenLayers.Tile.Image(layer, position, bounds, url, size);
tile.imgDiv = {};
var clone = tile.clone();
t.ok( clone instanceof OpenLayers.Tile.Image, "OpenLayers.Tile.clone returns Tile.Image object" );
t.ok( clone.layer == layer, "clone.layer is set correctly");
t.ok( clone.position.equals(position), "clone.position is set correctly");
t.ok( clone.bounds.equals(bounds), "clone.bounds is set correctly");
t.eq( clone.url, url, "clone.url is set correctly");
t.ok( clone.size.equals(size), "clone.size is set correctly");
t.ok( clone.frame, "clone has a frame");
t.ok( clone.frame != tile.frame, "clone's frame is a new one");
t.ok( clone.imgDiv == null, "clone's imgDiv was not copied");
}
function test_Tile_Image_IFrame_viewRequestID (t) {
t.plan( 2 );
function test_Tile_Image_async (t) {
t.plan( 3 );
var map = new OpenLayers.Map('map');
var layer = new OpenLayers.Layer.WMS(
"Name",
"http://labs.metacarta.com/TESTURL?",
{layers: 'basic'}
{layers: 'basic'}, {async: true, getURLasync: function(bounds, scope, url, callback) {
scope.url = this.getURL(bounds);
callback.call(scope);
}}
);
map.addLayer(layer);
@@ -101,10 +79,10 @@
var bounds = new OpenLayers.Bounds(1,2,3,4);
tile = layer.addTile(bounds, position);
tile.renderTile();
t.eq(tile.imgDiv.viewRequestID, map.viewRequestID, "viewRequestID correct after renderTile");
map.viewRequestID++;
t.eq(tile.imgDiv.src, layer.getURL(bounds), "image src correct for async request");
t.eq(tile.asyncRequestId, 1, "asyncRequestId correct after renderTile");
tile.renderTile();
t.eq(tile.imgDiv.viewRequestID, map.viewRequestID, "viewRequestID correct after subsequent renderTile");
t.eq(tile.asyncRequestId, 2, "asyncRequestId correct after subsequent renderTile");
tile.destroy();
layer.destroy();
map.destroy();
@@ -156,8 +134,8 @@
t.eq( img.src,
"http://labs.metacarta.com/TESTURL?" + OpenLayers.Util.getParameterString(tParams),
"tile.draw creates an image");
t.eq( tile.imgDiv.style.width, "5px", "Image width is correct" );
t.eq( tile.imgDiv.style.height, "6px", "Image height is correct" );
t.eq( tile.imgDiv.style.width, "100%", "Image width is correct" );
t.eq( tile.imgDiv.style.height, "100%", "Image height is correct" );
// this should trigger a "reload" event (since the image never actually
// loads in tests)
@@ -260,14 +238,14 @@
tile = new OpenLayers.Tile.Image(layer, position, new OpenLayers.Bounds(-90,-85,-90,85), url, size);
tile.draw();
tile.moveTo(new OpenLayers.Bounds(-185,-90,-180,-80), new OpenLayers.Pixel(-180,-85), true);
t.delay_call( 1, function() { t.eq(tile.imgDiv, null, "Tile imgDiv is null.") } );
t.delay_call( 1, function() { t.eq(tile.imgDiv.style.display, "none", "Tile image is invisible.") } );
var layer = new OpenLayers.Layer.WMS( "OpenLayers WMS",
"http://labs.metacarta.com/wms/vmap0?", {layers: 'basic'}, {'reproject': true, 'alpha':true});
map.addLayer(layer);
tile = new OpenLayers.Tile.Image(layer, position, new OpenLayers.Bounds(-90,-85,-90,85), url, size);
tile.draw();
tile.moveTo(new OpenLayers.Bounds(-185,-90,-180,-80), new OpenLayers.Pixel(-180,-85), true)
t.delay_call( 1, function() { t.eq(tile.imgDiv, null, "Alpha tile imgDiv is null.") } );
t.delay_call( 1, function() { t.eq(tile.imgDiv.style.display, "none", "Alpha tile image is invisible.") } );
}
@@ -316,6 +294,23 @@
map.destroy();
}
function test_createBackBuffer(t) {
t.plan(3);
var map = new OpenLayers.Map('map');
var layer = new OpenLayers.Layer.WMS( "OpenLayers WMS",
"http://labs.metacarta.com/wms/vmap0?", {layers: 'basic'});
map.addLayer(layer);
map.setCenter(new OpenLayers.LonLat(0,0), 5);
var tile = layer.grid[0][0];
var img = tile.imgDiv;
var backBuffer = tile.createBackBuffer();
t.eq(backBuffer.style.left, tile.frame.style.left, "backBuffer tile has same left style as frame");
t.ok(backBuffer.firstChild === img, "image appended to backBuffer");
t.ok(tile.imgDiv == null, "image reference removed from tile");
map.destroy();
}
</script>
</head>
<body>
tests/Tile/Image/IFrame.html
+36 -54
View File
@@ -15,26 +15,29 @@
var wmsUrl = "http://labs.metacarta.com/wms/vmap0?";
function test_Tile_Image_IFrame_create (t) {
t.plan( 3 );
t.plan( 5 );
map = new OpenLayers.Map('map');
var bar = new Array(205).join("1234567890");
layer = new OpenLayers.Layer.WMS(name, wmsUrl, {layers: 'basic', foo: bar}, {tileOptions: {maxGetUrlLength: 2048}});
layer = new OpenLayers.Layer.WMS(name, wmsUrl,
{layers: 'basic', foo: bar},
{tileOptions: {maxGetUrlLength: 2048},
transitionEffect: 'resize'});
map.addLayer(layer);
var tile = layer.addTile(bounds, position);
tile.renderTile();
tile.positionImage();
t.eq(tile.imgDiv.firstChild.nodeName.toLowerCase(), "iframe", "IFrame used for long URL");
t.eq(tile.backBufferMode, 2, "backBufferMode is 2 after tile creation");
tile.draw();
t.eq(tile.imgDiv.nodeName.toLowerCase(), "iframe", "IFrame used for long URL");
layer.mergeNewParams({foo: null});
tile.renderTile();
tile.positionImage();
tile.draw();
t.eq(tile.imgDiv.nodeName.toLowerCase(), "img", "IMG used for short URL");
t.eq(tile.backBufferMode, 2, "backBufferMode reset to 2");
tile.maxGetUrlLength = 0;
tile.renderTile();
tile.positionImage();
t.eq(tile.imgDiv.firstChild.nodeName.toLowerCase(), "iframe", "IFrame used when maxGetUrlLength is 0");
tile.draw();
t.eq(tile.imgDiv.nodeName.toLowerCase(), "iframe", "IFrame used when maxGetUrlLength is 0");
tile.destroy();
layer.destroy();
@@ -52,22 +55,22 @@
tile.clear();
t.eq(
tile.imgDiv.firstChild.nodeName.toLowerCase(), "div",
"IFrame successfully removed from DOM");
tile.frame.getElementsByTagName("iframe").length, 0,
"IFrame removed on clear()");
tile.destroy();
layer.destroy();
map.destroy();
}
function test_Tile_Image_IFrame_initImgDiv (t) {
t.plan( 4 );
function test_Tile_Image_IFrame_initImage (t) {
t.plan( 2 );
map = new OpenLayers.Map('map');
layer = new OpenLayers.Layer.WMS(name, wmsUrl, {layers: 'basic'}, {tileOptions: {maxGetUrlLength: 0}});
map.addLayer(layer);
tile = layer.addTile(bounds, position);
tile.url = layer.getURL(bounds);
tile.initImgDiv();
tile.initImage();
if(isMozilla) {
t.ok( tile.imgDiv instanceof HTMLElement, "tile.iFrame successfully created.");
@@ -75,63 +78,41 @@
else {
t.ok( tile.imgDiv != null, "tile.iFrame successfully created.");
}
t.eq( tile.imgDiv.id, tile.id, "imgDiv id correctly set.");
t.eq( tile.imgDiv.className, "olTileImage", "iFrame's className correctly set.");
t.ok( tile.imgDiv.map == map, "map correctly added to iFrame.");
map.destroy();
}
function test_Tile_Image_IFrame_createImgDiv (t) {
t.plan( 3 );
function test_Tile_Image_IFrame_createImage (t) {
t.plan( 9 );
map = new OpenLayers.Map('map');
layer = new OpenLayers.Layer.WMS(name, wmsUrl, {layers: 'basic'}, {tileOptions: {maxGetUrlLength: 0}});
map.addLayer(layer);
var tile = layer.addTile(bounds, position);
tile.renderTile();
var imgDiv = tile.imgDiv;
var iFrame = imgDiv.firstChild;
var eventPane = imgDiv.childNodes[1];
tile.draw();
var iFrame = tile.imgDiv;
var eventPane = tile.frame.childNodes[0];
t.ok(OpenLayers.String.contains(eventPane.style.backgroundImage,
tile.blankImageUrl),
"backgroundImage of eventPane is set.");
t.eq(parseInt(eventPane.style.zIndex, 10), 1, "zIndex of eventPane is set.");
if(isIE) {
t.ok(iFrame != null, "IFrame successfully created.");
t.eq(eventPane.style.backgroundColor, '#ffffff', "backgroundColor of overlay pane is set in InternetExplorer.");
t.eq(eventPane.style.filter, 'chroma(color=#FFFFFF)', "filter of overlay pane is set in InternetExplorer.");
}
else {
t.ok(iFrame instanceof HTMLElement, "IFrame successfully created.");
t.ok(true, 'Skip eventPane backgroundColor test outside IE');
t.ok(true, 'Skip eventPane filter test outside IE');
}
map.destroy();
}
function test_Tile_Image_IFrame_createIFrame (t) {
t.plan( 8 );
map = new OpenLayers.Map('map');
layer = new OpenLayers.Layer.WMS(name, wmsUrl, {layers: 'basic'}, {tileOptions: {maxGetUrlLength: 0}});
map.addLayer(layer);
var tile = layer.addTile(bounds, position);
var iFrame = tile.createIFrame();
var id = tile.id+'_iFrame';
t.eq(iFrame.id, id, "iframe id correctly set.");
t.eq(iFrame.name, id, "iframe name correctly set.");
if(isIE) {
t.eq(iFrame.style.backgroundColor, '#ffffff', "backgroundColor correctly set.");
t.eq(iFrame.style.filter, 'chroma(color=#FFFFFF)', "filter correctly set.");
}
else {
t.eq(iFrame.style.backgroundColor, 'transparent', "backgroundColor correctly set.");
t.ok(true, "Skip filter test outside InternetExplorer.");
} else {
t.ok(iFrame instanceof HTMLElement, "IFrame successfully created.");
t.ok(true, 'Skip IFrame backgroundColor test outside IE');
t.ok(true, 'Skip IFrame filter test outside IE');
}
t.eq( iFrame.scrolling, 'no', "no scrolling");
t.eq( parseFloat(iFrame.marginWidth), 0, "no margin width");
t.eq( parseFloat(iFrame.marginHeight), 0, "no margin height");
t.eq( parseFloat(iFrame.frameBorder), 0, "no iframe border");
map.destroy();
}
function test_Tile_Image_IFrame_createRequestForm (t) {
@@ -152,7 +133,7 @@
map.addLayer(newLayer);
tile = newLayer.addTile(bounds, position);
tile.url = newLayer.getURL(bounds);
tile.initImgDiv();
tile.initImage();
tile.url = newLayer.getURL(bounds);
var form = tile.createRequestForm();
@@ -182,9 +163,10 @@
tile.draw();
tile.clear();
tile.initImage();
tile.createRequestForm();
t.ok(
tile.imgDiv.firstChild.nodeName == "IFRAME",
tile.imgDiv.nodeName == "IFRAME",
"Iframe has been reinserted properly"
);
tests/list-tests.html
+1
View File
@@ -226,6 +226,7 @@
<li>Tile.html</li>
<li>Tile/Google.html</li>
<li>Tile/Image.html</li>
<li>Tile/BackBufferable.html</li>
<li>Tile/Image/IFrame.html</li>
<li>Tile/WFS.html</li>
<li>Tween.html</li>
tests/run-tests.html
+1 -1
View File
@@ -1102,7 +1102,7 @@ Test.AnotherWay._delay_continue_action=function( test_object, milliseconds_passe
if( finished ) {
try {
action.call_fn();
}catch( e ) {
}catch( e ) {
Test.AnotherWay._handle_exception( test_object, e, "in delay_call" );
}
}