[Commits] r2468 - in sandbox/mapgears/geoext.ux/ux: . LayerTreeBuilder LayerTreeBuilder/examples LayerTreeBuilder/lib LayerTreeBuilder/lib/GeoExt.ux LayerTreeBuilder/lib/GeoExt.ux/widgets LayerTreeBuilder/lib/GeoExt.ux/widgets/tree LayerTreeBuilder/resources LayerTreeBuilder/resources/css LayerTreeBuilder/resources/lang

commits at geoext.org commits at geoext.org
Fri Oct 22 17:47:22 CEST 2010


Author: adube
Date: 2010-10-22 17:47:22 +0200 (Fri, 22 Oct 2010)
New Revision: 2468

Added:
   sandbox/mapgears/geoext.ux/ux/LayerTreeBuilder/
   sandbox/mapgears/geoext.ux/ux/LayerTreeBuilder/examples/
   sandbox/mapgears/geoext.ux/ux/LayerTreeBuilder/examples/tree-builder.html
   sandbox/mapgears/geoext.ux/ux/LayerTreeBuilder/examples/tree-builder.js
   sandbox/mapgears/geoext.ux/ux/LayerTreeBuilder/lib/
   sandbox/mapgears/geoext.ux/ux/LayerTreeBuilder/lib/GeoExt.ux/
   sandbox/mapgears/geoext.ux/ux/LayerTreeBuilder/lib/GeoExt.ux/widgets/
   sandbox/mapgears/geoext.ux/ux/LayerTreeBuilder/lib/GeoExt.ux/widgets/tree/
   sandbox/mapgears/geoext.ux/ux/LayerTreeBuilder/lib/GeoExt.ux/widgets/tree/LayerTreeBuilder.js
   sandbox/mapgears/geoext.ux/ux/LayerTreeBuilder/resources/
   sandbox/mapgears/geoext.ux/ux/LayerTreeBuilder/resources/css/
   sandbox/mapgears/geoext.ux/ux/LayerTreeBuilder/resources/css/LayerTreeBuilder.css
   sandbox/mapgears/geoext.ux/ux/LayerTreeBuilder/resources/images/
   sandbox/mapgears/geoext.ux/ux/LayerTreeBuilder/resources/lang/
   sandbox/mapgears/geoext.ux/ux/LayerTreeBuilder/resources/lang/fr.js
   sandbox/mapgears/geoext.ux/ux/LayerTreeBuilder/tests/
Log:
LayerTreeBuilder prototype

Added: sandbox/mapgears/geoext.ux/ux/LayerTreeBuilder/examples/tree-builder.html
===================================================================
--- sandbox/mapgears/geoext.ux/ux/LayerTreeBuilder/examples/tree-builder.html	                        (rev 0)
+++ sandbox/mapgears/geoext.ux/ux/LayerTreeBuilder/examples/tree-builder.html	2010-10-22 15:47:22 UTC (rev 2468)
@@ -0,0 +1,34 @@
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>GeoExt Legend Tree</title>
+        
+
+        <script type="text/javascript" src="../../../../ext/adapter/ext/ext-base.js"></script>
+        <script type="text/javascript" src="../../../../ext/ext-all.js"></script>
+        <link rel="stylesheet" type="text/css" href="../../../../ext/resources/css/ext-all.css" />
+        <link rel="stylesheet" type="text/css" href="../../../../ext/examples/shared/examples.css" />
+
+        <!-- Google Maps API for "localhost" -->
+        <!--script src='http://maps.google.com/maps?file=api&amp;v=2&amp;key=ABQIAAAAjpkAC9ePGem0lIq5XcMiuhR_wWLPFku8Ix9i2SXYRVK3e45q1BQUd_beF8dtzKET_EteAjPdGDwqpQ'></script-->
+        <!-- Google Maps API for "dev.geoext.org" -->
+        <script src='http://maps.google.com/maps?file=api&amp;v=2&amp;key=ABQIAAAA_5ak-hsiH4j5bQQn7-k66xTWxvN8zH6Ta_pgIhhU0TB7bG8iAhS99ituPif4lG-2CHXoZ3qenLnK1g'></script>
+
+        <script type="text/javascript" src="../../../../openlayers/lib/OpenLayers.js"></script>
+        <script type="text/javascript" src="../../../../geoext/lib/GeoExt.js"></script>
+
+        <link rel="stylesheet" type="text/css" href="../resources/css/LayerTreeBuilder.css" />
+        <script type="text/javascript" src="../lib/GeoExt.ux/widgets/tree/LayerTreeBuilder.js"></script>
+        <script type="text/javascript" src="../resources/lang/fr.js"></script>
+        <script type="text/javascript" src="tree-builder.js"></script>
+    </head>
+    <body>
+        <div id="desc">
+            <h1>GeoExt Tree Builder</h1>
+
+            <p></p>
+
+            <p>The js is not minified so it is readable. See
+            <a href="tree-builder.js">tree-builder.js</a>.</p>
+        </div>
+    </body>
+</html>

Added: sandbox/mapgears/geoext.ux/ux/LayerTreeBuilder/examples/tree-builder.js
===================================================================
--- sandbox/mapgears/geoext.ux/ux/LayerTreeBuilder/examples/tree-builder.js	                        (rev 0)
+++ sandbox/mapgears/geoext.ux/ux/LayerTreeBuilder/examples/tree-builder.js	2010-10-22 15:47:22 UTC (rev 2468)
@@ -0,0 +1,144 @@
+/**
+ * Copyright (c) 2008-2010 The Open Source Geospatial Foundation
+ * 
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+ /** api: example[tree-legend]
+  *  Tree Legend
+  *  -----------
+  *  Render layer nodes with legends.
+  */
+
+var map, mapPanel, tree, host, url, layers;
+
+Ext.onReady(function() {
+    host = "http://dev4g.mapgears.com";
+    url = host + "/cgi-bin/mswms_gmap?";
+    layers = [];
+
+    // google base layer
+
+    layers.push(new OpenLayers.Layer.Google(
+            "Google Satellite",
+            {type: G_SATELLITE_MAP, sphericalMercator: true, displayInLayerSwitcher: true}
+    ));
+
+    map = new OpenLayers.Map({
+        projection: new OpenLayers.Projection("EPSG:900913"),
+        units: "m",
+        numZoomLevels: 18,
+        maxResolution: 156543.0339,
+        maxExtent: new OpenLayers.Bounds(-20037508, -20037508,
+                                         20037508, 20037508.34)
+    });
+
+    mapPanel = new GeoExt.MapPanel({
+        region: "center",
+        center: [-7924121.1710935, 6185868.5449234],
+        zoom: 10,
+        map: map
+    });
+
+    tree = new GeoExt.ux.tree.LayerTreeBuilder({
+        region: "east",
+        title: "Layers",
+        width: 250,
+        autoScroll: true,
+        enableDD: true,
+        rootVisible: false,
+        lines: false
+    });
+
+    new Ext.Viewport({
+        layout: "fit",
+        hideBorders: true,
+        items: {
+            layout: "border",
+            items: [
+                mapPanel, tree, {
+                    contentEl: desc,
+                    region: "west",
+                    width: 250,
+                    bodyStyle: {padding: "5px"}
+                }
+            ]
+        }
+    });
+
+    layers.push(new OpenLayers.Layer.WMS("Canadian parks", url, {
+            layers: "park",
+            format: 'image/png'
+        }, {
+            singleTile: true,
+            group: "GMap/Polygons",
+            isBaseLayer: false,
+            visibility: false
+        }
+    ));
+
+    layers.push(new OpenLayers.Layer.WMS("Canadian railroads", url, {
+            layers: "rail",
+            format: 'image/png'
+        }, {
+            singleTile: true,
+            group: "GMap/Lines",
+            isBaseLayer: false,
+            visibility: false
+        }
+    ));
+
+    layers.push(new OpenLayers.Layer.WMS("Canadian roads", url, {
+            layers: "road",
+            format: 'image/png'
+        }, {
+            singleTile: true,
+            group: "GMap/Lines",
+            isBaseLayer: false,
+            visibility: false
+        }
+    ));
+
+    layers.push(new OpenLayers.Layer.WMS("Canadian cities", url, {
+            layers: "popplace",
+            format: 'image/png'
+        }, {
+            singleTile: true,
+            group: "GMap/Points",
+            isBaseLayer: false,
+            visibility: false
+        }
+    ));
+
+    // group : Vector
+    layers.push(new OpenLayers.Layer.Vector(
+        "A vector layer",
+        {visibility: false, group: 'Vector'}
+    ));
+
+    // group : undefined
+    layers.push(new OpenLayers.Layer.Vector(
+        "Layer without any group is classified as 'other layer'",
+        {visibility: false}
+    ));
+
+    // a base layer without any group is added to the 'base layer' group
+    layers.push(new OpenLayers.Layer.Google("Google Street",
+        {sphericalMercator: true, visibility: false}
+    ));
+
+    // a base layer without any group is added to the 'base layer' group
+    layers.push(new OpenLayers.Layer.WMS("Canada bathymetry", url, {
+            layers: "base",
+            format: 'image/png'
+        }, {
+            singleTile: true,
+            visibility: false
+        }
+    ));
+
+    map.addLayers(layers);
+    map.setCenter(new OpenLayers.LonLat(-7924121.1710935, 6185868.5449234), 6);
+});

Added: sandbox/mapgears/geoext.ux/ux/LayerTreeBuilder/lib/GeoExt.ux/widgets/tree/LayerTreeBuilder.js
===================================================================
--- sandbox/mapgears/geoext.ux/ux/LayerTreeBuilder/lib/GeoExt.ux/widgets/tree/LayerTreeBuilder.js	                        (rev 0)
+++ sandbox/mapgears/geoext.ux/ux/LayerTreeBuilder/lib/GeoExt.ux/widgets/tree/LayerTreeBuilder.js	2010-10-22 15:47:22 UTC (rev 2468)
@@ -0,0 +1,157 @@
+Ext.namespace("GeoExt.ux.tree");
+
+GeoExt.ux.tree.LayerTreeBuilder = Ext.extend(Ext.tree.TreePanel, {
+
+    otherLayersText: "Other layers",
+
+    baseLayersText: "Base layers",
+
+    /** api: config[layerStore]
+     *  ``GeoExt.data.LayerStore``
+     *  The layer store containing layers to be displayed in the tree. 
+     *  If not provided it will be taken from the MapPanel.
+     */
+    layerStore: null,
+
+    plugins: [{ptype: "gx_treenodecomponent"}],
+
+    loader: {
+        applyLoader: false,
+        uiProviders: {"custom_ui": Ext.extend(
+            GeoExt.tree.LayerNodeUI,
+            new GeoExt.tree.TreeNodeUIEventMixin()
+        )}
+    },
+
+    root: {
+        nodeType: "async",
+        children: []
+    },
+
+    initComponent: function(){
+        GeoExt.ux.tree.LayerTreeBuilder.superclass.initComponent.call(this);
+        if(!this.layerStore) {
+            this.layerStore = GeoExt.MapPanel.guess().layers;
+        }
+
+        this.layerStore.on({
+            "add": this.onLayerAdded,
+            "remove": this.onLayerRemoved,
+            scope: this
+        });
+    },
+
+    onLayerRemoved: function(store, records, index){
+        //todo: remove empty groups
+    },
+
+    onLayerAdded: function(store, records, index){
+        var layer = records[0].getLayer();
+        var group;
+        var groupString;
+
+        // get group array and group string
+        if(layer.options && layer.options.group !== undefined)
+        {
+            group = layer.options.group.split('/');
+            groupString = layer.options.group;
+        }
+        else
+        {
+            groupString = (layer.isBaseLayer)
+                ? this.baseLayersText : this.otherLayersText;
+            group = [groupString];
+            layer.options.group = groupString;
+        }
+
+        // get layer title
+        var layerTitle = records[0].data.title
+        if(layer.options && layer.options.title)
+        {
+            layerTitle = layer.options.title;
+        }
+
+        // if layer has no GROUP
+        if (groupString === "") {
+            var layerNode = {
+                nodeType: "gx_layer",
+                layer: layer.name,
+                layerStore: this.layerStore,
+                isLeaf: true,
+                allowDrag: false,
+                checked: layer.visibility
+            };
+            this.getRootNode().appendChild(layerNode);
+        } else {
+            this.addGroupNodes(group, this.getRootNode(), groupString);
+        }
+    },
+
+    addGroupNodes: function(groups, parentNode, groupString){
+        var group = groups.shift();
+        var childNode = this.getNodeByText(parentNode, group);
+
+        // if the childNode doesn't exist, we need to create and append it
+        if (!childNode) {
+            // if that's the last element of the groups array, we need a
+            // 'LayerContainer'
+            if (groups.length == 0){
+                parentNode.appendChild({
+                    text: group,
+                    layerStore: this.layerStore,
+                    allowDrag: false,
+                    nodeType: 'gx_layercontainer',
+                    leaf: false,
+                    loader: {
+                        filter: function(record) {
+                            return record.getLayer().options.group == groupString;
+                        },
+                        baseAttrs: {
+                            uiProvider: "custom_ui"
+                        },
+                        createNode: function(attr) {
+                            var layerRecord = this.store.getByLayer(attr.layer);
+                            if (layerRecord.getLayer() instanceof OpenLayers.Layer.WMS){
+                                // add a WMS legend to each node created
+                                attr.component = {
+                                    xtype: "gx_wmslegend",
+                                    layerRecord: layerRecord,
+                                    showTitle: false,
+                                    hidden: true,
+                                    cls: "gx-layertreebuilder-legend"
+                                };
+                            }
+                            return GeoExt.tree.LayerLoader.prototype.createNode.call(this, attr);
+                        }
+                    }
+                });
+            } else {
+                // else, create and append a simple node...
+                parentNode.appendChild({
+                    text: group,
+                    leaf: false,
+                    allowDrag: false,
+                    nodeType: "node"
+                });
+            }
+
+            childNode = this.getNodeByText(parentNode, group);
+        }
+
+        if (groups.length != 0){
+            this.addGroupNodes(groups, childNode, groupString);
+        }
+
+    },
+
+    getNodeByText: function(node, text){
+        for(var i=0; i<node.childNodes.length; i++)
+        {
+            if(node.childNodes[i]['text'] == text)
+            {
+                return node.childNodes[i];
+            }
+        }
+        return false;
+    }
+});

Added: sandbox/mapgears/geoext.ux/ux/LayerTreeBuilder/resources/css/LayerTreeBuilder.css
===================================================================
--- sandbox/mapgears/geoext.ux/ux/LayerTreeBuilder/resources/css/LayerTreeBuilder.css	                        (rev 0)
+++ sandbox/mapgears/geoext.ux/ux/LayerTreeBuilder/resources/css/LayerTreeBuilder.css	2010-10-22 15:47:22 UTC (rev 2468)
@@ -0,0 +1,10 @@
+.gx-layertreebuilder-legend {
+    padding-left: 26px;
+}
+.x-tree-node-el {
+    border-bottom: 1px solid #ddd;
+    padding-bottom: 3px;
+}
+.gx-tree-layer-icon {
+    display: none;
+}
\ No newline at end of file

Added: sandbox/mapgears/geoext.ux/ux/LayerTreeBuilder/resources/lang/fr.js
===================================================================
--- sandbox/mapgears/geoext.ux/ux/LayerTreeBuilder/resources/lang/fr.js	                        (rev 0)
+++ sandbox/mapgears/geoext.ux/ux/LayerTreeBuilder/resources/lang/fr.js	2010-10-22 15:47:22 UTC (rev 2468)
@@ -0,0 +1,7 @@
+Ext.namespace("GeoExt.ux.tree")
+if (GeoExt.ux.tree.LayerTreeBuilder) {
+    Ext.apply(GeoExt.ux.tree.LayerTreeBuilder.prototype, {
+        otherLayersText: "Autres couches",
+        baseLayersText: "Couches de base"
+    });
+}



More information about the Commits mailing list