OpenLayers OpenLayers

Changeset 6111

Show
Ignore:
Timestamp:
02/08/08 11:28:11 (10 months ago)
Author:
crschmidt
Message:

Add support for animated panning, with most of the work done by Pierre, thx pierre! panTo method now animates when moving. (Closes #110)

Files:

Legend:

Unmodified
Added
Removed
Modified
Copied
Moved
  • trunk/openlayers/lib/OpenLayers/Control/OverviewMap.js

    r6106 r6111  
    512512    updateMapToRect: function() { 
    513513        var lonLatBounds = this.getMapBoundsFromRectBounds(this.rectPxBounds); 
    514         this.map.setCenter(lonLatBounds.getCenterLonLat(), this.map.zoom); 
     514        this.map.panTo(lonLatBounds.getCenterLonLat()); 
    515515    }, 
    516516 
  • trunk/openlayers/lib/OpenLayers/Map.js

    r6108 r6111  
    12471247     * dx - {Integer} 
    12481248     * dy - {Integer} 
    1249      */ 
    1250     pan: function(dx, dy) { 
    1251  
     1249     * options - {Object} Only one at this time: "animate", which uses 
     1250     *    panTo instead of setCenter. Default is true. 
     1251     */ 
     1252    pan: function(dx, dy, options) { 
     1253         
     1254        if (!options) { 
     1255            options = {} 
     1256        }     
    12521257        // getCenter 
    12531258        var centerPx = this.getViewPortPxFromLonLat(this.getCenter()); 
     
    12591264        if (!newCenterPx.equals(centerPx)) { 
    12601265            var newCenterLonLat = this.getLonLatFromViewPortPx(newCenterPx); 
    1261             this.setCenter(newCenterLonLat); 
     1266            if (options.animate) { 
     1267                this.panTo(newCenterLonLat); 
     1268            } else { 
     1269                this.setCenter(newCenterLonLat); 
     1270            }     
    12621271        } 
    12631272 
    12641273   }, 
     1274    
     1275   /**  
     1276     * APIMethod: panTo 
     1277     * Allows user to pan to a new lonlat 
     1278     * If the new lonlat is in the current extent the map will slide smoothly 
     1279     *  
     1280     * Parameters: 
     1281     * lonlat - {<OpenLayers.Lonlat>} 
     1282     */ 
     1283    panTo: function(lonlat) { 
     1284        if (this.getExtent().containsLonLat(lonlat)) { 
     1285            if (!this.panTween) { 
     1286                this.panTween = new OpenLayers.Tween(OpenLayers.Easing.Expo.easeOut); 
     1287            } 
     1288            var center = this.getCenter(); 
     1289            var from = { 
     1290                lon: center.lon, 
     1291                lat: center.lat 
     1292            }; 
     1293            var to = { 
     1294                lon: lonlat.lon, 
     1295                lat: lonlat.lat 
     1296            }; 
     1297            this.panTween.start(from, to, 50, { 
     1298                callbacks: { 
     1299                    start: OpenLayers.Function.bind(function(lonlat) { 
     1300                        this.events.triggerEvent("movestart"); 
     1301                    }, this), 
     1302                    eachStep: OpenLayers.Function.bind(function(lonlat) { 
     1303                        var lonlat = new OpenLayers.LonLat(lonlat.lon, lonlat.lat); 
     1304                        this.moveTo(lonlat, this.zoom, true); 
     1305                    }, this), 
     1306                    done: OpenLayers.Function.bind(function(lonlat) { 
     1307                        this.events.triggerEvent("moveend"); 
     1308                    }, this) 
     1309                } 
     1310            }); 
     1311        } else { 
     1312            this.setCenter(lonlat); 
     1313        } 
     1314    }, 
    12651315 
    12661316    /** 
     
    13031353        // noEvent is false by default 
    13041354        var noEvent = options.noEvent; 
     1355 
     1356        if (this.panTween && options.caller == "setCenter") { 
     1357            this.panTween.stop(); 
     1358        }     
    13051359              
    13061360        if (!this.center && !this.isValidLonLat(lonlat)) { 
  • trunk/openlayers/tests/Control/test_OverviewMap.html

    r6106 r6111  
    3939        var centerLL = new OpenLayers.LonLat(-71,42);  
    4040        map.setCenter(centerLL, 11); 
    41  
     41        t.delay_call(1, function() { 
    4242        var overviewCenter = control.ovmap.getCenter(); 
    4343        var overviewZoom = control.ovmap.getZoom(); 
     
    4747         
    4848        control.mapDivClick({'xy':new OpenLayers.Pixel(5,5)}); 
    49          
     49        }, 2, function() { 
    5050        var cent = map.getCenter(); 
    5151        t.eq(cent.lon, -71.3515625, "Clicking on the Overview Map has the correct effect on map lon"); 
     
    5858        control.rectDrag(new OpenLayers.Pixel(15, 15)); 
    5959        control.updateMapToRect(); 
    60          
     60        }, 2, function() { 
    6161        var cent = map.getCenter(); 
    6262        t.eq(cent.lon, -71.2734375, "Dragging on the Overview Map has the correct effect on map lon"); 
     
    6969        t.eq(overviewCenter.lat, 0, "Overviewmap center lat correct -- second zoom"); 
    7070        t.eq(overviewZoom, 0, "Overviewmap zoomcorrect -- second zoom"); 
    71          
    7271        map.destroy(); 
    73  
     72        }); 
    7473    } 
    7574 
  • trunk/openlayers/tests/Control/test_PanZoom.html

    r5474 r6111  
    6262                     
    6363                    simulateClick(wnd, wnd.control.buttons[0]); 
    64                     t.ok( wnd.mapper.getCenter().lat > wnd.centerLL.lat, "Pan up works correctly" ); 
    65                     t.ok(!flag.mousedown, "mousedown does not get to the map"); 
    66                     t.ok(flag.mouseup, "mouseup does get to the map"); 
    67                     t.ok(!flag.click, "click does not get to the map"); 
    68                     t.ok(!flag.dblclick, "dblclick does not get to the map"); 
    69                     resetFlags(); 
     64                    t.delay_call(2, function() { 
     65                        t.ok( wnd.mapper.getCenter().lat > wnd.centerLL.lat, "Pan up works correctly" ); 
     66                        t.ok(!flag.mousedown, "mousedown does not get to the map"); 
     67                        t.ok(flag.mouseup, "mouseup does get to the map"); 
     68                        t.ok(!flag.click, "click does not get to the map"); 
     69                        t.ok(!flag.dblclick, "dblclick does not get to the map"); 
     70                        resetFlags(); 
    7071 
    71                     simulateClick(wnd, wnd.control.buttons[1]); 
     72                        simulateClick(wnd, wnd.control.buttons[1]); 
     73                    }, 2, function() {     
    7274                    t.ok( wnd.mapper.getCenter().lon < wnd.centerLL.lon, "Pan left works correctly" ); 
    7375                    t.ok(!flag.mousedown, "mousedown does not get to the map"); 
     
    7880 
    7981                    simulateClick(wnd, wnd.control.buttons[2]); 
     82                    }, 2, function() { 
    8083                    t.ok( wnd.mapper.getCenter().lon == wnd.centerLL.lon, "Pan right works correctly" ); 
    8184                    t.ok(!flag.mousedown, "mousedown does not get to the map"); 
     
    8689 
    8790                    simulateClick(wnd, wnd.control.buttons[3]); 
     91                    }, 2, function() { 
    8892                    t.ok( wnd.mapper.getCenter().lat == wnd.centerLL.lat, "Pan down works correctly" ); 
    8993                    t.ok(!flag.mousedown, "mousedown does not get to the map"); 
     
    9498 
    9599                    simulateClick(wnd, wnd.control.buttons[4]); 
     100                    }, 2, function() { 
    96101                    t.eq( wnd.mapper.getZoom(), 6, "zoomin works correctly" ); 
    97102                    t.ok(!flag.mousedown, "mousedown does not get to the map"); 
     
    102107 
    103108                    simulateClick(wnd, wnd.control.buttons[6]); 
     109                    }, 2, function() { 
    104110                    t.eq( wnd.mapper.getZoom(), 5, "zoomout works correctly" ); 
    105111                    t.ok(!flag.mousedown, "mousedown does not get to the map"); 
     
    110116 
    111117                    simulateClick(wnd, wnd.control.buttons[5]); 
     118                    }, 2, function() { 
    112119                    t.eq( wnd.mapper.getZoom(), 2, "zoomworld works correctly" ); 
    113120                    t.ok(!flag.mousedown, "mousedown does not get to the map"); 
     
    116123                    t.ok(!flag.dblclick, "dblclick does not get to the map"); 
    117124                    resetFlags(); 
    118                      
     125                    }); 
    119126                }); 
    120127            }); 
     
    147154     
    148155        var layer = new OpenLayers.Layer.WMS("Test Layer",  
    149             "http://octo.metacarta.com/cgi-bin/mapserv?", 
    150             {map: "/mapdata/vmap_wms.map", layers: "basic"}); 
     156            "http://labs.metacarta.com/wms-c/Basic.py?", 
     157            {layers: "basic"}); 
    151158        mapper.addLayer(layer); 
    152159     
  • trunk/openlayers/tests/Control/test_Permalink.html

    r4345 r6111  
    3939        if (!map.getCenter())  map.zoomToMaxExtent(); 
    4040        map.addControl(control); 
    41         map.pan(5, 0); 
     41        map.pan(5, 0, {animate:false}); 
    4242        t.ok(OpenLayers.Util.isEquivalentUrl(OpenLayers.Util.getElement('permalink').href, location+"?zoom=2&lat=0&lon=1.75781&layers=BT"), 'pan sets permalink'); 
    4343         
     
    5656        if (!map.getCenter())  map.zoomToMaxExtent(); 
    5757        map.addControl(control); 
    58         map.pan(5, 0); 
     58        map.pan(5, 0, {animate:false}); 
    5959        OpenLayers.Util.getElement('edit_permalink').href = './edit.html?zoom=2&lat=0&lon=1.75781&layers=B'; 
    6060        t.eq(OpenLayers.Util.getElement('permalink').href, OpenLayers.Util.getElement('edit_permalink').href, "Panning sets permalink with base"); 
     
    7777      if (!map.getCenter())  map.zoomToMaxExtent(); 
    7878      map.addControl(control); 
    79       map.pan(5, 0); 
     79      map.pan(5, 0, {animate:false}); 
    8080      OpenLayers.Util.getElement('edit_permalink').href = './edit.html?foo=bar&zoom=2&lat=0&lon=1.75781&layers=B'; 
    8181      t.eq(OpenLayers.Util.getElement('permalink').href, OpenLayers.Util.getElement('edit_permalink').href, "Panning sets permalink with base and querystring"); 
     
    8383      control = new OpenLayers.Control.Permalink('permalink', "./edit.html?foo=bar&" ); 
    8484      map.addControl(control); 
    85       map.pan(0, 0); 
     85      map.pan(0, 0, {animate:false}); 
    8686      t.eq(OpenLayers.Util.getElement('permalink').href, OpenLayers.Util.getElement('edit_permalink').href, "Panning sets permalink with base and querystring ending with '&'"); 
    8787       
     
    8989      OpenLayers.Util.getElement('edit_permalink').href = './edit.html?zoom=2&lat=0&lon=1.75781&layers=B'; 
    9090      map.addControl(control); 
    91       map.pan(5, 0); 
    92       map.pan(-5, 0); 
     91      map.pan(5, 0, {animate:false}); 
     92      map.pan(-5, 0, {animate:false}); 
    9393      t.eq(OpenLayers.Util.getElement('permalink').href, OpenLayers.Util.getElement('edit_permalink').href, "Panning sets permalink with base and querystring ending with '?'"); 
    9494 
     
    105105        if (!map.getCenter())  map.zoomToMaxExtent(); 
    106106        map.addControl(control); 
    107         map.pan(5, 0); 
     107        map.pan(5, 0, {animate:false}); 
    108108        OpenLayers.Util.getElement('edit_permalink').href = './edit.html?zoom=2&lat=0&lon=1.75781&layers=B'; 
    109109        t.eq(OpenLayers.Util.getElement('permalink').href, OpenLayers.Util.getElement('edit_permalink').href, "Panning sets permalink with existing zoom in base"); 
  • trunk/openlayers/tests/Layer/test_Grid.html

    r4792 r6111  
    543543        var bounds = layer.getTileBounds(new OpenLayers.Pixel(200,200)); 
    544544        t.eq(bounds.toBBOX(), "-180,-90,0,90", "get tile bounds returns correct bounds");  
    545         map.pan(200,0); 
     545        map.pan(200,0, {animate:false}); 
    546546        var bounds = layer.getTileBounds(new OpenLayers.Pixel(200,200)); 
    547547        t.eq(bounds.toBBOX(), "0,-90,180,90", "get tile bounds returns correct bounds after pan");  
  • trunk/openlayers/tests/Layer/test_KaMap.html

    r5460 r6111  
    246246        var bounds = layer.getTileBounds(new OpenLayers.Pixel(200,200)); 
    247247        t.eq(bounds.toBBOX(), "-180,0,0,180", "get tile bounds returns correct bounds");  
    248         map.pan(200,0); 
     248        map.pan(200,0,{animate:false}); 
    249249        var bounds = layer.getTileBounds(new OpenLayers.Pixel(200,200)); 
    250250        t.eq(bounds.toBBOX(), "0,0,180,180", "get tile bounds returns correct bounds after pan");  
  • trunk/openlayers/tests/test_Map.html

    r6099 r6111  
    682682        map.setBaseLayer(tmsLayer); 
    683683        map.zoomIn(); 
    684         map.pan(0, -200); 
     684        map.pan(0, -200, {animate:false}); 
    685685        map.setBaseLayer(wmsLayer); 
    686686        t.eq(map.layerContainerDiv.style.top, "0px", "layerContainer is recentered after setBaseLayer");