add displayProjection API Property on the Map, and on relevant controls.

Spherical mercator example now makes use of this, displaying coordinates 
in lon/lat instead of meters, and permalink/argparser now work in lon/lat
as well. this functionality will make using SphericalMercator easier for
a number of applications. 
r=tschaub (Closes #1036)


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

examples/spherical-mercator.html

@@ -25,7 +25,8 @@
 
         function init(){
             var options = {
-                projection: "EPSG:900913",
+                projection: new OpenLayers.Projection("EPSG:900913"),
+                displayProjection: new OpenLayers.Projection("EPSG:4326"),
                 units: "m",
                 maxResolution: 156543.0339,
                 maxExtent: new OpenLayers.Bounds(-20037508, -20037508,
@@ -104,6 +105,8 @@
                            yahoo, yahoosat, yahoohyb, mapnik, wms, vector]);
             map.addControl(new OpenLayers.Control.LayerSwitcher());
             map.addControl(new OpenLayers.Control.EditingToolbar(vector));
+            map.addControl(new OpenLayers.Control.Permalink());
+            map.addControl(new OpenLayers.Control.MousePosition());
             map.zoomToMaxExtent()
         }
 

lib/OpenLayers/Control/ArgParser.js

@@ -31,6 +31,20 @@ OpenLayers.Control.ArgParser = OpenLayers.Class(OpenLayers.Control, {
      */
     layers: null,
     
+    /** 
+     * APIProperty: displayProjection
+     * {<OpenLayers.Projection>} Requires proj4js support. 
+     *     Projection used when reading the coordinates from the URL. This will
+     *     reproject the map coordinates from the URL into the map's
+     *     projection.
+     *
+     *     If you are using this functionality, be aware that any permalink
+     *     which is added to the map will determine the coordinate type which
+     *     is read from the URL, which means you should not add permalinks with
+     *     different displayProjections to the same map. 
+     */
+    displayProjection: null, 
+
     /**
      * Constructor: OpenLayers.Control.ArgParser
      *
@@ -56,6 +70,14 @@ OpenLayers.Control.ArgParser = OpenLayers.Class(OpenLayers.Control, {
             var control = this.map.controls[i];
             if ( (control != this) &&
                  (control.CLASS_NAME == "OpenLayers.Control.ArgParser") ) {
+                
+                // If a second argparser is added to the map, then we 
+                // override the displayProjection to be the one added to the
+                // map. 
+                if (control.displayProjection != this.displayProjection) {
+                    this.displayProjection = control.displayProjection;
+                }    
+                
                 break;
             }
         }
@@ -98,6 +120,11 @@ OpenLayers.Control.ArgParser = OpenLayers.Class(OpenLayers.Control, {
             this.map.events.unregister('changebaselayer', this, 
                                        this.setCenter);
             
+            if (this.displayProjection) {
+                this.center.transform(this.displayProjection, 
+                                      this.map.getProjectionObject()); 
+            }      
+
             this.map.setCenter(this.center, this.zoom);
         }
     },

lib/OpenLayers/Control/MousePosition.js

@@ -52,6 +52,13 @@ OpenLayers.Control.MousePosition = OpenLayers.Class(OpenLayers.Control, {
      */
     lastXy: null,
 
+    /**
+     * APIProperty: displayProjection
+     * {<OpenLayers.Projection>} A projection that the 
+     * mousecontrol will display.
+     */
+    displayProjection: null, 
+    
     /**
      * Constructor: OpenLayers.Control.MousePosition
      * 
@@ -113,7 +120,12 @@ OpenLayers.Control.MousePosition = OpenLayers.Class(OpenLayers.Control, {
                 // map has not yet been properly initialized
                 return;
             }    
+            if (this.displayProjection) {
+                lonLat.transform(this.map.getProjectionObject(), 
+                                 this.displayProjection );
+            }      
             this.lastXy = evt.xy;
+            
         }
         
         var digits = parseInt(this.numdigits);

lib/OpenLayers/Control/Permalink.js

@@ -25,6 +25,18 @@ OpenLayers.Control.Permalink = OpenLayers.Class(OpenLayers.Control, {
      */
     base: '',
 
+    /** 
+     * APIProperty: displayProjection
+     * {<OpenLayers.Projection>} Requires proj4js support.  Projection used
+     *     when creating the coordinates in the link. This will reproject the
+     *     map coordinates into display coordinates. If you are using this
+     *     functionality, the permalink which is last added to the map will
+     *     determine the coordinate type which is read from the URL, which
+     *     means you should not add permalinks with different
+     *     displayProjections to the same map. 
+     */
+    displayProjection: null, 
+
     /**
      * Constructor: OpenLayers.Control.Permalink
      *
@@ -67,11 +79,20 @@ OpenLayers.Control.Permalink = OpenLayers.Class(OpenLayers.Control, {
         for(var i=0; i< this.map.controls.length; i++) {
             var control = this.map.controls[i];
             if (control.CLASS_NAME == "OpenLayers.Control.ArgParser") {
+                
+                // If a permalink is added to the map, and an ArgParser already
+                // exists, we override the displayProjection to be the one
+                // on the permalink. 
+                if (control.displayProjection != this.displayProjection) {
+                    this.displayProjection = control.displayProjection;
+                }    
+                
                 break;
             }
         }
         if (i == this.map.controls.length) {
-            this.map.addControl(new OpenLayers.Control.ArgParser());       
+            this.map.addControl(new OpenLayers.Control.ArgParser(
+                { 'displayProjection': this.displayProjection }));       
         }
 
     },
@@ -112,8 +133,19 @@ OpenLayers.Control.Permalink = OpenLayers.Class(OpenLayers.Control, {
         var params = OpenLayers.Util.getParameters(this.base);
         
         params.zoom = this.map.getZoom(); 
-        params.lat = Math.round(center.lat*100000)/100000;
+        var lat = center.lat;
-        params.lon = Math.round(center.lon*100000)/100000;
+        var lon = center.lon;
+        
+        if (this.displayProjection) {
+            var mapPosition = OpenLayers.Projection.transform(
+              { x: lon, y: lat }, 
+              this.map.getProjectionObject(), 
+              this.displayProjection );
+            lon = mapPosition.x;  
+            lat = mapPosition.y;  
+        }       
+        params.lat = Math.round(lat*100000)/100000;
+        params.lon = Math.round(lon*100000)/100000;
         
         params.layers = '';
         for(var i=0; i< this.map.layers.length; i++) {

lib/OpenLayers/Map.js

@@ -239,6 +239,15 @@ OpenLayers.Map = OpenLayers.Class({
      */
     theme: null,
     
+    /** 
+     * APIProperty: displayProjection
+     * {<OpenLayers.Projection>} Requires proj4js support.Projection used by
+     *     several controls to display data to user. If this property is set,
+     *     it will be set on any control which has a null displayProjection
+     *     property at the time the control is added to the map. 
+     */
+    displayProjection: null,
+
     /**
      * APIProperty: fallThrough
      * {Boolean} Should OpenLayers allow events on the map to fall through to
@@ -915,6 +924,13 @@ OpenLayers.Map = OpenLayers.Class({
         // If a control doesn't have a div at this point, it belongs in the
         // viewport.
         control.outsideViewport = (control.div != null);
+        
+        // If the map has a displayProjection, and the control doesn't, set 
+        // the display projection.
+        if (this.displayProjection && !control.displayProjection) {
+            control.displayProjection = this.displayProjection;
+        }    
+        
         control.setMap(this);
         var div = control.draw(px);
         if (div) {

tests/Control/test_MousePosition.html

@@ -2,15 +2,29 @@
 <head>
   <script src="../../lib/OpenLayers.js"></script>
   <script type="text/javascript">
+    var map, control; 
+    function test_01_Control_MousePosition_constructor (t) {
+        t.plan( 2 );
     
-    function test_MousePosition_constructor(t) {
+        control = new OpenLayers.Control.MousePosition();
-        t.plan(2);
+        t.ok( control instanceof OpenLayers.Control.MousePosition, "new OpenLayers.Control returns object" );
-    
+        t.eq( control.displayClass,  "olControlMousePosition", "displayClass is correct" );
-        var control = new OpenLayers.Control.MousePosition();
+    }
-        t.ok(control instanceof OpenLayers.Control.MousePosition, "new OpenLayers.Control.MousePosition returns object");
+    function test_02_Control_MousePosition_redraw_noLayer_displayProjection(t) {
-        t.eq(control.displayClass, "olControlMousePosition", "displayClass set correctly");
+        t.plan(2);
+        control = new OpenLayers.Control.MousePosition({'displayProjection': new OpenLayers.Projection("WGS84")});
+        map = new OpenLayers.Map('map');
+        map.addControl(control);
+        control.redraw({'xy': new OpenLayers.Pixel(10,10)});
+        control.redraw({'xy': new OpenLayers.Pixel(12,12)});
+        t.eq(control.div.innerHTML, "", "innerHTML set correctly");
+        l = new OpenLayers.Layer('name', {'isBaseLayer': true});
+        map.addLayer(l);
+        map.zoomToMaxExtent();
+        control.redraw({'xy': new OpenLayers.Pixel(10,10)});
+        control.redraw({'xy': new OpenLayers.Pixel(12,12)});
+        t.eq(control.div.innerHTML, "-175.78125, 85.78125", "innerHTML set correctly when triggered.");
     }
-
     function test_MousePosition_destroy(t) {
         t.plan(1);
     
@@ -56,7 +70,6 @@
         t.eq(control.div.innerHTML, "-175.78125, 85.78125", "innerHTML set correctly when triggered.");
         map.destroy();     
     }
-
   </script>
 </head>
 <body>