[Commits] r220 - in sandbox/opengeo/alachua: . examples lib lib/GeoExt lib/GeoExt/data lib/GeoExt/widgets tests tests/data tests/widgets

commits at geoext.org commits at geoext.org
Fri Mar 13 19:51:27 CET 2009


Author: sbenthall
Date: 2009-03-13 19:51:27 +0100 (Fri, 13 Mar 2009)
New Revision: 220

Added:
   sandbox/opengeo/alachua/examples/
   sandbox/opengeo/alachua/examples/mappanel-div.html
   sandbox/opengeo/alachua/examples/mappanel-window.html
   sandbox/opengeo/alachua/lib/GeoExt/data/LayerStore.js
   sandbox/opengeo/alachua/lib/GeoExt/widgets/
   sandbox/opengeo/alachua/lib/GeoExt/widgets/MapPanel.js
   sandbox/opengeo/alachua/tests/data/LayerStore.html
   sandbox/opengeo/alachua/tests/widgets/
   sandbox/opengeo/alachua/tests/widgets/MapPanel.html
Modified:
   sandbox/opengeo/alachua/lib/GeoExt.js
   sandbox/opengeo/alachua/tests/list-tests.html
Log:
Patched with MapPanel patch from #4


Added: sandbox/opengeo/alachua/examples/mappanel-div.html
===================================================================
--- sandbox/opengeo/alachua/examples/mappanel-div.html	                        (rev 0)
+++ sandbox/opengeo/alachua/examples/mappanel-div.html	2009-03-13 18:51:27 UTC (rev 220)
@@ -0,0 +1,67 @@
+<html>
+  <head>
+    <script type="text/javascript" src="../../../openlayers/lib/OpenLayers.js"></script>
+    <script type="text/javascript" src="../../../ext/2.2/adapter/ext/ext-base.js"></script>
+    <script type="text/javascript" src="../../../ext/2.2/ext-all-debug.js"></script>
+    <script type="text/javascript" src="../lib/GeoExt.js"></script>
+
+    <link rel="stylesheet" type="text/css" href="../../../ext/2.2/resources/css/ext-all.css"></link>
+
+    <script type="text/javascript">
+
+        var mapPanel = null;
+        
+        function createMap() {
+            var map = new OpenLayers.Map();
+            var layer = new OpenLayers.Layer.WMS(
+                "vmap0",
+                "http://labs.metacarta.com/wms/vmap0",
+                {layers: 'basic'}
+            );
+            map.addLayer(layer);
+            return map;
+        }
+
+        function load() {
+            var map = createMap();
+
+            mapPanel = new GeoExt.MapPanel({
+                // panel options
+                id: "map-panel",
+                title: "GeoExt MapPanel",
+                renderTo: "mappanel",
+                height: 400,
+                width: 600,
+                // map panel-specific options
+                map: map,
+                center: new OpenLayers.LonLat(5, 45),
+                zoom: 4
+            });
+        }
+
+        function mapSizeUp() {
+            var size = mapPanel.getSize();
+            size.width += 40;
+            size.height += 40;
+            mapPanel.setSize(size);
+        }
+
+        function mapSizeDown() {
+            var size = mapPanel.getSize();
+            size.width -= 40;
+            size.height -= 40;
+            mapPanel.setSize(size);
+        }
+
+        Ext.onReady(function() {
+            load();
+        });
+    </script>
+        
+  </head>
+  <body>
+    <div id="mappanel"></div>
+    <input type="button" onclick="mapSizeUp()" value="bigger"></input>
+    <input type="button" onclick="mapSizeDown()" value="smaller"></input>
+  </body>
+</html>


Property changes on: sandbox/opengeo/alachua/examples/mappanel-div.html
___________________________________________________________________
Name: svn:mime-type
   + text/html
Name: svn:keywords
   + Id
Name: svn:eol-style
   + native

Added: sandbox/opengeo/alachua/examples/mappanel-window.html
===================================================================
--- sandbox/opengeo/alachua/examples/mappanel-window.html	                        (rev 0)
+++ sandbox/opengeo/alachua/examples/mappanel-window.html	2009-03-13 18:51:27 UTC (rev 220)
@@ -0,0 +1,54 @@
+<html>
+  <head>
+    <script type="text/javascript" src="../../../openlayers/lib/OpenLayers.js"></script>
+    <script type="text/javascript" src="../../../ext/2.2/adapter/ext/ext-base.js"></script>
+    <script type="text/javascript" src="../../../ext/2.2/ext-all-debug.js"></script>
+    <script type="text/javascript" src="../lib/GeoExt.js"></script>
+
+    <link rel="stylesheet" type="text/css" href="../../../ext/2.2/resources/css/ext-all.css"></link>
+
+    <script type="text/javascript">
+        var app = (function() {
+
+            var mapPanel = null;
+            
+            var createMap = function() {
+                var map = new OpenLayers.Map();
+                var layer = new OpenLayers.Layer.WMS(
+                    "vmap0",
+                    "http://labs.metacarta.com/wms/vmap0",
+                    {layers: 'basic'}
+                );
+                map.addLayer(layer);
+                return map;
+            };
+
+            return {
+                load: function() {
+                    var map = createMap();
+
+                    new Ext.Window({
+                        id: "window",
+                        title: "GeoExt MapPanel Window",
+                        height: 400,
+                        width: 600,
+                        layout: "fit",
+                        items: [{
+                            xtype: "gx_mappanel",
+                            map: map,
+                            extent: new OpenLayers.Bounds(-165, 45, -90, 45)
+                        }]
+                    }).show();
+                }
+            }
+        })();
+
+        Ext.onReady(function() {
+            app.load();
+        });
+    </script>
+        
+  </head>
+  <body>
+  </body>
+</html>


Property changes on: sandbox/opengeo/alachua/examples/mappanel-window.html
___________________________________________________________________
Name: svn:mime-type
   + text/html
Name: svn:keywords
   + Id
Name: svn:eol-style
   + native

Added: sandbox/opengeo/alachua/lib/GeoExt/data/LayerStore.js
===================================================================
--- sandbox/opengeo/alachua/lib/GeoExt/data/LayerStore.js	                        (rev 0)
+++ sandbox/opengeo/alachua/lib/GeoExt/data/LayerStore.js	2009-03-13 18:51:27 UTC (rev 220)
@@ -0,0 +1,189 @@
+/**
+ * (C) 2009 The Open Planning Project
+ */
+
+Ext.namespace("GeoExt.data");
+
+/**
+ * Class: GeoExt.data.LayerStore
+ * A store of layer records. A layer record is an {Ext.Record} with at least a
+ * layer and a title property in its data object. This store is used by the
+ * MapPanel to provide an Ext way of accessing layers and storing meta
+ * information about layers.
+ */
+GeoExt.data.LayerStore = Ext.extend(Ext.data.Store, {
+    
+    /**
+     * ConfigProperty: map
+     * {OpenLayers.Map|GeoExt.MapPanel} If provided, the store will sync with
+     *     the layers array of the map.
+     */
+    map: null,
+
+    /**
+     * Property: adding
+     * {Boolean} Private property to avoid add events from layer and store
+     *     bouncing back and forth
+     */
+    adding: false,
+    
+    /**
+     * Property: removing
+     * {Boolean} Private property to avoid remove events from layer and store
+     *     bouncing back and forth
+     */
+    removing: false,
+
+    /**
+     * Constructor: GeoExt.tree.LayerNode
+     * 
+     * Parameters:
+     * config - {Object}
+     */
+    constructor: function(config) {
+        GeoExt.data.LayerStore.superclass.constructor.apply(this, arguments);
+        var map = config.map;
+        this.map = map instanceof GeoExt.MapPanel ? map.map : map;
+
+        if (this.map) {
+            var mapLayers = this.map.layers;
+            var layer;
+            for(var i=0; i<mapLayers.length; ++i) {
+                layer = mapLayers[i];
+                if(!this.getById(layer.id)) {
+                    this.addLayer(layer);
+                }
+            }
+            this.each(function(record){
+                var layer = record.data.layer;
+                if(mapLayers.indexOf(layer) == -1) {
+                    this.adding = true;
+                    this.map.addLayer(layer);
+                    this.adding = false;
+                }
+            }, this);
+            
+            this.map.events.on({
+                "addlayer": this.onAddLayer,
+                "removelayer": this.onRemoveLayer,
+                scope: this
+            });
+            this.on({
+                "add": this.onAddLayerRecords,
+                "remove": this.onRemoveLayerRecord,
+                scope: this
+            });
+        }
+    },
+    
+    /**
+     * APIMethod: addLayer
+     * Adds a layer to this store
+     * 
+     * Parameters:
+     * layer - {OpenLayers.Layer} The layer to add
+     * data - {Object} row data for the layer
+     * 
+     * Data properties used by GeoExt:
+     * layer - {OpenLayers.Layer} reference to a layer
+     * title - {String} Title of the layer (if not provided, this will be the
+     *     layer object's name property)
+     */
+    addLayer: function(layer, data) {
+        var recordData = Ext.applyIf({}, data);
+        Ext.applyIf(recordData, {
+            layer: layer,
+            title: layer.name
+        });
+        this.add([new Ext.data.Record(recordData, layer.id)]);
+    },
+    
+    /**
+     * APIMethod: removeLayer
+     * Removes a layer from this store
+     * 
+     * Parameters:
+     * layer - {OpenLayers.Layer} The layer to remove
+     */
+    removeLayer: function(layer) {
+        this.remove(this.getById(layer.id));
+    },
+
+    /**
+     * Method: onAddLayer
+     * Handler for the layer's addlayer event.
+     * 
+     * Parameters:
+     * evt - {Object}
+     */
+    onAddLayer: function(evt) {
+        var layer = evt.layer;
+        this.adding = true;
+        this.addLayer(layer);
+        this.adding = false;
+    },
+    
+    /**
+     * Method: onAddLayerRecords
+     * Handler for the layer store's add event
+     * 
+     * Parameters:
+     * store - {Ext.data.Store}
+     * records - {Array(Ext.data.Record)}
+     * index - {Number}
+     */
+    onAddLayerRecords: function(store, records, index) {
+        if(!this.adding) {
+            for(var i=0; i<records.length; ++i) {
+                this.map.addLayer(records[i].data.layer);
+            }
+        }
+    },
+    
+    /**
+     * Method: onRemoveLayer
+     * Handler for the layer's removelayer event
+     * 
+     * Parameters:
+     * evt - {Object}
+     */
+    onRemoveLayer: function(evt) {
+        var layer = evt.layer;
+        this.removing = true;
+        this.removeLayer(layer);
+        this.removing = false;
+    },
+    
+    /**
+     * Method: onRemoveLayerRecord
+     * Handler for the layer store's remove event
+     * 
+     * Parameters:
+     * store - {Ext.data.Store}
+     * record - {Ext.data.Record}
+     * index - {Number}
+     */
+    onRemoveLayerRecord: function(store, record, index) {
+        if(!this.removing) {
+            this.map.removeLayer(record.get("layer"));
+        }
+    }
+
+});
+
+/**
+ * APIFunction: GeoExt.data.LayerStore.guess
+ * Convenience function to guess the layer store by querying the Ext component
+ * manager for a MapPanel, and taking the layer store from the first map panel
+ * it finds.
+ * 
+ * Returns:
+ * {<GeoExt.data.LayerStore>}
+ */
+GeoExt.data.LayerStore.guess = function() {
+    var mapPanel = Ext.ComponentMgr.all.find(function(o) {
+        return o instanceof GeoExt.MapPanel;
+    });
+    return mapPanel.layers;
+};
+

Added: sandbox/opengeo/alachua/lib/GeoExt/widgets/MapPanel.js
===================================================================
--- sandbox/opengeo/alachua/lib/GeoExt/widgets/MapPanel.js	                        (rev 0)
+++ sandbox/opengeo/alachua/lib/GeoExt/widgets/MapPanel.js	2009-03-13 18:51:27 UTC (rev 220)
@@ -0,0 +1,155 @@
+/*
+ * Initial code
+ * (C) 2008 Tim Coulter, The Open Planning Project
+ *
+ * Misc tweaks for inclusion into trunk GeoExt
+ * (C) 2009 Eric Lemoine, Camptocamp France SAS
+ * (C) 2009 Andreas Hocevar, The Open Planning Project
+ *
+ * This file is part of GeoExt
+ *
+ * GeoExt is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * GeoExt is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with GeoExt.  If not, see <http://www.gnu.org/licenses/>.
+ */
+
+Ext.namespace("GeoExt");
+
+/**
+ * Class: GeoExt.MapPanel
+ *     A map panel is a panel with a map inside it.
+ *
+ * Example: create a map panel and render it in a div identified
+ * by "div-id".
+ *
+ * (start code)
+ * var mapPanel = new GeoExt.MapPanel({
+ *     border: false,
+ *     renderTo: "div-id",
+ *     map: new OpenLayers.Map({
+ *         maxExtent: new OpenLayers.Bounds(-90, -45, 90, 45)
+ *     })
+ * });
+ * (end)
+ *
+ * Example: create a panel including a map panel with a toolbar.
+ *
+ * (start code)
+ * var panel = new Ext.Panel({
+ *     items: [{
+ *         xtype: "gx_mappanel",
+ *         bbar: new Ext.Toolbar()
+ *     }]
+ * });
+ * (end)
+ *
+ * Inherits from:
+ *  - {Ext.Panel}
+ */
+
+/**
+ * Constructor: GeoExt.MapPanel
+ *     Creates a panel with a map inside it.
+ *
+ * Parameters:
+ * config - {Object} A config object. In addition to the config options
+ *     of its parent class, this object can receive specific options,
+ *     see the API properties to know about these specific options.
+ */
+GeoExt.MapPanel = Ext.extend(Ext.Panel, {
+    /**
+     * APIProperty: map
+     * {OpenLayers.Map|Object} An {OpenLayers.Map} instance
+     * or an {OpenLayers.Map} config object, in the latter case
+     * the map panel will take care of creating the {OpenLayers.Map}
+     * object.
+     */
+    map: null,
+    
+    /**
+     * APIProperty: layers
+     * {Ext.data.Store} A store holding records representing a map's layers.
+     *     The data hash of a layer record contains a layer property
+     *     referencing the layer. Read-only.
+     *     {<GeoExt.data.LayerStore>} will be created.
+     */
+    layers: null,
+
+    /**
+     * APIProperty: center
+     * {OpenLayers.LonLat} The lonlat to which the map will
+     * be initially centered, to be used in conjunction with
+     * the zoom option.
+     */
+    center: null,
+
+    /**
+     * APIProperty: zoom
+     * {Number} The initial zoom level of the map, to be used
+     * in conjunction with the center option.
+     */
+    zoom: null,
+
+    /**
+     * APIProperty: extent
+     * {OpenLayers.Bounds} The initial extent of the map, use
+     * either this option of the center and zoom options.
+     */
+    extent: null,
+    
+    /**
+     * Method: initComponent
+     *     Initializes the map panel. Creates an OpenLayers map if
+     *     none was provided in the config options passed to the
+     *     constructor.
+     */
+    initComponent: function(){
+        if(!(this.map instanceof OpenLayers.Map)) {
+            this.map = new OpenLayers.Map(this.map);
+        }
+        this.layers = new GeoExt.data.LayerStore({map: this.map});
+        
+        this.on("render", this.gx_onRender, this);
+        this.on("bodyresize", this.gx_onBodyResize, this);
+
+        GeoExt.MapPanel.superclass.initComponent.call(this);       
+    },
+    
+    /**
+     * Method: gx_onRender
+     *     Private method called after the panel has been
+     *     rendered.
+     */
+    gx_onRender: function() {
+        this.map.render(this.body.dom);
+        if(this.map.layers.length > 0) {
+            if(this.center && this.zoom) {
+                this.map.setCenter(this.center, this.zoom);
+            }  else if(this.extent) {
+                this.map.zoomToExtent(this.extent);
+            } else {
+                this.map.zoomToMaxExtent();
+            }
+        }
+    },
+
+    /**
+     * Method: gx_onBodyResize
+     *     Private method called after the panel has been
+     *     resized.
+     */
+    gx_onBodyResize: function() {
+        this.map.updateSize();
+    }
+});
+
+Ext.reg('gx_mappanel', GeoExt.MapPanel); 

Modified: sandbox/opengeo/alachua/lib/GeoExt.js
===================================================================
--- sandbox/opengeo/alachua/lib/GeoExt.js	2009-03-13 18:47:00 UTC (rev 219)
+++ sandbox/opengeo/alachua/lib/GeoExt.js	2009-03-13 18:51:27 UTC (rev 220)
@@ -76,7 +76,9 @@
             "GeoExt/data/FeatureReader.js",
             "GeoExt/data/FeatureStoreMediator.js",
             "GeoExt/data/LayerStoreMediator.js",
-            "GeoExt/data/ProtocolProxy.js"
+            "GeoExt/data/LayerStore.js",
+            "GeoExt/data/ProtocolProxy.js",
+            "GeoExt/widgets/MapPanel.js"
         );
 
         var agent = navigator.userAgent;

Added: sandbox/opengeo/alachua/tests/data/LayerStore.html
===================================================================
--- sandbox/opengeo/alachua/tests/data/LayerStore.html	                        (rev 0)
+++ sandbox/opengeo/alachua/tests/data/LayerStore.html	2009-03-13 18:51:27 UTC (rev 220)
@@ -0,0 +1,67 @@
+<!DOCTYPE html>
+<html debug="true">
+  <head>
+    <script type="text/javascript" src="../../../../ext/2.2.1/adapter/ext/ext-base.js"></script>
+    <script type="text/javascript" src="../../../../ext/2.2.1/ext-all-debug.js"></script>
+
+    <script type="text/javascript" src="../../../../openlayers/lib/OpenLayers.js"></script>
+
+    <!-- script linking to ../../lib/GeoExt.js does not work in FF2!!-->
+    <script type="text/javascript" src="../../lib/GeoExt/data/LayerStore.js"></script>
+    <script type="text/javascript" src="../../lib/GeoExt/widgets/MapPanel.js"></script>
+
+    <script type="text/javascript">
+       
+        function createMap() {
+            var map = new OpenLayers.Map();
+            return map;
+        }
+
+        function loadMapPanel() {
+            var map = createMap();
+
+            mapPanel = new GeoExt.MapPanel({
+                // panel options
+                id: "map-panel",
+                title: "GeoExt MapPanel",
+                renderTo: "mappanel",
+                height: 400,
+                width: 600,
+                // map panel-specific options
+                map: map,
+                center: new OpenLayers.LonLat(5, 45),
+                zoom: 4
+            });
+
+            return mapPanel;
+        }
+
+        function test_layerstore(t) {
+            t.plan(6);
+
+            var mapPanel = loadMapPanel();
+            var map = mapPanel.map;
+
+            var layer = new OpenLayers.Layer.Vector("Foo Layer");
+
+            map.addLayer(layer);
+
+            t.eq(map.layers.length,1,"Adding layer to map does not create duplicate layers on map");
+            t.eq(mapPanel.layers.getCount(),1,"Adding layer to map does not create duplicate records in LayerStore");
+
+            mapPanel.layers.removeLayer(layer);
+
+            t.eq(map.layers.length,0,"removeLayer on MapPanel's LayerStore removes layer from map");
+            t.eq(mapPanel.layers.getCount(),0,"removeLayer on MapPanel's LayerStore removes layer from map");
+
+            mapPanel.layers.addLayer(layer);
+            t.eq(map.layers.length,1,"Adding layer to MapPanel's LayerStore adds only one layer to map");
+            t.eq(mapPanel.layers.getCount(),1,"Adding layers to MapPanel's LayerStore does not create duplicate layers"); 
+
+
+        }
+    </script>
+  <body>
+    <div id="mappanel"></div>
+  </body>
+</html>


Property changes on: sandbox/opengeo/alachua/tests/data/LayerStore.html
___________________________________________________________________
Name: svn:mime-type
   + text/html
Name: svn:keywords
   + Id
Name: svn:eol-style
   + native

Modified: sandbox/opengeo/alachua/tests/list-tests.html
===================================================================
--- sandbox/opengeo/alachua/tests/list-tests.html	2009-03-13 18:47:00 UTC (rev 219)
+++ sandbox/opengeo/alachua/tests/list-tests.html	2009-03-13 18:51:27 UTC (rev 220)
@@ -1,6 +1,8 @@
 <ul id="testlist">
   <li>data/FeatureReader.html</li>
   <li>data/FeatureStoreMediator.html</li>
+  <li>data/LayerStore.html</li>
   <li>data/LayerStoreMediator.html</li>
   <li>data/ProtocolProxy.html</li>
+  <li>widgets/MapPanel.html</li>
 </ul>

Added: sandbox/opengeo/alachua/tests/widgets/MapPanel.html
===================================================================
--- sandbox/opengeo/alachua/tests/widgets/MapPanel.html	                        (rev 0)
+++ sandbox/opengeo/alachua/tests/widgets/MapPanel.html	2009-03-13 18:51:27 UTC (rev 220)
@@ -0,0 +1,53 @@
+<!DOCTYPE html>
+<html debug="true">
+  <head>
+    <script type="text/javascript" src="../../../../ext/2.2.1/adapter/ext/ext-base.js"></script>
+    <script type="text/javascript" src="../../../../ext/2.2.1/ext-all-debug.js"></script>
+
+    <script type="text/javascript" src="../../../../openlayers/lib/OpenLayers.js"></script>
+
+    <!-- script linking to ../../lib/GeoExt.js does not work in FF2!!-->
+    <script type="text/javascript" src="../../lib/GeoExt/data/LayerStore.js"></script>
+    <script type="text/javascript" src="../../lib/GeoExt/widgets/MapPanel.js"></script>
+
+    <script type="text/javascript">
+       
+        function createMap() {
+            var map = new OpenLayers.Map();
+            var layer = new OpenLayers.Layer("test", {isBaseLayer: true});
+            map.addLayer(layer);
+            return map;
+        }
+
+        function loadMapPanel() {
+            var map = createMap();
+
+            mapPanel = new GeoExt.MapPanel({
+                // panel options
+                id: "map-panel",
+                title: "GeoExt MapPanel",
+                renderTo: "mappanel",
+                height: 400,
+                width: 600,
+                // map panel-specific options
+                map: map,
+                center: new OpenLayers.LonLat(5, 45),
+                zoom: 4
+            });
+
+            return mapPanel;
+        }
+
+        function test_mappanel(t) {
+            t.plan(2)
+            
+            loadMapPanel();
+            t.eq(mapPanel.map.getCenter().toString(), "lon=5,lat=45", "Map center set correctly");
+            t.eq(mapPanel.map.getZoom(), 4, "Zoom set correctly");
+        }
+
+    </script>
+  <body>
+    <div id="mappanel"></div>
+  </body>
+</html>


Property changes on: sandbox/opengeo/alachua/tests/widgets/MapPanel.html
___________________________________________________________________
Name: svn:mime-type
   + text/html
Name: svn:keywords
   + Id
Name: svn:eol-style
   + native



More information about the Commits mailing list