[Commits] r663 - in sandbox/bartvde/legend/geoext: examples lib lib/GeoExt/widgets lib/GeoExt/widgets/legend

commits at geoext.org commits at geoext.org
Fri May 8 22:39:32 CEST 2009


Author: bartvde
Date: 2009-05-08 22:39:32 +0200 (Fri, 08 May 2009)
New Revision: 663

Added:
   sandbox/bartvde/legend/geoext/lib/GeoExt/widgets/legend/
   sandbox/bartvde/legend/geoext/lib/GeoExt/widgets/legend/WMS.js
Modified:
   sandbox/bartvde/legend/geoext/examples/legendpanel.js
   sandbox/bartvde/legend/geoext/lib/GeoExt.js
   sandbox/bartvde/legend/geoext/lib/GeoExt/widgets/LegendPanel.js
Log:
make legend panel more pluggable, first try

Modified: sandbox/bartvde/legend/geoext/examples/legendpanel.js
===================================================================
--- sandbox/bartvde/legend/geoext/examples/legendpanel.js	2009-05-08 18:54:03 UTC (rev 662)
+++ sandbox/bartvde/legend/geoext/examples/legendpanel.js	2009-05-08 20:39:32 UTC (rev 663)
@@ -21,12 +21,6 @@
             {isBaseLayer: false})
     ]);
 
-    legendPanel = new GeoExt.LegendPanel({
-        map: map, 
-        width: 200,
-        autoScroll: true,
-        region: 'west'});
-
     mapPanel = new GeoExt.MapPanel({
         region: 'center',
         height: 400,
@@ -35,6 +29,12 @@
         center: new OpenLayers.LonLat(146.4, -41.6),
         zoom: 7});
 
+    legendPanel = new GeoExt.LegendPanel({
+        layers: mapPanel.layers, 
+        width: 200,
+        autoScroll: true,
+        region: 'west'});
+
      new Ext.Panel({
         title: "GeoExt LegendPanel Demo",
         layout: 'border',

Modified: sandbox/bartvde/legend/geoext/lib/GeoExt/widgets/LegendPanel.js
===================================================================
--- sandbox/bartvde/legend/geoext/lib/GeoExt/widgets/LegendPanel.js	2009-05-08 18:54:03 UTC (rev 662)
+++ sandbox/bartvde/legend/geoext/lib/GeoExt/widgets/LegendPanel.js	2009-05-08 20:39:32 UTC (rev 663)
@@ -1,438 +1,38 @@
-/*
- * Copyright (C) 2008 Camptocamp, OpenGeo
- *
- * 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.LegendPanel
- *      LegendPanel is an Ext.Panel that displays a legend for all layers in a
- *      map, automatically adding and removing legend graphics when layers are 
- *      added and removed from the map. Currently, the following layers are 
- *      supported: 
- *      - {OpenLayers.Layer.WMS}
- *
- *      In the future other layer types can be added.
- *
- * Inherits from:
- *  - {Ext.Panel}
- */
-
-/**
- * Constructor: GeoExt.LegendPanel
- * Create an instance of GeoExt.LegendPanel
- *
- * Parameters:
- * config - {Object} A config object used to set the legend
- *     panel's properties.
- *
- *     In addition to the properties respected by an Ext panel, the LegendPanel
- *     recognizes a property named 'map' which can be an OpenLayers.Map 
- *     instance, a GeoExt.MapPanel, or the component id of a GeoExt.MapPanel.  
- *     This property specifies the map that provides the layers for the legend 
- *     panel.
- *
- * Returns:
- * {<GeoExt.LegendPanel>}
- */
-
 GeoExt.LegendPanel = Ext.extend(Ext.Panel, {
-    /**
-     * APIProperty: wmsMode
-     * {Integer} should the legend component use SLD WMS GetLegendGraphic
-     *     requests or LegendURLs from the GetCapabilities reponse?
-     *     One of: GeoExt.LegendPanel.GETLEGENDGRAPHIC or 
-     *     GeoExt.LegendPanel.LEGENDURL. The LEGENDURL option requires
-     *     the OpenLayers.Format.WMSCapabilities parser. GETLEGENDGRAPHIC is
-     *     the default.
-     */
-    wmsMode: 0, // GeoExt.LegendPanel.GETLEGENDGRAPHIC,
 
     /**
-     * APIProperty: map
-     * {OpenLayers.Map} The Map instance that the legend panel will stay in 
-     *     sync with.
+     * APIProperty: layers
+     * {<GeoExt.data.LayerStore>} 
      */
-    map: null,
+    layers: null,
 
     /**
-     * APIProperty: labelCls
-     * {String} Additional css class to put on the legend labels
-     */
-    labelCls: null,
-
-    /**
-     * APIProperty: wmsLegendFormat
-     * {String} the format to use in the GetLegendGraphic requests, defaults
-     *     to image/png. The value should be a valid mime-type.
-     */
-    wmsLegendFormat: "image/png",
-
-    /**
-     * APIProperty: ascending
-     * {Boolean} if true the layers in the tree will show the
-     *     bottom OpenLayer layer on top and the top OpenLayer layer on the
-     *     bottom. If false, this is inverted.
-     */
-    ascending: true,
-
-    /**
-     * APIProperty: static
-     * {Boolean} if true the LegendPanel will not listen to the addlayer,
-     *     changelayer and removelayer events. So it will load with the initial
-     *     state of the map object and not change anymore.
-     */
-    static: false,
-
-    /**
-     * Property: idPrefix
-     * {String} the prefix to use for the id attribute value of the sub panels
-     *    (gxt for GeoExt and lp for LegendPanel)
-    */
-    idPrefix: 'gxt-lp-',
-
-    /**
      * Method: initComponent
      *      Initialize the component and register the map property if provided.
      */
     initComponent: function() {
         GeoExt.LegendPanel.superclass.initComponent.call(this);
-        if (!(this.map instanceof OpenLayers.Map)) {
-            if (typeof this.map == "string") {
-                var mapPanel = Ext.getCmp(this.map);
-                this.map = mapPanel.map;
-            } else {
-                // Assume it's a MapPanel
-                this.map = this.map.map;
-            }
-        } else {
-            this.setMap(this.map);
-        }
     },
 
     /**
-     * APIMethod: setMap
-     * Assign a map object to the legend panel
-     *
-     * Parameters:
-     * map - {<OpenLayers.Map>}
-     */
-    setMap: function(map) {
-        this.map = map;
-        if (!this.static) {
-            this.map.events.register("addlayer", this, this.addLayer);
-            this.map.events.register("changelayer", this, this.changeLayer);
-            this.map.events.register("removelayer", this, this.removeLayer);
-        }
-    },
-
-    /**
      * Method: onRender
      *      This function is called when the component renders.
      */
     onRender: function(ct, position) {
         GeoExt.LegendPanel.superclass.onRender.call(this, ct, position);
-        if (this.map) {
-            var layers = this.map.layers.slice();
-            if (!this.ascending) {
-                layers.reverse();
-            }
-            for (var i=0, len=layers.length; i<len; i++) {
-                var layer = layers[i];
-                this.createLegend(layer);
-            }
-        }
-    },
-
-    /**
-     * Method: onDestroy
-     *      This function is called when the component destroys. We deregister
-     *      the events here.
-     */
-    onDestroy: function() {
-        if (!this.static) {
-            this.map.events.unregister("addlayer", this, this.addLayer);
-            this.map.events.unregister("changelayer", this, this.changeLayer);
-            this.map.events.unregister("removelayer", this, this.removeLayer);
-        }
-        GeoExt.LegendPanel.superclass.onDestroy.call(this);
-    },
-
-    /**
-     * Method: addLayer
-     *      Internal function called on the addlayer event
-     *
-     * Parameters:
-     * evt - {Object} The event object sent by OpenLayers
-     */
-    addLayer: function(evt) {
-        if (evt.layer && evt.layer instanceof OpenLayers.Layer.WMS) {
-            this.createLegend(evt.layer);
-        }
-    },
-
-    /**
-     * Method: removeLayer
-     *      Internal function called on the removelayer event
-     *
-     * Parameters:
-     * evt - {Object} The event object sent by OpenLayers
-     */
-    removeLayer: function(evt) {
-        if (evt.layer && evt.layer instanceof OpenLayers.Layer.WMS) {
-            this.remove(Ext.getCmp(this.generatePanelId(evt.layer)));
-        }
-    },
-
-    /**
-     * Method: changeLayer
-     *      Internal function called on the changelayer event
-     *
-     * Parameters:
-     * evt - {Object} The event object sent by OpenLayers
-     */
-    changeLayer: function(evt) {
-        // TODO deal with property order if we want to reflect the order
-        // in the legend
-        if (evt && evt.layer && evt.property && 
-          (evt.layer instanceof OpenLayers.Layer.WMS)) {
-            var panel = Ext.getCmp(this.generatePanelId(evt.layer));
-            if (!panel) {
-                panel = this.createLegend(evt.layer);
-            }
-            if (evt.property == 'visibility') {
-                if (panel) {
-                    panel.setVisible(evt.layer.getVisibility());
-                }
-            }
-            // it is possible for an application to hide layers from the legend
-            // by setting the hideInLegend property on the layer
-            // when the hideInLegend property changes, the application is
-            // responsible for triggering a changelayer event with a property
-            // named legendvisibility.
-            else if (evt.property == 'legendvisibility') {
-                if (panel) {
-                    panel.setVisible(!evt.layer.hideInLegend);
-                }
-            }else if(evt.property == 'order') {
-                var newPosition;
-                if(this.ascending){
-                    newPosition = this.map.getLayerIndex(evt.layer);
-                } else {
-                    newPosition = this.map.layers.length - 1
-                        - this.map.getLayerIndex(evt.layer);
-                }
-
-                this.moveLegend(panel, evt.layer, newPosition);
-            }
-        }
-    },
-
-    /**
-     * Method: moveLegend
-     * Relocate a layer within the legend panel.  This does not actually reposition the existing panel, but creates a new panel and inserts it at the new location since Ext layouts do not, in general, support dynamic reordering.
-     *
-     * Parameters: 
-     * panel - {Ext.Panel} the panel, expected to be a child of the legend panel
-     * layer - {OpenLayers.Layer} the layer that has been moved
-     * position - {Integer} the new position of the legend graphic within the 
-     *    panel
-     */
-    moveLegend: function(panel, layer, position){
-        var cfg = panel.initialConfig;
-        this.remove(panel);
-        var newPanel = this.createLegendPanel(
-            this.generatePanelId(layer),
-            layer.name, 
-            this.generateImageGroup(layer)
-        );
-        this.insert(position, panel);
+        this.layers.each(function(record) { 
+            var layer = record.get('layer');
+            // use the right legend generator for this layer type
+            var legendGenerator = GeoExt.legend[layer.CLASS_NAME.replace(
+                'OpenLayers.Layer.', '')];
+            var legend = new legendGenerator({layer: layer});
+            this.add(legend);
+        }, this);
         this.doLayout();
-    },
-
-    /**
-     * Method: generatePanelId
-     *     Generate an id attribute value for the panel.
-     *     It is assumed that the combination of layer.params.LAYERS and
-     *     layer.id is unique.
-     *
-     * Parameters:
-     * layer - {<OpenLayers.Layer.WMS>} the layer object
-     *
-     * Returns: 
-     * {String}
-     */
-    generatePanelId: function(layer) {
-        if (layer) {
-            return this.idPrefix + layer.id;
-        }
-    },
-
-    /**
-     * Method: onImageLoadError
-     *     When the image fails loading (e.g. when the server returns an XML
-     *     exception) we need to set the src to a blank image otherwise IE
-     *     will show the infamous red cross.
-     */
-    onImageLoadError: function() {
-        this.src = Ext.BLANK_IMAGE_URL;
-    },
-
-    /**
-     * Method: createLegendPanel
-     *     Create a panel for every layer, it will contain a Label with the
-     *     layer's name and for every possible sub layer an image
-     *
-     * Parameters:
-     * id - {String} the unique id to use for the panel
-     * title - {String} the title of the layer
-     * legImg - {Object} the legend image object
-     *
-     * Returns:
-     * {<Ext.Panel>}
-     */
-    createLegendPanel: function(id, title, legImg) {
-        // TODO: we probably need the ability to change the css class
-        // of the label
-        var panelConfig = {
-            id: id,
-            bodyStyle: this.bodyStyle,
-            items: [
-                new Ext.form.Label({
-                    text: title,
-                    cls: 'x-form-item x-form-item-label' + 
-                        (this.labelCls ? ' ' + this.labelCls : '')
-                })
-            ]
-        };
-
-        panelConfig = Ext.applyIf(panelConfig, this.childDefaults);
-
-        var panel = new Ext.Panel(panelConfig);
-        for (var i=0, len=legImg.length; i<len; i++) {
-            panel.add(new Ext.BoxComponent({el: legImg[i]}));
-        }
-        return panel;
-    },
-
-    /**
-     * Method: getLegendUrl
-     *     Get the URL from which the legend image can be retrieved
-     *
-     * Parameters:
-     * layer - {<OpenLayers.Layer.WMS>} the WMS layer
-     * layerName - {String} one of the layers from the LAYERS parameter
-     *
-     * Returns:
-     * {String}
-     */
-    getLegendUrl: function(layer, layerName) {
-        if (this.wmsMode == GeoExt.LegendPanel.GETLEGENDGRAPHIC) {
-           return layer.getFullRequestString({
-                REQUEST: "GetLegendGraphic",
-                WIDTH: null,
-                HEIGHT: null,
-                EXCEPTIONS: "application/vnd.ogc.se_xml",
-                LAYER: layerName,
-                LAYERS: null,
-                SRS: null,
-                FORMAT: this.wmsLegendFormat
-            });
-        }
-    },
-
-    /**
-     * Method: createImage
-     *     Create an image object for the legend image
-     *
-     * Parameters:
-     * src - {String} the source of the image (url)
-     * id - {String} the id (prefix) for the image object
-     *
-     * Returns:
-     * {DOMElement}
-     */
-    createImage: function(src, id) {
-        var legendImage = document.createElement("img");
-        Ext.EventManager.addListener(legendImage, 'error', 
-            this.onImageLoadError, legendImage);
-        legendImage.src = src;
-        legendImage.id = id+'_img';
-        return legendImage;
-    },
-
-    /**
-     * Method: createLegend
-     *     Create the legend panel for a layer
-     *
-     * Parameters:
-     * layer - {<OpenLayers.Layer>} the layer object
-     */
-    createLegend: function(layer) {
-        // currently only OpenLayers.Layer.WMS is supported and
-        // only for visible layers a legend is created.
-        // If an application does not want a layer in the legend
-        // they can set hideInLegend to true on the layer.
-        var panel;
-        if (layer instanceof OpenLayers.Layer.WMS && 
-            layer.getVisibility() && !layer.hideInLegend) {
-                panel = this.createLegendPanel(
-                    this.generatePanelId(layer),
-                    layer.name, 
-                    this.generateImageGroup(layer)
-                );
-
-                if (this.ascending) {
-                    this.add(panel);
-                } else {
-                    var idx = (this.map.layers.length-1)-this.map.getLayerIndex(layer);
-                    this.insert(idx, panel);
-                }
-                this.doLayout();
-        }
-        return panel;
-    },
-
-    /**
-     * Examine a layer and create an array of DOM nodes containing the legend 
-     * for the layer or its components (for example, a single 
-     * OpenLayers.Layer.WMS containing multiple layer names in its LAYERS 
-     * array).
-     *
-     * Parameters:
-     * layer - {OpenLayers.Layer}  The layer for which to produce legend 
-     *    graphics.
-     */
-    generateImageGroup: function(layer) {
-        var layers = layer.params.LAYERS.split(",");
-        var legImg = [];
-        for (var i = 0, len = layers.length; i < len; i++){
-            var layerName = layers[i];
-            legImg.push(this.createImage(
-                this.getLegendUrl(layer, layerName),
-                this.generatePanelId(layer)+i
-            )); 
-        }
-        return legImg;
     }
+
 });
 
-GeoExt.LegendPanel.LEGENDURL = 1;
-GeoExt.LegendPanel.GETLEGENDGRAPHIC = 0;
-
 Ext.reg('gx_legend', GeoExt.LegendPanel);

Added: sandbox/bartvde/legend/geoext/lib/GeoExt/widgets/legend/WMS.js
===================================================================
--- sandbox/bartvde/legend/geoext/lib/GeoExt/widgets/legend/WMS.js	                        (rev 0)
+++ sandbox/bartvde/legend/geoext/lib/GeoExt/widgets/legend/WMS.js	2009-05-08 20:39:32 UTC (rev 663)
@@ -0,0 +1,170 @@
+Ext.namespace('GeoExt.legend');
+
+GeoExt.legend.WMS = function(config) {
+    return new GeoExt.legend.WMSGenerator(config);
+};
+
+GeoExt.legend.WMSGenerator = Ext.extend(Ext.Panel, {
+
+    /**
+     * APIProperty: wmsLegendFormat
+     * {String} the format to use in the GetLegendGraphic requests, defaults
+     *     to image/png. The value should be a valid mime-type.
+     */
+    wmsLegendFormat: "image/png",
+
+    /**
+     * Property: idPrefix
+     * {String} the prefix to use for the id attribute value of the sub panels
+     *    (gxt for GeoExt and lp for LegendPanel)
+    */
+    idPrefix: 'gxt-lp-',
+
+    initComponent: function() {
+        GeoExt.legend.WMSGenerator.superclass.initComponent.call(this);
+        this.createLegend(this.layer);
+    },
+
+    /**
+     * Method: createImage
+     *     Create an image object for the legend image
+     *
+     * Parameters:
+     * src - {String} the source of the image (url)
+     * id - {String} the id (prefix) for the image object
+     *
+     * Returns:
+     * {DOMElement}
+     */
+    createImage: function(src, id) {
+        var legendImage = document.createElement("img");
+        Ext.EventManager.addListener(legendImage, 'error', 
+            this.onImageLoadError, legendImage);
+        legendImage.src = src;
+        legendImage.id = id+'_img';
+        return legendImage;
+    },
+    
+    /**
+     * Method: getLegendUrl
+     *     Get the URL from which the legend image can be retrieved
+     *
+     * Parameters:
+     * layer - {<OpenLayers.Layer.WMS>} the WMS layer
+     * layerName - {String} one of the layers from the LAYERS parameter
+     *
+     * Returns:
+     * {String}
+     */
+    getLegendUrl: function(layer, layerName) {
+       return layer.getFullRequestString({
+            REQUEST: "GetLegendGraphic",
+            WIDTH: null,
+            HEIGHT: null,
+            EXCEPTIONS: "application/vnd.ogc.se_xml",
+            LAYER: layerName,
+            LAYERS: null,
+            SRS: null,
+            FORMAT: this.wmsLegendFormat
+        });
+    },
+
+    /**
+     * Method: createLegend
+     *     Create the legend panel for a layer
+     *
+     * Parameters:
+     * layer - {<OpenLayers.Layer>} the layer object
+     */
+    createLegend: function(layer) {
+        var panel = null;
+        if (layer.getVisibility()) {
+            panel = this.createLegendPanel(
+                this.generatePanelId(layer),
+                layer.name, 
+                this.generateImageGroup(layer)
+            );
+        }
+        this.add(panel);
+        this.doLayout();
+    },
+    
+    /**
+     * Method: generatePanelId
+     *     Generate an id attribute value for the panel.
+     *     It is assumed that the combination of layer.params.LAYERS and
+     *     layer.id is unique.
+     *
+     * Parameters:
+     * layer - {<OpenLayers.Layer.WMS>} the layer object
+     *
+     * Returns: 
+     * {String}
+     */
+    generatePanelId: function(layer) {
+        if (layer) {
+            return this.idPrefix + layer.id;
+        }
+    },
+
+    /**
+     * Method: createLegendPanel
+     *     Create a panel for every layer, it will contain a Label with the
+     *     layer's name and for every possible sub layer an image
+     *
+     * Parameters:
+     * id - {String} the unique id to use for the panel
+     * title - {String} the title of the layer
+     * legImg - {Object} the legend image object
+     *
+     * Returns:
+     * {<Ext.Panel>}
+     */
+    createLegendPanel: function(id, title, legImg) {
+        // TODO: we probably need the ability to change the css class
+        // of the label
+        var panelConfig = {
+            id: id,
+            bodyStyle: this.bodyStyle,
+            items: [
+                new Ext.form.Label({
+                    text: title,
+                    cls: 'x-form-item x-form-item-label' + 
+                        (this.labelCls ? ' ' + this.labelCls : '')
+                })
+            ]
+        };
+
+        panelConfig = Ext.applyIf(panelConfig, this.childDefaults);
+
+        var panel = new Ext.Panel(panelConfig);
+        for (var i=0, len=legImg.length; i<len; i++) {
+            panel.add(new Ext.BoxComponent({el: legImg[i]}));
+        }
+        return panel;
+    },
+
+    /**
+     * Examine a layer and create an array of DOM nodes containing the legend 
+     * for the layer or its components (for example, a single 
+     * OpenLayers.Layer.WMS containing multiple layer names in its LAYERS 
+     * array).
+     *
+     * Parameters:
+     * layer - {OpenLayers.Layer}  The layer for which to produce legend 
+     *    graphics.
+     */
+    generateImageGroup: function(layer) {
+        var layers = layer.params.LAYERS.split(",");
+        var legImg = [];
+        for (var i = 0, len = layers.length; i < len; i++){
+            var layerName = layers[i];
+            legImg.push(this.createImage(
+                this.getLegendUrl(layer, layerName),
+                this.generatePanelId(layer)+i
+            )); 
+        }
+        return legImg;
+    }
+
+});

Modified: sandbox/bartvde/legend/geoext/lib/GeoExt.js
===================================================================
--- sandbox/bartvde/legend/geoext/lib/GeoExt.js	2009-05-08 18:54:03 UTC (rev 662)
+++ sandbox/bartvde/legend/geoext/lib/GeoExt.js	2009-05-08 20:39:32 UTC (rev 663)
@@ -68,6 +68,7 @@
             "GeoExt/data/WMSCapabilitiesReader.js",
             "GeoExt/data/WMSCapabilitiesStore.js",
             "GeoExt/data/ProtocolProxy.js",
+            "GeoExt/widgets/legend/WMS.js",
             "GeoExt/widgets/LegendPanel.js",
             "GeoExt/widgets/MapPanel.js",
             "GeoExt/widgets/Popup.js"



More information about the Commits mailing list