OpenLayers OpenLayers

Ticket #442: final_animatedZooming_LayerWMSUntiled.patch

File final_animatedZooming_LayerWMSUntiled.patch, 11.0 kB (added by emanuel, 3 years ago)

WMS untiled baselayer supports animated zooming (included unit tests)

  • tests/Layer/test_WMS_Untiled.html

    old new  
     1<html> 
     2<head> 
     3  <script src="../../lib/OpenLayers.js"></script> 
     4  <script type="text/javascript"><!-- 
     5    var isMozilla = (navigator.userAgent.indexOf("compatible") == -1); 
     6    var map; 
     7    var layer;  
     8     
     9    var name = 'Test Layer'; 
     10    var url = "http://octo.metacarta.com/cgi-bin/mapserv"; 
     11    var params = { map: '/mapdata/vmap_wms.map',  
     12                   layers: 'basic',  
     13                  format: 'image/png'}; 
     14 
     15 
     16 
     17    function test_01_Layer_WMS_Untiled_constructor (t) { 
     18        t.plan( 1 ); 
     19                        
     20        layer = new OpenLayers.Layer.WMS.Untiled(name, url, params, null); 
     21        t.ok( layer instanceof OpenLayers.Layer.WMS.Untiled, "returns OpenLayers.Layer.WMS.Untiled object" ); 
     22    } 
     23 
     24    function test_02_Layer_WMS_Untiled_getResolution(t) { 
     25        t.plan( 1 ); 
     26 
     27        map = new OpenLayers.Map('map'); 
     28        layer = new OpenLayers.Layer.WMS.Untiled(name, url, params); 
     29        map.addLayer(layer); 
     30 
     31        map.zoom = 5; 
     32 
     33        t.eq( layer.getResolution(), 0.0439453125, "getResolution() returns correct value"); 
     34    } 
     35 
     36    function test_03_Layer_WMS_Untiled_getZoomForExtent(t) { 
     37        t.plan( 2 ); 
     38        var bounds, zoom; 
     39 
     40        map = new OpenLayers.Map('map'); 
     41        layer = new OpenLayers.Layer.WMS(name, url, params); 
     42        map.addLayer(layer); 
     43 
     44        bounds = new OpenLayers.Bounds(10,10,12,12); 
     45        zoom = layer.getZoomForExtent(bounds); 
     46 
     47        t.eq( zoom, 8, "getZoomForExtent() returns correct value"); 
     48 
     49        bounds = new OpenLayers.Bounds(10,10,100,100); 
     50        zoom = layer.getZoomForExtent(bounds); 
     51 
     52        t.eq( zoom, 2, "getZoomForExtent() returns correct value"); 
     53    }    
     54    function test_04_Layer_WMS_Untiled_getURL (t) { 
     55        t.plan( 2 ); 
     56     
     57        var url = "http://octo.metacarta.com/cgi-bin/mapserv"; 
     58        layer = new OpenLayers.Layer.WMS.Untiled(name, url, params); 
     59        var map = new OpenLayers.Map('map'); 
     60        map.addLayer(layer); 
     61 
     62        var bounds = new OpenLayers.Bounds(1,2,3,4);         
     63        var url = map.baseLayer.getURL(bounds); 
     64         
     65        var tileSize = new OpenLayers.Size(512,512); 
     66        url = map.baseLayer.getURL(bounds,tileSize);         
     67        t.ok( url.match("WIDTH=512"),  
     68                "url with custom width has been set correctly"); 
     69        t.ok( url.match("HEIGHT=512"),  
     70                "url with custom height has been set correctly"); 
     71    } 
     72 
     73  
     74 
     75 
     76    /*** animated zooming test functions ***/ 
     77 
     78    function test_10_Layer_WMS_Untiled_setZoomOutTile (t) { 
     79        t.plan(5); 
     80         
     81        map = new OpenLayers.Map('map'); 
     82        layer = new OpenLayers.Layer.WMS.Untiled(name, url, params); 
     83        map.addLayer(layer); 
     84        map.tileSize = new OpenLayers.Size(256,256);  
     85        map.zoomOutTileFactor = 4; 
     86        var tile = map.baseLayer.zoomOutTile; 
     87 
     88        t.ok( tile instanceof OpenLayers.Tile.Image,  
     89                "zoomOutTile is a Tile.Image object"); 
     90         
     91        var firstChild = map.baseLayer.div.firstChild; 
     92        t.eq( tile.imgDiv.id, firstChild.id,  
     93                "zoomOutTile is first child of baseLayerDiv"); 
     94 
     95        size = map.baseLayer.zoomOutTile.size; 
     96        t.eq( size.w, 1024, "zoomOutTile width is 1024px"); 
     97        t.eq( size.h, 1024, "zoomOutTile height is 1024px"); 
     98 
     99        t.ok( tile.imgDiv.style.display == "none",  
     100                "zoomOutTile is invisible"); 
     101    } 
     102 
     103 
     104    function test_11_Layer_WMS_Untiled_getTileSize (t) { 
     105        t.plan(2); 
     106 
     107        map = new OpenLayers.Map('map'); 
     108        layer = new OpenLayers.Layer.WMS.Untiled(name, url, params); 
     109        map.addLayer(layer); 
     110        map.setCenter(new OpenLayers.LonLat(0,0)); 
     111        map.baseLayer.tile.size = new OpenLayers.Size(512,512);   
     112 
     113        var size = map.baseLayer.getTileSize(); 
     114        t.eq(size.w, 512, "tile width is correct");  
     115        t.eq(size.h, 512, "tile height is correct"); 
     116    } 
     117 
     118    function test_12_Layer_WMS_Untiled_getCenterTile (t) { 
     119        t.plan(1); 
     120 
     121        map = new OpenLayers.Map('map'); 
     122        layer = new OpenLayers.Layer.WMS.Untiled(name, url, params); 
     123        map.addLayer(layer); 
     124        map.setCenter(new OpenLayers.LonLat(0,0)); 
     125         
     126        tile = map.baseLayer.getCenterTile();  
     127        t.ok(tile.bounds.contains(0,0,true),  
     128                "center tile has been set correctly" ); 
     129    } 
     130 
     131    function test_13_Layer_WMS_Untiled_scaleZoomOutTile (t) { 
     132        t.plan(5); 
     133 
     134        map = new OpenLayers.Map('map'); 
     135        layer = new OpenLayers.Layer.WMS.Untiled(name, url, params); 
     136        map.addLayer(layer); 
     137        map.setCenter(new OpenLayers.LonLat(0,0),0); 
     138 
     139        var tile = map.baseLayer.zoomOutTile; 
     140        map.baseLayer.scaleZoomOutTile(1,map.maxResolution/2); 
     141 
     142        t.eq( tile.imgDiv.style.width, "512px",  
     143                "width of zoomOutTile has been set correctly"); 
     144        t.eq( tile.imgDiv.style.height, "512px",  
     145                "height of zoomOutTile has been set correctly"); 
     146        t.eq( tile.imgDiv.style.top, "-109px",  
     147                "top position of zoomOutTile has been set correctly"); 
     148        t.eq( tile.imgDiv.style.left, "-6px",  
     149                "left position of zoomOutTile has been set correctly"); 
     150        t.ok( tile.imgDiv.style.display != "none",  
     151                "zoomOutTile has been set visible"); 
     152    } 
     153 
     154    function test_14_Layer_WMS_Untiled_cloneBaseLayerDiv (t) { 
     155        t.plan(4); 
     156 
     157        map = new OpenLayers.Map('map'); 
     158        layer = new OpenLayers.Layer.WMS.Untiled(name, url, params); 
     159        map.addLayer(layer); 
     160         
     161        map.baseLayer.cloneBaseLayerDiv(); 
     162        var cloneDiv = map.baseLayerDivClone; 
     163        var originDiv = map.baseLayer.div;  
     164        t.ok( cloneDiv instanceof HTMLDivElement,  
     165                "cloned baseLayerDiv is a valid HTMLDivElement"); 
     166        t.eq( cloneDiv.childNodes.length, originDiv.childNodes.length, 
     167                "cloned baseLayerDiv has the same number of childs"); 
     168        t.eq( parseInt(cloneDiv.style.zIndex)+1, parseInt(originDiv.style.zIndex), 
     169                "zIndex has been set correctly"); 
     170        t.ok( map.baseLayer.zoomOutTile.imgDiv.style.display == "none", 
     171                "zoomOutTile of original div has been set invisible"); 
     172    } 
     173 
     174 
     175 
     176    function test_99_Layer_WMS_Untiled_destroy (t) { 
     177        t.plan( 1 ); 
     178 
     179        map = new OpenLayers.Map('map'); 
     180        layer = new OpenLayers.Layer.WMS.Untiled(name, url, params); 
     181        map.addLayer(layer); 
     182 
     183        layer.destroy(); 
     184        t.eq( layer.tile, null, "layer.wms.untiled.tile is null after destroy" ); 
     185    } 
     186     
     187       // --> 
     188  </script> 
     189</head> 
     190<body> 
     191<div id="map" style="width:500px;height:550px;display:none"></div> 
     192</body> 
     193</html> 
  • lib/OpenLayers/Layer/WMS/Untiled.js

    old new  
    3131    /** @type OpenLayers.Tile.Image */ 
    3232    tile: null, 
    3333 
    34     /** did the image finish loading before a new draw was initiated? 
    35      * @type Boolean */ 
    36     doneLoading: false, 
    3734 
    3835    /** 
    3936    * @constructor 
     
    164161                this.tile = null; 
    165162            } 
    166163 
     164            // fire loadstart event 
    167165            this.events.triggerEvent("loadstart"); 
    168166            this.doneLoading = false; 
    169167            if (!this.tile) { 
     
    182180     
    183181        } 
    184182    }, 
    185      
    186     getURL: function(bounds) { 
    187         var tileSize = this.map.getSize(); 
    188         tileSize.w = tileSize.w * this.ratio; 
    189         tileSize.h = tileSize.h * this.ratio; 
     183 
     184    getURL: function(bounds, tileSize) { 
     185        if (!tileSize) { 
     186            var tileSize = this.map.getSize(); 
     187            tileSize.w = tileSize.w * this.ratio; 
     188            tileSize.h = tileSize.h * this.ratio; 
     189        } 
    190190        return this.getFullRequestString( {'BBOX': bounds.toBBOX(), 
    191191                                                  'WIDTH': tileSize.w, 
    192192                                                  'HEIGHT': tileSize.h} ); 
     
    230230        return OpenLayers.Layer.Grid.prototype.getFullRequestString.apply( 
    231231                                                    this, arguments); 
    232232    }, 
    233      
     233    
     234 
     235    /********************************************************/ 
     236    /*                                                      */ 
     237    /*       Baselayer Functions for zooming/scaling        */ 
     238    /*                                                      */ 
     239    /********************************************************/     
     240 
     241    /**  
     242     * Initializes zoomOut tile and sets a x-times bigger tile size. 
     243     * 
     244     * Default function; will override from subclasses, 
     245     * otherwise it returns false 
     246     *  
     247     * @returns true after zoomOutTile is set 
     248     */ 
     249    setZoomOutTile:function() { 
     250        this.setZoomOutTile_share(); 
     251        return true 
     252    }, 
     253 
     254 
     255    /**  
     256     * Gets tile size. 
     257     *   
     258     * @returns the current map tile size if tile exists; otherwise 
     259     * null 
     260     * @type {OpenLayers.Size} 
     261     */ 
     262    getTileSize:function() { 
     263        if (this.tile)  
     264            return this.tile.size; 
     265        else 
     266            return null; 
     267    }, 
     268 
     269    /**  
     270     * Gets the center tile. 
     271     * 
     272     * @returns the only tile of the layer if tile exists; otherwise 
     273     * null 
     274     * @type {OpenLayers.Tile} 
     275     */ 
     276    getCenterTile:function() {    
     277        if (this.tile) 
     278            return this.tile;  
     279        else 
     280            return null; 
     281    }, 
     282 
     283    /** 
     284     * Reposition and resize the zoomOut tile to prevent a white frame 
     285     * during zoomOut. 
     286     * share scale algorithm with other baselayers 
     287     * 
     288     * @param {float} newZoomlevel 
     289     * @param {float} newResolution 
     290     * 
     291     * @returns true after the zoomOutTile is scaled, otherwise false 
     292     */ 
     293    scaleZoomOutTile: function(newZoomlevel, newResolution) { 
     294        if (this.zoomOutTile) { 
     295            this.scaleZoomOutTile_share(newZoomlevel, newResolution); 
     296            return true; 
     297        } 
     298        else 
     299            return false; 
     300    }, 
     301 
     302    /**  
     303     * Clones layerContainer for "smooth tile update".  
     304     * So, it gets no blank map while map is loading in new zoomlevel. 
     305     * 
     306     * @returns true after layerContainer is cloned 
     307     * @type Boolean 
     308     */ 
     309    cloneBaseLayerDiv:function() { 
     310        // share clone algorithm with other baselayers 
     311        this.cloneBaseLayerDiv_share(); 
     312 
     313        // remove the old imgDiv tile  
     314        // (so it doesn't becomes complicate with the same imgDiv of the 
     315        // cloned layerContainerDiv) 
     316        if (this.tile) 
     317            this.div.removeChild(this.tile.imgDiv); 
     318         
     319        this.tile = null;         
     320 
     321        return true; 
     322    }, 
     323 
     324  
    234325    /** @final @type String */ 
    235326    CLASS_NAME: "OpenLayers.Layer.WMS.Untiled" 
    236327});