[Commits] r1982 - in core/trunk/geoext: examples lib lib/GeoExt lib/GeoExt/state tests tests/lib/GeoExt tests/lib/GeoExt/state
commits at geoext.org
commits at geoext.org
Wed Mar 17 10:22:39 CET 2010
Author: elemoine
Date: 2010-03-17 10:22:39 +0100 (Wed, 17 Mar 2010)
New Revision: 1982
Added:
core/trunk/geoext/examples/permalink.html
core/trunk/geoext/examples/permalink.js
core/trunk/geoext/lib/GeoExt/state/
core/trunk/geoext/lib/GeoExt/state/PermalinkProvider.js
core/trunk/geoext/tests/lib/GeoExt/state/
core/trunk/geoext/tests/lib/GeoExt/state/PermalinkProvider.html
Modified:
core/trunk/geoext/lib/GeoExt.js
core/trunk/geoext/tests/list-tests.html
Log:
add a permalink provider, r=tschaub
Added: core/trunk/geoext/examples/permalink.html
===================================================================
--- core/trunk/geoext/examples/permalink.html (rev 0)
+++ core/trunk/geoext/examples/permalink.html 2010-03-17 09:22:39 UTC (rev 1982)
@@ -0,0 +1,23 @@
+<html>
+ <head>
+ <title>Permalink Example</title>
+
+ <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.0.0/adapter/ext/ext-base.js"></script>
+ <script type="text/javascript" src="http://extjs.cachefly.net/ext-3.0.0/ext-all.js"></script>
+ <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.0.0/resources/css/ext-all.css" />
+ <link rel="stylesheet" type="text/css" href="http://extjs.cachefly.net/ext-3.0.0/examples/shared/examples.css" />
+ <script src="http://dev.openlayers.org/nightly/OpenLayers.js"></script>
+ <script type="text/javascript" src="../lib/GeoExt.js"></script>
+
+ <script type="text/javascript" src="permalink.js"></script>
+
+ </head>
+ <body>
+ <h1>Permalink</h1>
+ <p>This example shows how to generate permalinks with the current map position and visible layers.</p>
+ <p>The js is not minified so it is readable. See <a href="permalink.js">permalink.js</a>.</p>
+ <div id="mappanel"></div>
+ <h2>Permalink:</h2>
+ <div id="permalink"></div>
+ </body>
+</html>
Added: core/trunk/geoext/examples/permalink.js
===================================================================
--- core/trunk/geoext/examples/permalink.js (rev 0)
+++ core/trunk/geoext/examples/permalink.js 2010-03-17 09:22:39 UTC (rev 1982)
@@ -0,0 +1,56 @@
+/**
+ * Copyright (c) 2008-2009 The Open Source Geospatial Foundation
+ *
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: example[permalink]
+ * Permalink
+ * ---------
+ * Display a permalink each time the map changes position.
+ */
+
+var permalinkProvider;
+
+Ext.onReady(function() {
+
+ // set a permalink provider
+ permalinkProvider = new GeoExt.state.PermalinkProvider({encodeType: false});
+ Ext.state.Manager.setProvider(permalinkProvider);
+
+ var map = new OpenLayers.Map();
+ map.addLayers([
+ new OpenLayers.Layer.WMS(
+ "Imagery",
+ "http://maps.opengeo.org/geowebcache/service/wms",
+ {layers: "bluemarble"}
+ ),
+ new OpenLayers.Layer.WMS(
+ "OSM",
+ "http://maps.opengeo.org/geowebcache/service/wms",
+ {layers: "openstreetmap"}
+ )
+ ]);
+ map.addControl(new OpenLayers.Control.LayerSwitcher());
+
+ var mapPanel = new GeoExt.MapPanel({
+ title: "GeoExt MapPanel",
+ renderTo: "mappanel",
+ height: 400,
+ width: 600,
+ map: map,
+ center: new OpenLayers.LonLat(5, 45),
+ zoom: 4,
+ stateId: "map",
+ prettyStateKeys: true
+ });
+
+ // update link when state chnages
+ var onStatechange = function(provider) {
+ var l = provider.getLink();
+ Ext.get("permalink").update("<a href=" + l + ">" + l + "</a>");
+ };
+ permalinkProvider.on({statechange: onStatechange});
+});
Added: core/trunk/geoext/lib/GeoExt/state/PermalinkProvider.js
===================================================================
--- core/trunk/geoext/lib/GeoExt/state/PermalinkProvider.js (rev 0)
+++ core/trunk/geoext/lib/GeoExt/state/PermalinkProvider.js 2010-03-17 09:22:39 UTC (rev 1982)
@@ -0,0 +1,138 @@
+/**
+ * Copyright (c) 2008-2009 The Open Source Geospatial Foundation
+ *
+ * Published under the BSD license.
+ * See http://svn.geoext.org/core/trunk/geoext/license.txt for the full text
+ * of the license.
+ */
+
+/** api: (define)
+ * module = GeoExt.state
+ * class = PermalinkProvider
+ * base_link = `Ext.state.Provider <http://extjs.com/deploy/dev/docs/?class=Ext.state.Provider>`_
+ */
+Ext.namespace("GeoExt.state");
+
+/** api: example
+ * Sample code displaying a new permalink each time the map is moved.
+ *
+ * .. code-block:: javascript
+ *
+ * // create permalink provider
+ * var permalinkProvider = new GeoExt.state.PermalinkProvider();
+ *
+ * // set it in the state manager
+ * Ext.state.Manager.setProvider(permalinkProvider);
+ *
+ * // create a map panel, and make it stateful
+ * var mapPanel = new GeoExt.MapPanel({
+ * renderTo: "map",
+ * layers: [
+ * new OpenLayers.Layer.WMS(
+ * "Global Imagery",
+ * "http://maps.opengeo.org/geowebcache/service/wms",
+ * {layers: "bluemarble"}
+ * )
+ * ],
+ * stateId: "map",
+ * prettyStateKeys: true // for pretty permalinks
+ * });
+ *
+ * // display permalink each time state is changed
+ * permalinkProvider.on({
+ * statechanged: function(provider, name, value) {
+ * alert(provider.getLink());
+ * }
+ * });
+ */
+
+/** api: constructor
+ * .. class:: PermalinkProvider(config)
+ *
+ * Create a permalink provider.
+ *
+ */
+GeoExt.state.PermalinkProvider = function(config) {
+ GeoExt.state.PermalinkProvider.superclass.constructor.apply(this, arguments);
+
+ config = config || {};
+
+ var url = config.url;
+ delete config.url;
+
+ Ext.apply(this, config);
+
+ this.state = this.readURL(url);
+};
+
+Ext.extend(GeoExt.state.PermalinkProvider, Ext.state.Provider, {
+
+ /** api: config[encodeType]
+ * ``Boolean`` Specifies whether type of state values should be encoded
+ * and decoded. Set it to false if you work with components that don't
+ * require encoding types, and want pretty permalinks. Defaults to true.
+ */
+ /** private: property[encodeType]
+ * ``Boolean``
+ */
+ encodeType: true,
+
+ /** private: method[readURL]
+ * :param url: ``String`` The URL to get the state from.
+ * :return: ``Object`` The state object.
+ *
+ * Create a state object from a URL.
+ */
+ readURL: function(url) {
+ var state = {};
+ var params = OpenLayers.Util.getParameters(url);
+ var k, split, stateId;
+ for(k in params) {
+ if(params.hasOwnProperty(k)) {
+ split = k.split("_");
+ if(split.length > 1) {
+ stateId = split[0];
+ state[stateId] = state[stateId] || {};
+ state[stateId][split.slice(1).join("_")] = this.encodeType ?
+ this.decodeValue(params[k]) : params[k];
+ }
+ }
+ }
+ return state;
+ },
+
+ /** api: method[getLink]
+ * :param base: ``String`` The base URL, optional.
+ * :return: ``String`` The permalink.
+ *
+ * Return the permalink corresponding to the current state.
+ */
+ getLink: function(base) {
+ base = base || document.location.href;
+
+ var params = {};
+
+ var id, k, state = this.state;
+ for(id in state) {
+ if(state.hasOwnProperty(id)) {
+ for(k in state[id]) {
+ params[id + "_" + k] = this.encodeType ?
+ unescape(this.encodeValue(state[id][k])) : state[id][k];
+ }
+ }
+ }
+
+ // merge params in the URL into the state params
+ OpenLayers.Util.applyDefaults(
+ params, OpenLayers.Util.getParameters(base));
+
+ var paramsStr = OpenLayers.Util.getParameterString(params);
+
+ var qMark = base.indexOf("?");
+ if(qMark > 0) {
+ base = base.substring(0, qMark);
+ }
+
+ return OpenLayers.Util.urlAppend(base, paramsStr);
+ }
+});
Modified: core/trunk/geoext/lib/GeoExt.js
===================================================================
--- core/trunk/geoext/lib/GeoExt.js 2010-03-16 23:58:15 UTC (rev 1981)
+++ core/trunk/geoext/lib/GeoExt.js 2010-03-17 09:22:39 UTC (rev 1982)
@@ -113,7 +113,8 @@
"GeoExt/plugins/PrintPageField.js",
"GeoExt/plugins/PrintProviderField.js",
"GeoExt/plugins/PrintExtent.js",
- "GeoExt/widgets/PrintMapPanel.js"
+ "GeoExt/widgets/PrintMapPanel.js",
+ "GeoExt/state/PermalinkProvider"
);
var agent = navigator.userAgent;
Added: core/trunk/geoext/tests/lib/GeoExt/state/PermalinkProvider.html
===================================================================
--- core/trunk/geoext/tests/lib/GeoExt/state/PermalinkProvider.html (rev 0)
+++ core/trunk/geoext/tests/lib/GeoExt/state/PermalinkProvider.html 2010-03-17 09:22:39 UTC (rev 1982)
@@ -0,0 +1,238 @@
+<!DOCTYPE html>
+<html debug="true">
+ <head>
+ <script type="text/javascript" src="../../../../../openlayers/lib/OpenLayers.js"></script>
+ <script type="text/javascript" src="../../../../../ext/adapter/ext/ext-base.js"></script>
+ <script type="text/javascript" src="../../../../../ext/ext-all-debug.js"></script>
+ <script type="text/javascript" src="../../../../lib/GeoExt.js"></script>
+
+ <script type="text/javascript">
+ function test_set(t) {
+ t.plan(1);
+
+ var p, state;
+
+ p = new GeoExt.state.PermalinkProvider();
+ state = {x: 5, y: 45, zoom: 10};
+
+ p.set("map", state);
+ t.eq(p.state.map, state,
+ "set works as expected");
+ }
+
+ function test_get(t) {
+ t.plan(2);
+
+ var p, state;
+
+ p = new GeoExt.state.PermalinkProvider();
+
+ state = {x: 5, y: 45, zoom: 10};
+ p.state = {
+ map: state
+ };
+
+ t.eq(p.get("map"), state,
+ "get returns expected value");
+ t.eq(p.get("foo", {foo: "bar"}), {foo: "bar"},
+ "get returns default value when state is undefined");
+ }
+
+ function test_readURL(t) {
+ t.plan(4);
+
+ var p, url, state, expected;
+
+ p = new GeoExt.state.PermalinkProvider({encodeType: false});
+
+ url = "http://foo?map_x=5&map_y=45&map_zoom=10";
+ state = p.readURL(url);
+ expected = {
+ map: {
+ x: "5",
+ y: "45",
+ zoom: "10"
+ }
+ };
+ t.eq(state, expected,
+ "readURL returns expected state (" + url + ")");
+
+ url = "http://foo?map_x=5&map_y=45&map_zoom=10&foo_bar1=val1&foo_bar2=val2";
+ state = p.readURL(url);
+ expected = {
+ map: {
+ x: "5",
+ y: "45",
+ zoom: "10"
+ },
+ foo: {
+ bar1: "val1",
+ bar2: "val2"
+ }
+ };
+ t.eq(state, expected,
+ "readURL returns expected state (" + url + ")");
+
+ url = "http://foo?map_x=5&map_y_y=45&map_zoom=10";
+ state = p.readURL(url);
+ expected = {
+ map: {
+ x: "5",
+ y_y: "45",
+ zoom: "10"
+ }
+ };
+ t.eq(state, expected,
+ "readURL returns expected state (" + url + ")");
+
+ url = "http://foo?map_x=5&map__y=45&map_zoom=10";
+ state = p.readURL(url);
+ expected = {
+ map: {
+ x: "5",
+ _y: "45",
+ zoom: "10"
+ }
+ };
+ t.eq(state, expected,
+ "readURL returns expected state (" + url + ")");
+ }
+
+ function test_readURL_encodeType(t) {
+ t.plan(2);
+
+ var p, url, state, expected;
+
+ p = new GeoExt.state.PermalinkProvider({encodeType: true});
+
+ url = "http://localhost" +
+ "?map_x=" + encodeURIComponent("n:5") +
+ "&map_y=" + encodeURIComponent("n:45") +
+ "&map_zoom=" + encodeURIComponent("n:10");
+ state = p.readURL(url);
+ expected = {
+ map: {
+ x: 5,
+ y: 45,
+ zoom: 10
+ }
+ };
+ t.eq(state, expected,
+ "readURL returns expected state (" + url + ")");
+
+ url = "http://localhost" +
+ "?map_x=" + encodeURIComponent("s:5") +
+ "&map_y=" + encodeURIComponent("s:45") +
+ "&map_zoom=" + encodeURIComponent("s:10");
+ state = p.readURL(url);
+ expected = {
+ map: {
+ x: "5",
+ y: "45",
+ zoom: "10"
+ }
+ };
+ t.eq(state, expected,
+ "readURL returns expected state (" + url + ")");
+ }
+
+ function test_getLink(t) {
+ t.plan(4);
+
+ var p, link, expected;
+
+ p = new GeoExt.state.PermalinkProvider({encodeType: false});
+
+ p.state = {
+ map: {
+ x: 5,
+ y: 45,
+ zoom: 10
+ }
+ };
+ link = p.getLink("http://localhost");
+ expected = "http://localhost?map_x=5&map_y=45&map_zoom=10";
+ t.eq(link, expected,
+ "getLink returns expected string [0]");
+
+ p.state = {
+ map: {
+ x: "5",
+ y: "45",
+ zoom: "10"
+ }
+ };
+ link = p.getLink("http://localhost");
+ expected = "http://localhost?map_x=5&map_y=45&map_zoom=10";
+ t.eq(link, expected,
+ "getLink returns expected string [1]");
+
+ p.state = {
+ map: {
+ x: 5,
+ y: 45,
+ zoom: 10
+ },
+ foo: {
+ bar: "bar"
+ }
+ };
+ link = p.getLink("http://localhost");
+ expected = "http://localhost?map_x=5&map_y=45&map_zoom=10&foo_bar=bar";
+ t.eq(link, expected,
+ "getLink returns expected string [2]");
+
+ p.state = {
+ map: {
+ x: 5,
+ y: 45,
+ zoom: 10
+ }
+ };
+ link = p.getLink("http://localhost?map_x=10&foo=bar");
+ expected = "http://localhost?map_x=5&map_y=45&map_zoom=10&foo=bar";
+ t.eq(link, expected,
+ "getLink returns expected string [3]");
+ }
+
+ function test_getLink_encode(t) {
+ t.plan(2);
+
+ var p, link, expected;
+
+ p = new GeoExt.state.PermalinkProvider({encodeType: true});
+
+ p.state = {
+ map: {
+ x: 5,
+ y: 45,
+ zoom: 10
+ }
+ };
+ link = p.getLink("http://localhost");
+ expected = "http://localhost" +
+ "?map_x=" + encodeURIComponent("n:5") +
+ "&map_y=" + encodeURIComponent("n:45") +
+ "&map_zoom=" + encodeURIComponent("n:10");
+ t.eq(link, expected,
+ "getLink returns expected string [0]");
+
+ p.state = {
+ map: {
+ x: "5",
+ y: "45",
+ zoom: "10"
+ }
+ };
+ link = p.getLink("http://localhost");
+ expected = "http://localhost" +
+ "?map_x=" + encodeURIComponent("s:5") +
+ "&map_y=" + encodeURIComponent("s:45") +
+ "&map_zoom=" + encodeURIComponent("s:10");
+ t.eq(link, expected,
+ "getLink returns expected string [1]");
+ }
+ </script>
+ <body>
+ </body>
+</html>
Modified: core/trunk/geoext/tests/list-tests.html
===================================================================
--- core/trunk/geoext/tests/list-tests.html 2010-03-16 23:58:15 UTC (rev 1981)
+++ core/trunk/geoext/tests/list-tests.html 2010-03-17 09:22:39 UTC (rev 1982)
@@ -42,4 +42,5 @@
<li>lib/GeoExt/widgets/WMSLegend.html</li>
<li>lib/GeoExt/widgets/ZoomSlider.html</li>
<li>lib/GeoExt/widgets/grid/FeatureSelectionModel.html</li>
+ <li>lib/GeoExt/state/PermalinkProvider.html</li>
</ul>
More information about the Commits
mailing list