Adding support for new generation 'framed' popups. This patch includes numerous improvements to the main popups, including the addition of autoSizing, panIntoView, and full support for overflow:auto of the contents div. Thanks go out to the CloudAmber folks, to Pierre in la belle France, to the guys at TOPP and of course, to senior cr5 for his patience and help in the last and final stretch. this is a huge improvement in the popup arena and couldn't have been done without the broad help of everyone out there in the community. Thank you everyone for making this possible. Big step for OpenLayers. (Closes #926)

git-svn-id: http://svn.openlayers.org/trunk/openlayers@6718 dc9f47b5-9b13-0410-9fdd-eb0c1a62fdaf
2008-03-31 04:43:36 +00:00
parent 0fa07edb04
commit 463dc45fbb
22 changed files with 4464 additions and 165 deletions
--- a/examples/sundials.html
+++ b/examples/sundials.html
@@ -0,0 +1,74 @@
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
+        <link rel="stylesheet" href="../theme/default/framedCloud.css" type="text/css" />
+
+    <style type="text/css">
+        #map {
+            width: 100%;
+            height: 100%;
+            border: 1px solid black;
+        }
+        .olPopup p { margin:0px; }
+    </style>
+    <script src="../lib/OpenLayers.js"></script>
+    <script type="text/javascript">
+        var lon = 5;
+        var lat = 40;
+        var zoom = 5;
+        var map, layer;
+
+        function init(){
+            map = new OpenLayers.Map('map');
+            layer = new OpenLayers.Layer.WMS( "OpenLayers WMS",
+                    "http://labs.metacarta.com/wms/vmap0", {layers: 'basic'} );
+            map.addLayer(layer);
+            map.addLayer(new OpenLayers.Layer.GML("KML", "sundials.kml", 
+               {
+                format: OpenLayers.Format.KML, 
+                formatOptions: {
+                  extractStyles: true, 
+                  extractAttributes: true
+                }
+               }));
+             selectControl = new OpenLayers.Control.SelectFeature(map.layers[1],
+                {onSelect: onFeatureSelect, onUnselect: onFeatureUnselect});
+  
+            map.addControl(selectControl);
+            selectControl.activate();   
+            map.zoomToMaxExtent();
+        }
+        function onPopupClose(evt) {
+            selectControl.unselect(selectedFeature);
+        }
+        function onFeatureSelect(feature) {
+            selectedFeature = feature;
+            popup = new OpenLayers.Popup.FramedCloud("chicken", 
+                                     feature.geometry.getBounds().getCenterLonLat(),
+                                     new OpenLayers.Size(100,100),
+                                     "<div style='font-size:.8em'>"+feature.attributes.description+"</div>",
+                                     null, true, onPopupClose);
+            feature.popup = popup;
+            map.addPopup(popup);
+        }
+        function onFeatureUnselect(feature) {
+            map.removePopup(feature.popup);
+            feature.popup.destroy();
+            feature.popup = null;
+        }
+    </script>
+  </head>
+  <body onload="init()">
+      <h1 id="title">KML Layer Example</h1>
+
+      <div id="tags"></div>
+
+      <p id="shortdesc">
+          Demonstrates loading and displaying a KML file on top of a basemap.
+    </p>
+
+    <div id="map"></div>
+
+    <div id="docs"></div>
+  </body>
+</html>