From ea5e96df85e5328b27a98b8c3bf9b296ac28f202 Mon Sep 17 00:00:00 2001
From: crschmidt <crschmidt@crschmidt.net>
Date: Sun, 27 Jan 2008 14:44:16 +0000
Subject: [PATCH] Add support to set the 'title' property of a control such
 that it will be displayed when hovering over the control in a control.panel
 via its panel_div. r=me (Closes #822)

git-svn-id: http://svn.openlayers.org/trunk/openlayers@5910 dc9f47b5-9b13-0410-9fdd-eb0c1a62fdaf
---
 examples/panel.html             | 11 +++++++----
 lib/OpenLayers/Control.js       | 10 ++++++++++
 lib/OpenLayers/Control/Panel.js |  3 +++
 tests/Control/test_Panel.html   | 12 +++++++++++-
 tests/test_Control.html         |  9 ++++++++-
 5 files changed, 39 insertions(+), 6 deletions(-)

diff --git a/examples/panel.html b/examples/panel.html
index da81a4ccf8..88ab4f5e9e 100644
--- a/examples/panel.html
+++ b/examples/panel.html
@@ -69,13 +69,16 @@
             map.addLayer(vlayer);
             
             
-            zb = new OpenLayers.Control.ZoomBox();
+            zb = new OpenLayers.Control.ZoomBox(
+                {title:"Zoom box: Selecting it you can zoom on an area by clicking and dragging."});
             var panel = new OpenLayers.Control.Panel({defaultControl: zb});
             panel.addControls([
-                new OpenLayers.Control.MouseDefaults(),
+                new OpenLayers.Control.MouseDefaults(
+                    {title:'You can use the default mouse configuration'}), 
                 zb,
-                new OpenLayers.Control.DrawFeature(vlayer, OpenLayers.Handler.Path),
-                new OpenLayers.Control.ZoomToMaxExtent()
+                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);
 
diff --git a/lib/OpenLayers/Control.js b/lib/OpenLayers/Control.js
index c4780bb26a..2d83af8db2 100644
--- a/lib/OpenLayers/Control.js
+++ b/lib/OpenLayers/Control.js
@@ -84,6 +84,13 @@ OpenLayers.Control = OpenLayers.Class({
      * Control. 
      */
     displayClass: "",
+    
+    /**
+    * Property: title  
+    * {string}  This property is used for showing a tooltip over the  
+    * Control.  
+    */ 
+    title: "",
 
     /** 
      * Property: active 
@@ -172,6 +179,9 @@ OpenLayers.Control = OpenLayers.Class({
         if (this.div == null) {
             this.div = OpenLayers.Util.createDiv(this.id);
             this.div.className = this.displayClass;
+            if (this.title != "") {
+                this.div.title = this.title;
+            }
         }
         if (px != null) {
             this.position = px.clone();
diff --git a/lib/OpenLayers/Control/Panel.js b/lib/OpenLayers/Control/Panel.js
index f00f67bc56..51cf56479d 100644
--- a/lib/OpenLayers/Control/Panel.js
+++ b/lib/OpenLayers/Control/Panel.js
@@ -172,6 +172,9 @@ OpenLayers.Control.Panel = OpenLayers.Class(OpenLayers.Control, {
             var element = document.createElement("div");
             var textNode = document.createTextNode(" ");
             controls[i].panel_div = element;
+            if (controls[i].title != "") {
+                controls[i].panel_div.title = controls[i].title;
+            }
             OpenLayers.Event.observe(controls[i].panel_div, "click", 
                 OpenLayers.Function.bind(this.onClick, this, controls[i]));
             OpenLayers.Event.observe(controls[i].panel_div, "mousedown", 
diff --git a/tests/Control/test_Panel.html b/tests/Control/test_Panel.html
index 56bb77a658..e9fbb14a25 100644
--- a/tests/Control/test_Panel.html
+++ b/tests/Control/test_Panel.html
@@ -46,7 +46,17 @@
         t.ok(!toolControl.active && anotherToolControl.active && toggleControl.active,
               "activated the other tool control, the first one is inactive and the toggle control still active.");
     }
-
+    function test_02_Control_Panel_titles (t) { 
+        t.plan(2); 
+        var panel = new OpenLayers.Control.Panel(); 
+        var toolControl = new OpenLayers.Control.ZoomBox({ 
+            title:"Zoom box: Selecting it you can zoom on an area by clicking and dragging." 
+        }); 
+        panel.addControls([toolControl]); 
+        t.eq(panel.controls.length, 1, "added a control to the panel"); 
+        t.eq(panel.controls[0].title, toolControl.panel_div.title, "the title is correctly set"); 
+    } 
+    
     function test_Control_Panel_getBy(t) {
         
         var panel = {
diff --git a/tests/test_Control.html b/tests/test_Control.html
index 47095948b1..4a2e254b9e 100644
--- a/tests/test_Control.html
+++ b/tests/test_Control.html
@@ -21,7 +21,14 @@
         t.ok(control.map === map, "Control.map is set to the map object" );
         t.ok(map.controls[map.controls.length - 1] === control, "map.controls contains control");
     }
-
+    
+    function test_Control_title(t) { 
+        t.plan( 1 ); 
+        var titleText = 'Title test'; 
+        control = new OpenLayers.Control({title:titleText}); 
+        t.eq( control.title, titleText, "control.title set correctly" ); 
+    }
+    
     function test_Control_destroy(t) {
         t.plan(3);