diff --git a/examples/anchor-permalink.html b/examples/anchor-permalink.html new file mode 100644 index 0000000000..99a355b231 --- /dev/null +++ b/examples/anchor-permalink.html @@ -0,0 +1,27 @@ + + + + + + + AnchorPermalink Example + + + + +

AnchorPermalink Example

+
+ anchor, permalink +
+

+ Place a permalink in the anchor of the url. +

+
+
+

+ See the anchor-permalink.js + source to see how this is done. +

+
+ + diff --git a/examples/anchor-permalink.js b/examples/anchor-permalink.js new file mode 100644 index 0000000000..1ad29392ac --- /dev/null +++ b/examples/anchor-permalink.js @@ -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})); +} diff --git a/lib/OpenLayers/Control/ArgParser.js b/lib/OpenLayers/Control/ArgParser.js index a352e6b236..8eda9338d3 100644 --- a/lib/OpenLayers/Control/ArgParser.js +++ b/lib/OpenLayers/Control/ArgParser.js @@ -64,6 +64,22 @@ OpenLayers.Control.ArgParser = OpenLayers.Class(OpenLayers.Control, { 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 @@ OpenLayers.Control.ArgParser = OpenLayers.Class(OpenLayers.Control, { } 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; diff --git a/lib/OpenLayers/Control/Permalink.js b/lib/OpenLayers/Control/Permalink.js index 22d11507ff..bb5bac54a4 100644 --- a/lib/OpenLayers/Control/Permalink.js +++ b/lib/OpenLayers/Control/Permalink.js @@ -35,6 +35,16 @@ OpenLayers.Control.Permalink = OpenLayers.Class(OpenLayers.Control, { */ 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 @@ OpenLayers.Control.Permalink = OpenLayers.Class(OpenLayers.Control, { * 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 @@ OpenLayers.Control.Permalink = OpenLayers.Class(OpenLayers.Control, { 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 @@ OpenLayers.Control.Permalink = OpenLayers.Class(OpenLayers.Control, { * 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; + } }, /** diff --git a/tests/Control/ArgParser.html b/tests/Control/ArgParser.html new file mode 100644 index 0000000000..34e9f5bc8f --- /dev/null +++ b/tests/Control/ArgParser.html @@ -0,0 +1,26 @@ + + + + + + diff --git a/tests/Control/Permalink.html b/tests/Control/Permalink.html index e052c8971c..4b07d3e2bb 100644 --- a/tests/Control/Permalink.html +++ b/tests/Control/Permalink.html @@ -4,11 +4,67 @@ diff --git a/tests/list-tests.html b/tests/list-tests.html index 92cde195eb..509fe5d60d 100644 --- a/tests/list-tests.html +++ b/tests/list-tests.html @@ -10,6 +10,7 @@
  • Console.html
  • Control.html
  • Control/Attribution.html
  • +
  • Control/ArgParser.html
  • Control/Button.html
  • Control/DragFeature.html
  • Control/DragPan.html