diff options
Diffstat (limited to 'misc/openlayers/tests/manual/renderedDimensions.html')
-rw-r--r-- | misc/openlayers/tests/manual/renderedDimensions.html | 113 |
1 files changed, 113 insertions, 0 deletions
diff --git a/misc/openlayers/tests/manual/renderedDimensions.html b/misc/openlayers/tests/manual/renderedDimensions.html new file mode 100644 index 0000000..b01624b --- /dev/null +++ b/misc/openlayers/tests/manual/renderedDimensions.html @@ -0,0 +1,113 @@ +<html xmlns="http://www.w3.org/1999/xhtml" debug="true"> + <head> + <title>OpenLayers: Popup Mayhem</title> + <link rel="stylesheet" href="../../theme/default/style.css" type="text/css" /> + <style type="text/css"> + #map { + width: 900px; + height: 500px; + border: 1px solid black; + } + </style> + + <script src="../../lib/OpenLayers.js"></script> + <script type="text/javascript"> + var map; + var layer, markers; + + var currentPopup; + + +// different popup types + + + //disable the autosize for the purpose of our matrix + OpenLayers.Popup.FramedCloud.prototype.autoSize = false; + + AutoSizeFramedCloud = OpenLayers.Class(OpenLayers.Popup.FramedCloud, { + 'autoSize': true + }); + + function init(){ + map = new OpenLayers.Map('map'); + + layer = new OpenLayers.Layer( + "popupMatrix", + {isBaseLayer: true} + ); + map.addLayer(layer); + + markers = new OpenLayers.Layer.Markers("zibo"); + map.addLayer(markers); + + addMarkers(); + map.zoomToMaxExtent(); + } + + function addMarkers() { + + var ll, popupClass, popupContentHTML; + + //anchored bubble popup small contents autosize closebox + ll = new OpenLayers.LonLat(-35,-15); + popupClass = AutoSizeFramedCloud; + popupContentHTML = "<div>This text's line-height is affected<br/>by it's parents. Thus we have to<br/>place the content inside<br/>the correct container to get<br/>the rendered size.</div>"; + addMarker(ll, popupClass, popupContentHTML, true); + + + } + + /** + * Function: addMarker + * Add a new marker to the markers layer given the following lonlat, + * popupClass, and popup contents HTML. Also allow specifying + * whether or not to give the popup a close box. + * + * Parameters: + * ll - {<OpenLayers.LonLat>} Where to place the marker + * popupClass - {<OpenLayers.Class>} Which class of popup to bring up + * when the marker is clicked. + * popupContentHTML - {String} What to put in the popup + * closeBox - {Boolean} Should popup have a close box? + * overflow - {Boolean} Let the popup overflow scrollbars? + */ + function addMarker(ll, popupClass, popupContentHTML, closeBox, overflow) { + + var feature = new OpenLayers.Feature(markers, ll); + feature.closeBox = closeBox; + feature.popupClass = popupClass; + feature.data.popupContentHTML = popupContentHTML; + feature.data.overflow = (overflow) ? "auto" : "hidden"; + + var marker = feature.createMarker(); + + var markerClick = function (evt) { + if (this.popup == null) { + this.popup = this.createPopup(this.closeBox); + map.addPopup(this.popup); + this.popup.show(); + } else { + this.popup.toggle(); + } + currentPopup = this.popup; + OpenLayers.Event.stop(evt); + }; + marker.events.register("mousedown", feature, markerClick); + + markers.addMarker(marker); + } + + </script> + </head> + <body onload="init()"> + <h1 id="title">Popup Matrix</h1> + + <div id="tags"> + </div> + <div style="line-height: 40px;"> + <div id="map" class="smallmap"></div> + </div> + Click on popup, should be able to read a full sentence, not just two lines. + </div> + </body> +</html> |