Tag RC2.

git-svn-id: http://svn.openlayers.org/tags/openlayers/release-2.6-rc2@6836 dc9f47b5-9b13-0410-9fdd-eb0c1a62fdaf

apidoc_config/Languages.txt

@@ -1,4 +1,4 @@
-Format: 1.35
+Format: Development Release 12-07-2007 (1.35 base)
 
 # This is the Natural Docs languages file for this project.  If you change
 # anything here, it will apply to THIS PROJECT ONLY.  If you'd like to change

apidoc_config/Menu.txt

@@ -1,4 +1,4 @@
-Format: 1.35
+Format: Development Release 12-07-2007 (1.35 base)
 
 
 Title: OpenLayers
@@ -8,6 +8,22 @@ SubTitle: JavaScript Mapping Library
 # Footer: [text]
 # If you want to add a copyright notice, this would be the place to do it.
 
+# You can add a timestamp to your documentation like one of these:
+# Timestamp: Generated on month day, year
+# Timestamp: Updated mm/dd/yyyy
+# Timestamp: Last updated mon day
+#
+#   m     - One or two digit month.  January is "1"
+#   mm    - Always two digit month.  January is "01"
+#   mon   - Short month word.  January is "Jan"
+#   month - Long month word.  January is "January"
+#   d     - One or two digit day.  1 is "1"
+#   dd    - Always two digit day.  1 is "01"
+#   day   - Day with letter extension.  1 is "1st"
+#   yy    - Two digit year.  2006 is "06"
+#   yyyy  - Four digit year.  2006 is "2006"
+#   year  - Four digit year.  2006 is "2006"
+
 
 # --------------------------------------------------------------------------
 # 
@@ -52,26 +68,31 @@ Group: OpenLayers  {
 
       File: Control  (no auto-title, OpenLayers/Control.js)
       File: ArgParser  (no auto-title, OpenLayers/Control/ArgParser.js)
-      File: ZoomToMaxExtent  (no auto-title, OpenLayers/Control/ZoomToMaxExtent.js)
-      File: OverviewMap  (no auto-title, OpenLayers/Control/OverviewMap.js)
+      File: Attribution  (no auto-title, OpenLayers/Control/Attribution.js)
+      File: Button  (no auto-title, OpenLayers/Control/Button.js)
       File: DragFeature  (no auto-title, OpenLayers/Control/DragFeature.js)
       File: DragPan  (no auto-title, OpenLayers/Control/DragPan.js)
       File: DrawFeature  (no auto-title, OpenLayers/Control/DrawFeature.js)
       File: EditingToolbar  (no auto-title, OpenLayers/Control/EditingToolbar.js)
       File: KeyboardDefaults  (no auto-title, OpenLayers/Control/KeyboardDefaults.js)
       File: LayerSwitcher  (no auto-title, OpenLayers/Control/LayerSwitcher.js)
+      File: ModifyFeature  (no auto-title, OpenLayers/Control/ModifyFeature.js)
       File: MouseDefaults  (no auto-title, OpenLayers/Control/MouseDefaults.js)
       File: MousePosition  (no auto-title, OpenLayers/Control/MousePosition.js)
       File: MouseToolbar  (no auto-title, OpenLayers/Control/MouseToolbar.js)
       File: Navigation  (no auto-title, OpenLayers/Control/Navigation.js)
+      File: NavigationHistory  (no auto-title, OpenLayers/Control/NavigationHistory.js)
       File: NavToolbar  (no auto-title, OpenLayers/Control/NavToolbar.js)
+      File: OverviewMap  (no auto-title, OpenLayers/Control/OverviewMap.js)
       File: Panel  (no auto-title, OpenLayers/Control/Panel.js)
+      File: PanZoom  (no auto-title, OpenLayers/Control/PanZoom.js)
       File: PanZoomBar  (no auto-title, OpenLayers/Control/PanZoomBar.js)
       File: Permalink  (no auto-title, OpenLayers/Control/Permalink.js)
       File: Scale  (no auto-title, OpenLayers/Control/Scale.js)
+      File: ScaleLine  (no auto-title, OpenLayers/Control/ScaleLine.js)
       File: SelectFeature  (no auto-title, OpenLayers/Control/SelectFeature.js)
       File: ZoomBox  (no auto-title, OpenLayers/Control/ZoomBox.js)
-      File: PanZoom  (OpenLayers/Control/PanZoom.js)
+      File: ZoomToMaxExtent  (no auto-title, OpenLayers/Control/ZoomToMaxExtent.js)
       }  # Group: Control
 
    File: Events  (no auto-title, OpenLayers/Events.js)
@@ -79,26 +100,53 @@ Group: OpenLayers  {
    Group: Feature  {
 
       File: Feature  (no auto-title, OpenLayers/Feature.js)
-      File: WFS  (no auto-title, OpenLayers/Feature/WFS.js)
       File: Vector  (no auto-title, OpenLayers/Feature/Vector.js)
+      File: WFS  (no auto-title, OpenLayers/Feature/WFS.js)
       }  # Group: Feature
 
+   Group: Filter  {
+
+      File: Filter  (no auto-title, OpenLayers/Filter.js)
+      File: Comparison  (no auto-title, OpenLayers/Filter/Comparison.js)
+      File: FeatureId  (no auto-title, OpenLayers/Filter/FeatureId.js)
+      File: Logical  (no auto-title, OpenLayers/Filter/Logical.js)
+      }  # Group: Filter
+
    Group: Format  {
 
-      File: Format  (OpenLayers/Format.js)
+      File: Format  (no auto-title, OpenLayers/Format.js)
       File: GeoJSON  (no auto-title, OpenLayers/Format/GeoJSON.js)
       File: GeoRSS  (no auto-title, OpenLayers/Format/GeoRSS.js)
       File: GML  (no auto-title, OpenLayers/Format/GML.js)
       File: JSON  (no auto-title, OpenLayers/Format/JSON.js)
       File: KML  (no auto-title, OpenLayers/Format/KML.js)
+      File: OSM  (no auto-title, OpenLayers/Format/OSM.js)
+
+      Group: SLD  {
+
+         File: SLD  (no auto-title, OpenLayers/Format/SLD.js)
+         File: v1  (no auto-title, OpenLayers/Format/SLD/v1.js)
+         File: v1_0_0  (no auto-title, OpenLayers/Format/SLD/v1_0_0.js)
+         }  # Group: SLD
+
+      File: Text  (no auto-title, OpenLayers/Format/Text.js)
       File: WFS  (no auto-title, OpenLayers/Format/WFS.js)
       File: WKT  (no auto-title, OpenLayers/Format/WKT.js)
       File: XML  (no auto-title, OpenLayers/Format/XML.js)
+
+      Group: WMC  {
+
+         File: WMC  (no auto-title, OpenLayers/Format/WMC.js)
+         File: v1  (no auto-title, OpenLayers/Format/WMC/v1.js)
+         File: v1_0_0  (no auto-title, OpenLayers/Format/WMC/v1_0_0.js)
+         File: v1_1_0  (no auto-title, OpenLayers/Format/WMC/v1_1_0.js)
+         }  # Group: WMC
+
       }  # Group: Format
 
    Group: Geometry  {
 
-      File: Geometry  (OpenLayers/Geometry.js)
+      File: Geometry  (no auto-title, OpenLayers/Geometry.js)
       File: Collection  (no auto-title, OpenLayers/Geometry/Collection.js)
       File: Curve  (no auto-title, OpenLayers/Geometry/Curve.js)
       File: LinearRing  (no auto-title, OpenLayers/Geometry/LinearRing.js)
@@ -109,15 +157,16 @@ Group: OpenLayers  {
       File: Point  (no auto-title, OpenLayers/Geometry/Point.js)
       File: Polygon  (no auto-title, OpenLayers/Geometry/Polygon.js)
       File: Rectangle  (no auto-title, OpenLayers/Geometry/Rectangle.js)
-      File: Surface  (no auto-title, OpenLayers/Geometry/Surface.js)
       }  # Group: Geometry
 
    Group: Handler  {
 
-      File: Handler  (OpenLayers/Handler.js)
+      File: Handler  (no auto-title, OpenLayers/Handler.js)
       File: Box  (no auto-title, OpenLayers/Handler/Box.js)
+      File: Click  (no auto-title, OpenLayers/Handler/Click.js)
       File: Drag  (no auto-title, OpenLayers/Handler/Drag.js)
       File: Feature  (no auto-title, OpenLayers/Handler/Feature.js)
+      File: Hover  (no auto-title, OpenLayers/Handler/Hover.js)
       File: Keyboard  (no auto-title, OpenLayers/Handler/Keyboard.js)
       File: MouseWheel  (no auto-title, OpenLayers/Handler/MouseWheel.js)
       File: Path  (no auto-title, OpenLayers/Handler/Path.js)
@@ -128,9 +177,19 @@ Group: OpenLayers  {
 
    File: Icon  (no auto-title, OpenLayers/Icon.js)
 
+   Group: Lang  {
+
+      File: Lang  (no auto-title, OpenLayers/Lang.js)
+      File: Lang["cs-CZ"]  (OpenLayers/Lang/cs-CZ.js)
+      File: Lang["de"]  (no auto-title, OpenLayers/Lang/de.js)
+      File: Lang["en"]  (no auto-title, OpenLayers/Lang/en.js)
+      File: Lang["en-CA"]  (no auto-title, OpenLayers/Lang/en-CA.js)
+      File: Lang["fr"]  (no auto-title, OpenLayers/Lang/fr.js)
+      }  # Group: Lang
+
    Group: Layer  {
 
-      File: Layer  (OpenLayers/Layer.js)
+      File: Layer  (no auto-title, OpenLayers/Layer.js)
       File: Boxes  (no auto-title, OpenLayers/Layer/Boxes.js)
       File: EventPane  (no auto-title, OpenLayers/Layer/EventPane.js)
       File: FixedZoomLevels  (no auto-title, OpenLayers/Layer/FixedZoomLevels.js)
@@ -141,10 +200,12 @@ Group: OpenLayers  {
       File: HTTPRequest  (no auto-title, OpenLayers/Layer/HTTPRequest.js)
       File: Image  (no auto-title, OpenLayers/Layer/Image.js)
       File: KaMap  (no auto-title, OpenLayers/Layer/KaMap.js)
+      File: MapGuide  (no auto-title, OpenLayers/Layer/MapGuide.js)
       File: MapServer  (no auto-title, OpenLayers/Layer/MapServer.js)
       File: MapServer.Untiled  (no auto-title, OpenLayers/Layer/MapServer/Untiled.js)
       File: Markers  (no auto-title, OpenLayers/Layer/Markers.js)
       File: MultiMap  (no auto-title, OpenLayers/Layer/MultiMap.js)
+      File: PointTrack  (no auto-title, OpenLayers/Layer/PointTrack.js)
       File: SphericalMercator  (no auto-title, OpenLayers/Layer/SphericalMercator.js)
       File: Text  (no auto-title, OpenLayers/Layer/Text.js)
       File: TileCache  (no auto-title, OpenLayers/Layer/TileCache.js)
@@ -162,33 +223,42 @@ Group: OpenLayers  {
 
    Group: Marker  {
 
-      File: Marker  (OpenLayers/Marker.js)
+      File: Marker  (no auto-title, OpenLayers/Marker.js)
       File: Box  (no auto-title, OpenLayers/Marker/Box.js)
       }  # Group: Marker
 
    Group: Popup  {
 
-      File: Popup  (OpenLayers/Popup.js)
+      File: Popup  (no auto-title, OpenLayers/Popup.js)
       File: Anchored  (no auto-title, OpenLayers/Popup/Anchored.js)
       File: AnchoredBubble  (no auto-title, OpenLayers/Popup/AnchoredBubble.js)
+      File: Framed  (OpenLayers/Popup/Framed.js)
+      File: FramedCloud  (OpenLayers/Popup/FramedCloud.js)
       }  # Group: Popup
 
+   File: Projection  (no auto-title, OpenLayers/Projection.js)
+
    Group: Renderer  {
 
-      File: Renderer  (OpenLayers/Renderer.js)
+      File: Renderer  (no auto-title, OpenLayers/Renderer.js)
       File: Elements  (no auto-title, OpenLayers/Renderer/Elements.js)
       File: SVG  (no auto-title, OpenLayers/Renderer/SVG.js)
       File: VML  (no auto-title, OpenLayers/Renderer/VML.js)
       }  # Group: Renderer
 
+   File: Rule  (no auto-title, OpenLayers/Rule.js)
+   File: Style  (no auto-title, OpenLayers/Style.js)
+   File: StyleMap  (no auto-title, OpenLayers/StyleMap.js)
+
    Group: Tile  {
 
-      File: Tile  (OpenLayers/Tile.js)
+      File: Tile  (no auto-title, OpenLayers/Tile.js)
       File: Image  (no auto-title, OpenLayers/Tile/Image.js)
       File: WFS  (no auto-title, OpenLayers/Tile/WFS.js)
       }  # Group: Tile
 
-   File: Util  (OpenLayers/Util.js)
+   File: Tween  (no auto-title, OpenLayers/Tween.js)
+   File: Util  (no auto-title, OpenLayers/Util.js)
    }  # Group: OpenLayers
 
 Group: Index  {

apidoc_config/Topics.txt

@@ -1,4 +1,4 @@
-Format: 1.35
+Format: Development Release 12-07-2007 (1.35 base)
 
 # This is the Natural Docs topics file for this project.  If you change anything
 # here, it will apply to THIS PROJECT ONLY.  If you'd like to change something
@@ -58,9 +58,6 @@ Ignore Keywords:
 # Class Hierarchy: [yes|no]
 #    Whether the topics are part of the class hierarchy.  Defaults to no.
 #
-# Variable Type: [yes|no]
-#    Whether the topics can be a variable type.  Defaults to no.
-#
 # Page Title If First: [yes|no]
 #    Whether the topic's title becomes the page title if it's the first one in
 #    a file.  Defaults to no.

build/build.py

@@ -2,11 +2,22 @@
 
 import sys
 sys.path.append("../tools")
+import mergejs
 
-import jsmin, mergejs
+have_compressor = None
+try:
+    import jsmin
+    have_compressor = "jsmin"
+except ImportError:
+    try:
+        import minimize
+        have_compressor = "minimize"
+    except Exception, E:
+        print E
+        pass
 
 sourceDirectory = "../lib"
-configFilename = "library.cfg"
+configFilename = "full.cfg"
 outputFilename = "OpenLayers.js"
 
 if len(sys.argv) > 1:
@@ -21,8 +32,15 @@ if len(sys.argv) > 2:
 
 print "Merging libraries."
 merged = mergejs.run(sourceDirectory, None, configFilename)
-print "Compressing."
-minimized = jsmin.jsmin(merged)
+if have_compressor == "jsmin":
+    print "Compressing using jsmin."
+    minimized = jsmin.jsmin(merged)
+elif have_compressor == "minimize":
+    print "Compressing using minimize."
+    minimized = minimize.minimize(merged)
+else: # fallback
+    print "Not compressing."
+    minimized = merged 
 print "Adding license file."
 minimized = file("license.txt").read() + minimized
 

build/buildUncompressed.py

@@ -6,7 +6,7 @@ sys.path.append("../tools")
 import jsmin, mergejs
 
 sourceDirectory = "../lib"
-configFilename = "library.cfg"
+configFilename = "full.cfg"
 outputFilename = "OpenLayers.js"
 
 if len(sys.argv) > 1:

build/full.cfg

@@ -13,3 +13,7 @@ Rico/Corner.js
 [exclude]
 Firebug/firebug.js
 Firebug/firebugx.js
+OpenLayers/Lang/de.js
+OpenLayers/Lang/en-CA.js
+OpenLayers/Lang/fr.js
+OpenLayers/Lang/cs-CZ.js

build/library.cfg

@@ -46,5 +46,9 @@ OpenLayers/Renderer/Elements.js
 OpenLayers/Renderer/SVG.js
 OpenLayers/Renderer/VML.js
 OpenLayers/Renderer.js
+OpenLayers/Lang/de.js
+OpenLayers/Lang/en-CA.js
+OpenLayers/Lang/fr.js
+OpenLayers/Lang/cs-CZ.js
 
 

build/license.txt

@@ -2,8 +2,8 @@
 
   OpenLayers.js -- OpenLayers Map Viewer Library
 
-  Copyright 2005-2007 MetaCarta, Inc., released under a modified BSD license.
-  Please see http://svn.openlayers.org/trunk/openlayers/repository-license.txt
+  Copyright 2005-2008 MetaCarta, Inc., released under the Clear BSD license.
+  Please see http://svn.openlayers.org/trunk/openlayers/license.txt
   for the full text of the license.
 
   Includes compressed code under the following licenses:
@@ -21,7 +21,7 @@
  *  Prototype is freely distributable under the terms of an MIT-style license.
  *  For details, see the Prototype web site: http://prototype.conio.net/
  *
-/*--------------------------------------------------------------------------*/
+ *--------------------------------------------------------------------------*/
 
 /**  
 *  

build/lite.cfg

@@ -21,3 +21,8 @@ OpenLayers/Tile/Image.js
 [exclude]
 Firebug/firebug.js
 Firebug/firebugx.js
+OpenLayers/Lang/de.js
+OpenLayers/Lang/en-CA.js
+OpenLayers/Lang/fr.js
+OpenLayers/Lang/cs-CZ.js
+

doc/Jugl.js

@@ -0,0 +1,74 @@
+/**
+ * Jugl.js -- JavaScript Template Attribute Language
+ * This code is not yet licensed for release or distribution.
+ *
+ * Copyright 2007 Tim Schaub
+ */
+
+/**
+ * Contains portions of OpenLayers.js -- OpenLayers Map Viewer Library
+ *
+ * Copyright 2005-2006 MetaCarta, Inc., released under a modified BSD license.
+ * Please see http://svn.openlayers.org/trunk/openlayers/repository-license.txt
+ * for the full text of the license.
+ */
+
+/**
+ * Contains portions of Prototype.js:
+ *
+ * Prototype JavaScript framework, version 1.4.0
+ *  (c) 2005 Sam Stephenson <sam@conio.net>
+ *
+ *  Prototype is freely distributable under the terms of an MIT-style license.
+ *  For details, see the Prototype web site: http://prototype.conio.net/
+ */
+
+(function(){var uri="http://jugl.tschaub.net/trunk/lib/Jugl.js";var Jugl={singleFile:true};window[uri]=Jugl;})();(function(){var uri="http://jugl.tschaub.net/trunk/lib/Jugl.js";var singleFile=(typeof window[uri]=="object"&&window[uri].singleFile);var Jugl={prefix:"jugl",namespaceURI:"http://namespace.jugl.org/",scriptName:(!singleFile)?"lib/Jugl.js":"Jugl.js",getScriptLocation:function(){var scriptLocation="";var scriptName=Jugl.scriptName;var scripts=document.getElementsByTagName('script');for(var i=0;i<scripts.length;i++){var src=scripts[i].getAttribute('src');if(src){var index=src.lastIndexOf(scriptName);if((index>-1)&&(index+scriptName.length==src.length)){scriptLocation=src.slice(0,-scriptName.length);break;}}}
+return scriptLocation;}};if(!singleFile){var jsfiles=new Array("Jugl/Util.js","Jugl/Class.js","Jugl/Async.js","Jugl/Node.js","Jugl/Attribute.js","Jugl/Console.js","Jugl/Template.js");var allScriptTags="";var host=Jugl.getScriptLocation()+"lib/";for(var i=0;i<jsfiles.length;i++){if(/MSIE/.test(navigator.userAgent)||/Safari/.test(navigator.userAgent)){var currentScriptTag="<script src='"+host+jsfiles[i]+"'></script>";allScriptTags+=currentScriptTag;}else{var s=document.createElement("script");s.src=host+jsfiles[i];var h=document.getElementsByTagName("head").length?document.getElementsByTagName("head")[0]:document.body;h.appendChild(s);}}
+if(allScriptTags){document.write(allScriptTags);}}
+window[uri]=Jugl;})();(function(){var uri="http://jugl.tschaub.net/trunk/lib/Jugl.js";var Jugl=window[uri];Jugl.Class=function(){var Class=function(){this.initialize.apply(this,arguments);}
+var extended={};var parent;for(var i=0;i<arguments.length;++i){if(typeof arguments[i]=="function"){parent=arguments[i].prototype;}else{parent=arguments[i];}
+Jugl.Util.extend(extended,parent);}
+Class.prototype=extended;return Class;};})();(function(){var uri="http://jugl.tschaub.net/trunk/lib/Jugl.js";var Jugl=window[uri];Jugl.Util=new Object();Jugl.Util.extend=function(destination,source){for(property in source){destination[property]=source[property];}
+return destination;};Jugl.Util.indexOf=function(array,obj){for(var i=0;i<array.length;i++){if(array[i]==obj)return i;}
+return-1;};Jugl.Util.bind=function(method,object){var args=[];for(var i=2;i<arguments.length;++i){args.push(arguments[i]);}
+return function(){for(var i=0;i<arguments.length;++i){args.push(arguments[i]);}
+return method.apply(object,args);}};})();(function(){var uri="http://jugl.tschaub.net/trunk/lib/Jugl.js";var Jugl=window[uri];Jugl.Console={log:function(){},debug:function(){},info:function(){},warn:function(){},error:function(){},assert:function(){},dir:function(){},dirxml:function(){},trace:function(){},group:function(){},groupEnd:function(){},time:function(){},timeEnd:function(){},profile:function(){},profileEnd:function(){},count:function(){}};(function(){if(window.console){var scripts=document.getElementsByTagName("script");for(var i=0;i<scripts.length;++i){if(scripts[i].src.indexOf("firebug.js")!=-1){Jugl.Util.extend(Jugl.Console,console);break;}}}})();})();(function(){var uri="http://jugl.tschaub.net/trunk/lib/Jugl.js";var Jugl=window[uri];Jugl.Attribute=Jugl.Class({node:null,element:null,type:null,nodeValue:null,template:null,initialize:function(node,element,type){this.node=node;this.element=element;this.type=type;this.nodeValue=element.nodeValue;this.nodeName=element.nodeName;this.template=node.template;},splitAttributeValue:function(value){value=(value!=null)?value:this.nodeValue;var matches=this.template.regExes.trimSpace.exec(value);var items;if(matches.length==3){items=[matches[1],matches[2]];}
+return items;},getAttributeValues:function(){var trimmed=this.nodeValue.replace(/[\t\n]/g,"").replace(/;\s*$/,"");var tabbed=trimmed.replace(/;;/g,"\t");var newlined=tabbed.split(";").join("\n");return newlined.replace(/\t/g,";").split(/\n/g);},removeSelf:function(){this.node.removeAttributeNode(this);},process:function(){return this.processAttribute[this.type].apply(this,[]);},evalInScope:function(str){var expression="with(this.node.scope){"+str+"}";return eval(expression);},processAttribute:{"define":function(){var values=this.getAttributeValues();var pair;for(var i=0;i<values.length;++i){pair=this.splitAttributeValue(values[i]);this.node.scope[pair[0]]=this.evalInScope(pair[1]);}
+this.removeSelf();return true;},"condition":function(){var proceed;try{proceed=!!(this.evalInScope(this.nodeValue));}catch(err){var message=err.name+": "+err.message+"\n";message+="attribute: "+this.nodeName;Jugl.Console.error(message);Jugl.Console.dirxml(this.node.element);Jugl.Console.log(this.node.scope);}
+this.removeSelf();if(!proceed){this.node.removeSelf();}
+return proceed;},"repeat":function(){var pair=this.splitAttributeValue();var key=pair[0];var list=this.evalInScope(pair[1]);this.removeSelf();if(!(list instanceof Array)){var items=new Array();for(var p in list){items.push(p);}
+list=items;}
+var node;var previousSibling=this.node;var length=list.length;for(var i=0;i<length;++i){node=this.node.clone();node.scope[key]=list[i];node.scope.repeat[key]={index:i,number:i+1,even:!(i%2),odd:!!(i%2),start:(i==0),end:(i==length-1),length:length};previousSibling.insertAfter(node);node.process();previousSibling=node;}
+this.node.removeSelf();return false;},"content":function(){var str;try{str=this.evalInScope(this.nodeValue);}catch(err){Jugl.Console.error("Failed to eval in node scope: "+
+this.nodeValue);throw err;}
+this.removeSelf();var child=new Jugl.Node(this.template,document.createTextNode(str));this.node.removeChildNodes();this.node.appendChild(child);return true;},"replace":function(){var str;try{str=this.evalInScope(this.nodeValue);}catch(err){Jugl.Console.error("Failed to eval in node scope: "+
+this.nodeValue);throw err;}
+this.removeSelf();var replacement=new Jugl.Node(this.template,document.createTextNode(str));this.node.insertBefore(replacement);this.node.removeSelf();return true;},"attributes":function(){var values=this.getAttributeValues();var pair,name,value;for(var i=0;i<values.length;++i){pair=this.splitAttributeValue(values[i]);name=pair[0];value=this.evalInScope(pair[1]);if(value!==false){this.node.setAttribute(name,value);}}
+this.removeSelf();return true;},"omit-tag":function(){var omit;try{omit=((this.nodeValue=="")||!!(this.evalInScope(this.nodeValue)));}catch(err){Jugl.Console.error("Failed to eval in node scope: "+
+this.nodeValue);throw err;}
+this.removeSelf();if(omit){var children=this.node.getChildNodes();var child;for(var i=0;i<children.length;++i){this.node.insertBefore(children[i]);}
+this.node.removeSelf();}}},CLASS_NAME:"Jugl.Attribute"});})();(function(){var uri="http://jugl.tschaub.net/trunk/lib/Jugl.js";var Jugl=window[uri];Jugl.Template=Jugl.Class({element:null,usingNS:false,xhtmlns:"http://www.w3.org/1999/xhtml",xmldom:null,regExes:null,loaded:false,loading:false,initialize:function(element,options){if(typeof(element)=="string"){element=document.getElementById(element);}
+if(element){this.element=element;this.loaded=true;}
+this.regExes={trimSpace:(/^\s*(\w+)\s+(.*?)\s*$/)};if(window.ActiveXObject){this.xmldom=new ActiveXObject("Microsoft.XMLDOM");}},process:function(context,clone,toString){if(this.element.getAttributeNodeNS){if(this.element.getAttributeNodeNS(Jugl.xhtmlns,Jugl.prefix)){this.usingNS=true;}}
+var node=new Jugl.Node(this,this.element);if(clone){node=node.clone();}
+if(context){node.scope=context;}
+try{node.process();}catch(err){Jugl.Console.error("Failed to process "+
+this.element+" node");}
+var data;if(toString){if(node.element.innerHTML){data=node.element.innerHTML;}else{if(this.xmldom){data=node.element.xml;}else{var serializer=new XMLSerializer();data=serializer.serializeToString(node.element);}}}else{data=node.element;}
+return data;},load:function(url){this.loading=true;var setElement=function(request){var doc=request.responseXML;this.element=doc.documentElement;this.loading=false;this.loaded=true;this.onLoad();}
+Jugl.Async.loadUrl(url,setElement,this);},onLoad:function(){},CLASS_NAME:"Jugl.Template"});})();(function(){var uri="http://jugl.tschaub.net/trunk/lib/Jugl.js";var Jugl=window[uri];Jugl.Node=Jugl.Class({template:null,element:null,scope:null,initialize:function(template,element){this.template=template;this.element=element;this.scope=new Object();this.scope.repeat=new Object();},clone:function(){var element=this.element.cloneNode(true);var node=new Jugl.Node(this.template,element);Jugl.Util.extend(node.scope,this.scope);return node;},getAttribute:function(localName){var element;if(this.element.nodeType==1){if(this.template.usingNS){element=this.element.getAttributeNodeNS(Jugl.namespaceURI,localName);}else{element=this.element.getAttributeNode(Jugl.prefix+":"+
+localName);}
+if(element&&!element.specified){element=false;}}
+var attribute;if(element){attribute=new Jugl.Attribute(this,element,localName);}else{attribute=element;}
+return attribute;},setAttribute:function(name,value){this.element.setAttribute(name,value);},removeAttributeNode:function(attribute){this.element.removeAttributeNode(attribute.element);},getChildNodes:function(){var children=[];var node,scope;for(var i=0;i<this.element.childNodes.length;++i){node=new Jugl.Node(this.template,this.element.childNodes[i]);node.scope=Jugl.Util.extend({},this.scope);children.push(node);}
+return children;},removeChildNodes:function(){while(this.element.hasChildNodes()){this.element.removeChild(this.element.firstChild);}},removeChild:function(node){this.element.removeChild(node.element);return node;},removeSelf:function(){this.element.parentNode.removeChild(this.element);},appendChild:function(node){this.element.appendChild(node.element);},insertAfter:function(node){var parent=this.element.parentNode;var sibling=this.element.nextSibling;if(sibling){parent.insertBefore(node.element,sibling);}else{parent.appendChild(node.element);}},insertBefore:function(node){var parent=this.element.parentNode;parent.insertBefore(node.element,this.element);},process:function(){var attribute;var keepProcessing=true;var series=["define","condition","repeat"];for(var i=0;i<series.length;++i){attribute=this.getAttribute(series[i]);if(attribute){try{keepProcessing=attribute.process();}catch(err){Jugl.Console.error("Failed to process "+
+series[i]+" attribute");throw err;}
+if(!keepProcessing){return;}}}
+var content=this.getAttribute("content");if(content){try{content.process();}catch(err){Jugl.Console.error("Failed to process content attribute");throw err;}}else{var replace=this.getAttribute("replace");if(replace){try{replace.process();}catch(err){Jugl.Console.error("Failed to process replace attribute");throw err;}}}
+var attributes=this.getAttribute("attributes");if(attributes){try{attributes.process();}catch(err){Jugl.Console.error("Failed to process attributes attribute");throw err;}}
+if(!content&&!replace){this.processChildNodes();}
+var omit=this.getAttribute("omit-tag");if(omit){try{omit.process();}catch(err){Jugl.Console.error("Failed to process omit-tag attribute");throw err;}}},processChildNodes:function(){var element,child;var children=this.getChildNodes();for(var i=0;i<children.length;++i){try{children[i].process();}catch(err){Jugl.Console.error("Failed to process "+
+children[i]+" node");throw err;}}},CLASS_NAME:"Jugl.Node"});})();(function(){var uri="http://jugl.tschaub.net/trunk/lib/Jugl.js";var Jugl=window[uri];Jugl.Async={loadTemplate:function(url,onComplete,caller){var createTemplate=function(request){var doc=request.responseXML;var template=new Jugl.Template(doc.documentElement);var complete=Jugl.Util.bind(onComplete,caller);complete(template);}
+Jugl.Async.loadUrl(url,createTemplate);},loadUrl:function(url,onComplete,caller){var complete=(caller)?Jugl.Util.bind(onComplete,caller):onComplete;var request=Jugl.Async.createXMLHttpRequest();request.open("GET",url);request.onreadystatechange=function(){if(request.readyState==4){complete(request);}}
+request.send(null);},createXMLHttpRequest:function(){if(typeof XMLHttpRequest!="undefined"){return new XMLHttpRequest();}else if(typeof ActiveXObject!="undefined"){return new ActiveXObject("Microsoft.XMLHTTP");}else{throw new Error("XMLHttpRequest not supported");}}};})();

doc/authors.txt

@@ -1,17 +1,24 @@
 OpenLayers contributors:
+
+Seb Benthall
 Howard Butler
 Bertil Chaupis                                                               
 John Cole
 Jeff Dege
+Roald de Wit
 Schuyler Erle
 Christian López Espínola
 John Frank
 Sean Gilles
 Pierre Giraud
 Andreas Hocevar
+Ian Johnson
 Eric Lemoine
 Philip Lindsay
+Martijn van Oosterhout
+David Overstrom
 Corey Puffault
+Gregers Rygg
 Tim Schaub
 Christopher Schmidt
 Cameron Shorter                                                              
@@ -19,9 +26,15 @@ Paul Spencer
 Glen Stampoultzis
 James Stembridge
 Erik Uzureau
+Ivan Willig
 Bill Woodall
 Steve Woodbridge
 
+Some portions of OpenLayers are used under the Apache 2.0 license, available
+in doc/licenses/APACHE-2.0.txt.
 
-OpenLayers is graciously supported by MetaCarta, Inc.
-<http://www.metacarta.com>.
+Some portions of OpenLayers are used under the MIT license, availabie in 
+doc/licenses/MIT-LICENSE.txt.
+
+Some portions of OpenLayers are Copyright 2001 Robert Penner, and are used 
+under the BSD license, available in doc/licenses/BSD-LICENSE.txt

doc/examples.html

@@ -0,0 +1,55 @@
+<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Strict//EN">
+<html>
+    <head>
+        <title>OL Docs</title>
+        <style type="text/css">
+            html, body {margin: 0;padding: 0.5em 1em;font: 0.9em Verdana, Arial, sans serif;}
+            .exampleContainer{width:90%; padding:5px; border-bottom:1px solid grey; }
+            .exampleNumber{display:inline; font-weight:bold; color:#333; }
+            .exampleTitle{display:inline; font-weight:bold; color:#333; }
+            .exampleName{display:inline; color:#333; }
+            .exampleDescription{color:#222; padding:3px; font-size:1.2em; }
+            .exampleClasses{font-size:.7em; color:grey;display:none;}
+        </style>
+        <script type="text/javascript" src="./Jugl.js"></script>
+        <script type="text/javascript" src="examples.js"></script>
+        <script type="text/javascript">
+            // import
+            var uri = "http://jugl.tschaub.net/trunk/lib/Jugl.js";
+            var Jugl = window[uri];
+            // this part does the actual template processing
+            window.onload = function() {
+                var template = new Jugl.Template("basic");
+                template.process();
+            }
+        </script>
+    </head>
+    <body>
+        <div id="basic" style="margin: 0 auto;">
+            <div class="exampleContainer" jugl:repeat="example examples">
+                <div class="exampleNumber" jugl:content="repeat.example.number">
+                    Example # goes here
+                </div>
+                <div class="exampleTitle" jugl:content="example.title">
+                    Title goes here
+                </div>
+                <div class="exampleName">
+                    <a jugl:content="example.example"
+                     jugl:attributes="href example.link">
+                    Example Filename and Link
+                    </a>
+                </div>
+                <div class="exampleDescription">
+                    <span jugl:content="example.shortdesc">
+                    Short Description goes here
+                    </span>
+                </div>
+                <div class="exampleClasses" >
+                    <span jugl:content="example.classes">
+                    Related Classes go here
+                    </span>
+                </div>
+            </div>
+        </div>
+    </body>
+</html>

doc/licenses/APACHE-2.0.txt

@@ -0,0 +1,202 @@
+
+                                 Apache License
+                           Version 2.0, January 2004
+                        http://www.apache.org/licenses/
+
+   TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION
+
+   1. Definitions.
+
+      "License" shall mean the terms and conditions for use, reproduction,
+      and distribution as defined by Sections 1 through 9 of this document.
+
+      "Licensor" shall mean the copyright owner or entity authorized by
+      the copyright owner that is granting the License.
+
+      "Legal Entity" shall mean the union of the acting entity and all
+      other entities that control, are controlled by, or are under common
+      control with that entity. For the purposes of this definition,
+      "control" means (i) the power, direct or indirect, to cause the
+      direction or management of such entity, whether by contract or
+      otherwise, or (ii) ownership of fifty percent (50%) or more of the
+      outstanding shares, or (iii) beneficial ownership of such entity.
+
+      "You" (or "Your") shall mean an individual or Legal Entity
+      exercising permissions granted by this License.
+
+      "Source" form shall mean the preferred form for making modifications,
+      including but not limited to software source code, documentation
+      source, and configuration files.
+
+      "Object" form shall mean any form resulting from mechanical
+      transformation or translation of a Source form, including but
+      not limited to compiled object code, generated documentation,
+      and conversions to other media types.
+
+      "Work" shall mean the work of authorship, whether in Source or
+      Object form, made available under the License, as indicated by a
+      copyright notice that is included in or attached to the work
+      (an example is provided in the Appendix below).
+
+      "Derivative Works" shall mean any work, whether in Source or Object
+      form, that is based on (or derived from) the Work and for which the
+      editorial revisions, annotations, elaborations, or other modifications
+      represent, as a whole, an original work of authorship. For the purposes
+      of this License, Derivative Works shall not include works that remain
+      separable from, or merely link (or bind by name) to the interfaces of,
+      the Work and Derivative Works thereof.
+
+      "Contribution" shall mean any work of authorship, including
+      the original version of the Work and any modifications or additions
+      to that Work or Derivative Works thereof, that is intentionally
+      submitted to Licensor for inclusion in the Work by the copyright owner
+      or by an individual or Legal Entity authorized to submit on behalf of
+      the copyright owner. For the purposes of this definition, "submitted"
+      means any form of electronic, verbal, or written communication sent
+      to the Licensor or its representatives, including but not limited to
+      communication on electronic mailing lists, source code control systems,
+      and issue tracking systems that are managed by, or on behalf of, the
+      Licensor for the purpose of discussing and improving the Work, but
+      excluding communication that is conspicuously marked or otherwise
+      designated in writing by the copyright owner as "Not a Contribution."
+
+      "Contributor" shall mean Licensor and any individual or Legal Entity
+      on behalf of whom a Contribution has been received by Licensor and
+      subsequently incorporated within the Work.
+
+   2. Grant of Copyright License. Subject to the terms and conditions of
+      this License, each Contributor hereby grants to You a perpetual,
+      worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+      copyright license to reproduce, prepare Derivative Works of,
+      publicly display, publicly perform, sublicense, and distribute the
+      Work and such Derivative Works in Source or Object form.
+
+   3. Grant of Patent License. Subject to the terms and conditions of
+      this License, each Contributor hereby grants to You a perpetual,
+      worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+      (except as stated in this section) patent license to make, have made,
+      use, offer to sell, sell, import, and otherwise transfer the Work,
+      where such license applies only to those patent claims licensable
+      by such Contributor that are necessarily infringed by their
+      Contribution(s) alone or by combination of their Contribution(s)
+      with the Work to which such Contribution(s) was submitted. If You
+      institute patent litigation against any entity (including a
+      cross-claim or counterclaim in a lawsuit) alleging that the Work
+      or a Contribution incorporated within the Work constitutes direct
+      or contributory patent infringement, then any patent licenses
+      granted to You under this License for that Work shall terminate
+      as of the date such litigation is filed.
+
+   4. Redistribution. You may reproduce and distribute copies of the
+      Work or Derivative Works thereof in any medium, with or without
+      modifications, and in Source or Object form, provided that You
+      meet the following conditions:
+
+      (a) You must give any other recipients of the Work or
+          Derivative Works a copy of this License; and
+
+      (b) You must cause any modified files to carry prominent notices
+          stating that You changed the files; and
+
+      (c) You must retain, in the Source form of any Derivative Works
+          that You distribute, all copyright, patent, trademark, and
+          attribution notices from the Source form of the Work,
+          excluding those notices that do not pertain to any part of
+          the Derivative Works; and
+
+      (d) If the Work includes a "NOTICE" text file as part of its
+          distribution, then any Derivative Works that You distribute must
+          include a readable copy of the attribution notices contained
+          within such NOTICE file, excluding those notices that do not
+          pertain to any part of the Derivative Works, in at least one
+          of the following places: within a NOTICE text file distributed
+          as part of the Derivative Works; within the Source form or
+          documentation, if provided along with the Derivative Works; or,
+          within a display generated by the Derivative Works, if and
+          wherever such third-party notices normally appear. The contents
+          of the NOTICE file are for informational purposes only and
+          do not modify the License. You may add Your own attribution
+          notices within Derivative Works that You distribute, alongside
+          or as an addendum to the NOTICE text from the Work, provided
+          that such additional attribution notices cannot be construed
+          as modifying the License.
+
+      You may add Your own copyright statement to Your modifications and
+      may provide additional or different license terms and conditions
+      for use, reproduction, or distribution of Your modifications, or
+      for any such Derivative Works as a whole, provided Your use,
+      reproduction, and distribution of the Work otherwise complies with
+      the conditions stated in this License.
+
+   5. Submission of Contributions. Unless You explicitly state otherwise,
+      any Contribution intentionally submitted for inclusion in the Work
+      by You to the Licensor shall be under the terms and conditions of
+      this License, without any additional terms or conditions.
+      Notwithstanding the above, nothing herein shall supersede or modify
+      the terms of any separate license agreement you may have executed
+      with Licensor regarding such Contributions.
+
+   6. Trademarks. This License does not grant permission to use the trade
+      names, trademarks, service marks, or product names of the Licensor,
+      except as required for reasonable and customary use in describing the
+      origin of the Work and reproducing the content of the NOTICE file.
+
+   7. Disclaimer of Warranty. Unless required by applicable law or
+      agreed to in writing, Licensor provides the Work (and each
+      Contributor provides its Contributions) on an "AS IS" BASIS,
+      WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
+      implied, including, without limitation, any warranties or conditions
+      of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A
+      PARTICULAR PURPOSE. You are solely responsible for determining the
+      appropriateness of using or redistributing the Work and assume any
+      risks associated with Your exercise of permissions under this License.
+
+   8. Limitation of Liability. In no event and under no legal theory,
+      whether in tort (including negligence), contract, or otherwise,
+      unless required by applicable law (such as deliberate and grossly
+      negligent acts) or agreed to in writing, shall any Contributor be
+      liable to You for damages, including any direct, indirect, special,
+      incidental, or consequential damages of any character arising as a
+      result of this License or out of the use or inability to use the
+      Work (including but not limited to damages for loss of goodwill,
+      work stoppage, computer failure or malfunction, or any and all
+      other commercial damages or losses), even if such Contributor
+      has been advised of the possibility of such damages.
+
+   9. Accepting Warranty or Additional Liability. While redistributing
+      the Work or Derivative Works thereof, You may choose to offer,
+      and charge a fee for, acceptance of support, warranty, indemnity,
+      or other liability obligations and/or rights consistent with this
+      License. However, in accepting such obligations, You may act only
+      on Your own behalf and on Your sole responsibility, not on behalf
+      of any other Contributor, and only if You agree to indemnify,
+      defend, and hold each Contributor harmless for any liability
+      incurred by, or claims asserted against, such Contributor by reason
+      of your accepting any such warranty or additional liability.
+
+   END OF TERMS AND CONDITIONS
+
+   APPENDIX: How to apply the Apache License to your work.
+
+      To apply the Apache License to your work, attach the following
+      boilerplate notice, with the fields enclosed by brackets "[]"
+      replaced with your own identifying information. (Don't include
+      the brackets!)  The text should be enclosed in the appropriate
+      comment syntax for the file format. We also recommend that a
+      file or class name and description of purpose be included on the
+      same "printed page" as the copyright notice for easier
+      identification within third-party archives.
+
+   Copyright [yyyy] [name of copyright owner]
+
+   Licensed under the Apache License, Version 2.0 (the "License");
+   you may not use this file except in compliance with the License.
+   You may obtain a copy of the License at
+
+       http://www.apache.org/licenses/LICENSE-2.0
+
+   Unless required by applicable law or agreed to in writing, software
+   distributed under the License is distributed on an "AS IS" BASIS,
+   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+   See the License for the specific language governing permissions and
+   limitations under the License.

doc/licenses/BSD-LICENSE.txt

@@ -0,0 +1,28 @@
+Redistribution and use of this software in source and binary forms, with or
+without modification, are permitted provided that the following conditions are
+met:
+
+* Redistributions of source code must retain the above
+  copyright notice, this list of conditions and the
+  following disclaimer.
+
+* Redistributions in binary form must reproduce the above
+  copyright notice, this list of conditions and the
+  following disclaimer in the documentation and/or other
+  materials provided with the distribution.
+
+* Neither the name of Yahoo! Inc. nor the names of its
+  contributors may be used to endorse or promote products
+  derived from this software without specific prior
+  written permission of Yahoo! Inc.
+
+THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND
+ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED
+WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE
+DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER OR CONTRIBUTORS BE LIABLE FOR
+ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES
+(INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES;
+LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON
+ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+(INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS
+SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.

doc/licenses/MIT-LICENSE.txt

@@ -0,0 +1,18 @@
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of this software and associated documentation files (the
+"Software"), to deal in the Software without restriction, including
+without limitation the rights to use, copy, modify, merge, publish,
+distribute, sublicense, and/or sell copies of the Software, and to
+permit persons to whom the Software is furnished to do so, subject to
+the following conditions:
+
+The above copyright notice and this permission notice shall be
+included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
+LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
+OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
+WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

doc/readme.txt

@@ -1,3 +1,3 @@
 Automatically generated OpenLayers API documentation is online:
 
-  http://dev.openlayers.org/docs/overview-tree.html
+  http://dev.openlayers.org/apidocs

doc/walkthru.html

@@ -0,0 +1,96 @@
+<html>
+<head>
+<title>OpenLayers examples walkthrough</title>
+<style type="text/css">
+    a { color:blue; text-decoration: none; }
+    a:hover { text-decoration: underline; }
+</style>
+<base href="http://openlayers.org/dev/examples/">
+</head>
+<body style="font-family: sans-serif">
+<h1><pre style="font-size: larger">&lt;ol&gt;</pre></h1>
+<p>API documentation: <a href="http://dev.openlayers.org/docs/">http://dev.openlayers.org/docs/</a></p>
+<p>Examples: <a href="http://dev.openlayers.org/examples/">http://openlayers.org/dev/examples/</a></p>
+<h2>Maps</h2>
+<ol>
+    <li><a href="../examples/lite.html">Basic example</a></li>
+    <li><a href="../examples/layerswitcher.html">Layer switcher (aka legend)</a></li>
+    <li><a href="../examples/example.html">Base layers versus overlays</a></li>
+    <li><a href="../examples/multiserver.html">Multiple WMS mirrors</a></li>
+    <li><a href="../examples/fullScreen.html">Full screen map</a></li>
+    <li><a href="../examples/wrapDateLine.html">Wrapping the date line</a></li>
+    <li><a href="../examples/projected-map.html">Other cartographic projections</a></li>
+    <li><a href="../examples/layer-opacity.html">Translucent overlays</a></li>
+</ol>
+
+<h2>Raster Layers</h2>
+<ol>
+    <li><a href="../examples/wms-untiled.html">Untiled WMS layer</a></li>
+    <li><a href="../examples/kamap.html">Ka-Map layer</a></li>
+    <li><a href="../examples/mapserver.html">MapServer layer</a></li>
+    <li><a href="../examples/worldwind.html">Worldwind layer</a></li>
+    <li><a href="../examples/tms.html">TMS layer</a></li>
+    <li><a href="../examples/image-layer.html">Image layer</a></li>
+    <li><a href="../examples/google.html">Google layer</a></li>
+    <li><a href="../examples/ve.html">VirtualEarth layer</a></li>
+    <li><a href="../examples/spherical-mercator.html">Spherical Mercator ("EPSG:900913")</a></li>
+    <li><a href="http://tilecache.org/">TileCache</a></li>
+</ol>
+
+<h2>Marker Layers</h2>
+<ol>
+    <li><a href="../examples/markers.html">Markers</a></li>
+    <li><a href="../examples/markerResize.html">Changing marker properties dynamically</a></li>
+    <li><a href="../examples/popups.html">Popups</a></li>
+    <li><a href="../examples/georss.html">GeoRSS</a> (<a href="georss.xml">example data</a>)</a></li>
+    <li><a href="../examples/georss-markers.html">GeoRSS with custom markers</a></li>
+    <li><a href="../examples/wfs.html">Point layer from WFS</a></li>
+    <li><a href="../examples/getfeatureinfo.html">WFS GetFeatureInfo example</a></li>
+</ol>
+
+<h2>Events and Controls</h2>
+<ol>
+    <li><a href="../examples/navtoolbar.html">Navigation tools on the map</a></li>
+    <li><a href="../examples/navtoolbar-outsidemap.html">Navigation toolbar off the map</a></li>
+    <li><a href="../examples/mouse-position.html">Tracking the mouse position</a></li>
+    <li><a href="../examples/overview.html">Overview map</a></li>
+    <li><a href="../examples/attribution.html">Layer attribution</a></li>
+    <li><a href="../examples/controls.html">Full range of controls</a></li>
+    <li><a href="../examples/custom-control.html">Custom controls #1</a></li>
+    <li><a href="../examples/custom-control.html">Custom controls #2</a></li>
+    <li><a href="../examples/custom-style.html">Custom control styles</a></li>
+    <li><a href="../examples/click.html">Trapping click events</a></li>
+    <li><a href="../examples/layerLoadMonitoring.html">Tracking map events</a></li>
+</ol>
+
+<h2>Vector Layers</h2>
+<ol>
+    <li><a href="../examples/vector-features.html">Generating features in JavaScript</a></li>
+    <li><a href="../examples/gml-layer.html">Loading features from GML</a></li>
+    <li><a href="../examples/kml-layer.html">Loading features from KML</a></li>
+    <li><a href="../examples/gml-serialize.html">Serializing features to GML</a></li>
+    <li><a href="../examples/vector-formats.html">Serializing to other formats</a></li>
+    <li><a href="../examples/select-feature.html">Selecting features</a></li>
+    <li><a href="../examples/select-feature-openpopup.html">Attaching popups to features</a></li>
+</ol>
+
+<h2>Editing Tools</h2>
+<ol>
+    <li><a href="../examples/draw-feature.html">Drawing features</a></li>
+    <li><a href="../examples/editingtoolbar.html">Editing toolbar</a> (<a href="editingtoolbar-outside.html">outside the map</a>)</li>
+    <li><a href="../examples/regular-polygons.html">Creating regular polygons</a></li>
+    <li><a href="../examples/modify-feature.html">Modifying features</a></li>
+    <li><a href="../examples/resize-features.html">Resizing features</a></li>
+    <li><a href="../examples/rotate-features.html">Rotating features</a></li>
+    <li><a href="../examples/wfs-t.html">Transactional WFS example</a></li>
+    <li><a href="http://featureserver.org/">FeatureServer</a></li>
+</ol>
+
+<h2>Testing</h2>
+<ol>
+    <li><a href="../tests/run-tests.html">Test.AnotherWay suite</a></li>
+</ol>
+
+<h1><pre style="font-size: larger">&lt;/ol&gt;</pre></h1>
+</body>
+</html>

doc_config/Languages.txt

@@ -1,4 +1,4 @@
-Format: 1.35
+Format: Development Release 12-07-2007 (1.35 base)
 
 # This is the Natural Docs languages file for this project.  If you change
 # anything here, it will apply to THIS PROJECT ONLY.  If you'd like to change

doc_config/Menu.txt

@@ -1,4 +1,4 @@
-Format: 1.35
+Format: Development Release 12-07-2007 (1.35 base)
 
 
 Title: OpenLayers
@@ -8,6 +8,22 @@ SubTitle: JavaScript Mapping Library
 # Footer: [text]
 # If you want to add a copyright notice, this would be the place to do it.
 
+# You can add a timestamp to your documentation like one of these:
+# Timestamp: Generated on month day, year
+# Timestamp: Updated mm/dd/yyyy
+# Timestamp: Last updated mon day
+#
+#   m     - One or two digit month.  January is "1"
+#   mm    - Always two digit month.  January is "01"
+#   mon   - Short month word.  January is "Jan"
+#   month - Long month word.  January is "January"
+#   d     - One or two digit day.  1 is "1"
+#   dd    - Always two digit day.  1 is "01"
+#   day   - Day with letter extension.  1 is "1st"
+#   yy    - Two digit year.  2006 is "06"
+#   yyyy  - Four digit year.  2006 is "2006"
+#   year  - Four digit year.  2006 is "2006"
+
 
 # --------------------------------------------------------------------------
 # 
@@ -50,55 +66,87 @@ Group: OpenLayers  {
 
    Group: Control  {
 
-      File: Control  (OpenLayers/Control.js)
+      File: Control  (no auto-title, OpenLayers/Control.js)
       File: ArgParser  (no auto-title, OpenLayers/Control/ArgParser.js)
-      File: ZoomToMaxExtent  (no auto-title, OpenLayers/Control/ZoomToMaxExtent.js)
-      File: OverviewMap  (no auto-title, OpenLayers/Control/OverviewMap.js)
+      File: Attribution  (no auto-title, OpenLayers/Control/Attribution.js)
+      File: Button  (no auto-title, OpenLayers/Control/Button.js)
       File: DragFeature  (no auto-title, OpenLayers/Control/DragFeature.js)
       File: DragPan  (no auto-title, OpenLayers/Control/DragPan.js)
       File: DrawFeature  (no auto-title, OpenLayers/Control/DrawFeature.js)
       File: EditingToolbar  (no auto-title, OpenLayers/Control/EditingToolbar.js)
       File: KeyboardDefaults  (no auto-title, OpenLayers/Control/KeyboardDefaults.js)
       File: LayerSwitcher  (no auto-title, OpenLayers/Control/LayerSwitcher.js)
+      File: ModifyFeature  (no auto-title, OpenLayers/Control/ModifyFeature.js)
       File: MouseDefaults  (no auto-title, OpenLayers/Control/MouseDefaults.js)
       File: MousePosition  (no auto-title, OpenLayers/Control/MousePosition.js)
       File: MouseToolbar  (no auto-title, OpenLayers/Control/MouseToolbar.js)
       File: Navigation  (no auto-title, OpenLayers/Control/Navigation.js)
+      File: NavigationHistory  (no auto-title, OpenLayers/Control/NavigationHistory.js)
       File: NavToolbar  (no auto-title, OpenLayers/Control/NavToolbar.js)
+      File: OverviewMap  (no auto-title, OpenLayers/Control/OverviewMap.js)
       File: Panel  (no auto-title, OpenLayers/Control/Panel.js)
+      File: PanZoom  (no auto-title, OpenLayers/Control/PanZoom.js)
       File: PanZoomBar  (no auto-title, OpenLayers/Control/PanZoomBar.js)
       File: Permalink  (no auto-title, OpenLayers/Control/Permalink.js)
       File: Scale  (no auto-title, OpenLayers/Control/Scale.js)
+      File: ScaleLine  (no auto-title, OpenLayers/Control/ScaleLine.js)
       File: SelectFeature  (no auto-title, OpenLayers/Control/SelectFeature.js)
       File: ZoomBox  (no auto-title, OpenLayers/Control/ZoomBox.js)
-      File: PanZoom  (no auto-title, OpenLayers/Control/PanZoom.js)
+      File: ZoomToMaxExtent  (no auto-title, OpenLayers/Control/ZoomToMaxExtent.js)
       }  # Group: Control
 
    File: Events  (no auto-title, OpenLayers/Events.js)
 
    Group: Feature  {
 
-      File: Feature  (OpenLayers/Feature.js)
-      File: WFS  (no auto-title, OpenLayers/Feature/WFS.js)
+      File: Feature  (no auto-title, OpenLayers/Feature.js)
       File: Vector  (no auto-title, OpenLayers/Feature/Vector.js)
+      File: WFS  (no auto-title, OpenLayers/Feature/WFS.js)
       }  # Group: Feature
 
+   Group: Filter  {
+
+      File: Filter  (no auto-title, OpenLayers/Filter.js)
+      File: Comparison  (no auto-title, OpenLayers/Filter/Comparison.js)
+      File: FeatureId  (no auto-title, OpenLayers/Filter/FeatureId.js)
+      File: Logical  (no auto-title, OpenLayers/Filter/Logical.js)
+      }  # Group: Filter
+
    Group: Format  {
 
-      File: Format  (OpenLayers/Format.js)
+      File: Format  (no auto-title, OpenLayers/Format.js)
       File: GeoJSON  (no auto-title, OpenLayers/Format/GeoJSON.js)
       File: GeoRSS  (no auto-title, OpenLayers/Format/GeoRSS.js)
       File: GML  (no auto-title, OpenLayers/Format/GML.js)
       File: JSON  (no auto-title, OpenLayers/Format/JSON.js)
       File: KML  (no auto-title, OpenLayers/Format/KML.js)
+      File: OSM  (no auto-title, OpenLayers/Format/OSM.js)
+
+      Group: SLD  {
+
+         File: SLD  (no auto-title, OpenLayers/Format/SLD.js)
+         File: v1  (no auto-title, OpenLayers/Format/SLD/v1.js)
+         File: v1_0_0  (no auto-title, OpenLayers/Format/SLD/v1_0_0.js)
+         }  # Group: SLD
+
+      File: Text  (no auto-title, OpenLayers/Format/Text.js)
       File: WFS  (no auto-title, OpenLayers/Format/WFS.js)
       File: WKT  (no auto-title, OpenLayers/Format/WKT.js)
       File: XML  (no auto-title, OpenLayers/Format/XML.js)
+
+      Group: WMC  {
+
+         File: WMC  (no auto-title, OpenLayers/Format/WMC.js)
+         File: v1  (no auto-title, OpenLayers/Format/WMC/v1.js)
+         File: v1_0_0  (no auto-title, OpenLayers/Format/WMC/v1_0_0.js)
+         File: v1_1_0  (no auto-title, OpenLayers/Format/WMC/v1_1_0.js)
+         }  # Group: WMC
+
       }  # Group: Format
 
    Group: Geometry  {
 
-      File: Geometry  (OpenLayers/Geometry.js)
+      File: Geometry  (no auto-title, OpenLayers/Geometry.js)
       File: Collection  (no auto-title, OpenLayers/Geometry/Collection.js)
       File: Curve  (no auto-title, OpenLayers/Geometry/Curve.js)
       File: LinearRing  (no auto-title, OpenLayers/Geometry/LinearRing.js)
@@ -109,15 +157,16 @@ Group: OpenLayers  {
       File: Point  (no auto-title, OpenLayers/Geometry/Point.js)
       File: Polygon  (no auto-title, OpenLayers/Geometry/Polygon.js)
       File: Rectangle  (no auto-title, OpenLayers/Geometry/Rectangle.js)
-      File: Surface  (no auto-title, OpenLayers/Geometry/Surface.js)
       }  # Group: Geometry
 
    Group: Handler  {
 
-      File: Handler  (OpenLayers/Handler.js)
+      File: Handler  (no auto-title, OpenLayers/Handler.js)
       File: Box  (no auto-title, OpenLayers/Handler/Box.js)
+      File: Click  (no auto-title, OpenLayers/Handler/Click.js)
       File: Drag  (no auto-title, OpenLayers/Handler/Drag.js)
       File: Feature  (no auto-title, OpenLayers/Handler/Feature.js)
+      File: Hover  (no auto-title, OpenLayers/Handler/Hover.js)
       File: Keyboard  (no auto-title, OpenLayers/Handler/Keyboard.js)
       File: MouseWheel  (no auto-title, OpenLayers/Handler/MouseWheel.js)
       File: Path  (no auto-title, OpenLayers/Handler/Path.js)
@@ -128,9 +177,19 @@ Group: OpenLayers  {
 
    File: Icon  (no auto-title, OpenLayers/Icon.js)
 
+   Group: Lang  {
+
+      File: Lang  (no auto-title, OpenLayers/Lang.js)
+      File: Lang["cs-CZ"]  (OpenLayers/Lang/cs-CZ.js)
+      File: Lang["de"]  (no auto-title, OpenLayers/Lang/de.js)
+      File: Lang["en"]  (no auto-title, OpenLayers/Lang/en.js)
+      File: Lang["en-CA"]  (no auto-title, OpenLayers/Lang/en-CA.js)
+      File: Lang["fr"]  (no auto-title, OpenLayers/Lang/fr.js)
+      }  # Group: Lang
+
    Group: Layer  {
 
-      File: Layer  (OpenLayers/Layer.js)
+      File: Layer  (no auto-title, OpenLayers/Layer.js)
       File: Boxes  (no auto-title, OpenLayers/Layer/Boxes.js)
       File: EventPane  (no auto-title, OpenLayers/Layer/EventPane.js)
       File: FixedZoomLevels  (no auto-title, OpenLayers/Layer/FixedZoomLevels.js)
@@ -141,10 +200,12 @@ Group: OpenLayers  {
       File: HTTPRequest  (no auto-title, OpenLayers/Layer/HTTPRequest.js)
       File: Image  (no auto-title, OpenLayers/Layer/Image.js)
       File: KaMap  (no auto-title, OpenLayers/Layer/KaMap.js)
+      File: MapGuide  (no auto-title, OpenLayers/Layer/MapGuide.js)
       File: MapServer  (no auto-title, OpenLayers/Layer/MapServer.js)
       File: MapServer.Untiled  (no auto-title, OpenLayers/Layer/MapServer/Untiled.js)
       File: Markers  (no auto-title, OpenLayers/Layer/Markers.js)
       File: MultiMap  (no auto-title, OpenLayers/Layer/MultiMap.js)
+      File: PointTrack  (no auto-title, OpenLayers/Layer/PointTrack.js)
       File: SphericalMercator  (no auto-title, OpenLayers/Layer/SphericalMercator.js)
       File: Text  (no auto-title, OpenLayers/Layer/Text.js)
       File: TileCache  (no auto-title, OpenLayers/Layer/TileCache.js)
@@ -168,27 +229,36 @@ Group: OpenLayers  {
 
    Group: Popup  {
 
-      File: Popup  (OpenLayers/Popup.js)
+      File: Popup  (no auto-title, OpenLayers/Popup.js)
       File: Anchored  (no auto-title, OpenLayers/Popup/Anchored.js)
       File: AnchoredBubble  (no auto-title, OpenLayers/Popup/AnchoredBubble.js)
+      File: Framed  (OpenLayers/Popup/Framed.js)
+      File: FramedCloud  (OpenLayers/Popup/FramedCloud.js)
       }  # Group: Popup
 
+   File: Projection  (no auto-title, OpenLayers/Projection.js)
+
    Group: Renderer  {
 
-      File: Renderer  (OpenLayers/Renderer.js)
+      File: Renderer  (no auto-title, OpenLayers/Renderer.js)
       File: Elements  (no auto-title, OpenLayers/Renderer/Elements.js)
       File: SVG  (no auto-title, OpenLayers/Renderer/SVG.js)
       File: VML  (no auto-title, OpenLayers/Renderer/VML.js)
       }  # Group: Renderer
 
+   File: Rule  (no auto-title, OpenLayers/Rule.js)
+   File: Style  (no auto-title, OpenLayers/Style.js)
+   File: StyleMap  (no auto-title, OpenLayers/StyleMap.js)
+
    Group: Tile  {
 
-      File: Tile  (OpenLayers/Tile.js)
+      File: Tile  (no auto-title, OpenLayers/Tile.js)
       File: Image  (no auto-title, OpenLayers/Tile/Image.js)
       File: WFS  (no auto-title, OpenLayers/Tile/WFS.js)
       }  # Group: Tile
 
-   File: Util  (OpenLayers/Util.js)
+   File: Tween  (no auto-title, OpenLayers/Tween.js)
+   File: Util  (no auto-title, OpenLayers/Util.js)
    }  # Group: OpenLayers
 
 Group: Index  {

doc_config/Topics.txt

@@ -1,4 +1,4 @@
-Format: 1.35
+Format: Development Release 12-07-2007 (1.35 base)
 
 # This is the Natural Docs topics file for this project.  If you change anything
 # here, it will apply to THIS PROJECT ONLY.  If you'd like to change something
@@ -55,9 +55,6 @@ Format: 1.35
 # Class Hierarchy: [yes|no]
 #    Whether the topics are part of the class hierarchy.  Defaults to no.
 #
-# Variable Type: [yes|no]
-#    Whether the topics can be a variable type.  Defaults to no.
-#
 # Page Title If First: [yes|no]
 #    Whether the topic's title becomes the page title if it's the first one in
 #    a file.  Defaults to no.

examples/GMLParser.html

@@ -1,5 +1,7 @@
 <html xmlns="http://www.w3.org/1999/xhtml">
   <head>
+      <title>OpenLayers GML Parser</title>
+    <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
     <style type="text/css">
         #map {
             width: 800px;
@@ -21,7 +23,7 @@
             }
                 html += "</ul>"
           }
-          document.body.innerHTML = html;
+          document.getElementById('output').innerHTML = html;
         }
         function load() {
             OpenLayers.loadURL("gml/owls.xml", "", null, parseData);
@@ -29,5 +31,19 @@
     </script>
   </head>
   <body onload="load()">
+      <h1 id="title">GML Parser Example</h1>
+
+      <div id="tags"></div>
+
+      <p id="shortdesc">
+          Demonstrate the operation of the GML parser.
+      </p>
+
+      <div id="output"></div>
+
+      <div id="docs">
+          This script reads data from a GML file and parses out the coordinates, appending them to a HTML string with markup tags.
+          This markup is dumped to an element in the page.
+    </div>
   </body>
 </html>

examples/KMLParser.html

@@ -1,27 +1,26 @@
 <html xmlns="http://www.w3.org/1999/xhtml">
   <head>
-    <style type="text/css">
-        #map {
-            width: 800px;
-            height: 475px;
-            border: 1px solid black;
-        }
-    </style>
+    <title>OpenLayers KML Parser Example</title>
     <script src="../lib/OpenLayers.js"></script>
     <script type="text/javascript">
         function parseData(req) {
-          g =  new OpenLayers.Format.KML();
+          g =  new OpenLayers.Format.KML({extractStyles: true});
           html = ""
           features = g.read(req.responseText);
           for(var feat in features) {
             html += "Feature: Geometry: "+ features[feat].geometry+",";
                 html += "<ul>";
             for (var j in features[feat].attributes) {
-                html += "<li>"+j+":"+features[feat].attributes[j]+"</li>";
+                html += "<li>Attribute "+j+":"+features[feat].attributes[j]+"</li>";
+            }
+                html += "</ul>"
+                html += "<ul>";
+            for (var j in features[feat].style) {
+                html += "<li>Style "+j+":"+features[feat].style[j]+"</li>";
             }
                 html += "</ul>"
           }
-          document.body.innerHTML = html;
+          document.getElementById('output').innerHTML = html;
         }
         function load() {
             OpenLayers.loadURL("kml/lines.kml", "", null, parseData);
@@ -29,5 +28,19 @@
     </script>
   </head>
   <body onload="load()">
+      <h1 id="title">KML Parser Example</h1>
+
+      <div id="tags"></div>
+
+      <p id="shortdesc">
+          Demonstrate the operation of the KML parser.
+      </p>
+
+      <div id="output"></div>
+
+      <div id="docs">
+          This script reads data from a KML file and parses out the coordinates, appending them to a HTML string with markup tags.
+          This markup is dumped to an element in the page.
+    </div>
   </body>
 </html>

examples/accessible.html

@@ -1,9 +1,12 @@
 <html xmlns="http://www.w3.org/1999/xhtml">
     <head>
+        <title>OpenLayers Accessible Example</title>
+        <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
+        
         <style type="text/css">
             #map {
                 width: 512px;
-                height: 256px;
+                height: 512px;
                 border: 1px solid #eee;
             }
             table {
@@ -25,6 +28,10 @@
             a:hover {
                 text-decoration: underline;
             }
+            a.api {
+                font-size:1em;
+                text-decoration:underline;
+            }
         </style>
         <script src="../lib/OpenLayers.js"></script>
         <script type="text/javascript">
@@ -45,7 +52,15 @@
         </script>
     </head>
     <body onload="init()">
-        <h3>OpenLayers Example</h3>
+        <h1 id="title">Accessible Example</h1>
+
+        <div id="tags">
+        </div>
+
+        <p id="shortdesc">
+            Demonstrate how to use the KeyboardDefaults option parameter for layer types.
+        </p>
+
         <table>
             <tbody>
                 <tr>
@@ -95,6 +110,8 @@
                 </tr>
             </tbody>
         </table>
+
+        <div id="docs">
             <p>Navigate the map in one of three ways:
                 <ul>
                     <li>Click on the named links to zoom and pan</li>
@@ -120,5 +137,8 @@
                     </li>
                 </ul>
             </p>
+
+            This is an example of using alternate methods to control panning and zooming.  This approach uses map.pan() and map.zoom().  You'll note that to pan, additional math is necessary along with map.size() in order to set the distance to pan.
+        </div>
     </body>
 </html>

examples/animated_panning.html

@@ -0,0 +1,103 @@
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <title>Animated Panning of the Map via map.panTo</title>
+    <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
+    <style type="text/css">
+        #map {
+            width: 512px;
+            height: 256px;
+            border: 1px solid black;
+        }
+        #map2 {
+            width: 512px;
+            height: 256px;
+            border: 1px solid black;
+        }
+    </style>
+    <script src="../lib/OpenLayers.js"></script>
+    <script type="text/javascript">
+        var map, layer, running = false;
+
+        OpenLayers.Control.Click = OpenLayers.Class(OpenLayers.Control, {                
+            defaultHandlerOptions: {
+                'single': true,
+                'delay': 200
+            },
+
+            initialize: function(options) {
+                this.handlerOptions = OpenLayers.Util.extend(
+                    {}, this.defaultHandlerOptions
+                );
+                OpenLayers.Control.prototype.initialize.apply(
+                    this, arguments
+                ); 
+                this.handler = new OpenLayers.Handler.Click(
+                    this, {
+                        'click': this.onClick 
+                    }, this.handlerOptions
+                );
+            }, 
+
+            onClick: function(evt) {  
+                map.panTo(map.getLonLatFromPixel(evt.xy));
+            }   
+
+        });
+
+        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.zoomToMaxExtent();
+            var click = new OpenLayers.Control.Click();
+            map.addControl(click);
+            click.activate();
+            map.addControl(new OpenLayers.Control.OverviewMap());
+
+            map2 = new OpenLayers.Map('map2', {'panMethod': null} );
+            layer = new OpenLayers.Layer.WMS( "OpenLayers WMS", 
+                "http://labs.metacarta.com/wms/vmap0", {layers: 'basic'} );
+                
+            map2.addLayer(layer);
+            map2.zoomToMaxExtent();
+        }
+
+        function setCenterInterval() {
+            if (!running) {
+                setCenter();
+                running = setInterval('setCenter()', 500);
+            } else {
+                clearInterval(running);
+                running = false;
+            }    
+        }
+        
+        function setCenter() {
+            var lon = Math.random() * 360 - 180;
+            var lat = Math.random() * 180 - 90;
+            var lonlat = new OpenLayers.LonLat(lon, lat);
+            map.panTo(lonlat);
+        }
+    </script>
+  </head>
+  <body onload="init()">
+    <h1 id="title">map.panTo Example</h1>
+    <div id="tags">map.panTo</div>
+    <div id="shortdesc">Show animated panning effects in the map</div>
+    <div id="map"></div>
+    <div id="docs">
+        <p>This is an example of transition effects. If the new random center is in the current extent, the map will pan smoothly. <br />
+        The random selection will continue until you press it again. Additionally, you can single click in the map to pan smoothly
+        to that area, or use the pan control to pan smoothly.
+        </p>
+    </div>
+    <button onclick="setCenterInterval()">Start/stop random recenter</button>
+     <div id="map2"></div>
+    <div>    
+    <p>To turn off Animated Panning, create a map with an panMethod set to
+        null. </p>
+    </div>
+  </body>
+</html>

examples/attribution.html

@@ -1,5 +1,8 @@
 <html xmlns="http://www.w3.org/1999/xhtml">
     <head>
+        <title>OpenLayers Attribution Example</title>
+        <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
+
         <style type="text/css">
             #map {
                 width: 512px;
@@ -18,8 +21,8 @@
                     {'attribution': 'Provided by <a href="http://labs.metacarta.com/">MetaCarta</a>'});
 
             var jpl_wms = new OpenLayers.Layer.WMS( "NASA Global Mosaic",
-                "http://wms.jpl.nasa.gov/wms.cgi", 
-                {layers: "modis,global_mosaic"},{attribution:"Provided by NASA"});
+                "http://t1.hypercube.telascience.org/cgi-bin/landsat7", 
+                {layers: "landsat7"},{attribution:"Provided by Telascience"});
 
                 map.addLayers([ol_wms, jpl_wms]);
                 map.addControl(new OpenLayers.Control.LayerSwitcher());
@@ -30,7 +33,21 @@
         </script>
     </head>
     <body onload="init()">
-    <h1>OpenLayers Example</h1>
+        <h1 id="title">Attribution Example</h1>
+
+        <div id="tags">
+        </div>
+
+        <p id="shortdesc">
+          Shows the use of the attribution layer option on a number of layer types.
+        </p>
+
         <div id="map"></div>
+
+        <div id="docs">
+            This is an example of how to add an attribution block to the OpenLayers window.  In order to use an
+            attribution block, an attribution parameter must be set in each layer that requires attribution. In
+            addition, an attribution control must be added to the map.
+        </div>
     </body>
 </html>

examples/baseLayers.html

@@ -1,12 +1,19 @@
 <html xmlns="http://www.w3.org/1999/xhtml">
     <head>
+        <title>OpenLayers Base Layers Example</title>
+        
+        <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
         <style type="text/css">
             #map {
-            width: 100%;
+                width: 512;
                 height: 512px;
                 border: 1px solid black;
                 background-color: blue;
             }
+            #controls
+            {
+                width: 512px;
+            }
         </style>
 
         <!-- this gmaps key generated for http://openlayers.org/dev/ -->
@@ -72,9 +79,23 @@
         </script>
     </head>
     <body onload="init()">
-    <h1>OpenLayers With WMS, Google, VE Example</h1>
+        <h1 id="title">Base Layers Example</h1>
+
+        <div id="tags">
+        </div>
+
+        <p id="shortdesc">
+           This example shows the use base layers from multiple commercial map image providers.
+        </p>
+
+        <div id="controls">
             <div id="map"></div>
+
             <div style="background-color:green" onclick="add()"> click to add a marker to the map</div>
             <div style="background-color:red" onclick="remove()"> click to remove the marker from the map</div>
+        </div>
+        
+        <div id="docs">
+       </div>
     </body>
 </html>

examples/boxes-vector.html

@@ -0,0 +1,60 @@
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>OpenLayers Boxes Example</title>
+        <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
+        <style type="text/css">
+            #map {
+                width: 512px;
+                height: 512px;
+                border: 1px solid black;
+            }
+        </style>
+        <script src="../lib/OpenLayers.js"></script>
+        <script type="text/javascript">
+            var box_extents = [
+                [-10, 50, 5, 60],
+                [-75, 41, -71, 44],
+                [-122.6, 37.6, -122.3, 37.9],
+                [10, 10, 20, 20]
+            ];
+            var map;
+            function init(){
+                map = new OpenLayers.Map('map');
+
+                var ol_wms = new OpenLayers.Layer.WMS( "OpenLayers WMS",
+                    "http://labs.metacarta.com/wms/vmap0?", {layers: 'basic'} );
+
+                var boxes  = new OpenLayers.Layer.Vector( "Boxes" );
+    
+                for (var i = 0; i < box_extents.length; i++) {
+                    ext = box_extents[i];
+                    bounds = new OpenLayers.Bounds(ext[0], ext[1], ext[2], ext[3]);
+                    
+                    box = new OpenLayers.Feature.Vector(bounds.toGeometry());
+                    boxes.addFeatures(box);
+                }
+
+                map.addLayers([ol_wms, boxes]);
+                map.addControl(new OpenLayers.Control.LayerSwitcher());
+                var sf = new OpenLayers.Control.SelectFeature(boxes);
+                map.addControl(sf);
+                sf.activate();
+                map.zoomToMaxExtent();
+            }
+        </script>
+    </head>
+    <body onload="init()">
+        <h1 id="title">Boxes Example</h1>
+
+        <div id="tags">
+        </div>
+
+        <p id="shortdesc">
+            Demonstrate marker and box type annotations on a map.
+        </p>
+        
+        <div id="map"></div>
+
+        <div id="docs"></div>
+    </body>
+</html>

examples/boxes.html

@@ -1,5 +1,7 @@
 <html xmlns="http://www.w3.org/1999/xhtml">
     <head>
+        <title>OpenLayers Boxes Example</title>
+        <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
         <style type="text/css">
             #map {
                 width: 512px;
@@ -41,7 +43,17 @@
         </script>
     </head>
     <body onload="init()">
-    <h1>OpenLayers Example</h1>
+        <h1 id="title">Boxes Example</h1>
+
+        <div id="tags">
+        </div>
+
+        <p id="shortdesc">
+            Demonstrate marker and box type annotations on a map.
+        </p>
+        
         <div id="map"></div>
+
+        <div id="docs"></div>
     </body>
 </html>

examples/buffer.html

@@ -1,9 +1,11 @@
 <html xmlns="http://www.w3.org/1999/xhtml">
     <head>
+        <title>OpenLayers Buffer Example</title>
+        <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
         <style type="text/css">
             #map {
-            width: 694px;
-            height: 464px;
+                width: 512px;
+                height: 512px;
                 border: 1px solid black;
             }
         </style>
@@ -34,8 +36,20 @@
         </script>
     </head>
     <body onload="init()">
+        <h1 id="title">Buffer Example</h1>
+
+        <div id="tags">
+        </div>
+
+        <p id="shortdesc">
+            This example shows the use of the buffer layer option for any layer that inherits from OpenLayers.Layer.Grid.
+        </p>
+
         <div id="map"></div>
-    <p>Use the buffer property to control how many tiles are included
-       outside the visible map area. Default is 2</p> 
+
+        <div id="docs">
+            Use the buffer property to control how many tiles are included
+            outside the visible map area. Default is 2.
+        </div>
     </body>
 </html>

examples/click-handler.html

@@ -0,0 +1,226 @@
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>OpenLayers Click Handler Example</title>
+        
+        <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
+        <style type="text/css">
+            #map {
+                width: 340px;
+                height: 170px;
+                border: 1px solid gray;
+            }
+            #west {
+                width: 350px;
+            }
+            #east {
+                position: absolute;
+                left: 370px;
+                top: 3em;
+            }
+
+            table td {
+                text-align: center;
+                margin: 0;
+                border: 1px solid gray;
+            }
+            textarea.output {
+                text-align: left;
+                font-size: 0.9em;
+                width: 250px;
+                height: 65px;
+                overflow: auto;
+            }
+        </style>
+        <script src="../lib/Firebug/firebug.js"></script>
+        <script src="../lib/OpenLayers.js"></script>
+        <script type="text/javascript">
+
+            OpenLayers.Control.Click = OpenLayers.Class(OpenLayers.Control, {                
+                defaultHandlerOptions: {
+                    'single': true,
+                    'double': false,
+                    'pixelTolerance': 0,
+                    'stopSingle': false,
+                    'stopDouble': false
+                },
+
+                initialize: function(options) {
+                    this.handlerOptions = OpenLayers.Util.extend(
+                        {}, this.defaultHandlerOptions
+                    );
+                    OpenLayers.Control.prototype.initialize.apply(
+                        this, arguments
+                    ); 
+                    this.handler = new OpenLayers.Handler.Click(
+                        this, {
+                            'click': this.onClick,
+                            'dblclick': this.onDblclick 
+                        }, this.handlerOptions
+                    );
+                }, 
+
+                onClick: function(evt) {
+                    var output = document.getElementById(this.key + "Output");
+                    var msg = "click " + evt.xy;
+                    output.value = output.value + msg + "\r\n";
+                },
+
+                onDblclick: function(evt) {  
+                    var output = document.getElementById(this.key + "Output");
+                    var msg = "dblclick " + evt.xy;
+                    output.value = output.value + msg + "\n";
+                }   
+
+            });
+
+            var map, controls; 
+
+            function init(){
+        
+                map = new OpenLayers.Map('map');
+                var layer = new OpenLayers.Layer.WMS(
+                    "OpenLayers WMS",
+                    "http://labs.metacarta.com/wms/vmap0",
+                    {layers: 'basic'}
+                );
+                map.addLayers([layer]);
+                
+                controls = {
+                    "single": new OpenLayers.Control.Click({
+                        hanlerOptions: {
+                            "single": true
+                        }
+                    }),
+                    "double": new OpenLayers.Control.Click({
+                        handlerOptions: {
+                            "single": false,
+                            "double": true
+                        }
+                    }),
+                    "both": new OpenLayers.Control.Click({
+                        handlerOptions: {
+                            "single": true,
+                            "double": true
+                        }
+                    }),
+                    "drag": new OpenLayers.Control.Click({
+                        handlerOptions: {
+                            "single": true,
+                            "pixelTolerance": null
+                        }
+                    }),
+                    "stopsingle": new OpenLayers.Control.Click({
+                        handlerOptions: {
+                            "single": true,
+                            "stopSingle": true
+                        }
+                    }),
+                    "stopdouble": new OpenLayers.Control.Click({
+                        handlerOptions: {
+                            "single": false,
+                            "double": true,
+                            "stopDouble": true
+                        }
+                    })
+                };
+
+                var props = document.getElementById("props");
+                var control;
+                for(var key in controls) {
+                    control = controls[key];
+                    // only to route output here
+                    control.key = key;
+                    map.addControl(control);
+                }
+
+                map.zoomToMaxExtent();
+            }
+            
+            function toggle(key) {
+                var control = controls[key];
+                if(control.active) {
+                    control.deactivate();
+                } else {
+                    control.activate();
+                }
+                var status = document.getElementById(key + "Status");
+                status.innerHTML = control.active ? "on" : "off";
+                var output = document.getElementById(key + "Output");
+                output.value = "";
+            }
+        </script>
+    </head>
+    <body onload="init()">
+        <h1 id="title">Click Handler Example</h1>
+        <div id="west">
+    
+            <div id="tags">
+            </div>
+    
+            <p id="shortdesc">
+                This example shows the use of the click handler.
+            </p>
+    
+            <div id="map"></div>
+            <p>
+                The click handler can be used to gain more flexibility over handling
+                click events.  The handler can be constructed with options to handle
+                only single click events, to handle single and double-click events,
+                to ignore clicks that include a drag, and to stop propagation of
+                single and/or double-click events.  A single click is a click that
+                is not followed by another click for more than 300ms.  This delay
+                is configured with the delay property.
+            </p>
+            <p>
+                The options to stop single and double clicks have to do with
+                stopping event propagation on the map events listener queue
+                (not stopping events from cascading to other elements).  The
+                ability to stop an event from propagating has to do with the
+                order in which listeners are registered.  With stopSingle or
+                stopDouble true, a click handler will stop propagation to all
+                listeners that were registered (or all handlers that were
+                activated) before the click handler was activated.  So, for
+                example, activating a click handler with stopDouble true after
+                the navigation control is active will stop double-clicks from
+                zooming in.
+            </p>
+        </div>
+        <div id="east">
+            <table>
+                <caption>Controls with click handlers (toggle on/off to clear output)</caption>
+                <tbody>
+                    <tr>
+                        <td>single only</td>
+                        <td><button id="singleStatus" onclick="toggle('single')">off</button></td>
+                        <td><textarea class="output" id="singleOutput"></textarea></td>
+                    </tr>
+                    <tr>
+                        <td>double only</td>
+                        <td><button id="doubleStatus" onclick="toggle('double')">off</button></td>
+                        <td><textarea class="output" id="doubleOutput"></textarea></td>
+                    </tr>
+                    <tr>
+                        <td>both</td>
+                        <td><button id="bothStatus" onclick="toggle('both')">off</button></td>
+                        <td><textarea class="output" id="bothOutput"></textarea></td>
+                    </tr>
+                    <tr>
+                        <td>single with drag</td>
+                        <td><button id="dragStatus" onclick="toggle('drag')">off</button></td>
+                        <td><textarea class="output" id="dragOutput"></textarea></td>
+                    </tr>
+                    <tr>
+                        <td>single with stop</td>
+                        <td><button id="stopsingleStatus" onclick="toggle('stopsingle')">off</button></td>
+                        <td><textarea class="output" id="stopsingleOutput"></textarea></td>
+                    </tr>
+                    <tr>
+                        <td>double with stop</td>
+                        <td><button id="stopdoubleStatus" onclick="toggle('stopdouble')">off</button></td>
+                        <td><textarea class="output" id="stopdoubleOutput"></textarea></td>
+                    </tr>
+                </tbody>
+            </table>
+        </div>
+    </body>
+</html>

examples/click.html

@@ -1,5 +1,8 @@
 <html xmlns="http://www.w3.org/1999/xhtml">
     <head>
+        <title>OpenLayers Click Event Example</title>
+        
+        <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
         <style type="text/css">
             #map {
                 width: 512px;
@@ -9,6 +12,36 @@
         </style>
         <script src="../lib/OpenLayers.js"></script>
         <script type="text/javascript">
+OpenLayers.Control.Click = OpenLayers.Class(OpenLayers.Control, {                
+                defaultHandlerOptions: {
+                    'single': true,
+                    'double': false,
+                    'pixelTolerance': 0,
+                    'stopSingle': false,
+                    'stopDouble': false
+                },
+
+                initialize: function(options) {
+                    this.handlerOptions = OpenLayers.Util.extend(
+                        {}, this.defaultHandlerOptions
+                    );
+                    OpenLayers.Control.prototype.initialize.apply(
+                        this, arguments
+                    ); 
+                    this.handler = new OpenLayers.Handler.Click(
+                        this, {
+                            'click': this.trigger,
+                        }, this.handlerOptions
+                    );
+                }, 
+
+                trigger: function(e) {
+                    var lonlat = map.getLonLatFromViewPortPx(e.xy);
+                    alert("You clicked near " + lonlat.lat + " N, " +
+                                              + lonlat.lon + " E");
+                },
+
+            });
             var map;
             function init(){
                 map = new OpenLayers.Map('map');
@@ -17,8 +50,8 @@
                     "http://labs.metacarta.com/wms/vmap0?", {layers: 'basic'} );
 
             var jpl_wms = new OpenLayers.Layer.WMS( "NASA Global Mosaic",
-                "http://wms.jpl.nasa.gov/wms.cgi", 
-                {layers: "modis,global_mosaic"});
+                "http://t1.hypercube.telascience.org/cgi-bin/landsat7", 
+                {layers: "landsat7"});
 
                 jpl_wms.setVisibility(false);
 
@@ -26,16 +59,29 @@
                 map.addControl(new OpenLayers.Control.LayerSwitcher());
                 // map.setCenter(new OpenLayers.LonLat(0, 0), 0);
                 map.zoomToMaxExtent();
-            map.events.register("click", map, function(e) { 
-                var lonlat = map.getLonLatFromViewPortPx(e.xy);
-                alert("You clicked near " + lonlat.lat + " N, " +
-                                          + lonlat.lon + " E");
-            });
+                
+                var click = new OpenLayers.Control.Click();
+                map.addControl(click);
+                click.activate();
+
             }
         </script>
     </head>
     <body onload="init()">
-    <h1>OpenLayers Example</h1>
+        <h1 id="title">Click Event Example</h1>
+
+        <div id="tags">
+        </div>
+
+        <p id="shortdesc">
+            This example shows the use of the click handler and getLonLatFromViewPortPx functions to trigger events on mouse click. 
+
+        </p>
+
         <div id="map"></div>
+    
+        <div id="docs">
+            Using the Click handler allows you to (for example) catch clicks without catching double clicks, something that standard browser events don't do for you. (Try double clicking: you'll zoom in, whereas using the browser click event, you would just get two alerts.) This example click control shows you how to use it. 
+        </div>
     </body>
 </html>

examples/controls.html

@@ -1,5 +1,8 @@
 <html xmlns="http://www.w3.org/1999/xhtml">
     <head>
+        <title>OpenLayers Map Controls Example</title>
+
+        <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
         <style type="text/css">
             #map {
                 width: 512px;
@@ -17,6 +20,7 @@
                 map.addControl(new OpenLayers.Control.MouseToolbar());
                 map.addControl(new OpenLayers.Control.LayerSwitcher({'ascending':false}));
                 map.addControl(new OpenLayers.Control.Permalink());
+                map.addControl(new OpenLayers.Control.ScaleLine());
                 map.addControl(new OpenLayers.Control.Permalink('permalink'));
                 map.addControl(new OpenLayers.Control.MousePosition());
                 map.addControl(new OpenLayers.Control.OverviewMap());
@@ -25,11 +29,9 @@
                 var ol_wms = new OpenLayers.Layer.WMS( "OpenLayers WMS",
                     "http://labs.metacarta.com/wms/vmap0",
                     {layers: 'basic'} );
-
                 var jpl_wms = new OpenLayers.Layer.WMS( "NASA Global Mosaic",
-                "http://wms.jpl.nasa.gov/wms.cgi", 
-                {layers: "modis,global_mosaic"});
-
+                    "http://t1.hypercube.telascience.org/cgi-bin/landsat7", 
+                    {layers: "landsat7"});
                 var dm_wms = new OpenLayers.Layer.WMS( "DM Solutions Demo",
                     "http://www2.dmsolutions.ca/cgi-bin/mswms_gmap",
                     {layers: "bathymetry,land_fn,park,drain_fn,drainage," +
@@ -45,8 +47,18 @@
         </script>
     </head>
     <body onload="init()">
-    <h1>OpenLayers Example</h1>
+        <h1 id="title">Map Controls Example</h1>
+
+        <div id="tags">
+        </div>
+
+        <p id="shortdesc">
+            Attach zooming, panning, layer switcher, overview map, and permalink map controls to an OpenLayers window.
+        </p>
+
         <a style="float:right" href="" id="permalink">Permalink</a>
         <div id="map"></div>
+
+        <div id="docs"></div>
     </body>
 </html>

examples/custom-control-point.html

@@ -1,15 +1,16 @@
 <html xmlns="http://www.w3.org/1999/xhtml">
   <head>
+      <title>OpenLayers Custom Control Point Examle</title>
+    <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
     <style type="text/css">
         #map {
-            width: 800px;
-            height: 475px;
+            width: 512px;
+            height: 512px;
             border: 1px solid black;
         }
     </style>
     <script src="../lib/OpenLayers.js"></script>
     <script type="text/javascript">
-        <!--
         var lon = 5;
         var lat = 40;
         var zoom = 5;
@@ -41,11 +42,21 @@
             map.addControl(control);
             map.setCenter(new OpenLayers.LonLat(lon, lat), zoom);
         }
-        // -->
     </script>
   </head>
   <body onload="init()">
+      <h1 id="title">Custom Control Point Example</h1>
+
+      <div id="tags">
+      </div>
+
+      <p id="shortdesc">
+          Demonstrate the addition of a point reporting control to the OpenLayers window.
+      </p>
+
     <div id="map"></div>
     <div id="bounds"></div>
+
+    <div id="docs"></div>
   </body>
 </html>

examples/custom-control.html

@@ -1,15 +1,16 @@
 <html xmlns="http://www.w3.org/1999/xhtml">
     <head>
+        <title>Custom Control Example</title>
+        <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
         <style type="text/css">
             #map {
-            width: 800px;
-            height: 475px;
+                width: 512px;
+                height: 512px;
                 border: 1px solid black;
             }
         </style>
         <script src="../lib/OpenLayers.js"></script>
         <script type="text/javascript">
-        <!--
             var lon = 5;
             var lat = 40;
             var zoom = 5;
@@ -32,7 +33,12 @@
                     },
 
                     notice: function (bounds) {
-                    alert(bounds);
+                        var ll = map.getLonLatFromPixel(new OpenLayers.Pixel(bounds.left, bounds.bottom)); 
+                        var ur = map.getLonLatFromPixel(new OpenLayers.Pixel(bounds.right, bounds.top)); 
+                        alert(ll.lon.toFixed(4) + ", " + 
+                              ll.lat.toFixed(4) + ", " + 
+                              ur.lon.toFixed(4) + ", " + 
+                              ur.lat.toFixed(4));
                     }
                 });
 
@@ -40,10 +46,20 @@
                 map.addControl(control);
                 map.setCenter(new OpenLayers.LonLat(lon, lat), zoom);
             }
-        // -->
         </script>
     </head>
     <body onload="init()">
+        <h1 id="title">Custom Control Example</h1>
+
+          <div id="tags">
+        </div>
+
+        <p id="shortdesc">
+            Demonstrate the addition of a draggable rectangle to the OpenLayers window.
+        </p>
+      
         <div id="map"></div>
+
+        <div id="docs"></div>
     </body>
 </html>

examples/custom-style.html

@@ -1,10 +1,12 @@
 <html xmlns="http://www.w3.org/1999/xhtml">
     <head>
+        <title>Custom Style Example</title>
+        
         <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
         <style type="text/css">
             #map {
-            width: 500px;
-            height: 350px;
+                width: 512px;
+                height: 512px;
                 border: 1px solid gray;
             }
             p {
@@ -18,7 +20,6 @@
         </style>
         <script src="../lib/OpenLayers.js"></script>
         <script type="text/javascript">
-        <!--
             var lon = 5;
             var lat = 40;
             var zoom = 5;
@@ -34,11 +35,21 @@
                 map.addLayer(layer);
                 map.setCenter(new OpenLayers.LonLat(lon, lat), zoom);
             }
-        // -->
         </script>
     </head>
     <body onload="init()">
+        <h1 id="title">Custom Style Example</h1>
+
+        <div id="tags">
+        </div>
+
+        <p id="shortdesc">
+            Demonstrate changing CSS styles on controls in the OpenLayers window.
+        </p>
+
         <div id="map"></div>
+
+        <div id="docs">
            <p>If you care to modify the style of any OpenLayers element, include
            the default stylesheet as a link and declare any style modifications
            below that link.  These style declarations can be in other linked
@@ -49,5 +60,6 @@
            <p>This example shows how to declare the font family, size, and color
            for the mouse position.  Note that only the style keys that you want to
            modify (change from the default) need to be specified.</p>
+        </div>
     </body>
 </html>

examples/debug.html

@@ -2,10 +2,11 @@
          "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
 <html xmlns="http://www.w3.org/1999/xhtml">
     <head>
+        <title>OpenLayers Debug Example</title>
+        
         <script src="../lib/Firebug/firebug.js"></script>
         <script src="../lib/OpenLayers.js"></script>
         <script type="text/javascript">
-        <!--
             function consoleLog() {
                 OpenLayers.Console.log("This is the result of an OpenLayers.Console.log() call");
             }
@@ -21,16 +22,23 @@
             function consoleDirxml() {
                 OpenLayers.Console.dirxml(document.getElementsByTagName('body')[0]);
             }
-        // -->
         </script>
     </head>
     <body>
-    <h1>OpenLayers Debug Example</h1>
+        <h1 id="title">Debug Example</h1>
+
+        <div id="tags"></div>
+
+        <p id="shortdesc">
+            Demonstrate console calls to a Firebug console. Requires Firefox. Mostly for developers.
+        </p>
+
+        <div id="docs">
             <p>To run OpenLayers in debug mode, include the following script
             tag <b>before</b> the tag that loads OpenLayers:
-    <pre>
-    &lt;script src="../lib/Firebug/firebug.js"&gt;&lt;/script&gt;
-    </pre>
+
+            <pre>    &lt;script src="../lib/Firebug/firebug.js"&gt;&lt;/script&gt;</pre>
+
             The path to firebug.js must be relative to your
             html file.  With this script included calls to OpenLayers.Console
             will be displayed in the Firebug console.  For browsers without
@@ -60,5 +68,6 @@
             <p>The Firebug website has a complete list of
             <a href="http://www.getfirebug.com/console.html">console calls</a>.
             Note that not all are supported with Firebug Lite.</p>
+        </div>
     </body>
 </html>

examples/doubleSetCenter.html

@@ -1,9 +1,27 @@
 <html>
-<head>
-<script src="../lib/OpenLayers.js"></script>
-</head>
-<body>
-  <div style="width:100%; height:100%" id="map"></div>
+    <head>
+        <title>OpenLayers Double Set Center Example</title>
+       
+        <script src="../lib/OpenLayers.js"></script>
+        <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
+        <style type="text/css">
+            #map {
+                width:512px;
+                height:521px;
+            }
+        </style>
+    </head>
+    <body>
+        <h1 id="title">Double Set Center Example</h1>
+
+        <div id="tags"></div>
+
+        <p id="shortdesc">
+            Demonstrate the behavior of two calls to set the center after instatiating the layer object.
+        </p>
+
+        <div id="map"></div>
+    
         <script defer="defer" type="text/javascript">
             var map = new OpenLayers.Map('map');
             var wms = new OpenLayers.Layer.WMS( "OpenLayers WMS",
@@ -12,6 +30,8 @@
             map.setCenter(new OpenLayers.LonLat(100,10));
             map.setCenter(new OpenLayers.LonLat(1,1));
         </script>
-</body>
+
+        <div id="docs"></div>
+    </body>
 </html>
 

examples/drag-feature.html

@@ -1,10 +1,12 @@
 <html xmlns="http://www.w3.org/1999/xhtml">
     <head>
-    <title>Drag Feature</title>
+        <title>Drag Feature Example</title>
+        
+        <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
         <style type="text/css">
             #map {
                 width: 512px;
-            height: 350px;
+                height: 512px;
                 border: 1px solid gray;
             }
             #controls {
@@ -19,7 +21,6 @@
         </style>
         <script src="../lib/OpenLayers.js"></script>
         <script type="text/javascript">
-        <!--
             var map, vectors, controls;
             function init(){
                 map = new OpenLayers.Map('map');
@@ -60,13 +61,19 @@
                     }
                 }
             }
-        
-        // -->
         </script>
     </head>
     <body onload="init()">
-    <h1>OpenLayers Drag Feature Example</h1>
+        <h1 id="title">Drag Feature Example</h1>
+
+        <div id="tags"></div>
+
+        <p id="shortdesc">
+            Demonstrates point, line and polygon creation and editing.
+        </p>
+
         <div id="map"></div>
+        
         <div id="controls">
             <ul id="controlToggle">
                 <li>
@@ -93,5 +100,7 @@
                 </li>
             </ul>
         </div>
+
+        <div id="docs"></div>
     </body>
 </html>

examples/draw-feature.html

@@ -1,9 +1,12 @@
 <html xmlns="http://www.w3.org/1999/xhtml">
     <head>
+        <title>Draw Feature Example</title>
+        
+        <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
         <style type="text/css">
             #map {
                 width: 512px;
-            height: 350px;
+                height: 512px;
                 border: 1px solid gray;
             }
             #controlToggle li {
@@ -15,7 +18,6 @@
         </style>
         <script src="../lib/OpenLayers.js"></script>
         <script type="text/javascript">
-        <!--
             var map, drawControls;
             OpenLayers.Util.onImageLoadErrorColor = "transparent";
             function init(){
@@ -61,12 +63,19 @@
                     }
                 }
             }
-        // -->
         </script>
     </head>
     <body onload="init()">
-    <h1>OpenLayers Draw Feature Example</h1>
+        <h1 id="title">OpenLayers Draw Feature Example</h1>
+
+        <div id="tags"></div>
+
+        <p id="shortdesc">
+            Demonstrate on-screen digitizing tools for point, line, and polygon creation.
+        </p>
+
         <div id="map"></div>
+    
         <ul id="controlToggle">
             <li>
                 <input type="radio" name="type" value="none" id="noneToggle"
@@ -86,11 +95,13 @@
                 <label for="polygonToggle">draw polygon</label>
             </li>
         </ul>
+
+        <div id="docs">
             <p>Feature digitizing is in freehand mode by default.  In freehand mode, the mouse is treated as a pen.
             Drawing begins on mouse down, continues with every mouse move, and ends with mouse up.</p>
             <p>To turn freehand mode off, hold down the shift key while digitizing.  With freehand mode off, one
             vertex is added with each click and double-clicks finish drawing.  Freehand mode can be toggled on and off
             at any time while drawing.</p>
-        
+        </div>
     </body>
 </html>

examples/editingtoolbar-outside.html

@@ -0,0 +1,52 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
+    <style type="text/css">
+        .olControlEditingToolbar  {
+            float:left;
+            right: 0px;
+            height: 30px; 
+            width: 150px;
+        }
+        #map {
+            width: 512px;
+            height: 256px;
+            border: 1px solid gray;
+        }
+    </style>
+    <script src="../lib/Firebug/firebug.js"></script>
+    <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', {theme: null});
+            layer = new OpenLayers.Layer.WMS(
+                "OpenLayers WMS", 
+                "http://labs.metacarta.com/wms/vmap0",
+                {layers: "basic"}
+            );
+            map.addLayer(layer);
+
+            vlayer = new OpenLayers.Layer.Vector( "Editable" );
+            map.addLayer(vlayer);
+            var container = document.getElementById("panel");
+            var panel = new OpenLayers.Control.EditingToolbar(
+                vlayer, {div: container}
+            );
+            map.addControl(panel);
+            
+            map.setCenter(new OpenLayers.LonLat(lon, lat), zoom);
+        }
+    </script>
+  </head>
+  <body onload="init()">
+    <h3>OpenLayers EditingToolbar Outside Viewport</h3>
+    <div id="map"></div>
+    <div id="panel" class="olControlEditingToolbar"></div>
+  </body>
+</html>

examples/editingtoolbar.html

@@ -1,17 +1,19 @@
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
 <html xmlns="http://www.w3.org/1999/xhtml">
     <head>
+        <title>OpenLayers Editing Toolbar Example</title>
+        
+        <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
         <style type="text/css">
             #map {
-            width: 800px;
-            height: 475px;
+                width: 512px;
+                height: 512px;
                 border: 1px solid black;
             }
         </style>
         <script src="../lib/OpenLayers.js"></script>
         <script src="../lib/Firebug/debug.js"></script>
         <script type="text/javascript">
-        <!--
             var lon = 5;
             var lat = 40;
             var zoom = 5;
@@ -30,11 +32,20 @@
     
                 map.setCenter(new OpenLayers.LonLat(lon, lat), zoom);
             }
-        // -->
         </script>
     </head>
     <body onload="init()">
+        <h1 id="title">Editing Toolbar Example</h1>
+
+        <div id="tags"></div>
+
+        <p id="shortdesc">
+            Demonstrate polygon, polyline and point creation and editing tools.
+        </p>
+
         <div id="panel"></div>
         <div id="map"></div>
+
+        <div id="docs"></div>
     </body>
 </html>

examples/events.html

@@ -0,0 +1,154 @@
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>OpenLayers Event Handling</title>
+        <style type="text/css">
+            #map {
+                width: 512px;
+                height: 256px;
+                border: 1px solid gray;
+            }
+            #panel {
+                margin: 5px;
+                height: 30px; 
+                width: 200px;
+            }
+            #panel div { 
+                float: left;
+                margin-left: 5px;
+                width: 25px;
+                height: 25px;
+                border: 1px solid gray;
+            }
+            #output {
+                position: absolute;
+                left: 550px;
+                top: 40px;
+                width: 350px;
+                height: 400px;
+            }
+            div.blueItemInactive {
+                background-color: #aac;
+            }
+            div.blueItemActive {
+                background-color: #33c;
+            }
+            div.orangeItemInactive {
+                background-color: #ca6;
+            }
+            div.orangeItemActive {
+                background-color: #ea0;
+            }
+            div.greenItemInactive {
+                background-color: #aca;
+            }
+            div.greenItemActive {
+                background-color: #3c3;
+            }
+                
+        </style>
+        <script src="../lib/OpenLayers.js"></script>
+        <script type="text/javascript">
+            var map, panel;
+
+            function init(){
+                
+                // define custom map event listeners
+                function mapEvent(event) {
+                    log(event.type);
+                }
+                function mapBaseLayerChanged(event) {
+                    log(event.type + " " + event.layer.name);
+                }
+                function mapLayerChanged(event) {
+                    log(event.type + " " + event.layer.name + " " + event.property);
+                }
+                map = new OpenLayers.Map('map', {
+                    eventListeners: {
+                        "moveend": mapEvent,
+                        "zoomend": mapEvent,
+                        "changelayer": mapLayerChanged,
+                        "changebaselayer": mapBaseLayerChanged
+                    }
+                });
+
+                panel = new OpenLayers.Control.Panel(
+                    {div: document.getElementById("panel")}
+                );
+                
+                // define custom event listeners
+                function toolActivate(event) {
+                    log("activate " + event.object.displayClass);
+                }
+                function toolDeactivate(event) {
+                    log("deactivate " + event.object.displayClass);
+                }
+                
+                // Multiple objects can share listeners with the same scope
+                var toolListeners = {
+                    "activate": toolActivate,
+                    "deactivate": toolDeactivate
+                };
+                var blue = new OpenLayers.Control({
+                    type: OpenLayers.Control.TYPE_TOGGLE,
+                    eventListeners: toolListeners,
+                    displayClass: "blue"
+                });
+                var orange = new OpenLayers.Control({
+                    type: OpenLayers.Control.TYPE_TOGGLE,
+                    eventListeners: toolListeners,
+                    displayClass: "orange"
+                });
+                var green = new OpenLayers.Control({
+                    type: OpenLayers.Control.TYPE_TOGGLE,
+                    eventListeners: toolListeners,
+                    displayClass: "green"
+                });
+                
+                // add buttons to a panel
+                panel.addControls([blue, orange, green]);
+                map.addControl(panel);
+                
+                var vmap = new OpenLayers.Layer.WMS(
+                    "OpenLayers WMS",
+                    "http://labs.metacarta.com/wms/vmap0",
+                    {layers: 'basic'}
+                );
+                var landsat = new OpenLayers.Layer.WMS(
+                    "NASA Global Mosaic",
+                    "http://t1.hypercube.telascience.org/cgi-bin/landsat7", 
+                    {layers: "landsat7"}
+                );
+                var nexrad = new OpenLayers.Layer.WMS(
+                    "Nexrad",
+                    "http://mesonet.agron.iastate.edu/cgi-bin/wms/nexrad/n0r.cgi",
+                    {layers:"nexrad-n0r-wmst", transparent: "TRUE", format: 'image/png'},
+                    {isBaseLayer: false}
+                );
+
+
+                map.addLayers([vmap, landsat, nexrad]);
+                map.addControl(new OpenLayers.Control.LayerSwitcher());
+                map.zoomToMaxExtent();
+
+            }
+            function log(msg) {
+                document.getElementById("output").innerHTML += msg + "\n";
+            }
+        </script>
+    </head>
+    <body onload="init()">
+        <h1 id="title">Event Handling</h1>
+
+        <div id="tags">
+        </div>
+
+        <p id="shortdesc">
+            Demonstrating various styles of event handling in OpenLayers.
+        </p>
+
+        <div id="map"></div>
+        <div id="panel"></div>
+        <textarea id="output"></textarea>
+        <div id="docs"></div>
+    </body>
+</html>

examples/example.html

@@ -1,5 +1,7 @@
 <html xmlns="http://www.w3.org/1999/xhtml">
   <head>
+    <title>OpenLayers Example</title>
+    <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
     <style type="text/css">
         #map {
             width: 512px;
@@ -13,7 +15,6 @@
         // debugging/inspecting in Firebug
         var map = null;
 
-        <!--
         function init(){
 
             //set title name to include Browser Detection
@@ -59,8 +60,8 @@
                             resolutions: [0.17578125,0.087890625,0.0439453125,0.02197265625,0.010986328125,0.0054931640625,0.00274658203125,0.00137329101]
             };
             var jpl_wms = new OpenLayers.Layer.WMS( "NASA Global Mosaic",
-                "http://wms.jpl.nasa.gov/wms.cgi", 
-                {layers: "modis,global_mosaic"}, options2);
+                "http://t1.hypercube.telascience.org/cgi-bin/landsat7", 
+                {layers: "landsat7"}, options2);
 
             var dm_wms = new OpenLayers.Layer.WMS( "DM Solutions Demo",
                 "http://www2.dmsolutions.ca/cgi-bin/mswms_gmap",
@@ -75,15 +76,20 @@
             // map.setCenter(new OpenLayers.LonLat(0, 0), 0);
             map.zoomToMaxExtent();
         }
-        // -->
     </script>
   </head>
   <body onload="init()">
-    <table><tr><td>
-        <h1>OpenLayers Example</h1>
-    </td><td>
-        <h3 id="browserHeader"></h3>
-    </td></tr></table>
+    <h1 id="title" style="display:inline;">OpenLayers Example</h1>
+    <h3 id="browserHeader" style="display:inline;"></h3>
+
+    <div id="tags"></div>
+
+    <p id="shortdesc">
+        Demonstrate a simple map with an overlay that includes layer switching controls.
+    </p>
+
     <div id="map"></div>
+
+    <div id="docs"></div>
   </body>
 </html>

examples/fractional-zoom.html

@@ -0,0 +1,73 @@
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
+    <style type="text/css">
+        #map {
+            width: 512px;
+            height: 256px;
+            border: 1px solid gray;
+        }
+    </style>
+    <script src="../lib/OpenLayers.js"></script>
+    <script type="text/javascript">
+        var map;
+
+        function init() {
+            map = new OpenLayers.Map('map', 
+                 {controls: [new OpenLayers.Control.Navigation(), 
+                             new OpenLayers.Control.PanZoomBar()], 
+                  numZoomLevels: 10 });
+            var wms = new OpenLayers.Layer.WMS(
+                "OpenLayers WMS",
+                "http://labs.metacarta.com/wms/vmap0",
+                {layers: 'basic'}
+            );
+            map.addLayers([wms]);
+
+            map.events.register("moveend", null, displayZoom);
+
+            map.zoomToMaxExtent();
+            
+            update(document.getElementById("fractional"));
+            
+        }
+        
+        function displayZoom() {
+            document.getElementById("zoom").innerHTML = map.zoom.toFixed(4);
+        }
+        
+        function update(input) {
+            map.fractionalZoom = input.checked;
+            map.zoomTo(Math.round(map.zoom));
+        }
+    </script>
+  </head>
+  <body onload="init()">
+    <h1 id="title">Fractional Zoom Example</h1>
+
+    <div id="tags">
+    </div>
+    <p id="shortdesc">
+            Shows the use of a map with fractional (or non-discrete) zoom levels.
+    </p>
+
+    <div id="map"></div>
+        <input type="checkbox" name="fractional"
+               id="fractional" checked="checked" onclick="update(this)" />
+        <label for="fractional">Fractional Zoom</label>
+        (zoom: <span id="zoom"></span>)
+        <br /><br />
+    <div id="docs">
+            <p>
+            Setting the map.fractionalZoom property to true allows zooming to
+            an arbitrary level (between the min and max resolutions).  This
+            can be demonstrated by shift-dragging a box to zoom to an arbitrary
+            extent.
+            </p>
+    </div>
+  </body>
+</html>
+
+
+
+

examples/fullScreen.html

@@ -1,11 +1,21 @@
 <html xmlns="http://www.w3.org/1999/xhtml">
     <head>
+        <title>Full Screen Example</title>
+        
+        <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
         <style type="text/css">
             #map {
                 width: 100%;
                 height: 100%;
                 border: 1px solid black;
             }
+
+            #text {
+                position: absolute;
+                bottom: 0px;
+                left:0px;
+                width: 512px;
+            }
         </style>
         <script src="../lib/OpenLayers.js"></script>
         <script type="text/javascript">
@@ -14,11 +24,11 @@
                 map = new OpenLayers.Map('map');
 
             var ol_wms = new OpenLayers.Layer.WMS( "OpenLayers WMS",
-                "http://labs.metacarta.com:80/wms/vmap0?", {layers: 'basic'}); 
-
+                    "http://labs.metacarta.com/wms/vmap0",
+                    {layers: 'basic'} );
             var jpl_wms = new OpenLayers.Layer.WMS( "NASA Global Mosaic",
-                "http://wms.jpl.nasa.gov/wms.cgi", 
-                {layers: "modis,global_mosaic"});
+                "http://t1.hypercube.telascience.org/cgi-bin/landsat7", 
+                {layers: "landsat7"});
 
                 var dm_wms = new OpenLayers.Layer.WMS( "DM Solutions Demo",
                     "http://www2.dmsolutions.ca/cgi-bin/mswms_gmap",
@@ -35,5 +45,20 @@
     </head>
     <body onload="init()">
         <div id="map"></div>
+
+          <div id="text">
+              <h1 id="title">Full Screen Example</h1>
+
+              <div id="tags"></div>
+
+              <p id="shortdesc">
+                Demonstrate a map that fill the entire browser window.
+            </p>
+
+            <div id="docs">
+                This example uses CSS to define the dimensions of the map element in order to fill the screen.
+                When the user resizes the window, the map size changes correspondingly. No scroll bars!
+            </div>
+        </div>
     </body>
 </html>

examples/fullScreen2.html

@@ -0,0 +1,52 @@
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>Full Screen Example 2</title>
+        
+        <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
+        <style type="text/css">
+            #map {
+                width: 100%;
+                height: 100%;
+                border: 1px solid black;
+            }
+        </style>
+        <script src="../lib/OpenLayers.js"></script>
+        <script type="text/javascript">
+            var map;
+            function init(){
+                map = new OpenLayers.Map('map');
+
+                var options = {numZoomLevels: 3};
+
+                var docImage = new OpenLayers.Layer.Image(
+                    'Full Screen',
+                    'fullscreen.jpg',
+                    new OpenLayers.Bounds(-156, -90, 156, 90),
+                    new OpenLayers.Size(1121, 650),
+                    options);
+
+                map.addLayers([docImage]);
+                // map.setCenter(new OpenLayers.LonLat(0, 0), 0);
+                map.zoomToMaxExtent();
+            }
+        </script>
+    </head>
+    <body onload="init()">
+        <div id="map"></div>
+
+        <div id="text">
+            <h1 id="title">Full Screen Example</h1>
+
+            <div id="tags"></div>
+
+            <p id="shortdesc">
+                Demonstrate a map that fill the entire browser window.
+            </p>
+
+            <div id="docs">
+                This example uses CSS to define the dimensions of the map element in order to fill the screen.
+                When the user resizes the window, the map size changes correspondingly. No scroll bars!
+            </div>
+        </div>
+    </body>
+</html>

examples/geojson.html

@@ -0,0 +1,67 @@
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
+    <style type="text/css">
+        #map {
+            width: 800px;
+            height: 475px;
+            border: 1px solid black;
+        }
+    </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.setCenter(new OpenLayers.LonLat(lon, lat), zoom);
+            var featurecollection = {
+              "type": "FeatureCollection", 
+              "features": [
+                {"geometry": {
+                    "type": "GeometryCollection", 
+                    "geometries": [
+                        {
+                            "type": "LineString", 
+                            "coordinates": 
+                                [[11.0878902207, 45.1602390564], 
+                                [15.01953125, 48.1298828125]]
+                        }, 
+                        {
+                            "type": "Polygon", 
+                            "coordinates": 
+                                [[[11.0878902207, 45.1602390564], 
+                                  [14.931640625, 40.9228515625], 
+                                  [0.8251953125, 41.0986328125], 
+                                  [7.63671875, 48.96484375], 
+                                  [11.0878902207, 45.1602390564]]]
+                        },
+                        {
+                            "type":"Point", 
+                            "coordinates":[15.87646484375, 44.1748046875]
+                        }
+                    ]
+                }, 
+                "type": "Feature", 
+                "properties": {}}
+              ]
+           };
+           var geojson_format = new OpenLayers.Format.GeoJSON();
+           var vector_layer = new OpenLayers.Layer.Vector(); 
+           map.addLayer(vector_layer);
+           vector_layer.addFeatures(geojson_format.read(featurecollection));
+
+        }
+    </script>
+  </head>
+  <body onload="init()">
+    <div id="map"></div>
+  </body>
+</html>

examples/georss-flickr.html

@@ -0,0 +1,115 @@
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
+    <style type="text/css">
+        #map {
+            width: 800px;
+            height: 400px;
+            border: 1px solid black;
+        }
+        
+        .olPopupContent {
+            font-size: smaller;
+        }
+    </style>
+    <script src="../lib/OpenLayers.js"></script>
+    <script type="text/javascript">
+        var map, layer, markerLayer, style, popup;
+        
+
+        function init(){
+            map = new OpenLayers.Map('map', {maxResolution:'auto'});
+            
+            layer = new OpenLayers.Layer.WMS( "OpenLayers WMS", 
+                "http://labs.metacarta.com/wms/vmap0", {layers: 'basic'} );
+            map.addLayer(layer);
+            
+            map.setCenter(new OpenLayers.LonLat(0, 0), 0);
+            map.addControl(new OpenLayers.Control.LayerSwitcher());
+            
+            // create a property style that reads the externalGraphic url from
+            // the thumbail attribute of the rss item
+            style = new OpenLayers.Style({externalGraphic: "${thumbnail}"});
+            
+            // create a rule with a point symbolizer that will make the thumbnail
+            // larger if the title of the rss item conatins "powder"
+            var rule = new OpenLayers.Rule({
+                symbolizer: {pointRadius: 30},
+                filter: new OpenLayers.Filter.Comparison({
+                    type: OpenLayers.Filter.Comparison.LIKE,
+                    property: "title",
+                    value: "*powder*"
+                })
+            });
+            rule.filter.value2regex("*");
+            
+            // If the above rule does not apply, use a smaller pointRadius.
+            var elseRule = new OpenLayers.Rule({
+                elseFilter: true,
+                symbolizer: {pointRadius: 20}
+            });
+            
+            style.addRules([rule, elseRule]);
+            
+            // Create a layer with a style map.  Giving the style map keys
+            // for "default" and "select" rendering intent.
+            markerLayer = new OpenLayers.Layer.Vector("", {
+                styleMap: new OpenLayers.StyleMap({
+                    "default": style,
+                    "select": new OpenLayers.Style({pointRadius: 35})
+                })
+            });
+            map.addLayer(markerLayer);
+            
+            // control that will show a popup when clicking on a thumbnail
+            var popupControl = new OpenLayers.Control.SelectFeature(markerLayer, {
+              onSelect: function(feature) {
+                  var pos = feature.geometry;
+                  if (popup) {
+                      map.removePopup(popup);
+                  }
+                  popup = new OpenLayers.Popup("popup",
+                      new OpenLayers.LonLat(pos.x, pos.y),
+                      new OpenLayers.Size(254,320),
+                      "<h3>" + feature.attributes.title + "</h3>" +
+                      feature.attributes.description,
+                      true);
+                  map.addPopup(popup);
+              }
+            }); 
+            map.addControl(popupControl);
+            
+            popupControl.activate();
+            
+            OpenLayers.loadURL("xml/georss-flickr.xml", null, window, afterload);
+            
+        }
+        
+        function afterload(req) {
+            // extended version of OpenLayers.Format.GeoRSS.createFeatureFromItem;
+            // adds the thumbnail attribute to the feature
+            function createFeatureFromItem(item) {
+                var feature = OpenLayers.Format.GeoRSS.prototype
+                        .createFeatureFromItem.apply(this, arguments);
+                feature.attributes.thumbnail =
+                        this.getElementsByTagNameNS(
+                        item, "*", "thumbnail")[0].getAttribute("url");
+                return feature;
+            }
+
+            var store = new OpenLayers.Format.GeoRSS({
+                    createFeatureFromItem: createFeatureFromItem});
+
+            rss = store.read(req.responseText);
+
+            markerLayer.setName("Some images from Flickr");
+            markerLayer.addFeatures(rss);
+        }
+    </script>
+  </head>
+  <body onload="init()">
+    <h1>GeoRSS from Flickr in OpenLayers</h1>
+    <p>The displayed GeoRSS feed has a <tt>&lt;media:thumbnail/&gt;</tt> property for each item. An extended <tt>createFeatureFromItem()</tt> function is used to add this attribute to the attributes hash of each feature read in by <tt>OpenLayers.Format.GeoRSS</tt>. The example is configured with a style to render each item with its thumbnail image. Also, to show how rules work, we defined a rule that if the title of an rss item contains "powder", it will be rendered larger than the others.</p>
+    <div id="map"></div>
+  </body>
+</html>

examples/georss-markers.html

@@ -1,9 +1,11 @@
 <html xmlns="http://www.w3.org/1999/xhtml">
   <head>
+      <title>OpenLayers GeoRSS Marker Example</title>
+    <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
     <style type="text/css">
         #map {
-            width: 800px;
-            height: 400px;
+            width: 512px;
+            height: 512px;
             border: 1px solid black;
         }
     </style>
@@ -28,7 +30,16 @@
     </script>
   </head>
   <body onload="init()">
-    <h1>GeoRSS in OpenLayers</h1>
+    <h1 id="title">GeoRSS Marker Example</h1>
+
+    <div id="tags"></div>
+
+    <p id="shortdesc">
+        Demonstrate loading a GeoRSS feed using the GeoRSS parser.
+    </p>
+
     <div id="map"></div>
+
+    <div id="docs"></div>
   </body>
 </html>

examples/georss-serialize.html

@@ -1,9 +1,11 @@
 <html xmlns="http://www.w3.org/1999/xhtml">
   <head>
+      <title>OpenLayers GeoRSS Serialize Example</title>
+    <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
     <style type="text/css">
         #map {
-            width: 45%;
-            height: 350px;
+            width: 512px;
+            height: 512px;
             border: 1px solid gray;
         }
     </style>
@@ -37,10 +39,20 @@
     </script>
   </head>
   <body onload="init()">
-    <h1>OpenLayers Draw Point Example</h1>
+    <h1 id="title">Draw Point Example</h1>
+
+    <div id="tags"></div>
+
+    <p id="shortdesc">
+        Demonstrate serialization of features in a Vector layer to GeoRSS.
+    </p>
+
     <div style="float:right;width:50%">
         <textarea id="gml" style="width:100%" rows="30"></textarea>
     </div>
+
     <div id="map"></div>
+
+    <div id="docs"></div>
   </body>
 </html>

examples/georss.html

@@ -1,9 +1,11 @@
 <html xmlns="http://www.w3.org/1999/xhtml">
   <head>
+      <title>OpenLayers GeoRSS Example</title>
+    <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
     <style type="text/css">
         #map {
-            width: 800px;
-            height: 400px;
+            width: 512px;
+            height: 512px;
             border: 1px solid black;
         }
     </style>
@@ -31,12 +33,31 @@
     </script>
   </head>
   <body onload="init()">
-    <h1>GeoRSS in OpenLayers</h1>
-    <p style="font-size:.9em;">This demo uses the OpenLayers GeoRSS parser, which supports GeoRSS Simple and W3C GeoRSS. Only points are currently supported. <a href="http://trac.openlayers.org/wiki/HowToDownload">Get the code!</a></p>
-    <form onsubmit="return false;">
-   GeoRSS URL: <input type="text" id="url" size="50" /><input type="submit" onclick="addUrl(); return false;" value="Load Feed" onsubmit="addUrl(); return false;" />
-    </form>  
-    <p>The above input box allows the input of a URL to a GeoRSS feed. This feed can be local to the HTML page -- for example, entering 'georss.xml' will work by default, because there is a local file in the directory called georss.xml -- or, with a properly set up ProxyHost variable (as is used here), it will be able to load any HTTP URL which contains GeoRSS and display it. Anything else will simply have no effect.</p>    
+    <h1 id="title">GeoRSS Example</h1>
+
+    <div id="tags"></div>
+
+    <p id="shortdesc">
+        Display a couple of locally cached georss feeds on an a basemap.
+    </p>
+
     <div id="map"></div>
+
+    <div id="docs">
+        <p>This demo uses the OpenLayers GeoRSS parser, which supports GeoRSS Simple and W3C GeoRSS. Only points are
+        currently supported.  The OpenLayers GeoRSS parser will automatically connect an information bubble to the map
+        markers, similar to Google maps.  In addition, the parser can use custom PNG icons for markers.  A sample GeoRSS
+        file (georss.xml) is included.
+
+        <form onsubmit="return false;">
+               GeoRSS URL: <input type="text" id="url" size="50" value="georss.xml" />
+               <input type="submit" onclick="addUrl(); return false;" value="Load Feed" onsubmit="addUrl(); return false;" />
+        </form>
+
+        <p>The above input box allows the input of a URL to a GeoRSS feed. This feed can be local to the HTML page --
+        for example, entering 'georss.xml' will work by default, because there is a local file in the directory called
+        georss.xml -- or, with a properly set up ProxyHost variable (as is used here), it will be able to load any
+        HTTP URL which contains GeoRSS and display it. Anything else will simply have no effect.</p>
+    </div>
   </body>
 </html>

examples/getfeatureinfo.html

@@ -1,20 +1,31 @@
 <html>
-<head>
-<script src="../lib/OpenLayers.js"></script>
-<style type="text/css">
-ul, li { padding-left: 0px; margin-left: 0px; }
-</style>
-<title>World Map Query</title> 
-</head>
-<body>
-  <a id='permalink' href="">Permalink</a><br />
+  <head>
+    <title>OpenLayers Feature Info Example</title>
+    <script src="../lib/OpenLayers.js"></script>
+    <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
+    <style type="text/css">
+        ul, li { padding-left: 0px; margin-left: 0px; }
+    </style>
+  </head>
+  <body>
+      <h1 id="title">Feature Info Example</h1>
+
+      <div id="tags"></div>
+
+      <p id="shortdesc">
+        Demonstrates sending a GetFeatureInfo query to an OWS. Returns information about a map feature in the side DIV.
+      </p>
+
+    <a id="permalink" href="">Permalink</a><br />
+
     <div style="float:right;width:28%">
         <h1 style="font-size:1.3em;">CIA Factbook</h1>
-    <p style='font-size:.8em;'>Click a country to see statistics about the country below.</p>
+        <p style="font-size:.8em;">Click a country to see statistics about the country below.</p>
         <div id="nodeList">
         </div>
     </div>
-  <div id="map" style="width:70%; height:90%"></div>
+      <div id="map" style="width:512px; height:512px"></div>
+
   <script defer="defer" type="text/javascript">
     OpenLayers.ProxyHost = "/dev/examples/proxy.cgi?url=";
     var map = new OpenLayers.Map('map', {'maxResolution':'auto'});
@@ -43,5 +54,8 @@ ul, li { padding-left: 0px; margin-left: 0px; }
         OpenLayers.Util.getElement('nodeList').innerHTML = response.responseText;
     }
   </script>
-</body>
+
+    <div id="docs">
+    </div>
+  </body>
 </html>

examples/gml-layer.html

@@ -1,9 +1,11 @@
 <html xmlns="http://www.w3.org/1999/xhtml">
   <head>
+      <title>OpenLayers GML Layer Example</title>
+    <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
     <style type="text/css">
         #map {
-            width: 800px;
-            height: 475px;
+            width: 512px;
+            height: 512px;
             border: 1px solid black;
         }
     </style>
@@ -25,6 +27,16 @@
     </script>
   </head>
   <body onload="init()">
+      <h1 id="title">GML Layer Example</h1>
+
+      <div id="tags"></div>
+
+      <p id="shortdesc">
+          Loads locally stored GML vector data on a basemap. Includes GML example file.
+    </p>
+
     <div id="map"></div>
+
+    <div id="docs"></div>
   </body>
 </html>

examples/gml-serialize.html

@@ -1,5 +1,7 @@
 <html xmlns="http://www.w3.org/1999/xhtml">
   <head>
+      <title>OpenLayers GML Serialization Example</title>
+    <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
     <style type="text/css">
         #map {
             width: 512px;
@@ -58,7 +60,14 @@
     </script>
   </head>
   <body onload="init()">
-    <h1>OpenLayers Draw Point Example</h1>
+    <h1 id="title">GML Serialization Example</h1>
+
+    <div id="tags"></div>
+
+    <p id="shortdesc">
+        Demonstrate the serialization of features drawn in the OpenLayers window.
+    </p>
+
     <div style="float:right">
         <ul id="controlToggle">
             <li>
@@ -75,9 +84,14 @@
                 <label for="lineToggle">draw line</label>
             </li>
         </ul>
+
         <p>Check the box to draw points.  Uncheck to navigate normally.</p>
+
         <textarea id="gml" cols="80" rows="30"></textarea>
     </div>
+
     <div id="map"></div>
+
+    <div id="docs"></div>
   </body>
 </html>

examples/google-reproject.html

@@ -0,0 +1,65 @@
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <title>OpenLayers Google with Overlay Example</title>
+    <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
+    <style type="text/css">
+        #map {
+            width: 512px;
+            height: 512px;
+            border: 1px solid black;
+        }
+    </style>
+
+    <!-- this gmaps key generated for http://openlayers.org/dev/ -->
+    <script src='http://maps.google.com/maps?file=api&amp;v=2&amp;key=ABQIAAAAjpkAC9ePGem0lIq5XcMiuhR_wWLPFku8Ix9i2SXYRVK3e45q1BQUd_beF8dtzKET_EteAjPdGDwqpQ'></script>
+    <script src="../lib/OpenLayers.js"></script>
+    <script type="text/javascript">
+        var map;
+
+        function init(){
+            map = new OpenLayers.Map('map');
+
+            var satellite = new OpenLayers.Layer.Google(
+                "Google Satellite" , {type: G_SATELLITE_MAP}
+            );
+
+            var wms = new OpenLayers.Layer.WMS(
+                "World Map",
+                "http://world.freemap.in/cgi-bin/mapserv",
+                {
+                    map: '/www/freemap.in/world/map/factbooktrans.map',
+                    transparent: 'TRUE',
+                    layers: 'factbook'
+                },
+                {'reproject': true}
+            );
+
+            map.addLayers([satellite, wms]);
+
+            map.setCenter(new OpenLayers.LonLat(10.205188,48.857593), 5);
+            map.addControl( new OpenLayers.Control.LayerSwitcher() );
+            map.addControl( new OpenLayers.Control.PanZoomBar() );
+        }
+    </script>
+  </head>
+  <body onload="init()">
+    <h1 id="title">Google with Overlay Example</h1>
+
+    <div id="tags"></div>
+
+    <p id="shortdesc">
+        Demonstrate a Google basemap used with boundary overlay layer.
+    </p>
+
+    <div id="map"></div>
+
+    <div id="docs">
+        An overlay in a Geographic projection can be stretched to somewhat
+        line up with Google tiles (in a Mercator projection).  Results get
+        worse farther from the equator.  Use the "reproject" option on a
+        layer to get this behavior.  Use the sphericalMercator option on
+        a Google layer to get proper overlays (with other layers in
+        Spherical Mercator).
+    </div>
+  </body>
+</html>

examples/google.html

@@ -1,75 +1,64 @@
 <html xmlns="http://www.w3.org/1999/xhtml">
   <head>
+    <title>OpenLayers Google Layer Example</title>
+    <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
     <style type="text/css">
         #map {
-            width: 100%;
+            width: 512px;
             height: 512px;
             border: 1px solid black;
-            background-color: red;
         }
     </style>
 
     <!-- this gmaps key generated for http://openlayers.org/dev/ -->
     <script src='http://maps.google.com/maps?file=api&amp;v=2&amp;key=ABQIAAAAjpkAC9ePGem0lIq5XcMiuhR_wWLPFku8Ix9i2SXYRVK3e45q1BQUd_beF8dtzKET_EteAjPdGDwqpQ'></script>
-    <!-- Localhost key -->
-    <!-- <script src='http://maps.google.com/maps?file=api&amp;v=2&amp;key=ABQIAAAAjpkAC9ePGem0lIq5XcMiuhT2yXp_ZAY8_ufC3CFXhHIE1NvwkxTS6gjckBmeABOGXIUiOiZObZESPg'></script>-->
     <script src="../lib/OpenLayers.js"></script>
     <script type="text/javascript">
-        var lon = 5;
-        var lat = 40;
-        var zoom = 17;
-        var map, layer;
+        var map;
 
-        function init(){
-            map = new OpenLayers.Map( 'map' , 
-            { controls: [new OpenLayers.Control.MouseDefaults()] , 'numZoomLevels':20});
+        function init() {
+            map = new OpenLayers.Map('map');
+            map.addControl(new OpenLayers.Control.LayerSwitcher());
             
-            var satellite = new OpenLayers.Layer.Google( "Google Satellite" , {type: G_SATELLITE_MAP, 'maxZoomLevel':18} );
+            var gphy = new OpenLayers.Layer.Google(
+                "Google Physical",
+                {type: G_PHYSICAL_MAP}
+            );
+            var gmap = new OpenLayers.Layer.Google(
+                "Google Streets" // the default
+            );
+            var ghyb = new OpenLayers.Layer.Google(
+                "Google Hybrid",
+                {type: G_HYBRID_MAP}
+            );
+            var gsat = new OpenLayers.Layer.Google(
+                "Google Satellite",
+                {type: G_SATELLITE_MAP}
+            );
 
 
-            map.addLayers([satellite]);
-            layer = new OpenLayers.Layer.WMS( "OpenLayers WMS", 
-                    "http://labs.metacarta.com/wms/vmap0", {layers: 'basic', 'transparent':true}, 
-                      {isBaseLayer: false} );
-            layer.setVisibility(false);
-         var twms = new OpenLayers.Layer.WMS( "World Map", 
-         "http://world.freemap.in/cgi-bin/mapserv?", 
-                 {map: '/www/freemap.in/world/map/factbooktrans.map', transparent:'true',
-                         layers: 'factbook', 'format':'png'}, {'reproject': true} );
-            map.addLayer(twms);
-            markers = new OpenLayers.Layer.Markers("markers");
-            map.addLayer(markers);
-
-            map.setCenter(new OpenLayers.LonLat(10.205188,48.857593), 5);
-            map.addControl( new OpenLayers.Control.LayerSwitcher() );
-            map.addControl( new OpenLayers.Control.PanZoomBar() );
+            map.addLayers([gphy, gmap, ghyb, gsat]);
 
+            map.setCenter(new OpenLayers.LonLat(10.2, 48.9), 5);
         }
-        
-        function add() {
-
-            var url = 'http://boston.openguides.org/markers/AQUA.png';
-            var sz = new OpenLayers.Size(10, 17);
-            var calculateOffset = function(size) {
-                                return new OpenLayers.Pixel(-(size.w/2), -size.h);
-                             };           
-            var icon = new OpenLayers.Icon(url, sz, null, calculateOffset);
-            var barcelona = new OpenLayers.LonLat(2.13134765625,
-                                                  41.37062534198901);
-            marker = new OpenLayers.Marker(barcelona, icon);
-            markers.addMarker(marker);
-        }
-
-        function remove() {
-            markers.removeMarker(marker);
-        }
-
     </script>
   </head>
   <body onload="init()">
-    <h1>OpenLayers With Google Layer Example</h1>
+    <h1 id="title">Google Layer Example</h1>
+
+    <div id="tags"></div>
+
+    <p id="shortdesc">
+        Demonstrate use of the various types of Google layers.
+    </p>
+
     <div id="map"></div>
-    <div style="background-color:green" onclick="add()"> click to add a marker to the map</div>
-    <div style="background-color:red" onclick="remove()"> click to remove the marker from the map</div>
+
+    <div id="docs">
+        For best performance, you must be using a version of the Google Maps
+        API which is v2.93 or higher. In order to use this version of the API,
+        it is best to simply set your application to use the string "v=2" in
+        the request, rather than tying your application to an explicit version.
+    </div>
   </body>
 </html>

examples/gutter.html

@@ -1,13 +1,15 @@
 <html>
   <head>
+      <title>OpenLayers Gutter Example</title>
+    <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
     <style type="text/css">
         #map {
-            width: 500px; 
-            height: 300px; 
+            width: 521px;
+            height: 512px;
             border: 1px solid gray;
         }
         p.caption {
-            width: 500px; 
+            width: 512px;
         }
     </style>
     <script src="../lib/OpenLayers.js"></script>
@@ -33,8 +35,17 @@
     </script>
   </head>
   <body>
-    <h1>OpenLayers Gutter Example</h1> 
+    <h1 id="title">Gutter Example</h1>
+
+    <div id="tags"></div>
+
+    <p id="shortdesc">
+        Demonstrates map tiling artifacts, and OpenLayer's facility for correcting this distortion.
+    </p>
+
     <div id="map"></div>
+
+    <div id="docs">
         <p class="caption">
             When you render tiles with certain types of symbols, there are artifacts
             at tile edges that make symbology not look continuous.  In the center of
@@ -42,6 +53,6 @@
             vertically by a tile.  Open the layer switcher and change to the layer
             with a 15 pixel gutter to see how the symbology looks nicer.
         </p>
-         
+    </div>
   </body>
 </html>

examples/hover-handler.html

@@ -0,0 +1,211 @@
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>OpenLayers Hover Handler Example</title>
+        <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
+        
+        <style type="text/css">
+            #map {
+                width: 340px;
+                height: 170px;
+                border: 1px solid gray;
+            }
+            #west {
+                width: 350px;
+            }
+            #east {
+                position: absolute;
+                left: 370px;
+                top: 3em;
+            }
+
+            table td {
+                text-align: center;
+                margin: 0;
+                border: 1px solid gray;
+            }
+            textarea.output {
+                text-align: left;
+                font-size: 0.9em;
+                width: 250px;
+                height: 65px;
+                overflow: auto;
+            }
+        </style>
+        <script src="../lib/Firebug/firebug.js"></script>
+        <script src="../lib/OpenLayers.js"></script>
+        <script type="text/javascript">
+
+            OpenLayers.Control.Hover = OpenLayers.Class(OpenLayers.Control, {                
+                defaultHandlerOptions: {
+                    'delay': 500,
+                    'pixelTolerance': null,
+                    'stopMove': false
+                },
+
+                initialize: function(options) {
+                    this.handlerOptions = OpenLayers.Util.extend(
+                        {}, this.defaultHandlerOptions
+                    );
+                    OpenLayers.Control.prototype.initialize.apply(
+                        this, arguments
+                    ); 
+                    this.handler = new OpenLayers.Handler.Hover(
+                        this,
+                        {'pause': this.onPause, 'move': this.onMove},
+                        this.handlerOptions
+                    );
+                }, 
+
+                onPause: function(evt) {
+                    var output = document.getElementById(this.key + 'Output');
+                    var msg = 'pause ' + evt.xy;
+                    output.value = output.value + msg + "\r\n";
+                },
+
+                onMove: function(evt) {
+                    // if this control sent an Ajax request (e.g. GetFeatureInfo) when
+                    // the mouse pauses the onMove callback could be used to abort that
+                    // request.
+                }
+            });
+
+            var map, controls; 
+
+            function init(){
+        
+                map = new OpenLayers.Map('map');
+                var layer = new OpenLayers.Layer.WMS(
+                    'OpenLayers WMS',
+                    'http://labs.metacarta.com/wms/vmap0',
+                    {layers: 'basic'}
+                );
+                map.addLayers([layer]);
+                
+                controls = {
+                    'long': new OpenLayers.Control.Hover({
+                        handlerOptions: {
+                            'delay': 2000
+                        }
+                    }),
+                    'short': new OpenLayers.Control.Hover({
+                        handlerOptions: {
+                            'delay': 100
+                        }
+                    }),
+                    'tolerant': new OpenLayers.Control.Hover({
+                        handlerOptions: {
+                            'delay': 1000,
+                            'pixelTolerance': 6
+                        }
+                    }),
+                    'untolerant': new OpenLayers.Control.Hover({
+                        handlerOptions: {
+                            'delay': 1000,
+                            'pixelTolerance': 1
+                        }
+                    }),
+                    'stoppropag': new OpenLayers.Control.Hover({
+                        handlerOptions: {
+                            'stopMove': true
+                        }
+                    })
+                };
+
+                var props = document.getElementById("props");
+                var control;
+                for(var key in controls) {
+                    control = controls[key];
+                    // only to route output here
+                    control.key = key;
+                    map.addControl(control);
+                }
+
+                map.addControl(new OpenLayers.Control.MousePosition());
+                map.zoomToMaxExtent();
+            }
+            
+            function toggle(key) {
+                var control = controls[key];
+                if(control.active) {
+                    control.deactivate();
+                } else {
+                    control.activate();
+                }
+                var status = document.getElementById(key + "Status");
+                status.innerHTML = control.active ? "on" : "off";
+                var output = document.getElementById(key + "Output");
+                output.value = "";
+            }
+        </script>
+    </head>
+    <body onload="init()">
+        <h1 id="title">Hover Handler Example</h1>
+        <div id="west">
+    
+            <div id="tags">
+            </div>
+    
+            <p id="shortdesc">
+                This example shows the use of the hover handler.
+            </p>
+    
+            <div id="map"></div>
+            <p>
+                The hover handler is to be used to emulate mouseovers on
+                objects on the map that aren't DOM elements. For example
+                one can use the hover hander to send WMS/GetFeatureInfo
+                requests as the user moves the mouse over the map.
+            </p>
+            <p>
+                The "delay" option specifies the number of milliseconds
+                before the event is considered a hover. Default is 500
+                milliseconds.
+            </p>
+            <p>
+                The "pixelTolerance" option specifies the maximum number
+                of pixels between mousemoves for an event to be
+                considered a hover. Default is null, which means no
+                pixel tolerance.
+            </p>
+            <p>
+                The "stopMove" option specifies whether other mousemove
+                listeners registered before the hover handler listener must
+                be notified on mousemoves or not. Default is false (meaning
+                that the other mousemove listeners will be notified on
+                mousemove).
+            </p>
+        </div>
+        <div id="east">
+            <table>
+                <caption>Controls with hover handlers (toggle on/off to clear output)</caption>
+                <tbody>
+                    <tr>
+                        <td>long delay (2 sec)</td>
+                        <td><button id="longStatus" onclick="toggle('long')">off</button></td>
+                        <td><textarea class="output" id="longOutput"></textarea></td>
+                    </tr>
+                    <tr>
+                        <td>short delay (100 msec)</td>
+                        <td><button id="shortStatus" onclick="toggle('short')">off</button></td>
+                        <td><textarea class="output" id="shortOutput"></textarea></td>
+                    </tr>
+                    <tr>
+                        <td>tolerant (6 pixels)</td>
+                        <td><button id="tolerantStatus" onclick="toggle('tolerant')">off</button></td>
+                        <td><textarea class="output" id="tolerantOutput"></textarea></td>
+                    </tr>
+                    <tr>
+                        <td>untolerant (1 pixel)</td>
+                        <td><button id="untolerantStatus" onclick="toggle('untolerant')">off</button></td>
+                        <td><textarea class="output" id="untolerantOutput"></textarea></td>
+                    </tr>
+                    <tr>
+                        <td>stop propagation</td>
+                        <td><button id="stoppropagStatus" onclick="toggle('stoppropag')">off</button></td>
+                        <td><textarea class="output" id="stoppropagOutput"></textarea></td>
+                    </tr>
+                </tbody>
+            </table>
+        </div>
+    </body>
+</html>

examples/image-layer.html

@@ -1,12 +1,14 @@
 <html xmlns="http://www.w3.org/1999/xhtml">
   <head>
+      <title>OpenLayers Image Layer Example</title>
+    <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
     <style type="text/css">
         p {
             width: 512px;
         }
         #map {
             width: 512px;
-            height: 256px;
+            height: 512px;
             border: 1px solid gray;
         }
     </style>
@@ -26,8 +28,8 @@
                                 options);
 
             var jpl_wms = new OpenLayers.Layer.WMS( "NASA Global Mosaic",
-                "http://wms.jpl.nasa.gov/wms.cgi", 
-                {layers: "modis,global_mosaic"}, options);
+                "http://t1.hypercube.telascience.org/cgi-bin/landsat7", 
+                {layers: "landsat7"}, options);
 
             map.addLayers([graphic, jpl_wms]);
             map.addControl(new OpenLayers.Control.LayerSwitcher());
@@ -36,8 +38,17 @@
     </script>
   </head>
   <body onload="init()">
-    <h1>OpenLayers Image Layer Example</h1>
+    <h1 id="title">Image Layer Example</h1>
+
+    <div id="tags"></div>
+
+    <p id="shortdesc">
+        Demonstrate a single non-tiled image as a selectable base layer.
+    </p>
+
     <div id="map"></div>
+
+    <div id="docs">
         <p>
             The "City Lights" layer above is created from a single web accessible
             image.  If you construct it without any resolution related options,
@@ -46,5 +57,6 @@
             intended to be used in an overview map - where another layer type
             might not make a good overview.
         </p>
+    </div>
   </body>
 </html>

examples/intersects.html

@@ -0,0 +1,179 @@
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <title>Geometry Intersections</title>
+    <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
+    <style type="text/css">
+        html, body {
+            margin: 0;
+            padding: 1em;
+            font: 0.9em Verdana, Arial, sans serif;
+        }
+        input, select, textarea {
+            font: 0.9em Verdana, Arial, sans-serif;
+        }
+        h2 {
+            margin-top: 0.75em;
+            font-size: 1.6em;
+        }
+        #leftcol {
+            position: absolute;
+            top: 0;
+            left: 1em;
+            padding: 0;
+            width: 455px;
+        }
+        #map {
+            width: 450px;
+            height: 225px;
+            border: 1px solid #ccc;
+        }
+        #input {
+            width: 450px;
+        }
+        #text {
+            font-size: 0.85em;
+            margin: 1em 0 1em 0;
+            width: 100%;
+            height: 10em;
+        }
+        #info {
+            position: relative;
+            padding: 2em 0;
+            margin-left: 470px;
+        }
+        #features {
+            font-size: 0.8em;
+            width: 100%;
+            height: 200px;
+        }
+        #intersections {
+            font-size: 0.8em;
+            width: 100%;
+            height: 200px;
+        }
+        p {
+            margin: 0;
+            padding: 0.75em 0 0.75em 0;
+        }
+    </style>
+    <script src="../lib/Firebug/firebug.js"></script>
+    <script src="../lib/OpenLayers.js"></script>
+    <script type="text/javascript">
+        var map, vectors, geojson;
+        function init(){
+            map = new OpenLayers.Map('map');
+            vectors = new OpenLayers.Layer.Vector(
+                "Vector Layer",
+                {isBaseLayer: true}
+            );
+
+            map.addLayers([vectors]);
+            map.addControl(new OpenLayers.Control.MousePosition());
+            
+            var panel = new OpenLayers.Control.EditingToolbar(vectors);
+            map.addControl(panel);
+
+            geojson = new OpenLayers.Format.GeoJSON();
+            
+            map.setCenter(new OpenLayers.LonLat(0, 0), 1);
+        }
+        
+        function serialize() {
+            var str = geojson.write(vectors.features, true);
+            document.getElementById('features').value = str;
+        }
+
+        function deserialize() {
+            var element = document.getElementById('text');
+            var features = geojson.read(element.value);
+            var bounds;
+            if(features) {
+                if(features.constructor != Array) {
+                    features = [features];
+                }
+                for(var i=0; i<features.length; ++i) {
+                    if (!bounds) {
+                        bounds = features[i].geometry.getBounds();
+                    } else {
+                        bounds.extend(features[i].geometry.getBounds());
+                    }
+                    
+                }
+                vectors.addFeatures(features);
+                map.zoomToExtent(bounds);
+                var plural = (features.length > 1) ? 's' : '';
+                element.value = features.length + ' feature' + plural + ' added'
+            } else {
+                element.value = 'Bad input';
+            }
+        }
+        
+        function intersect() {
+            var features = vectors.features;
+            var feat1, feat2, intersects12, intersects21;
+            var parts = [];
+            // reset attributes
+            for(var i=0; i<features.length; ++i) {
+                features[i].attributes.intersectsWith = [];
+            }
+            for(var i=0; i<features.length-1; ++i) {
+                feat1 = features[i];
+                for(var j=i+1; j<features.length; ++j) {
+                    feat2 = features[j];
+                    intersects12 = feat1.geometry.intersects(feat2.geometry);
+                    if(intersects12) {
+                        feat1.attributes.intersectsWith.push("f" + j);
+                        parts.push("f" + i + " intersects f" + j + "\n");
+                    }
+                    intersects21 = feat2.geometry.intersects(feat1.geometry);
+                    if(intersects21) {
+                        feat2.attributes.intersectsWith.push("f" + i);
+                        parts.push("f" + j + " intersects f" +  i + "\n");
+                    }
+                    if(intersects12 != intersects21) {
+                        parts.push("trouble with " + i + " and " + j + "\n");
+                    }
+                }
+            }
+            if(parts.length > 0) {
+                document.getElementById("intersections").value = parts.join("");
+            } else {
+                document.getElementById("intersections").value = "no intersections";
+            }
+        }
+
+        // preload images
+        (function() {
+            var roots = ["draw_point", "draw_line", "draw_polygon", "pan"];
+            var onImages = [];
+            var offImages = [];
+            for(var i=0; i<roots.length; ++i) {
+                onImages[i] = new Image();
+                onImages[i].src = "../theme/default/img/" + roots[i] + "_on.png";
+                offImages[i] = new Image();
+                offImages[i].src = "../theme/default/img/" + roots[i] + "_on.png";
+            }
+        })();
+
+    </script>
+  </head>
+  <body onload="init()">
+    <div id="leftcol">
+        <h2>OpenLayers Geometry Intersection Example</h2>
+        <div id="map"></div>
+        <div id="input">
+            <textarea id="text"></textarea> 
+            <input type="button" value="add feature" onclick="deserialize();" />
+            <span id="selected"></span>
+        </div>
+    </div>
+    <div id="info">
+        Features
+        <input type="button" value="refresh" onclick="serialize();" /><br />
+        <textarea id="features"></textarea>
+        Intersections
+        <input type="button" value="intersect all" onclick="intersect();" /><br />
+        <textarea id="intersections"></textarea>
+    </div>
+  </body>
+</html>

examples/kamap.html

@@ -1,9 +1,11 @@
 <html xmlns="http://www.w3.org/1999/xhtml">
   <head>
+      <title>OpenLayers KaMap Example</title>
+    <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
     <style type="text/css">
         #map {
-            width: 800px;
-            height: 475px;
+            width: 512px;
+            height: 512px;
             border: 1px solid black;
         }
     </style>
@@ -28,7 +30,16 @@
     </script>
   </head>
   <body onload="init()">
-    <h1>OpenLayers Example</h1>
+    <h1 id="title">KaMap Example</h1>
+
+    <div id="tags"></div>
+
+    <p id="shortdesc">
+        Demonstrate a tiled kamap layer as the base map, which can be pre-cached for higher performance.
+    </p>
+
     <div id="map"></div>
+
+    <div id="docs"></div>
   </body>
 </html>

examples/kml-layer-linestring.html

@@ -1,30 +0,0 @@
-<html xmlns="http://www.w3.org/1999/xhtml">
-  <head>
-    <style type="text/css">
-        #map {
-            width: 800px;
-            height: 475px;
-            border: 1px solid black;
-        }
-    </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", "kml/lines.kml", {format: OpenLayers.Format.KML}));
-            map.zoomToExtent(new OpenLayers.Bounds(-112.292744,36.068477,-112.22408,36.109246));
-        }
-    </script>
-  </head>
-  <body onload="init()">
-    <div id="map"></div>
-  </body>
-</html>

examples/kml-layer.html

@@ -1,9 +1,10 @@
 <html xmlns="http://www.w3.org/1999/xhtml">
   <head>
+    <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
     <style type="text/css">
         #map {
-            width: 800px;
-            height: 475px;
+            width: 512px;
+            height: 512px;
             border: 1px solid black;
         }
     </style>
@@ -19,12 +20,29 @@
             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", "kml/mc-search.kml", {format: OpenLayers.Format.KML}));
-            map.zoomToMaxExtent();
+            map.addLayer(new OpenLayers.Layer.GML("KML", "kml/lines.kml", 
+               {
+                format: OpenLayers.Format.KML, 
+                formatOptions: {
+                  extractStyles: true, 
+                  extractAttributes: true
+                }
+               }));
+            map.zoomToExtent(new OpenLayers.Bounds(-112.306698,36.017792,-112.03204,36.18087));
         }
     </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>

examples/layer-opacity.html

@@ -1,12 +1,14 @@
 <html xmlns="http://www.w3.org/1999/xhtml">
   <head>
+      <title>OpenLayers Layer Opacity Example</title>
+    <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
     <style type="text/css">
         body {
             font-family: sans-serif;
         }
         #map {
             width: 512px;
-            height: 350px;
+            height: 512px;
             border: 1px solid lightgray;
         }
         p {
@@ -47,29 +49,35 @@
         }
         function init(){
             var options = {
-                projection: "EPSG:26912",
-                units: 'm',
-                maxExtent: new OpenLayers.Bounds(455402, 4967657, 473295, 4984095),
-                maxResolution: 'auto',
-                maxZoomLevel: 8
+                maxExtent: new OpenLayers.Bounds(-110.994, 45.885, -110.950, 45.929),
+                maxResolution: "auto"
             };
             map = new OpenLayers.Map('map', options);
             var drg = new OpenLayers.Layer.WMS("Topo Maps",
                 "http://terraservice.net/ogcmap.ashx",
                 {layers: "DRG"});
             shade = new OpenLayers.Layer.WMS("Shaded Relief",
-                "http://ims.cr.usgs.gov/servlet19/com.esri.wms.Esrimap/USGS_EDC_Elev_NED_3", 
+                "http://gisdata.usgs.gov/wmsconnector/com.esri.wms.Esrimap?ServiceName=USGS_EDC_Elev_NED_3",
                 {layers: "HR-NED.IMAGE", reaspect: "false", transparent: 'true'},
                 {isBaseLayer: false, opacity: 0.3});
             map.addLayers([drg, shade]);
             map.addControl(new OpenLayers.Control.LayerSwitcher());
-            map.setCenter(new OpenLayers.LonLat(464348.5,4975876), 1);
+            map.zoomToMaxExtent();
         }
     </script>
   </head>
   <body onload="init()">
-    <h2>OpenLayers Layer Opacity Example</h2>
+    <h1 id="title">Layer Opacity Example</h1>
+
+    <div id="tags"></div>
+
+    <p id="shortdesc">
+        Demonstrate a change in the opacity for an overlay layer.
+    </p>
+
     <div id="map"></div>
+
+    <div id="docs">
         <p>
             Note that if you also have the setOpacity method defined on the Layer
             class, you can tweak the layer opacity after it has been added to the map.
@@ -80,5 +88,6 @@
             <a title="increase opacity" href="javascript: changeOpacity(0.1);">&gt;&gt;</a>
         </p>
         <p class="note">IE users: Wait until the shade layer has finished loading to try this.</p>
+    </div>
   </body>
 </html>

examples/layerLoadMonitoring.html

@@ -1,18 +1,19 @@
 <html xmlns="http://www.w3.org/1999/xhtml">
   <head>
+      <title>OpenLayers Layer Load Monitoring Example</title>
+    <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
     <style type="text/css">
         #map {
-            position: absolute;
-            top: 5px;
-            left: 5px;
-            width: 450px;
-            height: 475px;
+            width: 512px;
+            height: 512px;
             border: 1px solid black;
         }
+        #controls {
+            float: left;
+            text-align: right;
+        }
         #eventsLogID {
-            position: absolute;
-            top: 5px;
-            left: 460px;
+            text-align: left;
             width: 350px;
             height: 475px;
             overflow: auto;
@@ -108,14 +109,25 @@
     </script>
   </head>
   <body onload="init()">
-    <div id="map"></div>
+      <h1 id="title">Layer Load Monitoring Example</h1>
+
+      <div id="tags"></div>
+
+      <p id="shortdesc">
+          Demonstrate a method for monitoring tile loading performance.
+      </p>
+
+    <div id="map" style="float:left;"></div>
+
     <div id="controls">
         <div id="eventsLogID">
             <b>Events Log:</b>
         </div>
+
+        <input type="button" value="Clear" onclick="clearLog()"/>
     </div>
-    <div style="position:absolute; top: 500px; width: 700px">
-        <input type="button" value="Clear" style="float:right" onclick="clearLog()"/>
+
+    <div id="docs">
     </div>
   </body>
 </html>

examples/layerswitcher.html

@@ -1,5 +1,7 @@
 <html xmlns="http://www.w3.org/1999/xhtml">
   <head>
+      <title>OpenLayers Layer Switcher Example</title>
+    <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
     <style type="text/css">
         #map {
             width: 512px;
@@ -12,6 +14,7 @@
         var map;
         function init(){
             map = new OpenLayers.Map('map', { controls: [] });
+            map.addControl(new OpenLayers.Control.Navigation());
 
             map.addControl(new OpenLayers.Control.LayerSwitcher({'div':OpenLayers.Util.getElement('layerswitcher')}));
 
@@ -20,8 +23,8 @@
                 {layers: 'basic'}, {'displayInLayerSwitcher':false} );
 
             var jpl_wms = new OpenLayers.Layer.WMS( "NASA Global Mosaic",
-                "http://wms.jpl.nasa.gov/wms.cgi", 
-                {layers: "modis,global_mosaic"}, {'isBaseLayer': false});
+                "http://t1.hypercube.telascience.org/cgi-bin/landsat7", 
+                {layers: "landsat7"}, {'isBaseLayer': false});
 
             var dm_wms = new OpenLayers.Layer.WMS( "DM Solutions Demo",
                 "http://www2.dmsolutions.ca/cgi-bin/mswms_gmap",
@@ -38,7 +41,15 @@
     </script>
   </head>
   <body onload="init()">
-    <h1>OpenLayers Example</h1>
+    <h1 id="title">Layer Switcher Example</h1>
+
+    <div id="tags">
+    </div>
+
+    <p id="shortdesc">
+        Demonstrates the use of the LayerSwitcher outside of the OpenLayers window.
+    </p>
+
     <div id="layerswitcher" style="float:right; width: 20em;"></div>
     <div id="map"></div>
     <div id="docs">

examples/lite.html

@@ -1,30 +1,38 @@
 <html xmlns="http://www.w3.org/1999/xhtml">
   <head>
+    <title>OpenLayers Basic Single WMS Example</title>
+    <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
     <style type="text/css">
         #map {
-            width: 800px;
-            height: 475px;
+            width: 512px;
+            height: 512px;
             border: 1px solid black;
         }
     </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.setCenter(new OpenLayers.LonLat(lon, lat), zoom);
+            map.zoomToMaxExtent();
         }
     </script>
   </head>
   <body onload="init()">
+    <h1 id="title">Basic Single WMS Example</h1>
+
+    <div id="tags"></div>
+
+    <div id="shortdesc">Show a Simple Map</div>
+
     <div id="map"></div>
+
+    <div id="docs">
+        This example shows a very simple layout with minimal controls.  This example uses a single WMS base layer.
+    </div>
   </body>
 </html>

examples/mapguide.html

@@ -0,0 +1,110 @@
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <style type="text/css">
+        #map {
+            width: 400px;
+            height: 400px;
+            border: 1px solid black;
+            float:left;
+        }
+        #map2 {
+            width: 400px;
+            height: 400px;
+            border: 1px solid black;
+            float:left;
+        }
+    </style>
+    <script src="../lib/OpenLayers.js"></script>
+    <script type="text/javascript">
+    
+        var map, layer;
+        var url = "http://demo01.dmsolutions.ca/mapguide/mapagent/mapagent.fcgi";
+        //you can use this URL when MapGuide OS is installed locally
+        //var url = "/mapguide/mapagent/mapagent.fcgi";
+        
+        //tiled version
+        function initTiled(){
+        
+            OpenLayers.DOTS_PER_INCH = 96;
+            var extent = new OpenLayers.Bounds(-3631568.75,-1293815.5,4491139.5833333321,4937122);
+            var tempScales = [50000000,23207944.16806,10772173.45016,5000000,2320794.41681,1077217.34502,500000,232079.44168,107721.7345,50000];
+            var mapOptions = {
+                maxExtent: extent, 
+                scales: tempScales,
+                units: 'm',
+                projection: 'EPSG:42304'
+            };
+            map = new OpenLayers.Map( 'map', mapOptions );
+            
+            var params = {
+              mapdefinition: 'Library://Samples/Gmap/Maps/gmapTiled.MapDefinition',
+              basemaplayergroupname: "BaseLayerGroup"
+            }
+            var options = {
+              singleTile: false 
+            }
+            var layer = new OpenLayers.Layer.MapGuide( "MapGuide OS tiled layer", url, params, options );
+            map.addLayer(layer);
+            
+            map.zoomToMaxExtent();
+        }
+
+        //un-tiled version
+        function initUntiled() {
+        
+          OpenLayers.DOTS_PER_INCH = 96;
+          var extent = new OpenLayers.Bounds(-87.865114442365922,43.665065564837931,-87.595394059497067,43.823852564430069);
+          var mapOptions = {
+                maxExtent: extent, 
+                maxResolution: 'auto'
+          };
+          map = new OpenLayers.Map( 'map2', mapOptions );
+            
+          var options = {
+              buffer: 1,
+              singleTile: true
+          };
+          
+          var params = {
+              mapdefinition: 'Library://Samples/Sheboygan/Maps/Sheboygan.MapDefinition'
+          };
+          /*
+                    The MapGuide layer can also be created using mapname and session as follows provided there
+                    is some wrapper code to obtain a valid session id and mapname
+          var params = {
+              mapname: 'Sheboygan47b3560bf1071',
+              session: '043bb716-0000-1000-8000-0017a4e6ff5d_en_7F0000010AFC0AFB0AFA'
+          };
+          */
+          var layer = new OpenLayers.Layer.MapGuide( "MapGuide OS untiled baselayer", url, params, options );
+          map.addLayer(layer);
+          
+          //this is how to set up the layer for transparent overlays.  Requires a valid session ID 
+          //and mapName stored in that session.
+          //If the mapagent URL is on a different server than this OL layer, the OpenLayers proxy script
+          //must be used since this layer must perform an additional AJAX request before requesting the
+          //map  image
+          /* 
+            var options = {
+              isBaseLayer: false,
+              transparent: true,
+              buffer: 1,
+              singleTile: true
+            };
+            var params = {
+              mapName: 'Sheboygan',
+              session: '0b8cb80e-0000-1000-8003-0017a4e6ff5d_en_C0A802AD0AFC0AFB0AFA',
+            };
+            layer = new OpenLayers.Layer.MapGuide( "MapGuide OS Overlay layer", url, params, options );
+            map.addLayer(layer);
+          */ 
+          map.zoomToMaxExtent();
+    }
+    </script>
+  </head>
+  <body onload="initUntiled(); initTiled()">
+    <p>If prompted for a password, username is Anonymous and an empty password</p>
+    <div id="map"></div>
+    <div id="map2"></div>
+  </body>
+</html>

examples/mapserver.html

@@ -1,5 +1,7 @@
 <html xmlns="http://www.w3.org/1999/xhtml">
   <head>
+    <title>MapServer Layer</title>
+    <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
     <style type="text/css">
         #map {
             width: 800px;
@@ -28,6 +30,12 @@
     </script>
   </head>
   <body onload="init()">
+    <div id="title">MapServer Layer</div>
+    <div id="tags"></div>
+    <div id="shortdesc">Shows MapServer Layer</div>
     <div id="map"></div>
+    <div id="docs">
+        This is an example of using a MapServer Layer with a gutter parameter.  The gutter parameter is used to try to limit the edge effects between tiles.
+    </div>
   </body>
 </html>

examples/mapserver_untiled.html

@@ -1,5 +1,7 @@
 <html xmlns="http://www.w3.org/1999/xhtml">
   <head>
+    <title>MapServer Single Tile Mode</title>
+    <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
     <style type="text/css">
         #map {
             width: 100%;
@@ -21,6 +23,12 @@
     </script>
   </head>
   <body>
+    <div id="title">MapServer Single Tile Mode</div>
+    <div id="tags"></div>
+    <div id="shortdesc">Shows single tile MapServer Layer</div>
     <div id="map"></div>
+    <div id="docs">
+        This shows an example of using a MapServer Layer in single tile mode.  Single tile mode can be useful when pulling data from dynamic sources.
+    </div>
   </body>
 </html>

examples/markerResize.html

@@ -1,5 +1,7 @@
 <html xmlns="http://www.w3.org/1999/xhtml">
   <head>
+    <title>Resize a Marker</title>
+    <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
     <style type="text/css">
         #map {
             width: 512px;
@@ -43,8 +45,13 @@
     </script>
   </head>
   <body onload="init()">
-    <h1>OpenLayers Example</h1>
+    <div id="title">Resize a Marker</div>
+    <div id="tags"></div>
+    <div id="shortdesc">Dynamically resize a marker</div>
     <div id="map"></div>
+    <div id="docs">
+        This example shows how to create a OpenLayers.Layer.Markers layer, add an icon, put it into a marker, and add the marker to the layer.  Once the marker has been added it is possible to use setSize() on the icon in order to resize the marker.
+    </div>
     <div style="background-color:purple" onclick="resize()"> click to resize marker</div>
   </body>
 </html>

examples/markers.html

@@ -1,5 +1,7 @@
 <html xmlns="http://www.w3.org/1999/xhtml">
   <head>
+    <title>Markers Layer Example</title>
+    <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
     <style type="text/css">
         #map {
             width: 512px;
@@ -46,7 +48,12 @@
     </script>
   </head>
   <body onload="init()">
-    <h1>OpenLayers Example</h1>
+    <div id="title">Markers Layer Example</div>
+    <div id="tags"></div>
+    <div id="shortdesc">Show markers layer with different markers</div>
     <div id="map"></div>
+    <div id="docs">
+        This is an example of an OpenLayers.Layers.Markers layer that shows some examples of adding markers.  Also demonstrated is registering a mousedown effect on a marker.
+    </div>
   </body>
 </html>

examples/markersTextLayer.html

@@ -1,5 +1,7 @@
 <html xmlns="http://www.w3.org/1999/xhtml">
   <head>
+    <title>Using a Layer.Text to display markers</title>
+    <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
     <style type="text/css">
         #map {
             width: 512px;
@@ -28,7 +30,11 @@
     </script>
   </head>
   <body onload="init()">
-    <h1>OpenLayers Example</h1>
+    <h1 id="title">Using a Layer.Text to display markers</h1>
+    <p id="shortdesc">
+      The Layer.Text class reads a Tab seperated values file and displays it as markers on
+      the map.
+    </p>  
     <div id="map"></div>
   </body>
 </html>

examples/mm.html

@@ -1,5 +1,7 @@
 <html xmlns="http://www.w3.org/1999/xhtml">
   <head>
+    <title>MultiMap</title>
+    <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
     <style type="text/css">
         #map {
             width: 100%;
@@ -46,7 +48,10 @@
     </script>
   </head>
   <body onload="init()">
-    <h1>OpenLayers MultiMap Example</h1>
+    <h1 id="title">MultiMap Example</h1>
+    <p id="shortdesc">
+      An example of using the Layer.MultiMap class.
+    </p>  
     <div id="map"></div>
     <div style="background-color:green" onclick="add()"> click to add the marker to the map</div>
     <div style="background-color:red" onclick="remove()"> click to remove the marker from the map</div>

examples/modify-feature.html

@@ -1,6 +1,7 @@
 <html xmlns="http://www.w3.org/1999/xhtml">
   <head>
     <title>Modify Feature</title>
+    <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
     <style type="text/css">
         #map {
             width: 512px;
@@ -53,6 +54,9 @@
                             OpenLayers.Handler.Path),
                 polygon: new OpenLayers.Control.DrawFeature(vectors,
                             OpenLayers.Handler.Polygon),
+                regular: new OpenLayers.Control.DrawFeature(vectors,
+                            OpenLayers.Handler.RegularPolygon,
+                            {handlerOptions: {sides: 5}}),
                 modify: new OpenLayers.Control.ModifyFeature(vectors,
                                                              modifyOptions)
             };
@@ -65,6 +69,32 @@
             document.getElementById('noneToggle').checked = true;
         }
         
+        function update() {
+            // reset modification mode
+            controls.modify.mode = OpenLayers.Control.ModifyFeature.RESHAPE;
+            var rotate = document.getElementById("rotate").checked;
+            if(rotate) {
+                controls.modify.mode |= OpenLayers.Control.ModifyFeature.ROTATE;
+            }
+            var resize = document.getElementById("resize").checked;
+            if(resize) {
+                controls.modify.mode |= OpenLayers.Control.ModifyFeature.RESIZE;
+            }
+            var drag = document.getElementById("drag").checked;
+            if(drag) {
+                controls.modify.mode |= OpenLayers.Control.ModifyFeature.DRAG;
+            }
+            // disable reshape mode if at least one of modes rotate, resize,
+            // drag is enabled
+            if (rotate || resize || drag) {
+                controls.modify.mode &= ~OpenLayers.Control.ModifyFeature.RESHAPE;
+            }
+            var sides = parseInt(document.getElementById("sides").value);
+            sides = Math.max(3, isNaN(sides) ? 0 : sides);
+            controls.regular.handler.sides = sides;
+            var irregular =  document.getElementById("irregular").checked;
+            controls.regular.handler.irregular = irregular;
+        }
 
         function toggleControl(element) {
             for(key in controls) {
@@ -80,7 +110,8 @@
     </script>
   </head>
   <body onload="init()">
-    <h3>OpenLayers Modify Feature Example</h3>
+    <h3 id="title">OpenLayers Modify Feature Example</h3>
+    <div id="shortdesc">A demonstration of the ModifyFeature control for editing vector features.</div>
     <div id="map"></div>
     <div id="controls">
         <ul id="controlToggle">
@@ -101,10 +132,41 @@
                 <input type="radio" name="type" value="polygon" id="polygonToggle" onclick="toggleControl(this);" />
                 <label for="polygonToggle">draw polygon</label>
             </li>
+            <li>
+                <input type="radio" name="type" value="regular" id="regularToggle" onclick="toggleControl(this);" />
+                <label for="regularToggle">draw regular polygon</label>
+                <label for="sides"> - sides</label>
+                <input id="sides" type="text" size="2" maxlength="2"
+                       name="sides" value="5" onchange="update()" />
+                <ul>
+                    <li>
+                        <input id="irregular" type="checkbox"
+                               name="irregular" onchange="update()" />
+                        <label for="irregular">irregular</label>
+                    </li>
+                </ul>
+            </li>
             <li>
                 <input type="radio" name="type" value="modify" id="modifyToggle"
                        onclick="toggleControl(this);" />
                 <label for="modifyToggle">modify feature</label>
+                <ul>
+                    <li>
+                        <input id="rotate" type="checkbox"
+                               name="rotate" onchange="update()" />
+                        <label for="rotate">allow rotation</label>
+                    </li>
+                    <li>
+                        <input id="resize" type="checkbox"
+                               name="resize" onchange="update()" />
+                        <label for="resize">allow resizing</label>
+                    </li>
+                    <li>
+                        <input id="drag" type="checkbox"
+                               name="drag" onchange="update()" />
+                        <label for="drag">allow dragging</label>
+                    </li>
+                </ul>
             </li>
         </ul>
     </div>

examples/mouse-position.html

@@ -2,6 +2,8 @@
   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 <html xmlns="http://www.w3.org/1999/xhtml" debug="true">
   <head>
+    <title>MousePosition Control</title>
+    <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
     <style type="text/css">
         body {
             margin: 0;
@@ -35,6 +37,11 @@
     </script>
   </head>
   <body onload="init()">
+    <h3 id="title">MousePosition Control</h3>
+    <p id="shortdesc">
+      Use the MousePosition Control to display the coordinates of the cursor
+      inside or outside the map div.
+    </p>  
     <div id="map"></div>
     <div id="coords"></div>
     <p>Moving your mouse to the upper left corner of this map should return 'x=0,y=0' -- in the past, it didn't in IE. If it returns 2,2, consider it a bug, and report it.</p> 

examples/multimap-mercator.html

@@ -1,5 +1,7 @@
 <html xmlns="http://www.w3.org/1999/xhtml">
   <head>
+    <title>MultiMap SphericalMercator</title>
+    <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
     <style type="text/css">
         #map {
             width: 100%;
@@ -51,7 +53,12 @@
     </script>
   </head>
   <body onload="init()">
-    <h3>OpenLayers MultiMap Mercator Example</h3>
+    <h3 id="title">MultiMap Mercator Example</h3>
+    <p id="shortdesc">
+      This sphericalMercator example using multimap demonstrates that the
+      multimap layer does not fully support the sphericalMercator projection at
+      this time.
+    </p>  
     <div id="map"></div>
   </body>
 </html>

examples/multiserver.html

@@ -1,5 +1,6 @@
 <html xmlns="http://www.w3.org/1999/xhtml">
   <head>
+    <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
     <style type="text/css">
         #map {
             width: 800px;
@@ -28,6 +29,18 @@
     </script>
   </head>
   <body onload="init()">
+    <h1 id="title">Multiple Server URLS</h1>
+
+  <div id="tags">
+  </div>
+  <p id="shortdesc">
+      Load your tiles faster by pointing to the same server, but with different urls
+  </p>
+
     <div id="map"></div>
+    <div id="docs">
+    Browsers typically limit the number of concurrent requests to the same server, based on hostname. In order to ake tiles load more quickly, it often makes sense to distribute requests over multiple hostnames to achieve more concurrency. Typically, browsers perform best with 3 different hostnames -- your performance may vary. (For example, if your server can't handle more than 2 requests simultaneously, then additional hostnames will not help you.)    
+   </div>
+   
   </body>
 </html>

examples/mvs.html

@@ -88,10 +88,10 @@ function runMVS() {
             case 'nasa': 
                 theMVS.addLayer(
                     new OpenLayers.Layer.WMS("NASA Mosaic", 
-                       "http://wms.jpl.nasa.gov/wms.cgi",
+                       "http://t1.hypercube.telascience.org/cgi-bin/landsat7",
                        {"EXCEPTIONS" : "application/vnd.ogc.se_inimage",
                         "format" : "image/jpeg",
-                        layers:"modis,global_mosaic"}
+                        layers:"landsat7"}
                        ));
                 break;
             case 'gmaps':

examples/navigation-control.html

@@ -0,0 +1,40 @@
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <title>OpenLayers Navigation Control</title>
+    <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
+    <style type="text/css">
+        #map {
+            width: 512px;
+            height: 512px;
+            border: 1px solid black;
+        }
+    </style>
+    <script src="../lib/OpenLayers.js"></script>
+    <script type="text/javascript">
+        var map, layer;
+        function init(){
+            map = new OpenLayers.Map( 'map', { controls: [] });
+            layer = new OpenLayers.Layer.WMS( "OpenLayers WMS",
+                    "http://labs.metacarta.com/wms/vmap0",
+                    {layers: 'basic'} );
+            map.addLayer(layer);
+            nav = new OpenLayers.Control.Navigation({'zoomWheelEnabled': false});
+            map.addControl(nav);
+            map.zoomToMaxExtent();
+        }
+    </script>
+  </head>
+  <body onload="init()">
+    <h1 id="title">Navigation Control</h1>
+
+    <div id="tags"></div>
+
+    <div id="shortdesc">Demonstrate Navigation Control features</div>
+
+    <div id="map"></div>
+    <a href="#" onclick="nav.enableZoomWheel();return false">Turn on Wheel Zoom</a> | <a href="#" onclick="nav.disableZoomWheel(); return false;">Turn off Wheel Zoom</a>
+    <div id="docs">
+        This example demonstrates a couple features of the Navigation control. The Navigation control controls most map dragging, movement, zooming, etc. In this case, we have a demonstration of how to create a navigation control with no zoom wheel action, which can then be enabled or disabled by the user.
+    </div>
+  </body>
+</html>

examples/navigation-history.html

@@ -0,0 +1,75 @@
+<html xmlns="http://www.w3.org/1999/xhtml">
+    <head>
+        <title>OpenLayers Navigation History Example</title>
+        <style type="text/css">
+            #map {
+                width: 512px;
+                height: 256px;
+                border: 1px solid gray;
+            }
+            #panel {
+                right: 0px;
+                height: 30px; 
+                width: 200px;
+            }
+            #panel div { 
+                float: left;
+                margin: 5px;
+            }
+                
+        </style>
+        <script src="../lib/OpenLayers.js"></script>
+        <script type="text/javascript">
+            var map, nav, panel;
+
+            // preload images if you care
+            var preload = [
+                "../theme/default/img/view_previous_on.png",
+                "../theme/default/img/view_next_on.png"
+            ];
+            var img = new Array(preload.length);
+            for(var i=0; i<preload.length; ++i) {
+                img[i] = new Image();
+                img[i].src = preload[i];
+            }
+            
+            function init(){
+                map = new OpenLayers.Map('map');
+
+                nav = new OpenLayers.Control.NavigationHistory();
+                // parent control must be added to the map
+                map.addControl(nav);
+
+                panel = new OpenLayers.Control.Panel(
+                    {div: document.getElementById("panel")}
+                );
+                panel.addControls([nav.next, nav.previous]);
+                map.addControl(panel);
+                
+                var layer = new OpenLayers.Layer.WMS(
+                    "OpenLayers WMS",
+                    "http://labs.metacarta.com/wms/vmap0",
+                    {layers: 'basic'}
+                );
+                map.addLayer(layer);
+                map.zoomToMaxExtent();
+
+
+            }
+        </script>
+    </head>
+    <body onload="init()">
+        <h1 id="title">Map Navigation History Example</h1>
+
+        <div id="tags">
+        </div>
+
+        <p id="shortdesc">
+            A control for zooming to previous and next map extents.
+        </p>
+
+        <div id="map"></div>
+        Map navigation history controls<div id="panel"></div>
+        <div id="docs"></div>
+    </body>
+</html>

examples/navtoolbar.html

@@ -1,5 +1,6 @@
 <html xmlns="http://www.w3.org/1999/xhtml">
   <head>
+    <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
     <style type="text/css">
         #map {
             width: 800px;
@@ -9,6 +10,7 @@
         }
         
     </style>
+    <title>NavToolbar Demo</title>
     <script src="../lib/OpenLayers.js"></script>
     <script type="text/javascript">
         var lon = 5;
@@ -16,7 +18,7 @@
         var zoom = 5;
         var map, layer;
 
-        function init(){
+        function init() {
             map = new OpenLayers.Map( 'map', { controls: [new OpenLayers.Control.PanZoom()] } );
             layer = new OpenLayers.Layer.WMS( "OpenLayers WMS", 
                     "http://labs.metacarta.com/wms/vmap0", {layers: 'basic'} );
@@ -30,6 +32,11 @@
     </script>
   </head>
   <body onload="init()">
+    <h3 id="title">NavToolbar Demo</h3>
+    <p id="shortdesc">
+       Demo the NavToolbar, a subclass of Control.Panel which shows icons for
+       navigation.
+    </p> 
     <div id="map"></div>
   </body>
 </html>

examples/notile.html

@@ -1,5 +1,6 @@
 <html xmlns="http://www.w3.org/1999/xhtml">
   <head>
+    <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
     <style type="text/css">
         #mapDiv {
             width: 400px;
@@ -29,7 +30,11 @@
     </script>
   </head>
   <body onload="init()">
-    <h1>OpenLayers Example</h1>
+    <h1 id="title">Untiled Example</h1>
+    <p id="shortdesc">
+      Create an untiled WMS layer using the singleTile: true, option or the deprecated
+      WMS.Untiled layer.
+    </p>  
     <div id="mapDiv"></div>
     <p> The first layer is an old OpenLayers.Layer.WMS.Untiled layer, using 
         a default ratio value of 1.5.

examples/openmnnd.html

@@ -1,5 +1,6 @@
 <html xmlns="http://www.w3.org/1999/xhtml">
   <head>
+    <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
     <style type="text/css">
         #map {
             width: 600px;
@@ -27,12 +28,12 @@
 
             map.addLayer(wms);
 
-            wfs = new OpenLayers.Layer.WFS("Minnesota Streams (WFS)", wfs_url, {'typename':'streams'}, {ratio:1.25, minZoomLevel:4});
+            wfs = new OpenLayers.Layer.WFS("Minnesota Streams (WFS)", wfs_url, {'typename':'streams'}, {ratio:1.25, minZoomLevel:4, style: OpenLayers.Util.extend({}, OpenLayers.Feature.Vector.style['default'])});
 
             // preFeatureInsert can be used to set style before the feature is drawn
             wfs.preFeatureInsert= function(feature) { feature.style.strokeWidth="3"; feature.style.strokeColor="blue";
             }
-            wfs.onFeatureInsert = function() {
+            wfs.onFeatureInsert = function(feature) {
               OpenLayers.Util.getElement('stream_features').innerHTML = feature.layer.features.length;
             }
             map.addLayer(wfs);
@@ -56,7 +57,7 @@
             map.addLayer(pwfs);
 
             rstyle = OpenLayers.Util.extend({}, OpenLayers.Feature.Vector.style['default']);
-            OpenLayers.Util.extend(rstyle, {'strokeColor': 'white', strokeWIdth: "4"}); 
+            OpenLayers.Util.extend(rstyle, {'strokeColor': 'white', strokeWidth: "4"});
             rwfs = new OpenLayers.Layer.WFS("Minnesota Roads (WFS)", wfs_url, {'typename':'roads'},
               {ratio:1.25, minZoomLevel:7, extractAttributes: true, style:rstyle});
 
@@ -136,6 +137,26 @@
         </li>
     </ul>
     </div>
+    <p id="shortdesc">This example shows the use of a WFS service rendered using the OpenLayers vector library.</p>
     <div id="map"></div>
+    <div id="docs">
+            <p>
+            This is an example that shows rendering a WFS service using OpenLayer vectors in the browser. The OpenLayers code will download the GML
+            from the WFS service for each layer, parse it and create features using the OL vector library to draw the features on the map. For
+            more information on the vector library, please visit <a href="http://trac.openlayers.org/wiki/Documentation/VectorSupport">vector support wiki</a>.
+            In this example there are 4 layers shown on the map.  The base layer and parcel layer are created from a WMS serivce using the OpenLayers.Layer.WMS object.
+            The streams, roads, and plat layers are drawn from a WFS service using the OpenLayers.Layer.WFS object.
+            </p>
+
+            <p>
+            Rendering WFS layers into vectors is possible, but you need to be cautions when showing the features on the map.  Testing has shown that when
+            you renderer more than 200 vectors in the browser the performance decreases dramatically.  Also features that have a lot of vertices
+            can cause performance issues. In this example the parcel layer is rendered as a WMS layer because at the time of developing this example
+            there where a handful of features that had too many vertices to render without killing the browser resources.
+
+            There are a number of properties that can be set for each WFS layer, such color and line weight using style properties such as strokeColor and strokeWidth.
+            You can also get feature attributes from the WFS services using the extractAttribute property.  View the source to see the example code.
+            </p>
+    </div>
   </body>
 </html>

examples/osm-layer.html

@@ -0,0 +1,118 @@
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
+    <style type="text/css">
+        #map {
+            width: 70%;
+            height: 475px;
+            border: 1px solid black;
+        }
+    </style>
+    <script src="../lib/OpenLayers.js"></script>
+    <script type="text/javascript">
+        var lon = 5;
+        var lat = 40;
+        var zoom = 5;
+        var map, layer, gml;
+        function export_vectors() {
+            var x = new OpenLayers.Format.XML();
+            var content = x.write(gml.renderer.rendererRoot);
+            $("vectors").value = content;
+            $("vectors").style.display = "block";
+            $("vectorlink").href = "data:image/svg+xml," + escape(content);
+            $("vectorlink").style.display="block";
+        }
+        function on_feature_hover(feature) {
+            var text ="<ul>";
+            var type ="way";
+            if (feature.geometry.CLASS_NAME == "OpenLayers.Geometry.Point") {
+                type = "node";
+            }    
+            text += "<li>" + feature.osm_id + ": <a href='http://crschmidt.net/osm/attributes.html?type="+type+"&id="+feature.osm_id+"'>Edit</a>, <a href='http://www.openstreetmap.org/api/0.5/"+type + "/" + feature.osm_id + "'>API</a></li>";
+            for (var key in feature.attributes) {
+                text += "<li>" + key + ": " + feature.attributes[key] + "</li>";
+            }
+            text += "</ul>";
+            $("status").innerHTML = text;
+        }   
+        function clear_data() {
+            gml.destroyFeatures();
+        }
+        function new_data() {
+            if (!check_zoom()) { return; }
+            clear_data();
+            gml.loaded = false;
+            gml.url = "http://www.openstreetmap.org/api/0.5/map?bbox=" + map.getExtent().toBBOX();
+            $("status").innerHTML = "Loading more data...";
+            gml.loadGML();
+        }
+        function style_osm_feature(feature) {
+            feature.style = OpenLayers.Util.extend({'fill':'black'}, OpenLayers.Feature.Vector.style['default']);
+            if (feature.attributes.highway == "motorway") {
+                feature.style.strokeColor = "blue";
+                feature.style.strokeWidth = 5;
+            } else if (feature.attributes.highway == "primary") {
+                feature.style.strokeColor = "red";
+            } else if (feature.attributes.highway == "secondary") {
+                feature.style.strokeColor = "orange";
+            } else if (feature.attributes.highway) {
+                feature.style.strokeColor = "black";
+            }   
+        }
+        function check_zoom() { 
+            var zoom = map.getZoom();
+            if (zoom >= 11) { return true; }
+            if (zoom >= 9) { return confirm("Loading this amount of data may slow your browser. Are you sure you want to do this?"); }
+            $("status").innerHTML = "Area too large. Zoom in to load data. (Current zoom level: "+ zoom + ". Must be at zoom 9+.)";
+            return false;
+        }    
+        function init(){
+            OpenLayers.ProxyHost = "proxy.cgi?url=";
+            OpenLayers.Feature.Vector.style['default'].strokeWidth = 4;
+            OpenLayers.Feature.Vector.style['default'].cursor = 'pointer';
+            map = new OpenLayers.Map('map', {'maxResolution': 360/512/16, 'numZoomLevels':15, controls: [ new OpenLayers.Control.Navigation(), new OpenLayers.Control.PanZoomBar() ]});
+            map.addControl(new OpenLayers.Control.LayerSwitcher());
+            map.addControl(new OpenLayers.Control.Permalink());
+            layer = new OpenLayers.Layer.WMS( "OSM", 
+               [
+                 "http://t1.hypercube.telascience.org/tiles?",
+                 "http://t2.hypercube.telascience.org/tiles?",
+                 "http://t3.hypercube.telascience.org/tiles?",
+                 "http://t4.hypercube.telascience.org/tiles?"
+                 ], 
+                {layers: 'osm-4326', format: 'image/png' } );
+            map.addLayer(layer);
+            if (!map.getCenter()) { 
+                gml = new OpenLayers.Layer.GML("OSM", "osm/sutton_coldfield.osm", {format: OpenLayers.Format.OSM});
+                map.zoomToExtent(new OpenLayers.Bounds(-1.819072,52.549034,-1.814341,52.551582));
+            } else {
+                if (map.getZoom() >= 11) {
+                    gml = new OpenLayers.Layer.GML("OSM", "http://www.openstreetmap.org/api/0.5/map?bbox=" + map.getExtent().toBBOX(), {format: OpenLayers.Format.OSM});
+                } else {
+                    gml = new OpenLayers.Layer.GML("OSM", "xml/cambridgeport.osm", {format: OpenLayers.Format.OSM});
+                }    
+            }    
+            gml.events.register("loadstart", null, function() { $("status").innerHTML = "Loading..."; })
+            gml.events.register("loadend", null, function() { $("status").innerHTML = ""; })
+            map.addLayer(gml);
+            gml.preFeatureInsert = style_osm_feature; 
+            var sf = new OpenLayers.Control.SelectFeature(gml, {'onSelect': on_feature_hover});
+            map.addControl(sf);
+            sf.activate();
+        }
+    </script>
+  </head>
+  <body onload="init()">
+    <div style="width:28%; float:right" id="download">
+      <ul>
+       <li><a href="javascript:new_data();">Download current view</a></li>
+       <li><a href="javascript:clear_data();">Clear current data</a></li>
+       <li><a href="javascript:export_vectors();">Export Vector Data</a></li>
+      </ul>
+    <div id="status">Loading...</div>
+    </div>
+    <div id="map"></div>
+    <a id="vectorlink" href="" style="display:none">Display via data: URL (FF Only)</a>
+    <textarea id="vectors" style="display:none;width:100%" rows="10"></textarea>
+  </body>
+</html>

examples/osm/sutton_coldfield.osm

@@ -0,0 +1,662 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<osm version="0.5" generator="OpenStreetMap server">
+  <node id="200545" lat="52.5503033" lon="-1.8166417" user="blackadder" visible="true" timestamp="2006-03-22T16:33:41+00:00"/>
+  <node id="200546" lat="52.5501965" lon="-1.8168261" user="blackadder" visible="true" timestamp="2006-03-22T16:33:43+00:00"/>
+  <node id="200547" lat="52.5501645" lon="-1.8169929" user="blackadder" visible="true" timestamp="2006-03-22T16:33:45+00:00"/>
+  <node id="200548" lat="52.5501805" lon="-1.8172475" user="blackadder" visible="true" timestamp="2006-03-22T16:33:47+00:00"/>
+  <node id="200549" lat="52.5502392" lon="-1.8175372" user="blackadder" visible="true" timestamp="2006-03-22T16:33:50+00:00"/>
+  <node id="200627" lat="52.5499115" lon="-1.8161012" user="blackadder" visible="true" timestamp="2007-11-22T17:33:32+00:00"/>
+  <node id="200628" lat="52.5497408" lon="-1.81586" user="blackadder" visible="true" timestamp="2007-11-22T17:33:31+00:00"/>
+  <node id="200752" lat="52.5505598" lon="-1.8140051" user="blackadder" visible="true" timestamp="2006-03-22T16:36:20+00:00"/>
+  <node id="200758" lat="52.5501087" lon="-1.8142773" user="blackadder" visible="true" timestamp="2006-03-22T16:36:32+00:00"/>
+  <node id="645729" lat="52.5504008" lon="-1.8169154" user="blackadder" visible="true" timestamp="2006-07-24T23:21:42+01:00">
+    <tag k="place_name" v="Sutton Coldfield"/>
+    <tag k="ref" v="B72 1162"/>
+    <tag k="amenity" v="post_box"/>
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="653121" lat="52.5506073" lon="-1.8137881" user="blackadder" visible="true" timestamp="2006-03-25T18:08:29+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="29783468" lat="52.5506446" lon="-1.8141177" user="blackadder" visible="true" timestamp="2007-05-30T14:22:33+01:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="29783470" lat="52.5501275" lon="-1.8151451" user="blackadder" visible="true" timestamp="2007-05-30T14:22:33+01:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="29783471" lat="52.5505521" lon="-1.8157703" user="blackadder" visible="true" timestamp="2007-12-18T15:33:59+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="29783472" lat="52.5501836" lon="-1.8164007" user="blackadder" visible="true" timestamp="2007-12-18T15:33:59+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="29783473" lat="52.5506035" lon="-1.8170311" user="blackadder" visible="true" timestamp="2007-05-30T14:21:32+01:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="29783474" lat="52.5509559" lon="-1.8164092" user="blackadder" visible="true" timestamp="2007-05-30T14:21:33+01:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="29783571" lat="52.5506331" lon="-1.813672" user="blackadder" visible="true" timestamp="2007-05-30T14:25:11+01:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="175922968" lat="52.5508635" lon="-1.8167837" user="blackadder" visible="true" timestamp="2007-12-18T16:12:50+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="175922970" lat="52.5507591" lon="-1.8169628" user="blackadder" visible="true" timestamp="2007-12-17T23:10:46+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="175923086" lat="52.5506787" lon="-1.8175799" user="blackadder" visible="true" timestamp="2007-12-17T23:10:50+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="175923089" lat="52.5505886" lon="-1.8177227" user="blackadder" visible="true" timestamp="2007-12-18T16:12:51+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="177128255" lat="52.5504144" lon="-1.8171548" user="blackadder" visible="true" timestamp="2007-12-18T16:12:52+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="177128257" lat="52.5506497" lon="-1.8175392" user="blackadder" visible="true" timestamp="2007-12-18T16:12:52+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="177128259" lat="52.550557" lon="-1.8176871" user="blackadder" visible="true" timestamp="2007-12-18T16:12:52+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="177128262" lat="52.5503122" lon="-1.8173195" user="blackadder" visible="true" timestamp="2007-12-18T16:12:52+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="177128265" lat="52.5499209" lon="-1.8164147" user="blackadder" visible="true" timestamp="2007-12-18T15:33:55+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="177128266" lat="52.550178" lon="-1.8175708" user="blackadder" visible="true" timestamp="2007-12-18T15:33:55+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="177128268" lat="52.550066" lon="-1.8176374" user="blackadder" visible="true" timestamp="2007-12-19T17:06:34+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="177128270" lat="52.5498069" lon="-1.8164854" user="blackadder" visible="true" timestamp="2007-12-19T17:06:34+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="177128273" lat="52.5498629" lon="-1.8162923" user="blackadder" visible="true" timestamp="2007-12-18T15:33:55+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="177128275" lat="52.5497909" lon="-1.8164134" user="blackadder" visible="true" timestamp="2007-12-19T17:06:34+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="177128278" lat="52.5502519" lon="-1.8173348" user="blackadder" visible="true" timestamp="2007-12-18T15:33:55+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="177128280" lat="52.5504396" lon="-1.817036" user="blackadder" visible="true" timestamp="2007-12-18T15:33:55+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="177128281" lat="52.5503051" lon="-1.816799" user="blackadder" visible="true" timestamp="2007-12-18T15:33:55+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="177128283" lat="52.5502337" lon="-1.8169643" user="blackadder" visible="true" timestamp="2007-12-18T15:33:55+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="177128286" lat="52.5503168" lon="-1.8170397" user="blackadder" visible="true" timestamp="2007-12-18T15:33:55+00:00">
+    <tag k="created_by" v="JOSM"/>
+    <tag k="amenity" v="parking"/>
+  </node>
+  <node id="177177218" lat="52.5501201" lon="-1.8175441" user="blackadder" visible="true" timestamp="2007-12-18T16:53:50+00:00">
+    <tag k="created_by" v="JOSM"/>
+    <tag k="ref" v="28"/>
+    <tag k="building" v="residential"/>
+  </node>
+  <node id="177177220" lat="52.5498859" lon="-1.8164918" user="blackadder" visible="true" timestamp="2007-12-18T16:53:50+00:00">
+    <tag k="created_by" v="JOSM"/>
+    <tag k="ref" v="2"/>
+    <tag k="building" v="residential"/>
+  </node>
+  <node id="177177222" lat="52.5498106" lon="-1.8162993" user="blackadder" visible="true" timestamp="2007-12-18T16:53:50+00:00">
+    <tag k="created_by" v="JOSM"/>
+    <tag k="ref" v="160"/>
+    <tag k="building" v="residential"/>
+  </node>
+  <node id="177230961" lat="52.550392" lon="-1.8172751" user="blackadder" visible="true" timestamp="2007-12-18T16:53:44+00:00">
+    <tag k="created_by" v="JOSM"/>
+    <tag k="ref" v="158"/>
+    <tag k="building" v="residential"/>
+  </node>
+  <node id="177230963" lat="52.5501893" lon="-1.8162725" user="blackadder" visible="true" timestamp="2007-12-18T16:53:44+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="177230965" lat="52.5502522" lon="-1.8161638" user="blackadder" visible="true" timestamp="2007-12-18T16:53:45+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="177230968" lat="52.5498311" lon="-1.8155709" user="blackadder" visible="true" timestamp="2007-12-18T16:53:45+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="177231022" lat="52.5497724" lon="-1.8156875" user="blackadder" visible="true" timestamp="2007-12-18T16:53:47+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="177231024" lat="52.5501922" lon="-1.8161729" user="blackadder" visible="true" timestamp="2007-12-18T16:53:47+00:00">
+    <tag k="created_by" v="JOSM"/>
+    <tag k="ref" v="145"/>
+    <tag k="building" v="residential"/>
+  </node>
+  <node id="200551" lat="52.5520062" lon="-1.8172738" user="blackadder" visible="true" timestamp="2006-03-22T16:33:54+00:00"/>
+  <node id="200552" lat="52.5520649" lon="-1.8171246" user="blackadder" visible="true" timestamp="2006-03-22T16:33:55+00:00"/>
+  <node id="200553" lat="52.5520008" lon="-1.8172124" user="blackadder" visible="true" timestamp="2006-03-22T16:33:59+00:00"/>
+  <node id="200554" lat="52.5517927" lon="-1.8169666" user="blackadder" visible="true" timestamp="2006-03-22T16:34:01+00:00"/>
+  <node id="200555" lat="52.5517499" lon="-1.8168788" user="blackadder" visible="true" timestamp="2006-03-22T16:34:03+00:00"/>
+  <node id="200556" lat="52.5517248" lon="-1.8167286" user="blackadder" visible="true" timestamp="2007-11-22T17:33:33+00:00"/>
+  <node id="200557" lat="52.5518792" lon="-1.8163956" user="blackadder" visible="true" timestamp="2007-11-22T17:33:33+00:00"/>
+  <node id="200558" lat="52.5519665" lon="-1.8163705" user="blackadder" visible="true" timestamp="2007-11-22T17:33:32+00:00"/>
+  <node id="200562" lat="52.5519848" lon="-1.815281" user="blackadder" visible="true" timestamp="2006-03-22T16:34:21+00:00"/>
+  <node id="200573" lat="52.5520736" lon="-1.8145054" user="blackadder" visible="true" timestamp="2006-03-22T16:34:49+00:00"/>
+  <node id="200751" lat="52.5511951" lon="-1.8142246" user="blackadder" visible="true" timestamp="2006-03-22T16:36:18+00:00"/>
+  <node id="29783476" lat="52.5513103" lon="-1.8169385" user="blackadder" visible="true" timestamp="2007-05-30T14:21:33+01:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="29783477" lat="52.5517893" lon="-1.8159626" user="blackadder" visible="true" timestamp="2007-05-30T14:21:33+01:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="29783478" lat="52.5518461" lon="-1.8145067" user="blackadder" visible="true" timestamp="2007-05-30T14:21:33+01:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="29783479" lat="52.5511883" lon="-1.8143197" user="blackadder" visible="true" timestamp="2007-05-30T14:21:33+01:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="200511" lat="52.5558034" lon="-1.8267378" user="blackadder" visible="true" timestamp="2006-03-22T16:32:25+00:00"/>
+  <node id="200512" lat="52.5550357" lon="-1.8249151" user="blackadder" visible="true" timestamp="2007-11-22T17:33:32+00:00"/>
+  <node id="200513" lat="52.5553343" lon="-1.8257585" user="blackadder" visible="true" timestamp="2006-03-22T16:32:28+00:00"/>
+  <node id="200514" lat="52.5546308" lon="-1.8238934" user="blackadder" visible="true" timestamp="2006-03-22T16:32:30+00:00"/>
+  <node id="200515" lat="52.5544693" lon="-1.823135" user="blackadder" visible="true" timestamp="2007-11-22T17:33:32+00:00"/>
+  <node id="200517" lat="52.5545308" lon="-1.8235208" user="blackadder" visible="true" timestamp="2006-03-22T16:32:37+00:00"/>
+  <node id="200526" lat="52.5543989" lon="-1.8225501" user="blackadder" visible="true" timestamp="2006-03-22T16:33:02+00:00"/>
+  <node id="200527" lat="52.5543241" lon="-1.8221902" user="blackadder" visible="true" timestamp="2006-03-22T16:33:05+00:00"/>
+  <node id="200528" lat="52.5542654" lon="-1.8219444" user="blackadder" visible="true" timestamp="2006-03-22T16:33:07+00:00"/>
+  <node id="200530" lat="52.5541587" lon="-1.8216547" user="blackadder" visible="true" timestamp="2006-03-22T16:33:11+00:00"/>
+  <node id="200532" lat="52.5538918" lon="-1.821163" user="blackadder" visible="true" timestamp="2006-03-22T16:33:15+00:00"/>
+  <node id="200533" lat="52.5536782" lon="-1.8208031" user="blackadder" visible="true" timestamp="2006-03-22T16:33:17+00:00"/>
+  <node id="200534" lat="52.5534108" lon="-1.8204187" user="blackadder" visible="true" timestamp="2006-03-22T16:33:19+00:00"/>
+  <node id="200535" lat="52.5530804" lon="-1.8200481" user="blackadder" visible="true" timestamp="2006-03-22T16:33:21+00:00"/>
+  <node id="200536" lat="52.5527228" lon="-1.8197232" user="blackadder" visible="true" timestamp="2006-03-22T16:33:23+00:00"/>
+  <node id="200537" lat="52.5525413" lon="-1.8195652" user="blackadder" visible="true" timestamp="2006-03-22T16:33:25+00:00"/>
+  <node id="200539" lat="52.5522844" lon="-1.8193896" user="blackadder" visible="true" timestamp="2006-03-22T16:33:29+00:00"/>
+  <node id="200540" lat="52.5519374" lon="-1.8190999" user="blackadder" visible="true" timestamp="2006-03-22T16:33:31+00:00"/>
+  <node id="200541" lat="52.5521848" lon="-1.8193018" user="blackadder" visible="true" timestamp="2007-12-17T23:11:03+00:00"/>
+  <node id="200542" lat="52.5516186" lon="-1.8186947" user="blackadder" visible="true" timestamp="2007-11-22T17:33:32+00:00"/>
+  <node id="200543" lat="52.5517933" lon="-1.8189419" user="blackadder" visible="true" timestamp="2006-03-22T16:33:37+00:00"/>
+  <node id="200544" lat="52.5513983" lon="-1.8183449" user="blackadder" visible="true" timestamp="2006-03-22T16:33:39+00:00"/>
+  <node id="200550" lat="52.5519976" lon="-1.8179888" user="blackadder" visible="true" timestamp="2007-11-22T17:33:33+00:00"/>
+  <node id="200559" lat="52.5523069" lon="-1.816393" user="blackadder" visible="true" timestamp="2007-11-22T17:33:32+00:00"/>
+  <node id="200560" lat="52.5523905" lon="-1.8163169" user="blackadder" visible="true" timestamp="2007-11-22T17:33:32+00:00"/>
+  <node id="200561" lat="52.552524" lon="-1.8159306" user="blackadder" visible="true" timestamp="2006-03-22T21:55:12+00:00"/>
+  <node id="200563" lat="52.5526121" lon="-1.8152809" user="blackadder" visible="true" timestamp="2006-03-22T16:34:24+00:00"/>
+  <node id="200564" lat="52.5526358" lon="-1.8149766" user="blackadder" visible="true" timestamp="2007-11-22T17:33:34+00:00"/>
+  <node id="200565" lat="52.5526654" lon="-1.8146664" user="blackadder" visible="true" timestamp="2006-03-22T16:34:29+00:00"/>
+  <node id="200566" lat="52.5525937" lon="-1.8156438" user="blackadder" visible="true" timestamp="2006-03-22T16:34:31+00:00"/>
+  <node id="200571" lat="52.5535575" lon="-1.8148566" user="blackadder" visible="true" timestamp="2007-11-15T12:54:40+00:00"/>
+  <node id="200572" lat="52.5523885" lon="-1.8145932" user="blackadder" visible="true" timestamp="2006-03-22T16:34:46+00:00"/>
+  <node id="200629" lat="52.5495701" lon="-1.8156789" user="blackadder" visible="true" timestamp="2007-11-22T17:33:31+00:00"/>
+  <node id="200630" lat="52.5493694" lon="-1.815524" user="blackadder" visible="true" timestamp="2007-11-22T17:33:31+00:00"/>
+  <node id="200631" lat="52.5490781" lon="-1.8153587" user="blackadder" visible="true" timestamp="2007-11-22T17:33:31+00:00"/>
+  <node id="200632" lat="52.5488293" lon="-1.815287" user="blackadder" visible="true" timestamp="2007-11-22T17:33:32+00:00"/>
+  <node id="200633" lat="52.5485269" lon="-1.8153192" user="blackadder" visible="true" timestamp="2007-11-22T17:33:32+00:00"/>
+  <node id="200650" lat="52.5482109" lon="-1.815399" user="blackadder" visible="true" timestamp="2007-11-22T17:33:31+00:00"/>
+  <node id="200651" lat="52.5478984" lon="-1.8153867" user="blackadder" visible="true" timestamp="2007-11-22T17:33:31+00:00"/>
+  <node id="200652" lat="52.5474767" lon="-1.8152603" user="blackadder" visible="true" timestamp="2007-11-22T17:33:31+00:00"/>
+  <node id="200653" lat="52.5468312" lon="-1.8150679" user="blackadder" visible="true" timestamp="2007-11-22T17:33:29+00:00"/>
+  <node id="200753" lat="52.5496876" lon="-1.8136891" user="blackadder" visible="true" timestamp="2006-03-22T21:55:13+00:00"/>
+  <node id="200754" lat="52.549009" lon="-1.8133906" user="blackadder" visible="true" timestamp="2006-03-22T16:36:24+00:00"/>
+  <node id="200755" lat="52.5478879" lon="-1.8128287" user="blackadder" visible="true" timestamp="2006-03-22T16:36:26+00:00"/>
+  <node id="200756" lat="52.548993" lon="-1.8134871" user="blackadder" visible="true" timestamp="2006-03-22T16:36:28+00:00"/>
+  <node id="200757" lat="52.5490304" lon="-1.8135925" user="blackadder" visible="true" timestamp="2006-03-22T16:36:31+00:00"/>
+  <node id="200759" lat="52.5464722" lon="-1.8119684" user="blackadder" visible="true" timestamp="2006-03-22T16:36:34+00:00"/>
+  <node id="200771" lat="52.5466312" lon="-1.8121126" user="blackadder" visible="true" timestamp="2006-03-22T16:37:02+00:00"/>
+  <node id="653117" lat="52.5423754" lon="-1.8078749" user="blackadder" visible="true" timestamp="2007-11-26T18:40:45+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="653118" lat="52.5465842" lon="-1.81179" user="blackadder" visible="true" timestamp="2006-03-25T18:08:29+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="653119" lat="52.5444001" lon="-1.8100834" user="blackadder" visible="true" timestamp="2006-03-25T18:08:29+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="653120" lat="52.5490713" lon="-1.8131664" user="blackadder" visible="true" timestamp="2006-03-25T18:08:29+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="653122" lat="52.5526798" lon="-1.814402" user="blackadder" visible="true" timestamp="2006-03-25T18:08:29+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="653123" lat="52.5536564" lon="-1.814631" user="blackadder" visible="true" timestamp="2007-11-15T12:54:42+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="29783564" lat="52.5538289" lon="-1.8145536" user="blackadder" visible="true" timestamp="2007-11-15T12:53:07+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="29783565" lat="52.5539485" lon="-1.8128538" user="blackadder" visible="true" timestamp="2007-11-15T12:53:07+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="29783566" lat="52.5509299" lon="-1.8119156" user="blackadder" visible="true" timestamp="2007-05-30T14:25:10+01:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="29783567" lat="52.5470281" lon="-1.8097771" user="blackadder" visible="true" timestamp="2007-05-30T14:25:11+01:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="29783568" lat="52.5465979" lon="-1.811457" user="blackadder" visible="true" timestamp="2007-05-30T14:25:11+01:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="29783569" lat="52.5466086" lon="-1.8115118" user="blackadder" visible="true" timestamp="2007-05-30T14:25:11+01:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="29783570" lat="52.5491153" lon="-1.8130205" user="blackadder" visible="true" timestamp="2007-05-30T14:25:11+01:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="29783572" lat="52.5527014" lon="-1.8142812" user="blackadder" visible="true" timestamp="2007-05-30T14:25:11+01:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="135352210" lat="52.5549423" lon="-1.814954" user="blackadder" visible="true" timestamp="2007-11-26T18:37:58+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="175922965" lat="52.551783" lon="-1.8181591" user="blackadder" visible="true" timestamp="2007-12-18T16:12:50+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="175922972" lat="52.5516751" lon="-1.8183582" user="blackadder" visible="true" timestamp="2007-12-17T23:10:46+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="175923064" lat="52.5542375" lon="-1.8222046" user="blackadder" visible="true" timestamp="2007-12-18T15:34:00+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="175923066" lat="52.5540618" lon="-1.8217823" user="blackadder" visible="true" timestamp="2007-12-17T23:10:49+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="175923068" lat="52.5537913" lon="-1.8213338" user="blackadder" visible="true" timestamp="2007-12-17T23:10:49+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="175923070" lat="52.5529993" lon="-1.8203219" user="blackadder" visible="true" timestamp="2007-12-17T23:10:49+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="175923072" lat="52.5521418" lon="-1.8195539" user="blackadder" visible="true" timestamp="2007-12-17T23:10:49+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="175923077" lat="52.5517862" lon="-1.8192228" user="blackadder" visible="true" timestamp="2007-12-18T16:12:51+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="175923081" lat="52.55152" lon="-1.8188757" user="blackadder" visible="true" timestamp="2007-12-17T23:10:49+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="175923083" lat="52.5510247" lon="-1.8181078" user="blackadder" visible="true" timestamp="2007-12-17T23:10:50+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="175923092" lat="52.5514479" lon="-1.8190434" user="blackadder" visible="true" timestamp="2007-12-18T16:12:51+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="175923093" lat="52.5517434" lon="-1.8194353" user="blackadder" visible="true" timestamp="2007-12-18T16:12:51+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="175923094" lat="52.5529379" lon="-1.8205018" user="blackadder" visible="true" timestamp="2007-12-18T16:12:51+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="175923095" lat="52.5537161" lon="-1.8214889" user="blackadder" visible="true" timestamp="2007-12-18T16:12:51+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="175923096" lat="52.5539755" lon="-1.8218808" user="blackadder" visible="true" timestamp="2007-12-18T16:12:50+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="175923099" lat="52.5541405" lon="-1.8222767" user="blackadder" visible="true" timestamp="2007-12-18T15:34:00+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="177081428" lat="52.5552884" lon="-1.8256253" user="blackadder" visible="true" timestamp="2007-12-18T15:01:16+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="177081440" lat="52.5551147" lon="-1.825166" user="blackadder" visible="true" timestamp="2007-12-18T15:01:17+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="177128288" lat="52.5496708" lon="-1.816009" user="blackadder" visible="true" timestamp="2007-12-18T15:33:55+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="177128291" lat="52.5494958" lon="-1.8157939" user="blackadder" visible="true" timestamp="2007-12-18T15:33:56+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="177128294" lat="52.5492862" lon="-1.8156326" user="blackadder" visible="true" timestamp="2007-12-18T15:33:56+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="177128297" lat="52.5490612" lon="-1.8155156" user="blackadder" visible="true" timestamp="2007-12-18T15:33:56+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="177128299" lat="52.5488284" lon="-1.8154808" user="blackadder" visible="true" timestamp="2007-12-18T15:33:56+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="177128301" lat="52.5488246" lon="-1.8156477" user="blackadder" visible="true" timestamp="2007-12-19T17:06:33+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="177128303" lat="52.5490573" lon="-1.8156698" user="blackadder" visible="true" timestamp="2007-12-19T17:06:33+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="177128306" lat="52.5492802" lon="-1.8157959" user="blackadder" visible="true" timestamp="2007-12-19T17:06:33+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="177128308" lat="52.5494967" lon="-1.8159735" user="blackadder" visible="true" timestamp="2007-12-19T17:06:33+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="177128310" lat="52.549613" lon="-1.8161509" user="blackadder" visible="true" timestamp="2007-12-19T17:06:33+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="177230972" lat="52.5496355" lon="-1.8153859" user="blackadder" visible="true" timestamp="2007-12-18T16:53:45+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="177230975" lat="52.5494398" lon="-1.8152371" user="blackadder" visible="true" timestamp="2007-12-18T16:53:45+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="177230979" lat="52.5492418" lon="-1.8151165" user="blackadder" visible="true" timestamp="2007-12-18T16:53:45+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="177230981" lat="52.5490437" lon="-1.8150441" user="blackadder" visible="true" timestamp="2007-12-18T16:53:45+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="177230983" lat="52.5488114" lon="-1.8149878" user="blackadder" visible="true" timestamp="2007-12-18T16:53:45+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="177230985" lat="52.5485375" lon="-1.815024" user="blackadder" visible="true" timestamp="2007-12-18T16:53:45+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="177230988" lat="52.5481977" lon="-1.8150843" user="blackadder" visible="true" timestamp="2007-12-18T16:53:46+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="177230989" lat="52.5480118" lon="-1.8150884" user="blackadder" visible="true" timestamp="2007-12-18T16:53:46+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="177230996" lat="52.5480143" lon="-1.8152371" user="blackadder" visible="true" timestamp="2007-12-18T16:53:46+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="177231000" lat="52.5482099" lon="-1.8152331" user="blackadder" visible="true" timestamp="2007-12-18T16:53:46+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="177231003" lat="52.5485498" lon="-1.8151567" user="blackadder" visible="true" timestamp="2007-12-18T16:53:46+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="177231007" lat="52.5488212" lon="-1.8151246" user="blackadder" visible="true" timestamp="2007-12-18T16:53:46+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="177231010" lat="52.5490364" lon="-1.8151728" user="blackadder" visible="true" timestamp="2007-12-18T16:53:46+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="177231014" lat="52.5492393" lon="-1.8152452" user="blackadder" visible="true" timestamp="2007-12-18T16:53:46+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="177231016" lat="52.5494081" lon="-1.8153618" user="blackadder" visible="true" timestamp="2007-12-18T16:53:46+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="177231019" lat="52.5495915" lon="-1.8155106" user="blackadder" visible="true" timestamp="2007-12-18T16:53:47+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <node id="177231081" lat="52.5555213" lon="-1.8261466" user="blackadder" visible="true" timestamp="2007-12-18T16:53:49+00:00">
+    <tag k="created_by" v="JOSM"/>
+  </node>
+  <way id="35" visible="true" timestamp="2007-09-18T02:37:16+01:00" user="crschmidt">
+    <nd ref="200542"/>
+    <nd ref="200550"/>
+    <nd ref="200551"/>
+    <nd ref="200553"/>
+    <tag k="note" v="fire access route"/>
+    <tag k="created_by" v="JOSM"/>
+    <tag k="highway" v="footway"/>
+    <tag k="place_name" v="Sutton Coldfield"/>
+    <tag k="surface" v="paved"/>
+  </way>
+  <way id="37" visible="true" timestamp="2007-12-18T16:53:51+00:00" user="blackadder">
+    <nd ref="200511"/>
+    <nd ref="177231081"/>
+    <nd ref="200513"/>
+    <nd ref="177081428"/>
+    <nd ref="177081440"/>
+    <nd ref="200512"/>
+    <nd ref="200514"/>
+    <nd ref="200517"/>
+    <nd ref="200515"/>
+    <nd ref="200526"/>
+    <nd ref="200527"/>
+    <nd ref="200528"/>
+    <nd ref="200530"/>
+    <nd ref="200532"/>
+    <nd ref="200533"/>
+    <nd ref="200534"/>
+    <nd ref="200535"/>
+    <nd ref="200536"/>
+    <nd ref="200537"/>
+    <nd ref="200539"/>
+    <nd ref="200541"/>
+    <nd ref="200540"/>
+    <nd ref="200543"/>
+    <nd ref="200542"/>
+    <nd ref="200544"/>
+    <nd ref="200545"/>
+    <nd ref="200627"/>
+    <nd ref="200628"/>
+    <nd ref="200629"/>
+    <nd ref="200630"/>
+    <nd ref="200631"/>
+    <nd ref="200632"/>
+    <nd ref="200633"/>
+    <nd ref="200650"/>
+    <nd ref="200651"/>
+    <nd ref="200652"/>
+    <nd ref="200653"/>
+    <tag k="created_by" v="JOSM"/>
+    <tag k="place_name" v="Sutton Coldfield"/>
+    <tag k="postal_code" v="B72"/>
+    <tag k="name" v="Maney Hill Road"/>
+    <tag k="abutters" v="residential"/>
+    <tag k="highway" v="residential"/>
+  </way>
+  <way id="54" visible="true" timestamp="2006-03-29T09:51:45+01:00" user="blackadder">
+    <nd ref="200545"/>
+    <nd ref="200546"/>
+    <nd ref="200547"/>
+    <nd ref="200548"/>
+    <nd ref="200549"/>
+    <tag k="name" v="Mottrams Close"/>
+    <tag k="abutters" v="residential"/>
+    <tag k="postal_code" v="B72"/>
+    <tag k="highway" v="residential"/>
+    <tag k="place_name" v="Sutton Coldfield"/>
+    <tag k="created_by" v="JOSM"/>
+  </way>
+  <way id="55" visible="true" timestamp="2006-03-22T21:55:16+00:00" user="blackadder">
+    <nd ref="200758"/>
+    <nd ref="200757"/>
+    <nd ref="200756"/>
+    <nd ref="200754"/>
+    <tag k="place_name" v="Sutton Coldfield"/>
+    <tag k="highway" v="residential"/>
+    <tag k="postal_code" v="B72"/>
+    <tag k="name" v="East View Road"/>
+    <tag k="created_by" v="JOSM"/>
+  </way>
+  <way id="57" visible="true" timestamp="2007-09-26T14:35:13+01:00" user="blackadder">
+    <nd ref="200571"/>
+    <nd ref="200565"/>
+    <nd ref="200572"/>
+    <nd ref="200573"/>
+    <nd ref="200751"/>
+    <nd ref="200752"/>
+    <nd ref="200753"/>
+    <nd ref="200754"/>
+    <nd ref="200755"/>
+    <nd ref="200771"/>
+    <nd ref="200759"/>
+    <tag k="place_name" v="Sutton Coldfield"/>
+    <tag k="postal_code" v="B72"/>
+    <tag k="name" v="East View Road"/>
+    <tag k="created_by" v="JOSM"/>
+    <tag k="highway" v="unclassified"/>
+  </way>
+  <way id="395" visible="true" timestamp="2007-12-19T17:50:08+00:00" user="blackadder">
+    <nd ref="200552"/>
+    <nd ref="200553"/>
+    <nd ref="200554"/>
+    <nd ref="200555"/>
+    <nd ref="200556"/>
+    <nd ref="200557"/>
+    <nd ref="200558"/>
+    <nd ref="200559"/>
+    <nd ref="200560"/>
+    <nd ref="200561"/>
+    <nd ref="200566"/>
+    <nd ref="200563"/>
+    <nd ref="200564"/>
+    <nd ref="200565"/>
+    <tag k="place_name" v="Sutton Coldfield"/>
+    <tag k="postal_code" v="B72"/>
+    <tag k="name" v="Shooters Hill"/>
+    <tag k="abutters" v="residential"/>
+    <tag k="created_by" v="JOSM"/>
+    <tag k="highway" v="residential"/>
+  </way>
+  <way id="418" visible="true" timestamp="2006-03-25T11:39:32+00:00" user="blackadder">
+    <nd ref="200562"/>
+    <nd ref="200563"/>
+    <tag k="place_name" v="Sutton Coldfield"/>
+    <tag k="highway" v="residential"/>
+    <tag k="postal_code" v="B72"/>
+    <tag k="abutters" v="residential"/>
+    <tag k="name" v="Corncrake Close"/>
+    <tag k="created_by" v="JOSM"/>
+  </way>
+  <way id="4685537" visible="true" timestamp="2007-05-30T14:21:35+01:00" user="blackadder">
+    <nd ref="29783472"/>
+    <nd ref="29783473"/>
+    <nd ref="29783474"/>
+    <nd ref="29783476"/>
+    <nd ref="29783477"/>
+    <nd ref="29783478"/>
+    <nd ref="29783479"/>
+    <nd ref="29783468"/>
+    <nd ref="29783470"/>
+    <nd ref="29783471"/>
+    <nd ref="29783472"/>
+    <tag k="name" v="Maney Hill School"/>
+    <tag k="created_by" v="JOSM"/>
+    <tag k="landuse" v="school"/>
+    <tag k="amenity" v="school"/>
+  </way>
+  <way id="4685542" visible="true" timestamp="2007-05-30T14:25:15+01:00" user="blackadder">
+    <nd ref="29783570"/>
+    <nd ref="29783571"/>
+    <nd ref="29783572"/>
+    <nd ref="29783564"/>
+    <nd ref="29783565"/>
+    <nd ref="29783566"/>
+    <nd ref="29783567"/>
+    <nd ref="29783568"/>
+    <nd ref="29783569"/>
+    <nd ref="29783570"/>
+    <tag k="landuse" v="school"/>
+    <tag k="created_by" v="JOSM"/>
+    <tag k="amenity" v="school"/>
+  </way>
+  <way id="14166897" visible="true" timestamp="2007-11-26T18:40:45+00:00" user="blackadder">
+    <nd ref="135352210"/>
+    <nd ref="653123"/>
+    <nd ref="653122"/>
+    <nd ref="653121"/>
+    <nd ref="653120"/>
+    <nd ref="653118"/>
+    <nd ref="653119"/>
+    <nd ref="653117"/>
+    <tag k="created_by" v="JOSM"/>
+    <tag k="name" v="Freight Line"/>
+    <tag k="railway" v="rail"/>
+  </way>
+  <way id="16966783" visible="true" timestamp="2007-12-17T23:11:00+00:00" user="blackadder">
+    <nd ref="175922965"/>
+    <nd ref="175922968"/>
+    <nd ref="175922970"/>
+    <nd ref="175922972"/>
+    <nd ref="175922965"/>
+    <tag k="created_by" v="JOSM"/>
+    <tag k="building" v="residential"/>
+  </way>
+  <way id="16966792" visible="true" timestamp="2007-12-17T23:11:01+00:00" user="blackadder">
+    <nd ref="175923064"/>
+    <nd ref="175923066"/>
+    <nd ref="175923068"/>
+    <nd ref="175923070"/>
+    <nd ref="175923072"/>
+    <nd ref="175923077"/>
+    <nd ref="175923081"/>
+    <nd ref="175923083"/>
+    <nd ref="175923086"/>
+    <nd ref="175923089"/>
+    <nd ref="175923092"/>
+    <nd ref="175923093"/>
+    <nd ref="175923094"/>
+    <nd ref="175923095"/>
+    <nd ref="175923096"/>
+    <nd ref="175923099"/>
+    <nd ref="175923064"/>
+    <tag k="created_by" v="JOSM"/>
+    <tag k="building" v="residential"/>
+  </way>
+  <way id="17060325" visible="true" timestamp="2007-12-18T15:37:01+00:00" user="blackadder">
+    <nd ref="177128255"/>
+    <nd ref="177128262"/>
+    <nd ref="177128259"/>
+    <nd ref="177128257"/>
+    <nd ref="177128255"/>
+    <tag k="created_by" v="JOSM"/>
+    <tag k="building" v="residential"/>
+  </way>
+  <way id="17060326" visible="true" timestamp="2007-12-18T15:37:01+00:00" user="blackadder">
+    <nd ref="177128265"/>
+    <nd ref="177128270"/>
+    <nd ref="177128268"/>
+    <nd ref="177128266"/>
+    <nd ref="177128265"/>
+    <tag k="created_by" v="JOSM"/>
+    <tag k="building" v="residential"/>
+  </way>
+  <way id="17060327" visible="true" timestamp="2007-12-18T15:37:01+00:00" user="blackadder">
+    <nd ref="177128275"/>
+    <nd ref="177128273"/>
+    <nd ref="177128288"/>
+    <nd ref="177128291"/>
+    <nd ref="177128294"/>
+    <nd ref="177128297"/>
+    <nd ref="177128299"/>
+    <nd ref="177128301"/>
+    <nd ref="177128303"/>
+    <nd ref="177128306"/>
+    <nd ref="177128308"/>
+    <nd ref="177128310"/>
+    <nd ref="177128275"/>
+    <tag k="created_by" v="JOSM"/>
+    <tag k="building" v="residential"/>
+  </way>
+  <way id="17060329" visible="true" timestamp="2007-12-18T15:33:58+00:00" user="blackadder">
+    <nd ref="177128278"/>
+    <nd ref="177128280"/>
+    <nd ref="177128281"/>
+    <nd ref="177128283"/>
+    <nd ref="177128278"/>
+    <tag k="created_by" v="JOSM"/>
+    <tag k="amenity" v="parking"/>
+  </way>
+  <way id="17067452" visible="true" timestamp="2007-12-18T16:53:49+00:00" user="blackadder">
+    <nd ref="177230963"/>
+    <nd ref="177230965"/>
+    <nd ref="177230968"/>
+    <nd ref="177230972"/>
+    <nd ref="177230975"/>
+    <nd ref="177230979"/>
+    <nd ref="177230981"/>
+    <nd ref="177230983"/>
+    <nd ref="177230985"/>
+    <nd ref="177230988"/>
+    <nd ref="177230989"/>
+    <nd ref="177230996"/>
+    <nd ref="177231000"/>
+    <nd ref="177231003"/>
+    <nd ref="177231007"/>
+    <nd ref="177231010"/>
+    <nd ref="177231014"/>
+    <nd ref="177231016"/>
+    <nd ref="177231019"/>
+    <nd ref="177231022"/>
+    <nd ref="177230963"/>
+    <tag k="created_by" v="JOSM"/>
+    <tag k="building" v="residential"/>
+  </way>
+</osm>

examples/outOfRangeMarkers.html

@@ -1,5 +1,7 @@
 <html xmlns="http://www.w3.org/1999/xhtml">
 <head>
+    <title>Using maxResolution to control overlays</title>
+    <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
     <style type="text/css">
         #map {
             width: 650px;
@@ -50,7 +52,11 @@
 
 
  <body onload="init()">
-
+    <h3 id="title">Using maxResolution to control overlays</h3>
+    <p id="shortdesc">
+      See how to control the maximum resolution for a markers layer, 
+      causing it to not be displayed beyond a certain point.
+    </p>  
     <div id="map"></div>
 
   </body>

examples/overviewmap.html

@@ -1,47 +1,104 @@
-<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
-        "http://www.w3.org/TR/2000/REC-xhtml1-20000126/DTD/xhtml1-strict.dtd">
-<html xmlns="http://www.w3.org/1999/xhtml">
-<head>
-<title>Overview Map Example</title>
-<script src="../lib/OpenLayers.js" type="text/javascript"></script>
-<style>
-#map{
-    width:100%; 
-    height:500px;
-    border:1px solid;
-}
-</style>
-</head>
-<body>
-  <div id="map"></div>
+<html>
+    <head>
+        <title>Overview Map Example</title>
+        <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
+        <script src="../lib/OpenLayers.js" type="text/javascript"></script>
+        <style>
+        #map1 {
+            width: 500px; 
+            height: 300px;
+            border: 1px solid gray;
+        }
+        #map2 {
+            width: 500px; 
+            height: 300px;
+            border: 1px solid gray;
+        }
+        </style>
+    </head>
+    <body>
+        <h1 id="title">Overview Map</h1>
+
+        <div id="tags">
+        </div>
+        <p id="shortdesc">
+            Enable a small Overview Map that moves/interacts with your main map.
+        </p>
+        <div id="map1"></div>
+        <p>The above map has an overview map control that is created with
+        the default options.  Much like a regular map, the map contained by
+        the overview map control defaults to a geographic projection.</p>
+        <div id="map2"></div>
+        <p>The second map has an overview map control that is created with
+        non-default options.  In this case, the mapOptions property of the
+        control has been set to use non-default projection related properties.
+        In addition, any other properties of the overview map control can be
+        set in this way.</p>
         <script defer="defer" type="text/javascript">
-    var map = new OpenLayers.Map('map');
-    // my city
-    var constantina = new OpenLayers.LonLat(-5.6165,37.8623);
-    var wms = new OpenLayers.Layer.WMS( "OpenLayers WMS", 
-        "http://labs.metacarta.com/wms/vmap0", {layers: 'basic'} );
-    var nasa_wms = new OpenLayers.Layer.WMS( "NASA Global Mosaic", 
-        "http://wms.jpl.nasa.gov/wms.cgi", {layers: "modis,global_mosaic"} );
         
-    map.addLayers([    
-        nasa_wms,
-        wms
-    ]);
+        // create the top map (with default overview map control)
+        var map1 = new OpenLayers.Map('map1');
         
-    map.addControl(new OpenLayers.Control.LayerSwitcher());
+        var ol = new OpenLayers.Layer.WMS(
+            "OpenLayers WMS", 
+            "http://labs.metacarta.com/wms/vmap0",
+            {layers: 'basic'}
+        );
         
-    var options = {
-      layers: [wms.clone()],
-      minRatio: 8,
-      maxRatio: 128
+        var jpl = new OpenLayers.Layer.WMS(
+            "NASA Global Mosaic", 
+            "http://t1.hypercube.telascience.org/cgi-bin/landsat7",
+            {layers: "landsat7"}
+        );
+        
+        map1.addLayers([ol, jpl]);
+        map1.addControl(new OpenLayers.Control.LayerSwitcher());
+        
+        // create an overview map control with the default options
+        var overview1 = new OpenLayers.Control.OverviewMap();
+        map1.addControl(overview1);
+        
+        map1.setCenter(new OpenLayers.LonLat(0, 0), 2);
+        
+        // expand the overview map control
+        overview1.maximizeControl();
+        
+        
+        // create the bottom map (with advanced overview map control)
+        var mapOptions = {
+            maxExtent: new OpenLayers.Bounds(33861, 717605, 330846, 1019656), 
+            maxResolution: 296985/1024,
+            projection: "EPSG:2805",
+            units: "m"
         };
-    var overview = new OpenLayers.Control.OverviewMap(options);
 
-    map.addControl(overview);
+        var map2 = new OpenLayers.Map('map2', mapOptions);
         
-    map.setCenter(constantina, 4);
+        var bos = new OpenLayers.Layer.WMS(
+            "Boston", 
+            "http://boston.freemap.in/cgi-bin/mapserv",
+            {
+                map: '/www/freemap.in/boston/map/gmaps.map', 
+                layers: 'border,water,roads,rapid_transit,buildings', 
+                format: 'png'
+            }
+        );
+        
+        map2.addLayers([bos]);
+        map2.addControl(new OpenLayers.Control.LayerSwitcher());
+        
+        // create an overview map control with non-default options
+        var controlOptions = {
+            mapOptions: mapOptions
+        }
+        var overview2 = new OpenLayers.Control.OverviewMap(controlOptions);
+        map2.addControl(overview2);
+        
+        map2.setCenter(new OpenLayers.LonLat(182500, 868500), 3);
+        
+        // expand the overview map control
+        overview2.maximizeControl();
 
-    overview.maximizeControl();    
         </script>
-</body>
+    </body>
 </html>

examples/panel.html

@@ -1,5 +1,6 @@
 <html xmlns="http://www.w3.org/1999/xhtml">
   <head>
+    <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
     <style type="text/css">
         #map {
             width: 800px;
@@ -51,8 +52,8 @@
         }
         
     </style>
+    <script src="../lib/Firebug/firebug.js"></script>
     <script src="../lib/OpenLayers.js"></script>
-    <script src="../lib/Firebug/debug.js"></script>
     <script type="text/javascript">
         var lon = 5;
         var lat = 40;
@@ -69,13 +70,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);
 
@@ -84,6 +88,11 @@
     </script>
   </head>
   <body onload="init()">
+    <h3 id="title">Custom Control.Panel</h3>
+    <p id="shortdesc">
+      Create a custom control.panel, styled entirely with
+      CSS, and add your own controls to it.
+    </p>  
     <div id="panel"></div>
     <div id="map"></div>
   </body>

examples/point-track-markers.html

@@ -0,0 +1,69 @@
+<html xmlns="http://www.w3.org/1999/xhtml">
+  <head>
+    <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
+    <style type="text/css">
+        #map {
+            width: 800px;
+            height: 400px;
+            border: 1px solid black;
+        }
+    </style>
+    <script src="../lib/OpenLayers.js"></script>
+    <script type="text/javascript">
+        var map, layer, rss, lineFeatures, popup;
+
+        OpenLayers.ProxyHost = "proxy.cgi?url=";
+        function init(){
+            map = new OpenLayers.Map('map', {maxResolution:'auto'});
+            layer = new OpenLayers.Layer.WMS( "OpenLayers WMS", 
+                    "http://labs.metacarta.com/wms/vmap0", {layers: 'basic'} );
+            map.addLayer(layer);
+            map.setCenter(new OpenLayers.LonLat(20.22, 22.05), 9);
+            map.addControl(new OpenLayers.Control.LayerSwitcher());
+        }
+
+        function addUrl() {
+            var urlObj = OpenLayers.Util.getElement('url'); 
+            var value = urlObj.value;
+            var parts = value.split("/");
+            rss = new OpenLayers.Layer.GeoRSS(parts[parts.length-1], value);
+            rss.events.register("loadend", window, populateMap);
+            map.addLayer(rss);
+        }
+
+        function populateMap() {
+            // create the point track layer
+            var lineLayer = new OpenLayers.Layer.PointTrack(rss.name + " Track",
+                    {dataFrom: OpenLayers.Layer.PointTrack.dataFrom.SOURCE_NODE});
+            // add the features from the rss layer to the track layer. This
+            // also works with OpenLayers.Feature.Vector features.
+            lineLayer.addNodes(rss.features);
+            map.addLayer(lineLayer);
+            
+            rss.setName(rss.name + " Comments");
+            
+            var feature, marker;
+            // only show markers for features that are not "Untitled"
+            for (var i = rss.features.length-1; i>0; i--) {
+                if (rss.features[i].data.popupContentHTML.indexOf(
+                        "Untitled") != -1) {
+                    rss.removeMarker(rss.markers[i]);
+                }
+            }
+            
+            // keep markers on top of tracks
+            map.raiseLayer(rss, 1);
+        }
+    </script>
+  </head>
+  <body onload="init()">
+    <h1>GeoRSS PointTrack in OpenLayers</h1>
+    <p style="font-size:.9em;">This demo uses OpenLayers.Layer.GeoRSS and OpenLayers.Layer.PointTrack. The track is created by connecting the points of the GeoRSS feed.</a></p>
+    <form onsubmit="return false;">
+   GeoRSS URL: <input type="text" id="url" size="50" /><input type="submit" onclick="addUrl(); return false;" value="Load Feed" onsubmit="addUrl(); return false;" />
+    </form>  
+    <p>The above input box allows the input of a URL to a GeoRSS feed. This feed can be local to the HTML page -- for example, entering 'xml/track1.xml' will work by default.</p>
+    <p>The example shows a track, displayed as a line connecting the points of the feed. It also shows markers at positions that have a title tag in the rss item. If clicked, a popup will show title and description.</p>   
+    <div id="map"></div>
+  </body>
+</html>

examples/popupMatrix.html

@@ -0,0 +1,891 @@
+<html xmlns="http://www.w3.org/1999/xhtml" debug="true">
+  <head>
+    <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
+    <style type="text/css">
+        #map {
+            width: 900px;
+            height: 500px;
+            border: 1px solid black;
+            background-color: blue;
+        }
+    </style>
+
+    <link rel="stylesheet" href="../theme/default/framedCloud.css" type="text/css" />
+
+    <script src="../lib/Firebug/firebug.js"></script>
+    <script src="../lib/OpenLayers.js"></script>
+    <script type="text/javascript">
+        var map;
+        var layer, markers;
+        
+        var currentPopup;
+        
+        var samplePopupContentsHTML = "Old man down, way down down, down by the docks of the city.<br>Blind and dirty, asked me for a dime, a dime for a cup of coffee.<br>I got no dime but I got some time to hear his story.<br>My name is August West, and I love my Pearly Baker best more than my wine.<br>More than my wine - more than my maker, though he's no friend of mine.<br><br>Everyone said, I'd come to no good, I knew I would Pearly, believe them.<br>Half of my life, I spent doin' time for some other fucker's crime,<br>The other half found me stumbling 'round drunk on Burgundy wine.<br><br>But I'll get back on my feet again someday,<br>The good Lord willin', if He says I may.<br>I know that the life i'm livin's no good,<br>I'll get a new start, live the life I should.<br>I'll get up and fly away, I'll get up and fly away, fly away.<br><br>Pearly's been true, true to me, true to my dyin' day he said,<br>I said to him, I said to him, I'm sure she's been.<br>I said to him, I'm sure she's been tru to you.<br><br>Got up and wandered, wandered downtown, nowhere to go but just hang around.<br>I've got a girl, named Bonnie Lee, I know that girl's been true to me.<br>I know she's been, I'm sure she's been true to me.<br><br>";
+        var samplePopupContentsHTML_WideShort = "Old man down, way down down, down by the docks of the city.Blind and dirty, asked me for a dime, a dime for a cup of coffee.I got no dime but I got some time to hear his story.My name is August West, and I love my Pearly Baker best more than my wine.More than my wine - more than my maker, though he's no friend of mine.Everyone said, I'd come to no good, I knew I would Pearly, believe them.<br>Half of my life, I spent doin' time for some other fucker's crime,The other half found me stumbling 'round drunk on Burgundy wine.But I'll get back on my feet again someday,The good Lord willin', if He says I may.I know that the life i'm livin's no good,I'll get a new start, live the life I should.I'll get up and fly away, I'll get up and fly away, fly away.Pearly's been true, true to me, true to my dyin' day he said,I said to him, I said to him, I'm sure she's been.I said to him, I'm sure she's been tru to you.Got up and wandered, wandered downtown, nowhere to go but just hang around.I've got a girl, named Bonnie Lee, I know that girl's been true to me.I know she's been, I'm sure she's been true to me.";
+        
+// different popup types
+
+    //anchored
+        AutoSizeAnchored = OpenLayers.Class(OpenLayers.Popup.Anchored, {
+            'autoSize': true
+        });
+
+        AutoSizeAnchoredMinSize = OpenLayers.Class(OpenLayers.Popup.Anchored, {
+            'autoSize': true, 
+            'minSize': new OpenLayers.Size(400,400)
+        });
+
+        AutoSizeAnchoredMaxSize = OpenLayers.Class(OpenLayers.Popup.Anchored, {
+            'autoSize': true, 
+            'maxSize': new OpenLayers.Size(100,100)
+        });
+
+        //anchoredbubble
+    
+        AutoSizeAnchoredBubble = OpenLayers.Class(OpenLayers.Popup.AnchoredBubble, {
+            'autoSize': true
+        });
+
+        AutoSizeAnchoredBubbleMinSize = OpenLayers.Class(OpenLayers.Popup.AnchoredBubble, {
+            'autoSize': true, 
+            'minSize': new OpenLayers.Size(400,400)
+        });
+
+        AutoSizeAnchoredBubbleMaxSize = OpenLayers.Class(OpenLayers.Popup.AnchoredBubble, {
+            'autoSize': true, 
+            'maxSize': new OpenLayers.Size(100,100)
+        });
+
+        //framed
+
+        //disable the autosize for the purpose of our matrix
+        OpenLayers.Popup.FramedCloud.prototype.autoSize = false;
+
+        AutoSizeFramedCloud = OpenLayers.Class(OpenLayers.Popup.FramedCloud, {
+            'autoSize': true
+        });
+
+        AutoSizeFramedCloudMinSize = OpenLayers.Class(OpenLayers.Popup.FramedCloud, {
+            'autoSize': true, 
+            'minSize': new OpenLayers.Size(400,400)
+        });
+
+        AutoSizeFramedCloudMaxSize = OpenLayers.Class(OpenLayers.Popup.FramedCloud, {
+            'autoSize': true, 
+            'maxSize': new OpenLayers.Size(100,100)
+        });
+
+        
+        function init(){
+            map = new OpenLayers.Map('map');
+
+            layer = new OpenLayers.Layer.Image(
+                "popupMatrix", 
+                "popupMatrix.jpg", 
+                new OpenLayers.Bounds(-82.5,-71.5,97.5,67.5),
+                new OpenLayers.Size(1024,768)
+            );
+            map.addLayer(layer);
+
+            markers = new OpenLayers.Layer.Markers("zibo");
+            map.addLayer(markers);
+
+            map.addControl(new OpenLayers.Control.LayerSwitcher());
+            map.zoomToMaxExtent();
+
+            addMarkers();
+        }
+        
+        function addMarkers() {
+
+            var ll, popupClass, popupContentHTML;
+
+        //
+        //Anchored NO OVERFLOW
+        //
+
+            //anchored popup small contents no autosize
+            ll = new OpenLayers.LonLat(-55,20);
+            popupClass = OpenLayers.Popup.Anchored;
+            popupContentHTML = '<img src="small.jpg"></img>';
+            addMarker(ll, popupClass, popupContentHTML);
+
+            //anchored popup small contents no autosize closebox
+            var ll = new OpenLayers.LonLat(-50,20);
+            popupClass = OpenLayers.Popup.Anchored;
+            popupContentHTML = '<img src="small.jpg"></img>';
+            addMarker(ll, popupClass, popupContentHTML, true);
+
+
+            //anchored popup small contents autosize
+            ll = new OpenLayers.LonLat(-40,20);
+            popupClass = AutoSizeAnchored;
+            popupContentHTML = '<img src="small.jpg"></img>';
+            addMarker(ll, popupClass, popupContentHTML);
+
+            //anchored popup small contents autosize closebox
+            ll = new OpenLayers.LonLat(-35,20);
+            popupClass = AutoSizeAnchored;
+            popupContentHTML = '<img src="small.jpg"></img>';
+            addMarker(ll, popupClass, popupContentHTML, true);
+
+
+            //anchored popup small contents autosize minsize
+            ll = new OpenLayers.LonLat(-25,20);
+            popupClass = AutoSizeAnchoredMinSize;
+            popupContentHTML = '<img src="small.jpg"></img>';
+            addMarker(ll, popupClass, popupContentHTML);
+
+            //anchored popup small contents autosize minsize closebox
+            ll = new OpenLayers.LonLat(-20,20);
+            popupClass = AutoSizeAnchoredMinSize;
+            popupContentHTML = '<img src="small.jpg"></img>';
+            addMarker(ll, popupClass, popupContentHTML, true);
+
+
+            //anchored popup small contents autosize maxsize
+            ll = new OpenLayers.LonLat(-10,20);
+            popupClass = AutoSizeAnchoredMaxSize;
+            popupContentHTML = '<img src="small.jpg"></img>';
+            addMarker(ll, popupClass, popupContentHTML);
+
+            //anchored popup small contents autosize maxsize closebox
+            ll = new OpenLayers.LonLat(-5,20);
+            popupClass = AutoSizeAnchoredMaxSize;
+            popupContentHTML = '<img src="small.jpg"></img>';
+            addMarker(ll, popupClass, popupContentHTML, true);
+
+
+            //anchored popup bigger contents autosize
+            ll = new OpenLayers.LonLat(5,20);
+            popupClass = AutoSizeAnchored;
+            popupContentHTML = '<div style="background-color:red;">Popup.Anchored<br>autosize<br>' + samplePopupContentsHTML + '</div>' 
+            addMarker(ll, popupClass, popupContentHTML);
+
+            //anchored popup bigger contents autosize closebox
+            ll = new OpenLayers.LonLat(10,20);
+            popupClass = AutoSizeAnchored;
+            popupContentHTML = '<div style="background-color:red;">Popup.Anchored<br>autosize<br>closebox<br>' + samplePopupContentsHTML + '</div>' 
+            addMarker(ll, popupClass, popupContentHTML, true);
+
+            //anchored popup wide short text contents autosize
+            ll = new OpenLayers.LonLat(20,20);
+            popupClass = AutoSizeAnchored;
+            popupContentHTML = '<div style="background-color:red;">Popup.Anchored<br>autosize - wide short text<br>' + samplePopupContentsHTML_WideShort + '</div>' 
+            addMarker(ll, popupClass, popupContentHTML);
+
+            //anchored popup wide short text contents autosize closebox
+            ll = new OpenLayers.LonLat(25,20);
+            popupClass = AutoSizeAnchored;
+            popupContentHTML = '<div style="background-color:red;">Popup.Anchored<br>autosize - wide short text<br>closebox<br>' + samplePopupContentsHTML_WideShort + '</div>' 
+            addMarker(ll, popupClass, popupContentHTML, true);
+
+
+            //anchored popup wide short fixed contents autosize
+            ll = new OpenLayers.LonLat(35,20);
+            popupClass = AutoSizeAnchored;
+            popupContentHTML = '<img src="wideshort.jpg"></img>';
+            addMarker(ll, popupClass, popupContentHTML);
+
+            //anchored popup wide short fixed contents autosize closebox
+            ll = new OpenLayers.LonLat(40,20);
+            popupClass = AutoSizeAnchored;
+            popupContentHTML = '<img src="wideshort.jpg"></img>';
+            addMarker(ll, popupClass, popupContentHTML, true);
+
+
+            //anchored popup thin long fixed contents autosize
+            ll = new OpenLayers.LonLat(50,20);
+            popupClass = AutoSizeAnchored;
+            popupContentHTML = '<img src="thinlong.jpg"></img>';
+            addMarker(ll, popupClass, popupContentHTML);
+
+            //anchored popup thin long fixed contents autosize closebox
+            ll = new OpenLayers.LonLat(55,20);
+            popupClass = AutoSizeAnchored;
+            popupContentHTML = '<img src="thinlong.jpg"></img>';
+            addMarker(ll, popupClass, popupContentHTML, true);
+
+
+            //anchored popup wide long fixed contents autosize
+            ll = new OpenLayers.LonLat(65,20);
+            popupClass = AutoSizeAnchored;
+            popupContentHTML = '<img  src="widelong.jpg"></img>' 
+            addMarker(ll, popupClass, popupContentHTML);
+
+            //anchored popup wide long fixed contents autosize closebox
+            ll = new OpenLayers.LonLat(70,20);
+            popupClass = AutoSizeAnchored;
+            popupContentHTML = '<img  src="widelong.jpg"></img>' 
+            addMarker(ll, popupClass, popupContentHTML, true);
+
+        //
+        //Anchored WITH OVERFLOW
+        //
+
+            //anchored popup small contents no autosize overflow
+            var ll = new OpenLayers.LonLat(-55,15);
+            popupClass = OpenLayers.Popup.Anchored;
+            popupContentHTML = '<img src="small.jpg"></img>';
+            addMarker(ll, popupClass, popupContentHTML, false, true);
+
+            //anchored popup small contents no autosize closebox overflow
+            var ll = new OpenLayers.LonLat(-50,15);
+            popupClass = OpenLayers.Popup.Anchored;
+            popupContentHTML = '<img src="small.jpg"></img>';
+            addMarker(ll, popupClass, popupContentHTML, true, true);
+
+
+            //anchored popup small contents autosize overflow
+            ll = new OpenLayers.LonLat(-40,15);
+            popupClass = AutoSizeAnchored;
+            popupContentHTML = '<img src="small.jpg"></img>';
+            addMarker(ll, popupClass, popupContentHTML, false, true);
+
+            //anchored popup small contents autosize closebox overflow
+            ll = new OpenLayers.LonLat(-35,15);
+            popupClass = AutoSizeAnchored;
+            popupContentHTML = '<img src="small.jpg"></img>';
+            addMarker(ll, popupClass, popupContentHTML, true, true);
+
+
+            //anchored popup small contents autosize minsize overflow
+            ll = new OpenLayers.LonLat(-25,15);
+            popupClass = AutoSizeAnchoredMinSize;
+            popupContentHTML = '<img src="small.jpg"></img>';
+            addMarker(ll, popupClass, popupContentHTML, false, true);
+
+            //anchored popup small contents autosize minsize closebox overflow
+            ll = new OpenLayers.LonLat(-20,15);
+            popupClass = AutoSizeAnchoredMinSize;
+            popupContentHTML = '<img src="small.jpg"></img>';
+            addMarker(ll, popupClass, popupContentHTML, true, true);
+
+
+            //anchored popup small contents autosize maxsize overflow
+            ll = new OpenLayers.LonLat(-10,15);
+            popupClass = AutoSizeAnchoredMaxSize;
+            popupContentHTML = '<img src="small.jpg"></img>';
+            addMarker(ll, popupClass, popupContentHTML, false, true);
+
+            //anchored popup small contents autosize maxsize closebox overflow
+            ll = new OpenLayers.LonLat(-5,15);
+            popupClass = AutoSizeAnchoredMaxSize;
+            popupContentHTML = '<img src="small.jpg"></img>';
+            addMarker(ll, popupClass, popupContentHTML, true, true);
+
+
+            //anchored popup bigger contents autosize overflow
+            ll = new OpenLayers.LonLat(5,15);
+            popupClass = AutoSizeAnchored;
+            popupContentHTML = '<div style="background-color:red;">Popup.Anchored<br>autosize<br>overflow<br>' + samplePopupContentsHTML + '</div>' 
+            addMarker(ll, popupClass, popupContentHTML, false, true);
+
+            //anchored popup bigger contents autosize closebox overflow
+            ll = new OpenLayers.LonLat(10,15);
+            popupClass = AutoSizeAnchored;
+            popupContentHTML = '<div style="background-color:red;">Popup.Anchored<br>autosize<br>overflow<br>closebox<br>' + samplePopupContentsHTML + '</div>' 
+            addMarker(ll, popupClass, popupContentHTML, true, true);
+
+
+            //anchored popup wide short text contents autosize overflow
+            ll = new OpenLayers.LonLat(20,15);
+            popupClass = AutoSizeAnchored;
+            popupContentHTML = '<div style="background-color:red;">Popup.Anchored<br>autosize<br>overflow<br>' + samplePopupContentsHTML_WideShort + '</div>' 
+            addMarker(ll, popupClass, popupContentHTML, false, true);
+
+            //anchored popup wide short text contents autosize closebox overflow
+            ll = new OpenLayers.LonLat(25,15);
+            popupClass = AutoSizeAnchored;
+            popupContentHTML = '<div style="background-color:red;">Popup.Anchored<br>autosize<br>overflow<br>closebox<br>' + samplePopupContentsHTML_WideShort + '</div>' 
+            addMarker(ll, popupClass, popupContentHTML, true, true);
+
+            //anchored popup wide short fixed contents autosize overflow
+            ll = new OpenLayers.LonLat(35,15);
+            popupClass = AutoSizeAnchored;
+            popupContentHTML = '<img src="wideshort.jpg"></img>' 
+            addMarker(ll, popupClass, popupContentHTML, false, true);
+
+            //anchored popup wide short fixed contents autosize closebox overflow
+            ll = new OpenLayers.LonLat(40,15);
+            popupClass = AutoSizeAnchored;
+            popupContentHTML = '<img src="wideshort.jpg"></img>' 
+            addMarker(ll, popupClass, popupContentHTML, true, true);
+
+
+            //anchored popup thin long fixed contents autosize overflow
+            ll = new OpenLayers.LonLat(50,15);
+            popupClass = AutoSizeAnchored;
+            popupContentHTML = '<img src="thinlong.jpg"></img>' 
+            addMarker(ll, popupClass, popupContentHTML, false, true);
+
+            //anchored popup thin long fixed contents autosize closebox overflow
+            ll = new OpenLayers.LonLat(55,15);
+            popupClass = AutoSizeAnchored;
+            popupContentHTML = '<img src="thinlong.jpg"></img>' 
+            addMarker(ll, popupClass, popupContentHTML, true, true);
+
+
+            //anchored popup wide long fixed contents autosize overflow
+            ll = new OpenLayers.LonLat(65,15);
+            popupClass = AutoSizeAnchored;
+            popupContentHTML = '<img src="widelong.jpg"></img>' 
+            addMarker(ll, popupClass, popupContentHTML, false, true);
+
+            //anchored popup wide long fixed contents autosize closebox overflow
+            ll = new OpenLayers.LonLat(70,15);
+            popupClass = AutoSizeAnchored;
+            popupContentHTML = '<img src="widelong.jpg"></img>' 
+            addMarker(ll, popupClass, popupContentHTML, true, true);
+
+
+        //
+        //Bubble NO OVERFLOW
+        //
+
+            //anchored bubble popup small contents no autosize
+            var ll = new OpenLayers.LonLat(-55,5);
+            popupClass = OpenLayers.Popup.AnchoredBubble;
+            popupContentHTML = '<img src="small.jpg"></img>';
+            addMarker(ll, popupClass, popupContentHTML, false);
+
+            //anchored bubble popup small contents no autosize closebox
+            var ll = new OpenLayers.LonLat(-50,5);
+            popupClass = OpenLayers.Popup.AnchoredBubble;
+            popupContentHTML = '<img src="small.jpg"></img>';
+            addMarker(ll, popupClass, popupContentHTML, true);
+
+
+            //anchored bubble popup small contents autosize
+            ll = new OpenLayers.LonLat(-40,5);
+            popupClass = AutoSizeAnchoredBubble;
+            popupContentHTML = '<img src="small.jpg"></img>';
+            addMarker(ll, popupClass, popupContentHTML, false);
+
+            //anchored bubble popup small contents autosize closebox
+            ll = new OpenLayers.LonLat(-35,5);
+            popupClass = AutoSizeAnchoredBubble;
+            popupContentHTML = '<img src="small.jpg"></img>';
+            addMarker(ll, popupClass, popupContentHTML, true);
+
+
+            //anchored bubble popup small contents autosize minsize
+            ll = new OpenLayers.LonLat(-25,5);
+            popupClass = AutoSizeAnchoredBubbleMinSize;
+            popupContentHTML = '<img src="small.jpg"></img>';
+            addMarker(ll, popupClass, popupContentHTML, false);
+
+            //anchored bubble popup small contents autosize minsize closebox
+            ll = new OpenLayers.LonLat(-20,5);
+            popupClass = AutoSizeAnchoredBubbleMinSize;
+            popupContentHTML = '<img src="small.jpg"></img>';
+            addMarker(ll, popupClass, popupContentHTML, true);
+
+
+            //anchored bubble popup small contents autosize maxsize
+            ll = new OpenLayers.LonLat(-10,5);
+            popupClass = AutoSizeAnchoredBubbleMaxSize;
+            popupContentHTML = '<img src="small.jpg"></img>';
+            addMarker(ll, popupClass, popupContentHTML, false);
+
+            //anchored bubble popup small contents autosize maxsize closebox
+            ll = new OpenLayers.LonLat(-5,5);
+            popupClass = AutoSizeAnchoredBubbleMaxSize;
+            popupContentHTML = '<img src="small.jpg"></img>';
+            addMarker(ll, popupClass, popupContentHTML, true);
+
+
+            //anchored bubble popup bigger contents autosize closebox
+            ll = new OpenLayers.LonLat(5,5);
+            popupClass = AutoSizeAnchoredBubble;
+            popupContentHTML = '<div style="background-color:red;">Popup.AnchoredBubble<br>autosize<br>' + samplePopupContentsHTML + '</div>' 
+            addMarker(ll, popupClass, popupContentHTML, false);
+
+            //anchored bubble popup bigger contents autosize closebox
+            ll = new OpenLayers.LonLat(10,5);
+            popupClass = AutoSizeAnchoredBubble;
+            popupContentHTML = '<div style="background-color:red;">Popup.AnchoredBubble<br>autosize<br>closebox<br>' + samplePopupContentsHTML + '</div>' 
+            addMarker(ll, popupClass, popupContentHTML, true);
+
+
+            //anchored bubble popup wide short text contents autosize
+            ll = new OpenLayers.LonLat(20,5);
+            popupClass = AutoSizeAnchoredBubble;
+            popupContentHTML = '<div style="background-color:red;">Popup.AnchoredBubble<br>autosize - wide short text<br>' + samplePopupContentsHTML_WideShort + '</div>' 
+            addMarker(ll, popupClass, popupContentHTML);
+
+            //anchored bubble popup wide short text contents autosize closebox
+            ll = new OpenLayers.LonLat(25,5);
+            popupClass = AutoSizeAnchoredBubble;
+            popupContentHTML = '<div style="background-color:red;">Popup.AnchoredBubble<br>autosize - wide short text<br>closebox<br>' + samplePopupContentsHTML_WideShort + '</div>' 
+            addMarker(ll, popupClass, popupContentHTML, true);
+
+
+            //anchored bubble popup wide short fixed contents autosize
+            ll = new OpenLayers.LonLat(35,5);
+            popupClass = AutoSizeAnchoredBubble;
+            popupContentHTML = '<img src="wideshort.jpg"></img>' 
+            addMarker(ll, popupClass, popupContentHTML);
+
+            //anchored bubble popup wide short fixed contents autosize closebox
+            ll = new OpenLayers.LonLat(40,5);
+            popupClass = AutoSizeAnchoredBubble;
+            popupContentHTML = '<img src="wideshort.jpg"></img>' 
+            addMarker(ll, popupClass, popupContentHTML, true);
+
+
+            //anchored bubble popup thin long fixed contents autosize
+            ll = new OpenLayers.LonLat(50,5);
+            popupClass = AutoSizeAnchoredBubble;
+            popupContentHTML = '<img src="thinlong.jpg"></img>' 
+            addMarker(ll, popupClass, popupContentHTML);
+
+            //anchored bubble popup thin long fixed contents autosize closebox
+            ll = new OpenLayers.LonLat(55,5);
+            popupClass = AutoSizeAnchoredBubble;
+            popupContentHTML = '<img src="thinlong.jpg"></img>' 
+            addMarker(ll, popupClass, popupContentHTML, true);
+
+
+            //anchored bubble popup wide long fixed contents autosize
+            ll = new OpenLayers.LonLat(65,5);
+            popupClass = AutoSizeAnchoredBubble;
+            popupContentHTML = '<img src="widelong.jpg"></img>' 
+            addMarker(ll, popupClass, popupContentHTML);
+
+            //anchored bubble popup wide long fixed contents autosize closebox
+            ll = new OpenLayers.LonLat(70,5);
+            popupClass = AutoSizeAnchoredBubble;
+            popupContentHTML = '<img src="widelong.jpg"></img>' 
+            addMarker(ll, popupClass, popupContentHTML, true);
+
+          //
+          //Bubble OVERFLOW
+          //
+
+              //anchored bubble popup small contents no autosize
+            var ll = new OpenLayers.LonLat(-55,0);
+            popupClass = OpenLayers.Popup.AnchoredBubble;
+            popupContentHTML = '<img src="small.jpg"></img>';
+            addMarker(ll, popupClass, popupContentHTML, false, true);
+
+              //anchored bubble popup small contents no autosize closebox
+            var ll = new OpenLayers.LonLat(-50,0);
+            popupClass = OpenLayers.Popup.AnchoredBubble;
+            popupContentHTML = '<img src="small.jpg"></img>';
+            addMarker(ll, popupClass, popupContentHTML, true, true);
+
+
+            //anchored bubble popup small contents autosize
+            ll = new OpenLayers.LonLat(-40,0);
+            popupClass = AutoSizeAnchoredBubble;
+            popupContentHTML = '<img src="small.jpg"></img>';
+            addMarker(ll, popupClass, popupContentHTML, false, true);
+
+            //anchored bubble popup small contents autosize closebox
+            ll = new OpenLayers.LonLat(-35,0);
+            popupClass = AutoSizeAnchoredBubble;
+            popupContentHTML = '<img src="small.jpg"></img>';
+            addMarker(ll, popupClass, popupContentHTML, true, true);
+
+
+            //anchored bubble popup small contents autosize minsize
+            ll = new OpenLayers.LonLat(-25,0);
+            popupClass = AutoSizeAnchoredBubbleMinSize;
+            popupContentHTML = '<img src="small.jpg"></img>';
+            addMarker(ll, popupClass, popupContentHTML, false, true);
+
+            //anchored bubble popup small contents autosize minsize closebox
+            ll = new OpenLayers.LonLat(-20,0);
+            popupClass = AutoSizeAnchoredBubbleMinSize;
+            popupContentHTML = '<img src="small.jpg"></img>';
+            addMarker(ll, popupClass, popupContentHTML, true, true);
+
+
+            //anchored bubble popup small contents autosize maxsize
+            ll = new OpenLayers.LonLat(-10,0);
+            popupClass = AutoSizeAnchoredBubbleMaxSize;
+            popupContentHTML = '<img src="small.jpg"></img>';
+            addMarker(ll, popupClass, popupContentHTML, false, true);
+
+            //anchored bubble popup small contents autosize maxsize closebox
+            ll = new OpenLayers.LonLat(-5,0);
+            popupClass = AutoSizeAnchoredBubbleMaxSize;
+            popupContentHTML = '<img src="small.jpg"></img>';
+            addMarker(ll, popupClass, popupContentHTML, true, true);
+
+
+            //anchored bubble popup bigger contents autosize closebox
+            ll = new OpenLayers.LonLat(5,0);
+            popupClass = AutoSizeAnchoredBubble;
+            popupContentHTML = '<div style="background-color:red;">Popup.AnchoredBubble<br>autosize<br>overflow<br>' + samplePopupContentsHTML + '</div>' 
+            addMarker(ll, popupClass, popupContentHTML, false, true);
+
+            //anchored bubble popup bigger contents autosize closebox
+            ll = new OpenLayers.LonLat(10,0);
+            popupClass = AutoSizeAnchoredBubble;
+            popupContentHTML = '<div style="background-color:red;">Popup.AnchoredBubble<br>autosize<br>closebox<br>overflow<br>' + samplePopupContentsHTML + '</div>' 
+            addMarker(ll, popupClass, popupContentHTML, true, true);
+
+
+            //anchored bubble popup wide short contents autosize overflow
+            ll = new OpenLayers.LonLat(20,0);
+            popupClass = AutoSizeAnchoredBubble;
+            popupContentHTML = '<div style="background-color:red;">Popup.AnchoredBubble<br>autosize<br>overflow<br>' + samplePopupContentsHTML_WideShort + '</div>' 
+            addMarker(ll, popupClass, popupContentHTML, false, true);
+
+            //anchored bubble popup wide short contents autosize closebox overflow
+            ll = new OpenLayers.LonLat(25,0);
+            popupClass = AutoSizeAnchoredBubble;
+            popupContentHTML = '<div style="background-color:red;">Popup.AnchoredBubble<br>autosize<br>overflow<br>closebox<br>' + samplePopupContentsHTML_WideShort + '</div>' 
+            addMarker(ll, popupClass, popupContentHTML, true, true);
+
+
+            //anchored bubble popup wide short fixed contents autosize overflow
+            ll = new OpenLayers.LonLat(35,0);
+            popupClass = AutoSizeAnchoredBubble;
+            popupContentHTML = '<img src="wideshort.jpg"></img>' 
+            addMarker(ll, popupClass, popupContentHTML, false, true);
+
+            //anchored bubble popup wide short fixed contents autosize closebox overflow
+            ll = new OpenLayers.LonLat(40,0);
+            popupClass = AutoSizeAnchoredBubble;
+            popupContentHTML = '<img src="wideshort.jpg"></img>' 
+            addMarker(ll, popupClass, popupContentHTML, true, true);
+
+
+            //anchored bubble popup thin long fixed contents autosize overflow
+            ll = new OpenLayers.LonLat(50,0);
+            popupClass = AutoSizeAnchoredBubble;
+            popupContentHTML = '<img src="thinlong.jpg"></img>' 
+            addMarker(ll, popupClass, popupContentHTML, false, true);
+
+            //anchored bubble popup thin long fixed contents autosize closebox overflow
+            ll = new OpenLayers.LonLat(55,0);
+            popupClass = AutoSizeAnchoredBubble;
+            popupContentHTML = '<img src="thinlong.jpg"></img>' 
+            addMarker(ll, popupClass, popupContentHTML, true, true);
+
+
+            //anchored bubble popup wide long fixed contents autosize overflow
+            ll = new OpenLayers.LonLat(65,0);
+            popupClass = AutoSizeAnchoredBubble;
+            popupContentHTML = '<img src="widelong.jpg"></img>' 
+            addMarker(ll, popupClass, popupContentHTML, false, true);
+
+            //anchored bubble popup wide long fixed contents autosize closebox overflow
+            ll = new OpenLayers.LonLat(70,0);
+            popupClass = AutoSizeAnchoredBubble;
+            popupContentHTML = '<img src="widelong.jpg"></img>' 
+            addMarker(ll, popupClass, popupContentHTML, true, true);
+
+   //FRAMED
+ 
+          //
+          //FRAMED NO OVERFLOW
+          //
+
+              //anchored bubble popup small contents no autosize
+            var ll = new OpenLayers.LonLat(-55,-15);
+            popupClass = OpenLayers.Popup.FramedCloud;
+            popupContentHTML = '<img src="small.jpg"></img>';
+            addMarker(ll, popupClass, popupContentHTML, false);
+
+              //anchored bubble popup small contents no autosize closebox
+            var ll = new OpenLayers.LonLat(-50,-15);
+            popupClass = OpenLayers.Popup.FramedCloud;
+            popupContentHTML = '<img src="small.jpg"></img>';
+            addMarker(ll, popupClass, popupContentHTML, true);
+
+
+            //anchored bubble popup small contents autosize
+            ll = new OpenLayers.LonLat(-40,-15);
+            popupClass = AutoSizeFramedCloud;
+            popupContentHTML = '<img src="small.jpg"></img>';
+            addMarker(ll, popupClass, popupContentHTML, false);
+
+            //anchored bubble popup small contents autosize closebox
+            ll = new OpenLayers.LonLat(-35,-15);
+            popupClass = AutoSizeFramedCloud;
+            popupContentHTML = '<img src="small.jpg"></img>';
+            addMarker(ll, popupClass, popupContentHTML, true);
+
+
+            //anchored bubble popup small contents autosize minsize
+            ll = new OpenLayers.LonLat(-25,-15);
+            popupClass = AutoSizeFramedCloudMinSize;
+            popupContentHTML = '<img src="small.jpg"></img>';
+            addMarker(ll, popupClass, popupContentHTML, false);
+
+            //anchored bubble popup small contents autosize minsize closebox
+            ll = new OpenLayers.LonLat(-20,-15);
+            popupClass = AutoSizeFramedCloudMinSize;
+            popupContentHTML = '<img src="small.jpg"></img>';
+            addMarker(ll, popupClass, popupContentHTML, true);
+
+
+            //anchored bubble popup small contents autosize maxsize
+            ll = new OpenLayers.LonLat(-10,-15);
+            popupClass = AutoSizeFramedCloudMaxSize;
+            popupContentHTML = '<img src="small.jpg"></img>';
+            addMarker(ll, popupClass, popupContentHTML, false);
+
+            //anchored bubble popup small contents autosize maxsize closebox
+            ll = new OpenLayers.LonLat(-5,-15);
+            popupClass = AutoSizeFramedCloudMaxSize;
+            popupContentHTML = '<img src="small.jpg"></img>';
+            addMarker(ll, popupClass, popupContentHTML, true);
+
+
+            //anchored bubble popup bigger contents autosize closebox
+            ll = new OpenLayers.LonLat(5,-15);
+            popupClass = AutoSizeFramedCloud;
+            popupContentHTML = '<div style="background-color:red;">Popup.FramedCloud<br>autosize<br>' + samplePopupContentsHTML + '</div>' 
+            addMarker(ll, popupClass, popupContentHTML, false);
+
+            //anchored bubble popup bigger contents autosize closebox
+            ll = new OpenLayers.LonLat(10,-15);
+            popupClass = AutoSizeFramedCloud;
+            popupContentHTML = '<div style="background-color:red;">Popup.FramedCloud<br>autosize<br>closebox<br>' + samplePopupContentsHTML + '</div>' 
+            addMarker(ll, popupClass, popupContentHTML, true);
+
+
+            //anchored bubble popup wide short text contents autosize
+            ll = new OpenLayers.LonLat(20,-15);
+            popupClass = AutoSizeFramedCloud;
+            popupContentHTML = '<div style="background-color:red;">Popup.FramedCloud<br>autosize - wide short text<br>' + samplePopupContentsHTML_WideShort + '</div>' 
+            addMarker(ll, popupClass, popupContentHTML);
+
+            //anchored bubble popup wide short text contents autosize closebox
+            ll = new OpenLayers.LonLat(25,-15);
+            popupClass = AutoSizeFramedCloud;
+            popupContentHTML = '<div style="background-color:red;">Popup.FramedCloud<br>autosize - wide short text<br>closebox<br>' + samplePopupContentsHTML_WideShort + '</div>' 
+            addMarker(ll, popupClass, popupContentHTML, true);
+
+
+            //anchored bubble popup wide short fixed contents autosize
+            ll = new OpenLayers.LonLat(35,-15);
+            popupClass = AutoSizeFramedCloud;
+            popupContentHTML = '<img src="wideshort.jpg"></img>' 
+            addMarker(ll, popupClass, popupContentHTML);
+
+            //anchored bubble popup wide short fixed contents autosize closebox
+            ll = new OpenLayers.LonLat(40,-15);
+            popupClass = AutoSizeFramedCloud;
+            popupContentHTML = '<img src="wideshort.jpg"></img>' 
+            addMarker(ll, popupClass, popupContentHTML, true);
+
+
+            //anchored bubble popup thin long fixed contents autosize
+            ll = new OpenLayers.LonLat(50,-15);
+            popupClass = AutoSizeFramedCloud;
+            popupContentHTML = '<img src="thinlong.jpg"></img>' 
+            addMarker(ll, popupClass, popupContentHTML);
+
+            //anchored bubble popup thin long fixed contents autosize closebox
+            ll = new OpenLayers.LonLat(55,-15);
+            popupClass = AutoSizeFramedCloud;
+            popupContentHTML = '<img src="thinlong.jpg"></img>' 
+            addMarker(ll, popupClass, popupContentHTML, true);
+
+
+            //anchored bubble popup wide long fixed contents autosize
+            ll = new OpenLayers.LonLat(65,-15);
+            popupClass = AutoSizeFramedCloud;
+            popupContentHTML = '<img src="widelong.jpg"></img>' 
+            addMarker(ll, popupClass, popupContentHTML);
+
+            //anchored bubble popup wide long fixed contents autosize closebox
+            ll = new OpenLayers.LonLat(70,-15);
+            popupClass = AutoSizeFramedCloud;
+            popupContentHTML = '<img src="widelong.jpg"></img>' 
+            addMarker(ll, popupClass, popupContentHTML, true);
+
+          //
+          //FRAMED OVERFLOW
+          //
+
+              //anchored bubble popup small contents no autosize
+            var ll = new OpenLayers.LonLat(-55,-20);
+            popupClass = OpenLayers.Popup.FramedCloud;
+            popupContentHTML = '<img src="small.jpg"></img>';
+            addMarker(ll, popupClass, popupContentHTML, false, true);
+
+              //anchored bubble popup small contents no autosize closebox
+            var ll = new OpenLayers.LonLat(-50,-20);
+            popupClass = OpenLayers.Popup.FramedCloud;
+            popupContentHTML = '<img src="small.jpg"></img>';
+            addMarker(ll, popupClass, popupContentHTML, true, true);
+
+
+            //anchored bubble popup small contents autosize
+            ll = new OpenLayers.LonLat(-40,-20);
+            popupClass = AutoSizeFramedCloud;
+            popupContentHTML = '<img src="small.jpg"></img>';
+            addMarker(ll, popupClass, popupContentHTML, false, true);
+
+            //anchored bubble popup small contents autosize closebox
+            ll = new OpenLayers.LonLat(-35,-20);
+            popupClass = AutoSizeFramedCloud;
+            popupContentHTML = '<img src="small.jpg"></img>';
+            addMarker(ll, popupClass, popupContentHTML, true, true);
+
+
+            //anchored bubble popup small contents autosize minsize
+            ll = new OpenLayers.LonLat(-25,-20);
+            popupClass = AutoSizeFramedCloudMinSize;
+            popupContentHTML = '<img src="small.jpg"></img>';
+            addMarker(ll, popupClass, popupContentHTML, false, true);
+
+            //anchored bubble popup small contents autosize minsize closebox
+            ll = new OpenLayers.LonLat(-20,-20);
+            popupClass = AutoSizeFramedCloudMinSize;
+            popupContentHTML = '<img src="small.jpg"></img>';
+            addMarker(ll, popupClass, popupContentHTML, true, true);
+
+
+            //anchored bubble popup small contents autosize maxsize
+            ll = new OpenLayers.LonLat(-10,-20);
+            popupClass = AutoSizeFramedCloudMaxSize;
+            popupContentHTML = '<img src="small.jpg"></img>';
+            addMarker(ll, popupClass, popupContentHTML, false, true);
+
+            //anchored bubble popup small contents autosize maxsize closebox
+            ll = new OpenLayers.LonLat(-5,-20);
+            popupClass = AutoSizeFramedCloudMaxSize;
+            popupContentHTML = '<img src="small.jpg"></img>';
+            addMarker(ll, popupClass, popupContentHTML, true, true);
+
+
+            //anchored bubble popup bigger contents autosize closebox
+            ll = new OpenLayers.LonLat(5,-20);
+            popupClass = AutoSizeFramedCloud;
+            popupContentHTML = '<div style="background-color:red;">Popup.FramedCloud<br>autosize<br>overflow<br>' + samplePopupContentsHTML + '</div>' 
+            addMarker(ll, popupClass, popupContentHTML, false, true);
+
+            //anchored bubble popup bigger contents autosize closebox
+            ll = new OpenLayers.LonLat(10,-20);
+            popupClass = AutoSizeFramedCloud;
+            popupContentHTML = '<div style="background-color:red;">Popup.FramedCloud<br>autosize<br>closebox<br>overflow<br>' + samplePopupContentsHTML + '</div>' 
+            addMarker(ll, popupClass, popupContentHTML, true, true);
+
+
+            //anchored bubble popup wide short contents autosize overflow
+            ll = new OpenLayers.LonLat(20,-20);
+            popupClass = AutoSizeFramedCloud;
+            popupContentHTML = '<div style="background-color:red;">Popup.FramedCloud<br>autosize<br>overflow<br>' + samplePopupContentsHTML_WideShort + '</div>' 
+            addMarker(ll, popupClass, popupContentHTML, false, true);
+
+            //anchored bubble popup wide short contents autosize closebox overflow
+            ll = new OpenLayers.LonLat(25,-20);
+            popupClass = AutoSizeFramedCloud;
+            popupContentHTML = '<div style="background-color:red;">Popup.FramedCloud<br>autosize<br>overflow<br>closebox<br>' + samplePopupContentsHTML_WideShort + '</div>' 
+            addMarker(ll, popupClass, popupContentHTML, true, true);
+
+
+            //anchored bubble popup wide short fixed contents autosize overflow
+            ll = new OpenLayers.LonLat(35,-20);
+            popupClass = AutoSizeFramedCloud;
+            popupContentHTML = '<img src="wideshort.jpg"></img>' 
+            addMarker(ll, popupClass, popupContentHTML, false, true);
+
+            //anchored bubble popup wide short fixed contents autosize closebox overflow
+            ll = new OpenLayers.LonLat(40,-20);
+            popupClass = AutoSizeFramedCloud;
+            popupContentHTML = '<img src="wideshort.jpg"></img>' 
+            addMarker(ll, popupClass, popupContentHTML, true, true);
+
+
+            //anchored bubble popup thin long fixed contents autosize overflow
+            ll = new OpenLayers.LonLat(50,-20);
+            popupClass = AutoSizeFramedCloud;
+            popupContentHTML = '<img src="thinlong.jpg"></img>' 
+            addMarker(ll, popupClass, popupContentHTML, false, true);
+
+            //anchored bubble popup thin long fixed contents autosize closebox overflow
+            ll = new OpenLayers.LonLat(55,-20);
+            popupClass = AutoSizeFramedCloud;
+            popupContentHTML = '<img src="thinlong.jpg"></img>' 
+            addMarker(ll, popupClass, popupContentHTML, true, true);
+
+
+            //anchored bubble popup wide long fixed contents autosize overflow
+            ll = new OpenLayers.LonLat(65,-20);
+            popupClass = AutoSizeFramedCloud;
+            popupContentHTML = '<img src="widelong.jpg"></img>' 
+            addMarker(ll, popupClass, popupContentHTML, false, true);
+
+            //anchored bubble popup wide long fixed contents autosize closebox overflow
+            ll = new OpenLayers.LonLat(70,-20);
+            popupClass = AutoSizeFramedCloud;
+            popupContentHTML = '<img src="widelong.jpg"></img>' 
+            addMarker(ll, popupClass, popupContentHTML, true, 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(layer, 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>
+      <p id="shortdesc">
+          All kinds of different popup configurations.
+      </p>
+
+      <div id="map"></div>
+
+        <!-- preloading these images so the autosize will work correctly -->
+        <img src="small.jpg" style="position:absolute; top:-5000px; left: -5000px"></img>
+        <img src="wideshort.jpg" style="position:absolute; top:-5000px; left: -5000px"></img>
+        <img src="widelong.jpg" style="position:absolute; top:-5000px; left: -5000px"></img>
+        <img src="thinlong.jpg" style="position:absolute; top:-5000px; left: -5000px"></img>
+
+      <br/>      
+
+      
+   </div>
+  </body>
+</html>

examples/popups.html

@@ -1,5 +1,6 @@
 <html xmlns="http://www.w3.org/1999/xhtml">
   <head>
+    <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
     <style type="text/css">
         #map {
             width: 512px;
@@ -7,8 +8,8 @@
             border: 1px solid black;
         }
     </style>
-    <script src="../lib/OpenLayers.js"></script>
     <script src='http://maps.google.com/maps?file=api&amp;v=2&amp;key=ABQIAAAAjpkAC9ePGem0lIq5XcMiuhR_wWLPFku8Ix9i2SXYRVK3e45q1BQUd_beF8dtzKET_EteAjPdGDwqpQ'></script>
+    <script src="../lib/OpenLayers.js"></script>
     <script type="text/javascript">
         var map, layer, popup;
         var markers, feature, marker;
@@ -71,25 +72,14 @@
         }
         
         function mousedown(evt) {
-             // check to see if the popup was hidden by the close box
-             // if so, then destroy it before continuing
-            if (popup != null) {
-                if (!popup.visible()) {
-                    markers.map.removePopup(popup);
-                    popup.destroy();
-                    popup = null;
-                }
-            }
             if (popup == null) {
                 popup = feature.createPopup(true);
-                popup.setContentHTML("<a href='http://www.somethingconstructive.net' target='_blank'>click me</a>");
+                popup.setContentHTML("<div style='background-color:red; width:150;height:100'><a href='http://www.somethingconstructive.net' target='_blank'>click me</a></div>");
                 popup.setBackgroundColor("yellow");
                 popup.setOpacity(0.7);
                 markers.map.addPopup(popup);
             } else {
-                markers.map.removePopup(popup);
-                popup.destroy();
-                popup = null;
+                popup.toggle();
                }
             OpenLayers.Event.stop(evt);
         }        
@@ -120,6 +110,14 @@
     </script>
   </head>
   <body onload="init()">
+  <h1 id="title">Popup Mayhem</h1>
+
+  <div id="tags">
+  </div>
+  <p id="shortdesc">
+      All kinds of ways to create and interact with Popups.
+  </p>
+
   <div id="map"></div>
     <p>If you open an anchoredbubble and switch to google, it shouldn't crash. If it does, don't release OpenLayers.</p>  
     <div style="background-color:purple" onclick="add()"> click to add Popup to map</div>
@@ -129,5 +127,8 @@
     <div style="background-color:grey" onclick="removelayer()"> click to remove the markers layer</div>
     <div style="background-color:orange" onclick="alert(marker.onScreen())"> marker.onscreen()?</div>
     <div style="background-color:yellow" onclick="destroy()"> click to destroy the popup from map</div> 
+    <div id="docs">
+      Detailed description of this example needs to be written.
+   </div>
   </body>
 </html>

examples/projected-map.html

@@ -1,6 +1,7 @@
 <html xmlns="http://www.w3.org/1999/xhtml">
   <head>
 
+    <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
     <style type="text/css">
     body {
     border: 0px;
@@ -55,6 +56,13 @@
   </head>
 
 <body onload="init()">
+  <h1 id="title">Layer Projections</h1>
+
+  <div id="tags">
+  </div>
+  <p id="shortdesc">
+      Use different (not default) projections with your map 
+  </p>
     <div id="map"></div>
     <p>When using alternative projections, you still use OpenLayers.LonLat objects, even though
        the properties are actually X/Y values at that point.</p>

examples/proxy.cgi

@@ -6,22 +6,32 @@ restrictions that prevent the Javascript from loading pages not on the
 same server as the Javascript.  This has several problems: it's less
 efficient, it might break some sites, and it's a security risk because
 people can use this proxy to browse the web and possibly do bad stuff
-with it.  If you can get your code signed (see:
-http://trac.openlayers.org/wiki/HowToSignJavascript), then you should
-modify Parameters.js so that this isn't used.  Otherwise, you're stuck
 with it.  It only loads pages via http and https, but it can load any
-content type. XML and HTML are both currently used by Openlayers."""
+content type. It supports GET and POST requests."""
 
-import urllib
+import urllib2
 import cgi
-
-fs = cgi.FieldStorage()
-url = fs.getvalue('url', "http://openlayers.org")
+import sys, os
 
 # Designed to prevent Open Proxy type stuff.
 
-allowedHosts = ['www.openlayers.org', 'openlayers.org', 'octo.metacarta.com', 'merrimack.metacarta.com', 'labs.metacarta.com', 'world.freemap.in',
-                'prototype.openmnnd.org']
+allowedHosts = ['www.openlayers.org', 'openlayers.org', 
+                'labs.metacarta.com', 'world.freemap.in', 
+                'prototype.openmnnd.org', 'geo.openplans.org',
+                'www.openstreetmap.org']
+
+method = os.environ["REQUEST_METHOD"]
+
+if method == "POST":
+    qs = os.environ["QUERY_STRING"]
+    d = cgi.parse_qs(qs)
+    if d.has_key("url"):
+        url = d["url"][0]
+    else:
+        url = "http://www.openlayers.org"
+else:
+    fs = cgi.FieldStorage()
+    url = fs.getvalue('url', "http://www.openlayers.org")
 
 try:
     host = url.split("/")[2]
@@ -30,24 +40,36 @@ try:
         print "Content-Type: text/plain"
         print
         print "This proxy does not allow you to access that location."
+        print 
+        print os.environ
   
     elif url.startswith("http://") or url.startswith("https://"):
     
-        y = urllib.urlopen(url)
+        if method == "POST":
+            length = int(os.environ["CONTENT_LENGTH"])
+            headers = {"Content-Type": os.environ["CONTENT_TYPE"]}
+            body = sys.stdin.read(length)
+            r = urllib2.Request(url, body, headers)
+            y = urllib2.urlopen(r)
+        else:
+            y = urllib2.urlopen(url)
         
-        headers = str(y.info()).split('\n')
-        for h in headers:
-            if h.startswith("Content-Type:"):
-                print h
+        # print content type header
+        i = y.info()
+        if i.has_key("Content-Type"):
+            print "Content-Type: %s" % (i["Content-Type"])
+        else:
+            print "Content-Type: text/plain"
         print
         
         print y.read()
         
         y.close()
     else:
-        print """Content-Type: text/plain
+        print "Content-Type: text/plain"
+        print
+        print "Illegal request."
 
-Illegal request."""
 except Exception, E:
     print "Status: 500 Unexpected Error"
     print "Content-Type: text/plain"

examples/regular-polygons.html

@@ -1,6 +1,7 @@
 <html xmlns="http://www.w3.org/1999/xhtml">
   <head>
     <title>OpenLayers Regular Polygon Example</title>
+    <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
     <style type="text/css">
         html, body {
             margin: 0;
@@ -66,6 +67,7 @@
             map.setCenter(new OpenLayers.LonLat(0, 0), 3);
             
             document.getElementById('noneToggle').checked = true;
+             document.getElementById('irregularToggle').checked = false;
         }
         function setOptions(options) {
             polygonControl.handler.setOptions(options);
@@ -78,7 +80,11 @@
     </script>
   </head>
   <body onload="init()">
-    <h2>OpenLayers Regular Polygon Example</h2>
+    <h2 id="title">OpenLayers Regular Polygon Example</h2>
+    <p id="shortdesc">
+      Shows how to use the RegularPolygon handler to draw features with
+      different numbers of sides.
+    </p>
     <div id="map"></div>
     <div id="config">
         
@@ -146,6 +152,16 @@
                         </select>
                     </td>
                 </tr>
+                <tr>
+                    <td>
+                        irregular
+                    </td>
+                    <td>
+                        <input id="irregularToggle" name="irregular"
+                               type="checkbox"
+                               onchange="setOptions({irregular: this.checked})") />
+                    </td>
+                </tr>
             </tbody>
         </table>
     </div>
@@ -156,5 +172,7 @@
         the snap angle is non-null) and you hold down the <b>Shift</b> key, you
         will toggle to non-snapping mode.
     </p>
+    <p>
+         The <i>irregular</i> option allows drawing of irregular polygons.  With this option, the fixed radius option is ignored.
   </body>
 </html>

examples/resize-features.html

@@ -1,6 +1,7 @@
 <html xmlns="http://www.w3.org/1999/xhtml">
   <head>
     <title>OpenLayers Resize Features Example</title>
+    <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
     <style type="text/css">
         #map {
             width: 500px;
@@ -82,6 +83,11 @@
     </script>
   </head>
   <body onload="init()">
+    <h3 id="title">Resize Features Programatically</h3>
+    <p id="shortdesc">
+      Demonstration of how to use the geometry resize methods to
+      change feature sizes programatically.
+    </p>  
     <div id="map"></div>
     <p>This example demonstrates how features can be resized.  There is not yet
     a control built that provides a tool for resizing, but the geometry.resize

examples/restricted-extent.html

@@ -1,5 +1,7 @@
 <html xmlns="http://www.w3.org/1999/xhtml">
   <head>
+    <title>OpenLayers Restricted Extent Example</title>
+    <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
     <style type="text/css">
         #map {
             width: 512px;
@@ -40,7 +42,11 @@
     </script>
   </head>
   <body onload="init()">
-    <h3>OpenLayers Restricted Extent Example</h3>
+    <h3 id="title">OpenLayers Restricted Extent Example</h3>
+    <p id="shortdesc">
+      Don't let users drag outside the map extent: instead, limit dragging such
+      that the extent of the layer is the maximum viewable area.
+    </p>
     <div id="map"></div>
     <p>
         Map navigation is limited by a combination of map and layer properties.