Index: tests/Control/Panel.html
===================================================================
--- tests/Control/Panel.html	(revision 10576)
+++ tests/Control/Panel.html	(working copy)
@@ -157,6 +157,40 @@
 
 
     }
+    
+    function test_Control_Panel_saveState (t) { 
+        t.plan(8); 
+        var map = new OpenLayers.Map('map');
+        var defaultControl = new OpenLayers.Control();
+        var panel = new OpenLayers.Control.Panel({
+            saveState: true,
+            defaultControl: defaultControl
+        });
+        panel.addControls([new OpenLayers.Control(), defaultControl]);
+        map.addControl(panel);
+        t.ok(panel.controls[1].active,
+              "After activateControl() second control is active.");    
+        t.eq(panel.defaultControl, null, "defaultControl nullified after initial panel activation");          
+        panel.deactivate();      
+        t.ok(!panel.controls[0].active && !panel.controls[1].active,
+              "No controls are active after panel deactivation.");
+        panel.activate();   
+        t.ok(!panel.controls[0].active,
+              "After panel reactivation first control is inactive.");
+        t.ok(panel.controls[1].active,
+              "After panel reactivation second control is active.");              
+        panel.saveState = false;
+        panel.deactivate();      
+        t.ok(!panel.controls[0].active && !panel.controls[1].active,
+              "No controls are active after panel deactivation.");
+        panel.defaultControl = panel.controls[0];
+        panel.activate();   
+        t.ok(panel.controls[0].active,
+              "After panel deactivation/activation without saveState defaultControl is active.");
+        t.ok(!panel.controls[1].active,
+              "After panel deactivation/activation without saveState second control is inactive.");              
+        
+    } 
 
   </script>
 </head>
Index: lib/OpenLayers/Control/Panel.js
===================================================================
--- lib/OpenLayers/Control/Panel.js	(revision 10577)
+++ lib/OpenLayers/Control/Panel.js	(working copy)
@@ -32,10 +32,26 @@
      * APIProperty: defaultControl
      * {<OpenLayers.Control>} The control which is activated when the control is
      * activated (turned on), which also happens at instantiation.
+     * If <saveState> is true, <defaultControl> will be nullified after the
+     * first activation of the panel.
      */
     defaultControl: null,
     
     /**
+     * APIProperty: saveState
+     * {Boolean} If set to true, the active state of this panel's controls will
+     * be stored on panel deactivation, and restored on reactivation. Default
+     * is false.
+     */
+    saveState: false,
+      
+    /**
+     * Property: activeState
+     * {Object} stores the active state of this panel's controls.
+     */
+    activeState: null,
+
+    /**
      * Constructor: OpenLayers.Control.Panel
      * Create a new control panel.
      *
@@ -71,6 +87,7 @@
     initialize: function(options) {
         OpenLayers.Control.prototype.initialize.apply(this, [options]);
         this.controls = [];
+        this.activeState = {};
     },
 
     /**
@@ -88,7 +105,8 @@
             }
             OpenLayers.Event.stopObservingElement(this.controls[i].panel_div);
             this.controls[i].panel_div = null;
-        }    
+        }
+        this.activeState = null;
     },
 
     /**
@@ -96,11 +114,17 @@
      */
     activate: function() {
         if (OpenLayers.Control.prototype.activate.apply(this, arguments)) {
-            for(var i=0, len=this.controls.length; i<len; i++) {
-                if (this.controls[i] == this.defaultControl) {
-                    this.controls[i].activate();
+            var control;
+            for (var i=0, len=this.controls.length; i<len; i++) {
+                control = this.controls[i];
+                if (control === this.defaultControl ||
+                                    this.activeState[control.id] === true) {
+                    control.activate();
                 }
             }    
+            if (this.saveState === true) {
+                this.defaultControl = null;
+            }
             this.redraw();
             return true;
         } else {
@@ -113,8 +137,10 @@
      */
     deactivate: function() {
         if (OpenLayers.Control.prototype.deactivate.apply(this, arguments)) {
-            for(var i=0, len=this.controls.length; i<len; i++) {
-                this.controls[i].deactivate();
+            var control;
+            for (var i=0, len=this.controls.length; i<len; i++) {
+                control = this.controls[i];
+                this.activeState[control.id] = control.deactivate();
             }    
             return true;
         } else {
Index: examples/panel-savestate.html
===================================================================
--- examples/panel-savestate.html	(revision 0)
+++ examples/panel-savestate.html	(revision 0)
@@ -0,0 +1,110 @@
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <title>OpenLayers: Control Panel</title>
+    <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
+    <link rel="stylesheet" href="style.css" type="text/css" />
+    <style type="text/css">
+        .olControlPanel div { 
+          display:block;
+          width:  24px;
+          height: 24px;
+          margin: 5px;
+          background-color:red;
+        }
+        
+        .olControlPanel .olControlMouseDefaultsItemActive { 
+          background-color: blue;
+          background-image: url("../theme/default/img/pan_on.png");
+        }
+        .olControlPanel .olControlMouseDefaultsItemInactive { 
+          background-color: orange;
+          background-image: url("../theme/default/img/pan_off.png");
+        }
+        .olControlPanel .olControlDrawFeatureItemActive { 
+          width:  22px;  
+          height: 22px;
+          background-image: url("../theme/default/img/draw_line_on.png");
+        }
+        .olControlPanel .olControlDrawFeatureItemInactive { 
+          width:  22px;  
+          height: 22px;
+          background-image: url("../theme/default/img/draw_line_off.png");
+        }
+        .olControlPanel .olControlZoomBoxItemInactive { 
+          width:  22px;  
+          height: 22px;
+          background-color: orange;
+          background-image: url("../img/drag-rectangle-off.png");
+        }
+        .olControlPanel .olControlZoomBoxItemActive { 
+          width:  22px;  
+          height: 22px;
+          background-color: blue;
+          background-image: url("../img/drag-rectangle-on.png");
+        }
+        .olControlPanel .olControlZoomToMaxExtentItemInactive { 
+          width:  18px;  
+          height: 18px;
+          background-image: url("../img/zoom-world-mini.png");
+        }
+        
+    </style>
+    <script src="../lib/Firebug/firebug.js"></script>
+    <script src="../lib/OpenLayers.js"></script>
+    <script type="text/javascript">
+        var lon = 5;
+        var lat = 40;
+        var zoom = 5;
+        var map, layer, panel;
+
+        function init(){
+            map = new OpenLayers.Map( 'map', { controls: [] } );
+            layer = new OpenLayers.Layer.WMS( "OpenLayers WMS", 
+                    "http://labs.metacarta.com/wms/vmap0", {layers: 'basic'} );
+            map.addLayer(layer);
+
+            vlayer = new OpenLayers.Layer.Vector( "Editable" );
+            map.addLayer(vlayer);
+            
+            
+            zb = new OpenLayers.Control.ZoomBox(
+                {title:"Zoom box: Selecting it you can zoom on an area by clicking and dragging."});
+            panel = new OpenLayers.Control.Panel({
+                saveState: true,
+                defaultControl: zb
+            });
+            panel.addControls([
+                new OpenLayers.Control.Navigation({
+                    title:'You can use the default mouse configuration',
+                    displayClass: "olControlMouseDefaults"
+                }), 
+                zb,
+                new OpenLayers.Control.DrawFeature(vlayer, OpenLayers.Handler.Path,
+                    {title:'Draw a feature'}),
+                new OpenLayers.Control.ZoomToMaxExtent({title:"Zoom to the max extent"}) 
+            ]);
+            map.addControl(panel);
+
+            map.setCenter(new OpenLayers.LonLat(lon, lat), zoom);
+        }
+    </script>
+  </head>
+  <body onload="init()">
+    <h1 id="title">Custom Control.Panel</h1>
+    <p id="shortdesc">
+      Create a custom control.panel, styled entirely with
+      CSS, and add your own controls to it. Use the panel's saveState option to
+      restore control states after deactivating and re-activating the panel.
+    </p>  
+    <div id="panel"></div>
+    <div id="map" class="smallmap"></div>
+    <div> 
+	  <ul> 
+	    <li><a href="#"  
+	      onclick="panel.activate(); return false;">Activate panel</a></li> 
+	    <li><a href="#"  
+	      onclick="panel.deactivate(); return false;">Deactivate panel</a></li> 
+	    </ul>
+	</div> 
+  </body>
+</html>