callback for close button on popup (closes #1061)

git-svn-id: http://svn.openlayers.org/trunk/openlayers@4916 dc9f47b5-9b13-0410-9fdd-eb0c1a62fdaf

examples/select-feature-openpopup.html

@@ -12,13 +12,17 @@
     </style>
     <script src="../lib/OpenLayers.js"></script>
     <script type="text/javascript">
-        var map, drawControls, select;
+        var map, drawControls, selectControl, selectedFeature;
+        function onPopupClose(evt) {
+            selectControl.unselect(selectedFeature);
+        }
         function onFeatureSelect(feature) {
+            selectedFeature = feature;
             popup = new OpenLayers.Popup.Anchored("chicken", 
                                      feature.geometry.getBounds().getCenterLonLat(),
                                      new OpenLayers.Size(250,75),
                                      "<div style='font-size:.8em'>Feature: " + feature.id +"<br />Area: " + feature.geometry.getArea()+"</div>",
-                                     null, true);
+                                     null, true, onPopupClose);
             feature.popup = popup;
             map.addPopup(popup);
         }
@@ -38,13 +42,12 @@
             map.addControl(new OpenLayers.Control.LayerSwitcher());
             map.addControl(new OpenLayers.Control.MousePosition());
             
+            selectControl = new OpenLayers.Control.SelectFeature(polygonLayer,
+                {onSelect: onFeatureSelect, onUnselect: onFeatureUnselect});
             drawControls = {
                 polygon: new OpenLayers.Control.DrawFeature(polygonLayer,
                             OpenLayers.Handler.Polygon),
-                select: new OpenLayers.Control.SelectFeature(polygonLayer,
+                select: selectControl
-                {onSelect: onFeatureSelect,
-                 onUnselect: onFeatureUnselect
-                })
             };
             
             for(var key in drawControls) {

lib/OpenLayers/Popup.js

@@ -117,9 +117,10 @@ OpenLayers.Popup = OpenLayers.Class({
     * contentHTML - {String}          The HTML content to display inside the 
     *                                 popup.
     * closeBox - {Boolean}            Whether to display a close box inside
-    *                                 the popup. 
+    *                                 the popup.
+    * closeBoxCallback - {Function}   Function to be called on closeBox click.
     */
-    initialize:function(id, lonlat, size, contentHTML, closeBox) {
+    initialize:function(id, lonlat, size, contentHTML, closeBox, closeBoxCallback) {
         if (id == null) {
             id = OpenLayers.Util.createUniqueID(this.CLASS_NAME + "_");
         }
@@ -165,7 +166,7 @@ OpenLayers.Popup = OpenLayers.Class({
             closeImg.style.top = this.padding + "px";
             this.groupDiv.appendChild(closeImg);
 
-            var closePopup = function(e) {
+            var closePopup = closeBoxCallback || function(e) {
                 this.hide();
                 OpenLayers.Event.stop(e);
             }

lib/OpenLayers/Popup/Anchored.js

@@ -38,9 +38,12 @@ OpenLayers.Popup.Anchored =
     * anchor - {Object} Object which must expose a 'size' <OpenLayers.Size> 
     *     and 'offset' <OpenLayers.Pixel> (generally an <OpenLayers.Icon>).
     * closeBox - {Boolean}
+    * closeBoxCallback - {Function} Function to be called on closeBox click.
     */
-    initialize:function(id, lonlat, size, contentHTML, anchor, closeBox) {
+    initialize:function(id, lonlat, size, contentHTML, anchor, closeBox,
-        var newArguments = new Array(id, lonlat, size, contentHTML, closeBox);
+                        closeBoxCallback) {
+        var newArguments = new Array(id, lonlat, size, contentHTML, closeBox,
+                                     closeBoxCallback);
         OpenLayers.Popup.prototype.initialize.apply(this, newArguments);
 
         this.anchor = (anchor != null) ? anchor 

lib/OpenLayers/Popup/AnchoredBubble.js

@@ -32,8 +32,10 @@ OpenLayers.Popup.AnchoredBubble =
      *     a 'size' (<OpenLayers.Size>) and 'offset' (<OpenLayers.Pixel>) 
      *     (Note that this is generally an <OpenLayers.Icon>).
      * closeBox - {Boolean}
+     * closeBoxCallback - {Function} Function to be called on closeBox click.
      */
-    initialize:function(id, lonlat, size, contentHTML, anchor, closeBox) {
+    initialize:function(id, lonlat, size, contentHTML, anchor, closeBox,
+                        closeBoxCallback) {
         OpenLayers.Popup.Anchored.prototype.initialize.apply(this, arguments);
     },
 

tests/test_Popup.html

@@ -29,7 +29,7 @@
     }
     
     function test_02_Popup_constructor (t) {
-        t.plan( 5 );
+        t.plan( 8 );
 
         var id = "chicken";
         var w = 500;
@@ -39,17 +39,37 @@
         var lat = 40;
         var ll = new OpenLayers.LonLat(lon, lat);
         var content = "foo";
+        var closePopupCallback = function(e) {
+            //this should get triggered by the "observer.observer();" call below
+            t.ok(true, "closePopupCallback called")
+        };
 
         popup = new OpenLayers.Popup(id,
                                      ll,
                                      sz,
-                                     content);
+                                     content,
+                                     true,
+                                     closePopupCallback);
 
         t.ok( popup instanceof OpenLayers.Popup, "new OpenLayers.Popup returns Popup object" );
         t.eq(popup.id, id, "popup.id set correctly");
         t.ok(popup.lonlat.equals(ll), "popup.lonlat set correctly");
         t.ok(popup.size.equals(sz), "popup.size set correctly");
         t.eq(popup.contentHTML, content, "contentHTML porpoerty of set correctly");
+
+        // test that a browser event is registered on click on popup closebox
+        var closeImgDiv = popup.groupDiv.childNodes[1];
+        var cacheID = closeImgDiv._eventCacheID;
+        for (var i = 0; i < OpenLayers.Event.observers[cacheID].length; i++) {
+            var observer = OpenLayers.Event.observers[cacheID][i];
+            if (observer.element == closeImgDiv) {
+                t.ok(true, "An event was registered for the close box element");
+                t.eq(observer.name, "click", "A click event was registered for the close box element");
+                //call the registered observer to make sure it's the right one
+                observer.observer();
+                break;
+            }
+        }
     }
 
     function test_Popup_updatePosition(t) {