[Commits] r791 - in sandbox/opengeo/geoexplorer: examples lib lib/GeoExt/widgets lib/GeoExt/widgets/legend tests tests/lib/GeoExt/widgets

commits at geoext.org commits at geoext.org
Fri May 15 22:53:26 CEST 2009


Author: tcoulter
Date: 2009-05-15 22:53:26 +0200 (Fri, 15 May 2009)
New Revision: 791

Added:
   sandbox/opengeo/geoexplorer/examples/legendpanel.html
   sandbox/opengeo/geoexplorer/examples/legendpanel.js
   sandbox/opengeo/geoexplorer/lib/GeoExt/widgets/legend/
   sandbox/opengeo/geoexplorer/lib/GeoExt/widgets/legend/Image.js
   sandbox/opengeo/geoexplorer/lib/GeoExt/widgets/legend/WMS.js
   sandbox/opengeo/geoexplorer/tests/lib/GeoExt/widgets/LegendPanel.html
Modified:
   sandbox/opengeo/geoexplorer/lib/GeoExt.js
   sandbox/opengeo/geoexplorer/tests/list-tests.html
Log:
Oops. These should have made it with the last commit.

Added: sandbox/opengeo/geoexplorer/examples/legendpanel.html
===================================================================
--- sandbox/opengeo/geoexplorer/examples/legendpanel.html	                        (rev 0)
+++ sandbox/opengeo/geoexplorer/examples/legendpanel.html	2009-05-15 20:53:26 UTC (rev 791)
@@ -0,0 +1,26 @@
+<html>
+    <head>
+        <script type="text/javascript" src="http://dev.geoext.org/trunk/ext/adapter/ext/ext-base.js"></script>
+        <script type="text/javascript" src="http://dev.geoext.org/trunk/ext/ext-all.js"></script>
+        <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-2.2.1/resources/css/ext-all.css" />
+        <link rel="stylesheet" type="text/css" href="http://extjs.com/deploy/dev/examples/shared/examples.css"></link>
+        <script src="http://openlayers.org/api/2.8-rc2/OpenLayers.js"></script>
+        <script type="text/javascript" src="../lib/GeoExt.js"></script>
+
+        <script type="text/javascript" src="legendpanel.js"></script>
+
+        <style type="text/css">
+        .mylabel {
+            font-weight: bold;
+            color: red;
+        }
+        </style>
+    </head>
+    <body>
+        <h1>GeoExt.LegendPanel</h1>
+        <p>This example shows the how to create a LegendPanel that autopopulates with legends from a map
+        that has already been created.</p>
+        <p>The js is not minified so it is readable. See <a href="legendpanel.js">legendpanel.js</a>.</p>
+        <div id="view"></div>
+    </body>
+</html>

Added: sandbox/opengeo/geoexplorer/examples/legendpanel.js
===================================================================
--- sandbox/opengeo/geoexplorer/examples/legendpanel.js	                        (rev 0)
+++ sandbox/opengeo/geoexplorer/examples/legendpanel.js	2009-05-15 20:53:26 UTC (rev 791)
@@ -0,0 +1,83 @@
+
+var mapPanel;
+
+Ext.onReady(function() {
+    var map = new OpenLayers.Map({allOverlays: true});
+    map.addLayers([
+        new OpenLayers.Layer.WMS(
+            "Tasmania",
+            "http://publicus.opengeo.org/geoserver/wms?",
+            {layers: 'topp:tasmania_state_boundaries', format: 'image/png', transparent: true},
+            {singleTile: true}),
+        new OpenLayers.Layer.WMS(
+            "Cities and Roads",
+            "http://publicus.opengeo.org/geoserver/wms?",
+            {layers: 'topp:tasmania_cities,topp:tasmania_roads', format: 'image/png', transparent: true},
+            {singleTile: true}),
+        new OpenLayers.Layer.Vector('Polygons', {styleMap: new OpenLayers.StyleMap({
+                "default": new OpenLayers.Style({
+                    pointRadius: 8,
+                    fillColor: "#00ffee",
+                    strokeColor: "#000000",
+                    strokeWidth: 2
+                }) }) })
+    ]);
+
+    addLayer = function() {
+        var wmslayer = new OpenLayers.Layer.WMS("Bodies of Water",
+            "http://publicus.opengeo.org/geoserver/wms?",
+            {layers: 'topp:tasmania_water_bodies', format: 'image/png', transparent: true},
+            {singleTile: true});
+        mapPanel.map.addLayer(wmslayer);
+    };
+
+    removeLayer = function() {
+        mapPanel.map.removeLayer(mapPanel.map.layers[1]);
+    };
+
+    moveLayer = function(idx) {
+        mapPanel.map.setLayerIndex(mapPanel.map.layers[0], idx);
+    };
+
+    toggleVisibility = function() {
+        mapPanel.map.layers[1].setVisibility(!mapPanel.map.layers[1].getVisibility());
+    };
+
+    updateHideInLegend = function() {
+        mapPanel.layers.getAt(1).set("hideInLegend", true);
+    };
+
+
+    mapPanel = new GeoExt.MapPanel({
+        region: 'center',
+        height: 400,
+        width: 600,
+        map: map,
+        center: new OpenLayers.LonLat(146.4, -41.6),
+        zoom: 7});
+
+    legendPanel = new GeoExt.LegendPanel({
+        labelCls: 'mylabel',
+        ascending: false,
+        bodyStyle: 'padding:5px',
+        width: 300,
+        tbar: new Ext.Toolbar({items: [
+            new Ext.Button({text: 'add', handler: addLayer}),
+            new Ext.Button({text: 'remove', handler: removeLayer}),
+            new Ext.Button({text: 'movetotop', handler: function() { moveLayer(10); } }),
+            new Ext.Button({text: 'moveup', handler: function() { moveLayer(1); } }),
+            new Ext.Button({text: 'togglevis', handler: toggleVisibility}),
+            new Ext.Button({text: 'hide', handler: updateHideInLegend})
+            ]}),
+        autoScroll: true,
+        region: 'west'});
+
+     new Ext.Panel({
+        title: "GeoExt LegendPanel Demo",
+        layout: 'border',
+        renderTo: 'view',
+        height: 400,
+        width: 800,
+        items: [legendPanel, mapPanel] });
+});
+

Added: sandbox/opengeo/geoexplorer/lib/GeoExt/widgets/legend/Image.js
===================================================================
--- sandbox/opengeo/geoexplorer/lib/GeoExt/widgets/legend/Image.js	                        (rev 0)
+++ sandbox/opengeo/geoexplorer/lib/GeoExt/widgets/legend/Image.js	2009-05-15 20:53:26 UTC (rev 791)
@@ -0,0 +1,66 @@
+/* Copyright (C) 2008-2009 The Open Source Geospatial Foundation
+ * Published under the BSD license.
+ * See http://geoext.org/svn/geoext/core/trunk/license.txt for the full text
+ * of the license.
+ * 
+ * pending approval */
+
+/** api: (define)
+ *  module = GeoExt.legend
+ *  class = Image
+ */
+
+Ext.namespace('GeoExt', 'GeoExt.legend');
+
+/** api: constructor
+ *  .. class:: Image(config)
+ *
+ *  Show a legend image in a BoxComponent and make sure load errors are dealt
+ *  with.
+ */
+GeoExt.legend.Image = Ext.extend(Ext.BoxComponent, {
+
+    /** api: config[url]
+     *  ``String``  The url of the image to load
+     */
+    url: null,
+
+    /** api: config[imgCls]
+     *  ``String``  Optional css class to apply to img tag
+     */
+    imgCls: null,
+
+    /** private: method[initComponent]
+     *  Initializes the legend image component. 
+     */
+    initComponent: function() {
+        GeoExt.legend.Image.superclass.initComponent.call(this);
+        this.autoEl = {tag: 'img',
+            'class': (this.imgCls ? this.imgCls : ''), src: this.url};
+    },
+
+    /** private: method[onRender]
+     *  Private method called when the legend image component is being
+     *  rendered.
+     */
+    onRender: function(ct, position) {
+        GeoExt.legend.Image.superclass.onRender.call(this, ct, position);
+        this.getEl().on('error', this.onImageLoadError, this);
+    },
+
+    /** private: method[onDestroy]
+     *  Private method called during the destroy sequence.
+     */
+    onDestroy: function() {
+        this.getEl().un('error', this.onImageLoadError, this);
+        GeoExt.legend.Image.superclass.onDestroy.apply(this, arguments);
+    },
+    
+    /** private: method[onImageLoadError]
+     *  Private method called if the legend image fails loading.
+     */
+    onImageLoadError: function() {
+        this.getEl().dom.src = Ext.BLANK_IMAGE_URL;
+    }
+
+});

Added: sandbox/opengeo/geoexplorer/lib/GeoExt/widgets/legend/WMS.js
===================================================================
--- sandbox/opengeo/geoexplorer/lib/GeoExt/widgets/legend/WMS.js	                        (rev 0)
+++ sandbox/opengeo/geoexplorer/lib/GeoExt/widgets/legend/WMS.js	2009-05-15 20:53:26 UTC (rev 791)
@@ -0,0 +1,87 @@
+/* Copyright (C) 2008-2009 The Open Source Geospatial Foundation
+ * Published under the BSD license.
+ * See http://geoext.org/svn/geoext/core/trunk/license.txt for the full text
+ * of the license.
+ *
+ * pending approval */
+
+/**
+ * @include GeoExt/widgets/legend/Image.js
+ */
+
+/** api: (define)
+ *  module = GeoExt.legend
+ *  class = WMS
+ */
+Ext.namespace('GeoExt', 'GeoExt.legend');
+
+/** api: constructor
+ *  .. class:: WMS(config)
+ *
+ *  Show a legend image for a WMS layer.
+ */
+GeoExt.legend.WMS = Ext.extend(Ext.Panel, {
+
+    /** api: config[imageFormat]
+     *  ``String``  
+     *  The image format to request the legend image in.
+     *  Defaults to image/png.
+     */
+    imageFormat: "image/gif",
+
+    /** api: config[layer]
+     *  ``OpenLayers.Layer.WMS``
+     *  The WMS layer to request the legend for.
+     */
+    layer: null,
+
+    /** api: config[bodyBorder]
+     *  ``Boolean``
+     *  Show a border around the legend image or not. Default is false.
+     */
+    bodyBorder: false,
+
+    /** private: method[initComponent]
+     *  Initializes the WMS legend. For group layers it will create multiple
+     *  image box components.
+     */
+    initComponent: function() {
+        GeoExt.legend.WMS.superclass.initComponent.call(this);
+        this.createLegend();
+    },
+
+    /** private: method[getLegendUrl]
+     *  :param layer: ``OpenLayers.Layer.WMS`` The OpenLayers WMS layer object
+     *  :param layerName: ``String`` The name of the layer 
+     *  (used in the LAYERS parameter)
+     *  :return: ``String`` The url of the SLD WMS GetLegendGraphic request.
+     *
+     *  Get the url for the SLD WMS GetLegendGraphic request.
+     */
+    getLegendUrl: function(layerName) {
+       return this.layer.getFullRequestString({
+           REQUEST: "GetLegendGraphic",
+           WIDTH: null,
+           HEIGHT: null,
+           EXCEPTIONS: "application/vnd.ogc.se_xml",
+           LAYER: layerName,
+           LAYERS: null,
+           SRS: null,
+           FORMAT: this.imageFormat
+       });
+    },
+
+    /** private: method[createLegend]
+     *  Add one BoxComponent per sublayer to this panel.
+     */
+    createLegend: function() {
+        var layers = this.layer.params.LAYERS.split(",");
+        for (var i = 0, len = layers.length; i < len; i++){
+            var layerName = layers[i];
+            var legend = new GeoExt.legend.Image({url:
+                this.getLegendUrl(layerName)});
+            this.add(legend);
+        }
+    }
+
+});

Modified: sandbox/opengeo/geoexplorer/lib/GeoExt.js
===================================================================
--- sandbox/opengeo/geoexplorer/lib/GeoExt.js	2009-05-15 20:52:26 UTC (rev 790)
+++ sandbox/opengeo/geoexplorer/lib/GeoExt.js	2009-05-15 20:53:26 UTC (rev 791)
@@ -81,7 +81,10 @@
             "GeoExt/widgets/tree/LayerContainer.js",
             "GeoExt/widgets/form/SearchAction.js",
             "GeoExt/widgets/form/BasicForm.js",
-            "GeoExt/widgets/form/FormPanel.js"
+            "GeoExt/widgets/form/FormPanel.js",
+            "GeoExt/widgets/legend/Image.js",
+            "GeoExt/widgets/legend/WMS.js",
+            "GeoExt/widgets/LegendPanel.js"
         );
 
         var agent = navigator.userAgent;

Added: sandbox/opengeo/geoexplorer/tests/lib/GeoExt/widgets/LegendPanel.html
===================================================================
--- sandbox/opengeo/geoexplorer/tests/lib/GeoExt/widgets/LegendPanel.html	                        (rev 0)
+++ sandbox/opengeo/geoexplorer/tests/lib/GeoExt/widgets/LegendPanel.html	2009-05-15 20:53:26 UTC (rev 791)
@@ -0,0 +1,74 @@
+<!DOCTYPE html>
+<html debug="true">
+  <head>
+    <script type="text/javascript" src="../../../../../openlayers/lib/OpenLayers.js"></script>
+    <script type="text/javascript" src="../../../../../ext/adapter/ext/ext-base.js"></script>
+    <script type="text/javascript" src="../../../../../ext/ext-all-debug.js"></script>
+    <script type="text/javascript" src="../../../../lib/GeoExt.js"></script>
+
+    <script type="text/javascript">
+
+        function createMap() {
+            var map = new OpenLayers.Map({allOverlays: true});
+            var layer = new OpenLayers.Layer.WMS("test", '/ows', {layers: 'a'});
+            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_legendpanel(t) {
+            t.plan(6);
+            var mapPanel = loadMapPanel();
+            var lp  = new GeoExt.LegendPanel({
+                renderTo: 'legendpanel'});
+            lp.render();
+            t.eq(lp.items.length, 1, "Same number of layers in legend panel and in map");
+
+            var item = lp.getComponent(mapPanel.map.layers[0].id);
+            var url = item.items.items[1].items.items[0].url;
+            var expectedUrl = "/ows?SERVICE=WMS&VERSION=1.1.1&REQUEST=GetLegendGraphic&STYLES=&EXCEPTIONS=application%2Fvnd.ogc.se_xml&FORMAT=image%2Fgif&LAYER=a";
+            t.eq(url, expectedUrl, "GetLegendGraphic url is generated correctly");
+
+            var layer;
+            layer = new OpenLayers.Layer.WMS("test2", '/ows', {layers: 'b', format: 'image/png', transparent: 'TRUE'});
+            mapPanel.map.addLayer(layer);
+
+            t.eq(lp.items.length, 2, "New WMS layer has been added");
+
+            layer = new OpenLayers.Layer.WMS("test3", '/ows', {layers: 'c'}, {visibility: false});
+            mapPanel.map.addLayer(layer);
+
+            t.eq(lp.items.length, 3, "A non visible WMS layer will be added");
+
+            mapPanel.map.removeLayer(mapPanel.map.layers[0]);
+            t.eq(lp.items.length, 3, "Removing the WMS layer only hides the legend from the panel");
+
+            mapPanel.layers.getAt(1).set("hideInLegend", true);
+            var id = mapPanel.layers.getAt(1).get('layer').id;
+            t.eq(lp.getComponent(id).hidden, true, "Layer has been hidden in legend");
+        }
+
+    </script>
+  <body>
+    <div id="legendpanel"></div>
+    <div id="mappanel"></div>
+  </body>
+</html>

Modified: sandbox/opengeo/geoexplorer/tests/list-tests.html
===================================================================
--- sandbox/opengeo/geoexplorer/tests/list-tests.html	2009-05-15 20:52:26 UTC (rev 790)
+++ sandbox/opengeo/geoexplorer/tests/list-tests.html	2009-05-15 20:53:26 UTC (rev 791)
@@ -15,4 +15,5 @@
   <li>lib/GeoExt/widgets/form/SearchAction.html</li>
   <li>lib/GeoExt/widgets/form/BasicForm.html</li>
   <li>lib/GeoExt/widgets/form/FormPanel.html</li>
+  <li>lib/GeoExt/widgets/LegendPanel.html</li>
 </ul>



More information about the Commits mailing list