[Commits] r1214 - in core/trunk/geoext: lib/GeoExt/widgets/tree tests tests/lib/GeoExt/widgets/tree
commits at geoext.org
commits at geoext.org
Fri Jul 3 17:59:14 CEST 2009
Author: ahocevar
Date: 2009-07-03 17:59:14 +0200 (Fri, 03 Jul 2009)
New Revision: 1214
Added:
core/trunk/geoext/tests/lib/GeoExt/widgets/tree/BaseLayerContainer.html
Modified:
core/trunk/geoext/lib/GeoExt/widgets/tree/BaseLayerContainer.js
core/trunk/geoext/lib/GeoExt/widgets/tree/LayerContainer.js
core/trunk/geoext/lib/GeoExt/widgets/tree/LayerNode.js
core/trunk/geoext/tests/lib/GeoExt/widgets/tree/LayerContainer.html
core/trunk/geoext/tests/lib/GeoExt/widgets/tree/LayerNode.html
core/trunk/geoext/tests/list-tests.html
Log:
Added checkedGroup config option to render layer nodes with a radio
button instead of a checkbox. r=tschaub (closes #109)
Modified: core/trunk/geoext/lib/GeoExt/widgets/tree/BaseLayerContainer.js
===================================================================
--- core/trunk/geoext/lib/GeoExt/widgets/tree/BaseLayerContainer.js 2009-07-03 15:27:31 UTC (rev 1213)
+++ core/trunk/geoext/lib/GeoExt/widgets/tree/BaseLayerContainer.js 2009-07-03 15:59:14 UTC (rev 1214)
@@ -25,7 +25,10 @@
*
* A layer container that will collect all base layers of an OpenLayers
* map. Only layers that have displayInLayerSwitcher set to true will be
- * included.
+ * included. The childrens' iconCls defaults to "gx-tree-baselayer-icon".
+ *
+ * Children will be rendered with a radio button instead of a checkbox,
+ * showing the user that only one base layer can be active at a time.
*
* To use this node type in ``TreePanel`` config, set nodeType to
* "gx_baselayercontainer".
@@ -37,6 +40,10 @@
*/
constructor: function(config) {
config.text = config.text || "Base Layer";
+ config.defaults = Ext.apply({
+ iconCls: 'gx-tree-baselayer-icon',
+ checkedGroup: 'baselayer'
+ }, config.defaults);
GeoExt.tree.BaseLayerContainer.superclass.constructor.apply(this, arguments);
},
Modified: core/trunk/geoext/lib/GeoExt/widgets/tree/LayerContainer.js
===================================================================
--- core/trunk/geoext/lib/GeoExt/widgets/tree/LayerContainer.js 2009-07-03 15:27:31 UTC (rev 1213)
+++ core/trunk/geoext/lib/GeoExt/widgets/tree/LayerContainer.js 2009-07-03 15:59:14 UTC (rev 1214)
@@ -22,8 +22,8 @@
*
* A subclass of ``Ext.tree.TreeNode`` that will collect all layers of an
* OpenLayers map. Only layers that have displayInLayerSwitcher set to true
- * will be included. The childrens' iconCls will be set to "baselayer-icon"
- * for base layers, and to "layer-icon" for overlay layers.
+ * will be included. The childrens' iconCls defaults to
+ * "gx-tree-layer-icon".
*
* To use this node type in ``TreePanel`` config, set nodeType to
* "gx_layercontainer".
@@ -152,8 +152,8 @@
index = index || 0;
var layer = layerRecord.get("layer");
if (layer.displayInLayerSwitcher === true) {
- var node = new GeoExt.tree.LayerNode(Ext.applyIf({
- iconCls: layer.isBaseLayer ? 'baselayer-icon' : 'layer-icon',
+ var node = new GeoExt.tree.LayerNode(Ext.apply({
+ iconCls: 'gx-tree-layer-icon',
layer: layer,
layerStore: this.layerStore
}, this.defaults));
Modified: core/trunk/geoext/lib/GeoExt/widgets/tree/LayerNode.js
===================================================================
--- core/trunk/geoext/lib/GeoExt/widgets/tree/LayerNode.js 2009-07-03 15:27:31 UTC (rev 1213)
+++ core/trunk/geoext/lib/GeoExt/widgets/tree/LayerNode.js 2009-07-03 15:59:14 UTC (rev 1214)
@@ -34,17 +34,29 @@
var a = this.node.attributes;
if (a.radioGroup && this.radio === null) {
this.radio = Ext.DomHelper.insertAfter(this.checkbox,
- ['<input type="radio" class="x-tree-node-radio" name="',
+ ['<input type="radio" class="gx-tree-layer-radio" name="',
a.radioGroup, '_radio"></input>'].join(""));
}
+ if(a.checkedGroup) {
+ // replace the checkbox with a radio button
+ var radio = Ext.DomHelper.insertAfter(this.checkbox,
+ ['<input type="radio" name="', a.checkedGroup,
+ '_checkbox" class="', this.checkbox.className,
+ this.checkbox.checked ? '" checked="checked"' : '',
+ '"></input>'].join(""));
+ Ext.get(this.checkbox).remove();
+ this.checkbox = radio;
+ }
},
/** private: method[onClick]
* :param e: ``Object``
*/
onClick: function(e) {
- if (e.getTarget('input[type=radio]', 1)) {
+ if (e.getTarget('.gx-tree-layer-radio', 1)) {
this.fireEvent("radiochange", this.node);
+ } else if(e.getTarget('.x-tree-node-cb', 1)) {
+ GeoExt.tree.LayerNodeUI.superclass.onCheckChange.call(this);
} else {
GeoExt.tree.LayerNodeUI.superclass.onClick.call(this, e);
}
@@ -84,19 +96,25 @@
* A subclass of ``Ext.tree.TreeNode`` that is connected to an
* ``OpenLayers.Layer`` by setting the node's layer property. Checking or
* unchecking the checkbox of this node will directly affect the layer and
- * vice versa. The default iconCls for this node's icon is "layer-icon",
- * unless it has children.
+ * vice versa. The default iconCls for this node's icon is
+ * "gx-tree-layer-icon", unless it has children.
*
* Setting the node's layer property to a layer name instead of an object
* will also work. As soon as a layer is found, it will be stored as layer
* property in the attributes hash.
*
* The node's text property defaults to the layer name.
+ *
+ * If the node has a checkedGroup attribute configured, it will be
+ * rendered with a radio button instead of the checkbox. The value of
+ * the checkedGroup attribute is a string, identifying the options group
+ * for the node.
*
* If the node has a radioGroup attribute configured, the node will be
- * rendered with a radio button. This works like the checkbox with the
- * checked attribute, but radioGroup is a string that identifies the options
- * group. Clicking the radio button will fire a radioChange event.
+ * rendered with a radio button next to the checkbox. This works like the
+ * checkbox with the checked attribute, but radioGroup is a string that
+ * identifies the options group. Clicking the radio button will fire a
+ * radioChange event.
*
* To use this node type in a ``TreePanel`` config, set ``nodeType`` to
* "gx_layer".
Added: core/trunk/geoext/tests/lib/GeoExt/widgets/tree/BaseLayerContainer.html
===================================================================
--- core/trunk/geoext/tests/lib/GeoExt/widgets/tree/BaseLayerContainer.html (rev 0)
+++ core/trunk/geoext/tests/lib/GeoExt/widgets/tree/BaseLayerContainer.html 2009-07-03 15:59:14 UTC (rev 1214)
@@ -0,0 +1,49 @@
+<html>
+ <head>
+ <script src="../../../../../../openlayers/lib/OpenLayers.js"></script>
+ <script src="../../../../../../ext/adapter/ext/ext-base.js"></script>
+ <script src="../../../../../../ext/ext-all-debug.js"></script>
+ <script src="../../../../../lib/GeoExt.js"></script>
+
+ <script>
+
+ function test_render(t) {
+
+ t.plan(2);
+
+ var map = new OpenLayers.Map({
+ div: "map"
+ });
+ // add a base layer
+ var layer = new OpenLayers.Layer("foo", {isBaseLayer: true});
+ map.addLayer(layer);
+ // add an overlay
+ map.addLayer(new OpenLayers.Layer());
+
+ var store = new GeoExt.data.LayerStore({
+ map: map
+ });
+
+ var node = new GeoExt.tree.BaseLayerContainer({
+ layerStore: store
+ });
+
+ var panel = new Ext.tree.TreePanel({
+ renderTo: document.body,
+ root: node
+ });
+
+ t.eq(node.childNodes.length, 1, "only base layers get added to the container");
+ t.eq(node.firstChild.attributes.iconCls, "gx-tree-baselayer-icon", "iconClass for child set correctly");
+
+ node.destroy();
+ map.destroy();
+
+ }
+
+ </script>
+ </head>
+ <body>
+ <div id="map" style="width: 100px; height: 100px;"></div>
+ </body>
+</html>
\ No newline at end of file
Property changes on: core/trunk/geoext/tests/lib/GeoExt/widgets/tree/BaseLayerContainer.html
___________________________________________________________________
Name: svn:keywords
+ Id Author Date Revision
Name: svn:eol-style
+ native
Modified: core/trunk/geoext/tests/lib/GeoExt/widgets/tree/LayerContainer.html
===================================================================
--- core/trunk/geoext/tests/lib/GeoExt/widgets/tree/LayerContainer.html 2009-07-03 15:27:31 UTC (rev 1213)
+++ core/trunk/geoext/tests/lib/GeoExt/widgets/tree/LayerContainer.html 2009-07-03 15:59:14 UTC (rev 1214)
@@ -28,7 +28,7 @@
function test_render(t) {
- t.plan(2);
+ t.plan(3);
var map = new OpenLayers.Map({
div: "map",
@@ -52,6 +52,7 @@
t.eq(node.childNodes && node.childNodes.length, 1, "container has one child");
t.ok(node.firstChild.layer === layer, "child layer is correct");
+ t.eq(node.firstChild.attributes.iconCls, "gx-tree-layer-icon", "iconClass for child set correctly");
node.destroy();
map.destroy();
Modified: core/trunk/geoext/tests/lib/GeoExt/widgets/tree/LayerNode.html
===================================================================
--- core/trunk/geoext/tests/lib/GeoExt/widgets/tree/LayerNode.html 2009-07-03 15:27:31 UTC (rev 1213)
+++ core/trunk/geoext/tests/lib/GeoExt/widgets/tree/LayerNode.html 2009-07-03 15:59:14 UTC (rev 1214)
@@ -26,7 +26,7 @@
function test_render(t) {
- t.plan(5);
+ t.plan(7);
var layer = new OpenLayers.Layer("foo");
@@ -38,6 +38,7 @@
var node = new GeoExt.tree.LayerNode({
layer: "foo",
radioGroup: "group",
+ checkedGroup: "check",
childNodeType: {
add: function() {
t.ok(true, "add function of childNodeType called");
@@ -61,6 +62,9 @@
// simulate a click event for testing the radiochange event
node.ui.onClick({getTarget: function() {return true}});
+ t.eq(node.ui.checkbox.type, "radio", "checkbox rendered as radio button when checkedGroup is configured");
+ t.eq(node.ui.checkbox.name, "check_checkbox", "option group name set correclty according to checkedGroup");
+
node.ui.toggleCheck();
t.eq(layer.visibility, false, "unchecking node hides layer");
});
Modified: core/trunk/geoext/tests/list-tests.html
===================================================================
--- core/trunk/geoext/tests/list-tests.html 2009-07-03 15:27:31 UTC (rev 1213)
+++ core/trunk/geoext/tests/list-tests.html 2009-07-03 15:59:14 UTC (rev 1214)
@@ -16,8 +16,9 @@
<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/tree/BaseLayerContainer.html</li>
+ <li>lib/GeoExt/widgets/tree/LayerContainer.html</li>
<li>lib/GeoExt/widgets/tree/LayerNode.html</li>
- <li>lib/GeoExt/widgets/tree/LayerContainer.html</li>
<li>lib/GeoExt/widgets/LegendImage.html</li>
<li>lib/GeoExt/widgets/LegendPanel.html</li>
<li>lib/GeoExt/widgets/ZoomSlider.html</li>
More information about the Commits
mailing list