update map.addPopup() to automatically add the popup at the correct screen location... and add it to the layersContainerDiv so that it will move with the maps. and example. and tests.

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

lib/OpenLayers/Map.js

@@ -161,15 +161,15 @@ OpenLayers.Map.prototype = {
 
     /** 
     * @param {OpenLayers.Popup} popup
-    * @param {OpenLayers.Pixel} px
     */
-    addPopup: function(popup, px) {
+    addPopup: function(popup) {
         this.popups.push(popup);
+        var px = this.getPixelFromLonLat(popup.lonlat)
         var popupDiv = popup.draw(px);
         if (popupDiv) {
             popupDiv.style.zIndex = this.Z_INDEX_BASE['Popup'] +
                                     this.popups.length;
-            this.viewPortDiv.appendChild(popupDiv);
+            this.layerContainerDiv.appendChild(popupDiv);
         }
     },
     
@@ -179,7 +179,7 @@ OpenLayers.Map.prototype = {
     removePopup: function(popup) {
         this.popups.remove(popup);
         if (popup.div) {
-            this.viewPortDiv.removeChild(popup.div);
+            this.layerContainerDiv.removeChild(popup.div);
         }
     },
         
@@ -325,6 +325,14 @@ OpenLayers.Map.prototype = {
         if (zoomChanged != null) { // reset the layerContainerDiv's location
             this.layerContainerDiv.style.left = "0px";
             this.layerContainerDiv.style.top  = "0px";
+
+            //redraw popups
+            for (var i = 0; i < this.popups.length; i++) {
+                var popup = this.popups[i];
+                var px = this.getPixelFromLonLat(popup.lonlat);
+                popup.moveTo(px);
+            }
+
         }
         var bounds = this.getExtent();
         for (var i = 0; i < this.layers.length; i++) {

popups.html

@@ -36,10 +36,11 @@
 
         function add() {
             popup = new OpenLayers.Popup("chicken", 
+                                         new OpenLayers.LonLat(5,40),
                                          new OpenLayers.Size(200,200),
                                          "example popup");
         
-            map.addPopup(popup, new OpenLayers.Pixel(50,50));
+            map.addPopup(popup);
         }        
         
         function destroy() {

tests/test_Map.html

@@ -80,12 +80,14 @@
         map = new OpenLayers.Map('map');
         
         var popup = new OpenLayers.Popup("chicken", 
+                                         new OpenLayers.LonLat(0,0),
                                          new OpenLayers.Size(200,200));
+        map.setCenter(new OpenLayers.LonLat(0, 0), 0);
 
-        map.addPopup(popup, new OpenLayers.Pixel(20,20));
+        map.addPopup(popup);
         t.eq(map.popups.indexOf(popup), 0, "popup successfully added to Map's internal popups array");
-        
-        var nodes = map.viewPortDiv.childNodes;
+
+        var nodes = map.layerContainerDiv.childNodes;
         
         var found = false;
         for (var i=0; i < nodes.length; i++) {
@@ -108,8 +110,6 @@
             }
         }
         t.ok(!found, "popup.div successfully removed from the map's viewPort");
-
-
     }
 
     function test_08_Map_px_lonlat_translation (t) {