[Commits] r2206 - in core/trunk/geoext: lib/GeoExt/widgets/tree tests/lib/GeoExt/widgets/tree

commits at geoext.org commits at geoext.org
Tue May 25 13:41:08 CEST 2010


Author: elemoine
Date: 2010-05-25 13:41:08 +0200 (Tue, 25 May 2010)
New Revision: 2206

Modified:
   core/trunk/geoext/lib/GeoExt/widgets/tree/LayerParamLoader.js
   core/trunk/geoext/lib/GeoExt/widgets/tree/LayerParamNode.js
   core/trunk/geoext/tests/lib/GeoExt/widgets/tree/LayerParamLoader.html
   core/trunk/geoext/tests/lib/GeoExt/widgets/tree/LayerParamNode.html
Log:
LayerParamNode shouldn't wait for render to set visibility and merge params, r=ahocevar (closes #284)

Modified: core/trunk/geoext/lib/GeoExt/widgets/tree/LayerParamLoader.js
===================================================================
--- core/trunk/geoext/lib/GeoExt/widgets/tree/LayerParamLoader.js	2010-05-24 09:41:51 UTC (rev 2205)
+++ core/trunk/geoext/lib/GeoExt/widgets/tree/LayerParamLoader.js	2010-05-25 11:41:08 UTC (rev 2206)
@@ -89,11 +89,11 @@
                 node.layer.params[this.param];
             if(paramValue) {
                 var items = (paramValue instanceof Array) ?
-                    paramValue :
+                    paramValue.slice() :
                     paramValue.split(this.delimiter);
 
-                Ext.each(items, function(item) {
-                    this.addParamNode(item, node);
+                Ext.each(items, function(item, index, allItems) {
+                    this.addParamNode(item, allItems, node);
                 }, this);
             }
     
@@ -108,16 +108,18 @@
     /** private: method[addParamNode]
      *  :param paramItem: ``String`` The param item that the child node will
      *      represent.
+     *  :param allParamItems: ``Array`` The full list of param items.
      *  :param node: :class:`GeoExt.tree.LayerNode`` The node that the param
      *      node will be added to as child.
      *  
      *  Adds a child node representing a param value of the layer
      */
-    addParamNode: function(paramItem, node) {
+    addParamNode: function(paramItem, allParamItems, node) {
         var child = this.createNode({
             layer: node.layer,
             param: this.param,
             item: paramItem,
+            allItems: allParamItems,
             delimiter: this.delimiter
         });
         var sibling = node.item(0);
@@ -142,4 +144,4 @@
 
         return new Ext.tree.TreePanel.nodeTypes[attr.nodeType](attr);
     }
-});
\ No newline at end of file
+});

Modified: core/trunk/geoext/lib/GeoExt/widgets/tree/LayerParamNode.js
===================================================================
--- core/trunk/geoext/lib/GeoExt/widgets/tree/LayerParamNode.js	2010-05-24 09:41:51 UTC (rev 2205)
+++ core/trunk/geoext/lib/GeoExt/widgets/tree/LayerParamNode.js	2010-05-25 11:41:08 UTC (rev 2206)
@@ -90,37 +90,44 @@
         this.param = config.param;
         this.item = config.item;
         this.delimiter = config.delimiter || ",";
+        this.allItems = config.allItems;
                 
         GeoExt.tree.LayerParamNode.superclass.constructor.apply(this, arguments);
 
-        // see if we have a layer already, and set allItems.
-        if(this.getLayer()) {
-            this.allItems = this.getItems();
+        this.getLayer();
+
+        if(this.layer) {
+
+            // read items from layer if allItems isn't set
+            // in the attributes
+            if(!this.allItems) {
+                this.allItems = this.getItemsFromLayer();
+            }
+
+            // if the "checked" attribute isn't set we derive
+            // it from what we have in the layer. Else, we need
+            // to update the layer param based on the value of
+            // the "checked" attribute
+            if(this.attributes.checked == null) {
+                this.attributes.checked =
+                    this.layer.getVisibility() &&
+                    this.getItemsFromLayer().indexOf(this.item) >= 0;
+            } else {
+                this.onCheckChange(this, this.attributes.checked);
+            }
+
+            this.layer.events.on({
+                "visibilitychanged": this.onLayerVisibilityChanged,
+                scope: this
+            });
+
+            this.on({
+                "checkchange": this.onCheckChange,
+                scope: this
+            });
         }
     },
     
-    /** private: method[render]
-     *  Private override.
-     */
-    render: function(bulkRender) {
-        var layer = this.getLayer();
-        
-        // set allItems now if we weren't able to do so in the c'tor
-        if(!this.allItems) {
-            this.allItems = this.getItems();
-        }
-        
-        var visibility = layer.getVisibility();
-        this.attributes.checked = this.attributes.checked == null ?
-            visibility : this.attributes.checked;
-        if(this.attributes.checked !== visibility) {
-            this.onCheckChange(this, !visibility);
-        }
-
-        this.addVisibilityEventHandlers();
-        GeoExt.tree.LayerParamNode.superclass.render.apply(this, arguments);
-    },
-    
     /** private: method[getLayer]
      *  :return: ``OpenLayers.Layer.HTTPRequest`` the layer
      *  
@@ -142,10 +149,10 @@
         return this.layer;
     },
     
-    /** private: method[getItems]
+    /** private: method[getItemsFromLayer]
      *  :return: ``Array`` the items of this node's layer's param
      */
-    getItems: function() {
+    getItemsFromLayer: function() {
         var paramValue = this.layer.params[this.param];
         return paramValue instanceof Array ?
             paramValue :
@@ -163,31 +170,16 @@
             items.join(this.delimiter);
         return params;
     },
-    
-    /** private: method[addVisibilityHandlers]
-     *  Adds handlers that sync the checkbox state with the layer's visibility
-     *  state
-     */
-    addVisibilityEventHandlers: function() {        
-        this.layer.events.on({
-            "visibilitychanged": this.onLayerVisibilityChanged,
-            scope: this
-        }); 
-        this.on({
-            "checkchange": this.onCheckChange,
-            scope: this
-        });
-    },
-    
+
     /** private: method[onLayerVisibilityChanged]
      *  Handler for visibilitychanged events on the layer.
      */
     onLayerVisibilityChanged: function() {
-        if(this.getItems().length === 0) {
+        if(this.getItemsFromLayer().length === 0) {
             this.layer.mergeNewParams(this.createParams(this.allItems));
         }
         var visible = this.layer.getVisibility();
-        if(visible && this.getItems().indexOf(this.item) !== -1) {
+        if(visible && this.getItemsFromLayer().indexOf(this.item) !== -1) {
             this.getUI().toggleCheck(true);
         }
         if(!visible) {
@@ -206,7 +198,7 @@
         var layer = this.layer;
 
         var newItems = [];
-        var curItems = this.getItems();
+        var curItems = this.getItemsFromLayer();
         // if the layer is invisible, and a subnode is checked for the first
         // time, we need to pretend that no subnode param items are set.
         if(checked === true && layer.getVisibility() === false &&

Modified: core/trunk/geoext/tests/lib/GeoExt/widgets/tree/LayerParamLoader.html
===================================================================
--- core/trunk/geoext/tests/lib/GeoExt/widgets/tree/LayerParamLoader.html	2010-05-24 09:41:51 UTC (rev 2205)
+++ core/trunk/geoext/tests/lib/GeoExt/widgets/tree/LayerParamLoader.html	2010-05-25 11:41:08 UTC (rev 2206)
@@ -52,7 +52,7 @@
         }
         
         function test_load(t) {
-            t.plan(4);
+            t.plan(5);
 
             var panel = setupTree();
             var nodes = panel.getRootNode().childNodes[0].childNodes;
@@ -61,6 +61,7 @@
             t.eq(nodes.length, 2, "2 child nodes created.");
             t.eq(nodes[0].param, "LAYERS", "param for 1st node set.");
             t.eq(nodes[0].item, "layer2", "item for 1st node set.");
+            t.eq(nodes[0].allItems, ["layer1", "layer2"], "allItems for 1st node set.");
             t.eq(nodes[1].item, "layer1", "item for 2nd node set.");
             
             panel.destroy();

Modified: core/trunk/geoext/tests/lib/GeoExt/widgets/tree/LayerParamNode.html
===================================================================
--- core/trunk/geoext/tests/lib/GeoExt/widgets/tree/LayerParamNode.html	2010-05-24 09:41:51 UTC (rev 2205)
+++ core/trunk/geoext/tests/lib/GeoExt/widgets/tree/LayerParamNode.html	2010-05-25 11:41:08 UTC (rev 2206)
@@ -6,163 +6,375 @@
         <script src="../../../../../lib/GeoExt.js"></script>
     
         <script>
+
+        var layer, store, panel, nodes;
             
-        function setupTree(layer1Checked) {
-            var layer = new OpenLayers.Layer.WMS("Group", "http://localhost/wms", {
-                 "LAYERS": ["layer1", "layer2"],
-                 "CQL_FILTER": "city='Vienna' OR city='Graz'"
-            }, {
-                visibility: false
-            });
+        function setup(layerParams, layerOptions, treeNodes, baseAttrs) {
+            layer = new OpenLayers.Layer.WMS(
+                "Group", "http://localhost/wms",
+                layerParams, layerOptions
+            );
            
-            var store = new GeoExt.data.LayerStore({
+            store = new GeoExt.data.LayerStore({
                 layers: [layer]
             });
 
-            return new Ext.tree.TreePanel({
+            Ext.each(treeNodes, function(n) { n.layer = layer; });
+
+            baseAttrs = Ext.applyIf({
+                layerStore: store
+            }, baseAttrs);
+
+            panel = new Ext.tree.TreePanel({
                 renderTo: "tree",
                 loader: new Ext.tree.TreeLoader({
-                    baseAttrs: {
-                        layerStore: store
-                    }
+                    baseAttrs: baseAttrs
                 }),
                 root: {
                     text: "Layers",
                     expanded: true,
-                    children: [{
-                        nodeType: "gx_layerparam",
-                        layer: layer,
-                        param: "LAYERS",
-                        item: "layer1",
-                        checked: layer1Checked
-                    }, {
-                        nodeType: "gx_layerparam",
-                        layer: layer,
-                        param: "LAYERS",
-                        item: "layer2",
-                        delimiter: ";"
-                    }, {
-                        nodeType: "gx_layerparam",
-                        // provide this layer as string to see if the layer can
-                        // be configured from the store provided in baseParams
-                        layer: "Group",
-                        param: "CQL_FILTER",
-                        item: "city='Vienna'",
-                        delimiter: " OR "
-                    }]
+                    children: treeNodes
                 }
             });
+
+            nodes = panel.getRootNode().childNodes;
         }
+
+        function teardown() {
+            panel.destroy();
+            layer.destroy();
+            store.destroy();
+        }
         
         function test_constructor(t) {
-            t.plan(4);
-            
+            t.plan(5);
+
+            var node;
+
             var layer = {
-                params: {bar: ["before", "foobar", "after"]}
+                params: {bar: ["before", "foobar", "after"]},
+                getVisibility: function() { return true; },
+                events: {on: function() {}}
             };
-            
-            var node = new GeoExt.tree.LayerParamNode({
+
+            // test that "param" and "item" are correctly set
+            // in the node
+            node = new GeoExt.tree.LayerParamNode({
                 layer: layer,
                 param: "bar",
                 item: "foobar"
             });
-            
             t.eq(node.param, "bar", "param set.");
             t.eq(node.item, "foobar", "item set.");
             t.eq(node.delimiter, ",", "default delimiter set.");
-            
             node.destroy();
-            
+
+            // test that a custom delimiter can be passed
+            // to the node
             node = new GeoExt.tree.LayerParamNode({
                 layer: layer,
                 param: "bar",
                 item: "foobar",
                 delimiter: ";"
             });
-
             t.eq(node.delimiter, ";", "custom delimiter set.");
-            
             node.destroy();
+
+            // test that allItems isn't read from the layer
+            // if it's provided in the node attributes
+            node = new GeoExt.tree.LayerParamNode({
+                layer: layer,
+                param: "bar",
+                item: "_foobar",
+                allItems: ["_before", "_foobar", "_after"]
+            });
+            t.eq(node.allItems, ["_before", "_foobar", "_after"],
+                 "allItems isn't read from the layer if provided");
         }
-        
-        function test_render(t) {
-            t.plan(5);
-            
-            var panel = setupTree(true);
-            var nodes = panel.getRootNode().childNodes;
-            var layer = nodes[0].layer;
 
-            t.ok(nodes[2].layer instanceof OpenLayers.Layer, "layer set from store.");
-            t.eq(nodes[0].allItems, ["layer1", "layer2"], "allItems with set from array");
-            t.eq(nodes[0].attributes.checked, true, "checked attribute maintained correctly");
-            t.eq(layer.params.LAYERS, ["layer1"], "layer displayed with checked item");
-            t.eq(nodes[2].allItems, ["city='Vienna'", "city='Graz'"], "allItems with custom delimiter set");
-            
-            panel.destroy();
-            nodes[2].attributes.layerStore.destroy();
-            layer.destroy();
+        function test_initialstate(t) {
+            t.plan(30);
+
+            function _test(id, paramName, paramValue, stateNode0, stateNode1) {
+                t.eq(layer.params[paramName], paramValue,
+                     "[" + id + "] layer params ok");
+                t.eq(nodes[0].attributes.checked, stateNode0,
+                     "[" + id + "] node 0 state ok");
+                t.eq(nodes[1].attributes.checked, stateNode1,
+                     "[" + id + "] node 1 state ok");
+            }
+
+            setup(
+                {"LAYERS": ["layer1", "layer2"]},
+                {visibility: true},
+                [{
+                    nodeType: "gx_layerparam",
+                    param: "LAYERS",
+                    item: "layer1"
+                }, {
+                    nodeType: "gx_layerparam",
+                    param: "LAYERS",
+                    item: "layer2"
+                }]
+            );
+            _test("0", "LAYERS", ["layer1", "layer2"], true, true);
+            teardown();
+
+            setup(
+                {"LAYERS": ["layer1", "layer2"]},
+                {visibility: false},
+                [{
+                    nodeType: "gx_layerparam",
+                    param: "LAYERS",
+                    item: "layer1"
+                }, {
+                    nodeType: "gx_layerparam",
+                    param: "LAYERS",
+                    item: "layer2"
+                }]
+            );
+            _test("1", "LAYERS", ["layer1", "layer2"], false, false);
+            teardown();
+
+            setup(
+                {"LAYERS": ["layer1", "layer2"]},
+                {visibility: false},
+                [{
+                    nodeType: "gx_layerparam",
+                    param: "LAYERS",
+                    item: "layer1",
+                    checked: false
+                }, {
+                    nodeType: "gx_layerparam",
+                    param: "LAYERS",
+                    item: "layer2",
+                    checked: true
+                }]
+            );
+            _test("2", "LAYERS", ["layer2"], false, true);
+            teardown();
+
+            setup(
+                {"LAYERS": []},
+                {visibility: false},
+                [{
+                    nodeType: "gx_layerparam",
+                    param: "LAYERS",
+                    item: "layer1",
+                    checked: true
+                }, {
+                    nodeType: "gx_layerparam",
+                    param: "LAYERS",
+                    item: "layer2",
+                    checked: false
+                }],
+                {allItems: ["layer1", "layer2"]}
+            );
+            _test("3", "LAYERS", ["layer1"], true, false);
+            teardown();
+
+            setup(
+                {"LAYERS": ""},
+                {visibility: false},
+                [{
+                    nodeType: "gx_layerparam",
+                    param: "LAYERS",
+                    item: "layer1",
+                    checked: true
+                }, {
+                    nodeType: "gx_layerparam",
+                    param: "LAYERS",
+                    item: "layer2",
+                    checked: false
+                }],
+                {allItems: ["layer1", "layer2"]}
+            );
+            _test("4", "LAYERS", "layer1", true, false);
+            teardown();
+
+            setup(
+                {"LAYERS": ["layer1"]},
+                {visibility: true},
+                [{
+                    nodeType: "gx_layerparam",
+                    param: "LAYERS",
+                    item: "layer1"
+                }, {
+                    nodeType: "gx_layerparam",
+                    param: "LAYERS",
+                    item: "layer2"
+                }],
+                {allItems: ["layer1", "layer2"]}
+            );
+            _test("5", "LAYERS", ["layer1"], true, false);
+            teardown();
+
+            setup(
+                {"LAYERS": ["layer1"]},
+                {visibility: false},
+                [{
+                    nodeType: "gx_layerparam",
+                    param: "LAYERS",
+                    item: "layer1"
+                }, {
+                    nodeType: "gx_layerparam",
+                    param: "LAYERS",
+                    item: "layer2"
+                }],
+                {allItems: ["layer1", "layer2"]}
+            );
+            _test("6", "LAYERS", ["layer1"], false, false);
+            teardown();
+
+            setup(
+                {"LAYERS": ["layer2"]},
+                {visibility: true},
+                [{
+                    nodeType: "gx_layerparam",
+                    param: "LAYERS",
+                    item: "layer1",
+                    checked: true
+                }, {
+                    nodeType: "gx_layerparam",
+                    param: "LAYERS",
+                    item: "layer2"
+                }],
+                {allItems: ["layer1", "layer2"]}
+            );
+            _test("7", "LAYERS", ["layer1", "layer2"], true, true);
+            teardown();
+
+            setup(
+                {"CQL_FILTER": "city='Graz'", LAYERS: ["layer2"]},
+                {visibility: true},
+                [{
+                    nodeType: "gx_layerparam",
+                    param: "LAYERS",
+                    item: "layer1",
+                    allItems: ["layer1", "layer2"],
+                    checked: true
+                }, {
+                    nodeType: "gx_layerparam",
+                    param: "CQL_FILTER",
+                    item: "city='Vienna'",
+                    delimiter: " OR ",
+                    allItems: ["city='Vienna'", "city='Graz'"],
+                    checked: true
+                }]
+            );
+            _test("8.0", "LAYERS", ["layer1", "layer2"], true, true);
+            _test("8.1", "CQL_FILTER", "city='Vienna' OR city='Graz'", true, true);
+            teardown();
         }
-        
+
         function test_onLayerVisibilityChanged(t) {
             t.plan(6);
 
-            var panel = setupTree();
-            var nodes = panel.getRootNode().childNodes;
-            var layer = nodes[0].layer;
+            setup(
+                {"LAYERS": []},
+                {visibility: false},
+                [{
+                    nodeType: "gx_layerparam",
+                    param: "LAYERS",
+                    item: "layer1",
+                    allItems: ["layer1", "layer2"]
+                }, {
+                    nodeType: "gx_layerparam",
+                    param: "LAYERS",
+                    item: "layer2",
+                    allItems: ["layer1", "layer2"]
+                }]
+            );
+
+            t.eq(nodes[0].attributes.checked, false,
+                 "node for layer1 is unchecked");
+            t.eq(nodes[1].attributes.checked, false,
+                 "node for layer2 is unchecked");
             
-            t.eq(nodes[0].attributes.checked, false, "node for layer1 is unchecked.");
-            t.eq(nodes[1].attributes.checked, false, "node for layer2 is unchecked.");
-            
             layer.setVisibility(true);
-            t.eq(nodes[0].attributes.checked, true, "node for layer1 is checked.");
-            t.eq(nodes[1].attributes.checked, true, "node for layer2 is checked.");
+            t.eq(nodes[0].attributes.checked, true,
+                 "node for layer1 is checked");
+            t.eq(nodes[1].attributes.checked, true,
+                 "node for layer2 is checked");
             
             layer.setVisibility(false);
-            t.eq(nodes[0].attributes.checked, false, "node for layer1 is unchecked again.");
-            t.eq(nodes[1].attributes.checked, false, "node for layer2 is unchecked again.");
+            t.eq(nodes[0].attributes.checked, false,
+                 "node for layer1 is unchecked again");
+            t.eq(nodes[1].attributes.checked, false,
+                 "node for layer2 is unchecked again");
             
-            panel.destroy();
-            nodes[2].attributes.layerStore.destroy();
-            layer.destroy();
+            teardown();
         }
         
         function test_onCheckChange(t) {
-            t.plan(9);
-            
-            var panel = setupTree();
-            var nodes = panel.getRootNode().childNodes;
-            var layer = nodes[0].layer;
-            
+            t.plan(10);
+
+            setup(
+                {"LAYERS": [], "CQL_FILTER": "city='Vienna' OR city='Graz'"},
+                {visibility: true},
+                [{
+                    nodeType: "gx_layerparam",
+                    param: "LAYERS",
+                    item: "layer1",
+                    checked: true,
+                    allItems: ["layer1", "layer2"]
+                }, {
+                    nodeType: "gx_layerparam",
+                    param: "LAYERS",
+                    item: "layer2",
+                    checked: false,
+                    allItems: ["layer1", "layer2"]
+                }, {
+                    nodeType: "gx_layerparam",
+                    param: "CQL_FILTER",
+                    item: "city='Vienna'",
+                    delimiter: " OR "
+                }]
+            );
+
+            // make the layer invisible first
             layer.setVisibility(false);
+
+            // test that all the nodes are unchecked
+            t.eq(nodes[0].attributes.checked, false,
+                 "node 0 unchecked");
+            t.eq(nodes[1].attributes.checked, false,
+                 "node 1 unchecked");
+
+            // now do the actual tests
             
-            // now all nodes are unchecked, but the layer has all params set
-            
-            t.eq(nodes[1].attributes.checked, false, "node unchecked because layer is invisible.");
-            
+            // check node 1
             nodes[1].getUI().toggleCheck(true);
             
             // now the layer has just the param item of nodes[0] set, and is visible
-            
-            t.eq(layer.getVisibility(), true, "layer is visible after checking a subnode.");
-            t.eq(layer.params.LAYERS, ["layer2"], "correct sublayer is set after checking it.");
-            
+            t.eq(layer.getVisibility(), true,
+                 "layer is visible after checking a subnode");
+            t.eq(layer.params.LAYERS, ["layer2"],
+                 "correct sublayer is set after checking it");
+
+            // uncheck node 1
             nodes[1].getUI().toggleCheck(false);
-            t.eq(layer.params.LAYERS, [], "layer2 invisible again after unchecking.");
-            t.eq(layer.getVisibility(), false, "layer hidden if no sublayers are visible");
-            
+            t.eq(layer.params.LAYERS, [],
+                 "layer2 invisible again after unchecking");
+            t.eq(layer.getVisibility(), false,
+                 "layer hidden if no sublayers are visible");
+
+            // check node 0
             nodes[0].getUI().toggleCheck(true);
-            t.eq(layer.params.LAYERS, ["layer1"], "only checked sublayer is visible.");
-            t.eq(layer.getVisibility(), true, "layer set to visible with checked sublayer.");
+            t.eq(layer.params.LAYERS, ["layer1"],
+                 "only checked sublayer is visible");
+            t.eq(layer.getVisibility(), true,
+                 "layer set to visible with checked sublayer");
 
             // now check if split and join with custom delimiter works
             nodes[2].getUI().toggleCheck(false);
-            t.eq(layer.params.CQL_FILTER, "city='Graz'", "param with custom delimiter removed.");
+            t.eq(layer.params.CQL_FILTER, "city='Graz'",
+                 "param with custom delimiter removed");
             nodes[2].getUI().toggleCheck(true);
-            t.eq(layer.params.CQL_FILTER, "city='Vienna' OR city='Graz'", "param with custom delimiter re-added.");
+            t.eq(layer.params.CQL_FILTER, "city='Vienna' OR city='Graz'",
+                 "param with custom delimiter re-added.");
 
-            panel.destroy();
-            nodes[2].attributes.layerStore.destroy();
-            layer.destroy();
+            teardown();
         }
                 
         </script>



More information about the Commits mailing list