[OpenLayers-Commits] r11170 - in trunk/openlayers: examples
lib/OpenLayers/Control tests tests/Control
commits-20090109 at openlayers.org
commits-20090109 at openlayers.org
Mon Feb 21 06:53:08 EST 2011
Author: erilem
Date: 2011-02-21 03:53:08 -0800 (Mon, 21 Feb 2011)
New Revision: 11170
Added:
trunk/openlayers/examples/anchor-permalink.html
trunk/openlayers/examples/anchor-permalink.js
trunk/openlayers/tests/Control/ArgParser.html
Modified:
trunk/openlayers/lib/OpenLayers/Control/ArgParser.js
trunk/openlayers/lib/OpenLayers/Control/Permalink.js
trunk/openlayers/tests/Control/Permalink.html
trunk/openlayers/tests/list-tests.html
Log:
add support for anchor-based permalink, p=sbrunner, r=me (closes #2785)
Added: trunk/openlayers/examples/anchor-permalink.html
===================================================================
--- trunk/openlayers/examples/anchor-permalink.html (rev 0)
+++ trunk/openlayers/examples/anchor-permalink.html 2011-02-21 11:53:08 UTC (rev 11170)
@@ -0,0 +1,27 @@
+<html>
+ <head>
+ <meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;" />
+ <meta name="apple-mobile-web-app-capable" content="yes" />
+ <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
+ <link rel="stylesheet" href="style.css" type="text/css" />
+ <title>AnchorPermalink Example</title>
+ <script src="../lib/OpenLayers.js"></script>
+ <script src="anchor-permalink.js"></script>
+ </head>
+ <body onload="init()">
+ <h1 id="title">AnchorPermalink Example</h1>
+ <div id="tags">
+ anchor, permalink
+ </div>
+ <p id="shortdesc">
+ Place a permalink in the anchor of the url.
+ </p>
+ <div id="map" class="smallmap"></div>
+ <div id="docs">
+ <p>
+ See the <a href="anchor-permalink.js" target="_blank">anchor-permalink.js
+ source</a> to see how this is done.
+ </p>
+ </div>
+ </body>
+</html>
Added: trunk/openlayers/examples/anchor-permalink.js
===================================================================
--- trunk/openlayers/examples/anchor-permalink.js (rev 0)
+++ trunk/openlayers/examples/anchor-permalink.js 2011-02-21 11:53:08 UTC (rev 11170)
@@ -0,0 +1,13 @@
+function init() {
+ var map = new OpenLayers.Map({
+ div: "map",
+ projection: new OpenLayers.Projection("EPSG:900913"),
+ displayProjection: new OpenLayers.Projection("EPSG:4326"),
+ layers: [
+ new OpenLayers.Layer.OSM()
+ ]
+ });
+ if (!map.getCenter()) map.zoomToMaxExtent();
+
+ map.addControl(new OpenLayers.Control.Permalink({anchor: true}));
+}
Modified: trunk/openlayers/lib/OpenLayers/Control/ArgParser.js
===================================================================
--- trunk/openlayers/lib/OpenLayers/Control/ArgParser.js 2011-02-21 11:51:21 UTC (rev 11169)
+++ trunk/openlayers/lib/OpenLayers/Control/ArgParser.js 2011-02-21 11:53:08 UTC (rev 11170)
@@ -64,6 +64,22 @@
OpenLayers.Control.prototype.initialize.apply(this, arguments);
},
+ getParameters: function(url) {
+ url = url || window.location.href;
+ var parameters = OpenLayers.Util.getParameters(url);
+
+ // If we have an chchor in the url use it to split the url
+ var index = url.indexOf('#');
+ if (index > 0) {
+ // create an url to parce on the getParameters
+ url = '?' + url.substring(index + 1, url.length);
+
+ OpenLayers.Util.extend(parameters,
+ OpenLayers.Util.getParameters(url));
+ }
+ return parameters;
+ },
+
/**
* Method: setMap
* Set the map property for the control.
@@ -92,7 +108,7 @@
}
if (i == this.map.controls.length) {
- var args = OpenLayers.Util.getParameters();
+ var args = this.getParameters();
// Be careful to set layer first, to not trigger unnecessary layer loads
if (args.layers) {
this.layers = args.layers;
Modified: trunk/openlayers/lib/OpenLayers/Control/Permalink.js
===================================================================
--- trunk/openlayers/lib/OpenLayers/Control/Permalink.js 2011-02-21 11:51:21 UTC (rev 11169)
+++ trunk/openlayers/lib/OpenLayers/Control/Permalink.js 2011-02-21 11:53:08 UTC (rev 11170)
@@ -36,6 +36,16 @@
element: null,
/**
+ * APIProperty: anchor
+ * {Boolean} This option changes 3 things:
+ * the character '#' is used in place of the character '?',
+ * the window.href is updated if no element is provided.
+ * When this option is set to true it's not recommend to provide
+ * a base without provide an element.
+ */
+ anchor: false,
+
+ /**
* APIProperty: base
* {String}
*/
@@ -59,14 +69,27 @@
* Parameters:
* element - {DOMElement}
* base - {String}
- * options - {Object} options to the control.
+ * options - {Object} options to the control.
+ *
+ * Or for anchor:
+ * options - {Object} options to the control.
*/
initialize: function(element, base, options) {
- OpenLayers.Control.prototype.initialize.apply(this, [options]);
- this.element = OpenLayers.Util.getElement(element);
- this.base = base || document.location.href;
+ if (element !== null && typeof element == 'object' && !OpenLayers.Util.isElement(element)) {
+ options = element;
+ this.base = document.location.href;
+ OpenLayers.Control.prototype.initialize.apply(this, [options]);
+ if (this.element != null) {
+ this.element = OpenLayers.Util.getElement(this.element);
+ }
+ }
+ else {
+ OpenLayers.Control.prototype.initialize.apply(this, [options]);
+ this.element = OpenLayers.Util.getElement(element);
+ this.base = base || document.location.href;
+ }
},
-
+
/**
* APIMethod: destroy
*/
@@ -122,7 +145,7 @@
draw: function() {
OpenLayers.Control.prototype.draw.apply(this, arguments);
- if (!this.element) {
+ if (!this.element && !this.anchor) {
this.element = document.createElement("a");
this.element.innerHTML = OpenLayers.i18n("permalink");
this.element.href="";
@@ -146,13 +169,19 @@
* Method: updateLink
*/
updateLink: function() {
+ var separator = this.anchor ? '#' : '?';
var href = this.base;
- if (href.indexOf('?') != -1) {
- href = href.substring( 0, href.indexOf('?') );
+ if (href.indexOf(separator) != -1) {
+ href = href.substring( 0, href.indexOf(separator) );
}
- href += '?' + OpenLayers.Util.getParameterString(this.createParams());
- this.element.href = href;
+ href += separator + OpenLayers.Util.getParameterString(this.createParams());
+ if (this.anchor && !this.element) {
+ window.location.href = href;
+ }
+ else {
+ this.element.href = href;
+ }
},
/**
Added: trunk/openlayers/tests/Control/ArgParser.html
===================================================================
--- trunk/openlayers/tests/Control/ArgParser.html (rev 0)
+++ trunk/openlayers/tests/Control/ArgParser.html 2011-02-21 11:53:08 UTC (rev 11170)
@@ -0,0 +1,26 @@
+<html>
+<head>
+ <script src="../OLLoader.js"></script>
+ <script type="text/javascript">
+ function test_getParameters(t) {
+ t.plan(4);
+
+ var c = new OpenLayers.Control.ArgParser(), p;
+
+ p = c.getParameters('http://example.com?fook=foov&bark=barv');
+ t.eq(p, {fook: 'foov', bark: 'barv'}, 'a) params are correct');
+
+ p = c.getParameters('http://example.com#fook=foov&bark=barv');
+ t.eq(p, {fook: 'foov', bark: 'barv'}, 'b) params are correct');
+
+ p = c.getParameters('http://example.com?a=b&b=c#fook=foov&bark=barv');
+ t.eq(p, {a: 'b', b: 'c', fook: 'foov', bark: 'barv'},
+ 'c) params are correct');
+
+ p = c.getParameters('http://example.com?a=b&b=c&fook=a&bark=b#fook=foov&bark=barv');
+ t.eq(p, {a: 'b', b: 'c', fook: 'foov', bark: 'barv'},
+ 'd) params are correct');
+ }
+ </script>
+</head>
+</html>
Modified: trunk/openlayers/tests/Control/Permalink.html
===================================================================
--- trunk/openlayers/tests/Control/Permalink.html 2011-02-21 11:51:21 UTC (rev 11169)
+++ trunk/openlayers/tests/Control/Permalink.html 2011-02-21 11:53:08 UTC (rev 11170)
@@ -4,11 +4,67 @@
<script type="text/javascript">
var map;
function test_Control_Permalink_constructor (t) {
- t.plan( 2 );
+ t.plan(42);
control = new OpenLayers.Control.Permalink();
- t.ok( control instanceof OpenLayers.Control.Permalink, "new OpenLayers.Control returns object" );
- t.eq( control.displayClass, "olControlPermalink", "displayClass is correct" );
+ t.ok(control instanceof OpenLayers.Control.Permalink, "new OpenLayers.Control returns object");
+ t.eq(control.displayClass, "olControlPermalink", "displayClass is correct");
+ t.eq(control.base, document.location.href, "base is correct");
+ t.ok(!control.anchor, "anchor is correct");
+
+ control = new OpenLayers.Control.Permalink('permalink', 'test.html');
+ t.ok(control instanceof OpenLayers.Control.Permalink, "new OpenLayers.Control returns object");
+ t.eq(control.displayClass, "olControlPermalink", "displayClass is correct");
+ t.eq(control.base, 'test.html', "base is correct");
+ t.ok(OpenLayers.Util.isElement(control.element), "element is a dom object");
+ t.ok(!control.anchor, "anchor is correct");
+
+ control = new OpenLayers.Control.Permalink('permalink');
+ t.ok(control instanceof OpenLayers.Control.Permalink, "new OpenLayers.Control returns object");
+ t.eq(control.displayClass, "olControlPermalink", "displayClass is correct");
+ t.eq(control.base, document.location.href, "base is correct");
+ t.ok(OpenLayers.Util.isElement(control.element), "element is a dom object");
+ t.ok(!control.anchor, "anchor is correct");
+
+ control = new OpenLayers.Control.Permalink(OpenLayers.Util.getElement('permalink'));
+ t.ok(control instanceof OpenLayers.Control.Permalink, "new OpenLayers.Control returns object");
+ t.eq(control.displayClass, "olControlPermalink", "displayClass is correct");
+ t.eq(control.base, document.location.href, "base is correct");
+ t.ok(OpenLayers.Util.isElement(control.element), "element is a dom object");
+ t.ok(!control.anchor, "anchor is correct");
+
+ control = new OpenLayers.Control.Permalink({anchor: true});
+ t.ok(control instanceof OpenLayers.Control.Permalink, "new OpenLayers.Control returns object");
+ t.eq(control.displayClass, "olControlPermalink", "displayClass is correct");
+ t.eq(control.base, document.location.href, "base is correct");
+ t.ok(control.element == null, "element is null");
+ t.ok(control.anchor, "anchor is correct");
+
+ control = new OpenLayers.Control.Permalink({anchor: false});
+ t.ok(control instanceof OpenLayers.Control.Permalink, "new OpenLayers.Control returns object");
+ t.eq(control.displayClass, "olControlPermalink", "displayClass is correct");
+ t.eq(control.base, document.location.href, "base is correct");
+ t.ok(!control.anchor, "anchor is correct");
+
+ control = new OpenLayers.Control.Permalink({});
+ t.ok(control instanceof OpenLayers.Control.Permalink, "new OpenLayers.Control returns object");
+ t.eq(control.displayClass, "olControlPermalink", "displayClass is correct");
+ t.eq(control.base, document.location.href, "base is correct");
+ t.ok(!control.anchor, "anchor is correct");
+
+ control = new OpenLayers.Control.Permalink({element: 'permalink', base: 'test.html'});
+ t.ok(control instanceof OpenLayers.Control.Permalink, "new OpenLayers.Control returns object");
+ t.eq(control.displayClass, "olControlPermalink", "displayClass is correct");
+ t.eq(control.base, 'test.html', "base is correct");
+ t.ok(OpenLayers.Util.isElement(control.element), "element is a dom object");
+ t.ok(!control.anchor, "anchor is correct");
+
+ control = new OpenLayers.Control.Permalink({element: 'permalink', base: 'test.html', anchor: true});
+ t.ok(control instanceof OpenLayers.Control.Permalink, "new OpenLayers.Control returns object");
+ t.eq(control.displayClass, "olControlPermalink", "displayClass is correct");
+ t.eq(control.base, 'test.html', "base is correct");
+ t.ok(OpenLayers.Util.isElement(control.element), "element is a dom object");
+ t.ok(control.anchor, "anchor is correct");
}
function test_Control_Permalink_uncentered (t) {
t.plan( 1 );
@@ -226,7 +282,45 @@
OpenLayers.Util.getParameters = old_getParameters;
OpenLayers.Projection.transform = old_transform;
}
+ function test_Control_Permalink_Anchor (t) {
+ t.plan(3);
+ control = new OpenLayers.Control.Permalink({anchor: true});
+ t.ok( control instanceof OpenLayers.Control.Permalink, "new OpenLayers.Control returns object" );
+ map = new OpenLayers.Map('map');
+ layer = new OpenLayers.Layer.WMS('Test Layer', "http://octo.metacarta.com/cgi-bin/mapserv", {map: '/mapdata/vmap_wms.map', layers: 'basic', format: 'image/jpeg'});
+ map.addLayer(layer);
+ layer = new OpenLayers.Layer.WMS('Test Layer', "http://octo.metacarta.com/cgi-bin/mapserv", {map: '/mapdata/vmap_wms.map', layers: 'basic', format: 'image/jpeg'}, {'isBaseLayer': false});
+ map.addLayer(layer);
+ layer.setVisibility(true);
+ if (!map.getCenter()) map.zoomToMaxExtent();
+ map.addControl(control);
+ map.pan(5, 0, {animate:false});
+ t.ok(OpenLayers.Util.isEquivalentUrl(OpenLayers.Util.getParameterString(control.createParams()), "zoom=2&lat=0&lon=1.75781&layers=BT"), 'pan sets permalink');
+
+ map.layers[1].setVisibility(false);
+ t.ok(OpenLayers.Util.isEquivalentUrl(OpenLayers.Util.getParameterString(control.createParams()), "zoom=2&lat=0&lon=1.75781&layers=BF"), 'setVisibility sets permalink');
+ }
+
+ function test_Control_Permalink_AnchorBaseElement (t) {
+ t.plan(3);
+
+ control = new OpenLayers.Control.Permalink('permalink', document.location.href, {anchor: true});
+ t.ok( control instanceof OpenLayers.Control.Permalink, "new OpenLayers.Control returns object" );
+ map = new OpenLayers.Map('map');
+ layer = new OpenLayers.Layer.WMS('Test Layer', "http://octo.metacarta.com/cgi-bin/mapserv", {map: '/mapdata/vmap_wms.map', layers: 'basic', format: 'image/jpeg'});
+ map.addLayer(layer);
+ layer = new OpenLayers.Layer.WMS('Test Layer', "http://octo.metacarta.com/cgi-bin/mapserv", {map: '/mapdata/vmap_wms.map', layers: 'basic', format: 'image/jpeg'}, {'isBaseLayer': false});
+ map.addLayer(layer);
+ layer.setVisibility(true);
+ if (!map.getCenter()) map.zoomToMaxExtent();
+ map.addControl(control);
+ map.pan(5, 0, {animate:false});
+ t.ok(OpenLayers.Util.isEquivalentUrl(OpenLayers.Util.getElement('permalink').href, location+"#zoom=2&lat=0&lon=1.75781&layers=BT"), 'pan sets permalink');
+
+ map.layers[1].setVisibility(false);
+ t.ok(OpenLayers.Util.isEquivalentUrl(OpenLayers.Util.getElement('permalink').href, location+"#zoom=2&lat=0&lon=1.75781&layers=BF"), 'setVisibility sets permalink');
+ }
</script>
</head>
<body>
Modified: trunk/openlayers/tests/list-tests.html
===================================================================
--- trunk/openlayers/tests/list-tests.html 2011-02-21 11:51:21 UTC (rev 11169)
+++ trunk/openlayers/tests/list-tests.html 2011-02-21 11:53:08 UTC (rev 11170)
@@ -10,6 +10,7 @@
<li>Console.html</li>
<li>Control.html</li>
<li>Control/Attribution.html</li>
+ <li>Control/ArgParser.html</li>
<li>Control/Button.html</li>
<li>Control/DragFeature.html</li>
<li>Control/DragPan.html</li>
More information about the Commits
mailing list