diff --git a/src/view-flot-graph.js b/src/view-flot-graph.js
index 4436a5a2..ecae709e 100644
--- a/src/view-flot-graph.js
+++ b/src/view-flot-graph.js
@@ -90,12 +90,18 @@ my.FlotGraph = Backbone.View.extend({
this.model.bind('change', this.render);
this.model.currentDocuments.bind('add', this.redraw);
this.model.currentDocuments.bind('reset', this.redraw);
+ var configFromHash = my.parseHashQueryString().graph;
+ if (configFromHash) {
+ configFromHash = JSON.parse(configFromHash);
+ }
this.chartConfig = _.extend({
group: null,
series: [],
graphType: 'line'
},
- config)
+ configFromHash,
+ config
+ );
this.render();
},
@@ -120,8 +126,9 @@ my.FlotGraph = Backbone.View.extend({
this._getEditorData();
// update navigation
// TODO: make this less invasive (e.g. preserve other keys in query string)
- window.location.hash = window.location.hash.split('?')[0] +
- '?graph=' + JSON.stringify(this.chartConfig);
+ var qs = my.parseHashQueryString();
+ qs['graph'] = this.chartConfig;
+ my.setHashQueryString(qs);
this.redraw();
},
diff --git a/src/view.js b/src/view.js
index 10f29a8c..791cbd4c 100644
--- a/src/view.js
+++ b/src/view.js
@@ -485,8 +485,23 @@ my.DataTableRow = Backbone.View.extend({
/* ========================================================== */
// ## Miscellaneous Utilities
+var urlPathRegex = /^([^?]+)(\?.*)?/;
+
+// Parse the Hash section of a URL into path and query string
+my.parseHashUrl = function(hashUrl) {
+ var parsed = urlPathRegex.exec(hashUrl);
+ if (parsed == null) {
+ return {};
+ } else {
+ return {
+ path: parsed[1],
+ query: parsed[2] || ''
+ }
+ }
+}
+
// Parse a URL query string (?xyz=abc...) into a dictionary.
-function parseQueryString(q) {
+my.parseQueryString = function(q) {
var urlParams = {},
e, d = function (s) {
return unescape(s.replace(/\+/g, " "));
@@ -503,6 +518,27 @@ function parseQueryString(q) {
return urlParams;
}
+// Parse the query string out of the URL hash
+my.parseHashQueryString = function() {
+ q = my.parseHashUrl(window.location.hash).query;
+ return my.parseQueryString(q);
+}
+
+// Compse a Query String
+my.composeQueryString = function(queryParams) {
+ var queryString = '?';
+ var items = [];
+ $.each(queryParams, function(key, value) {
+ items.push(key + '=' + JSON.stringify(value));
+ });
+ queryString += items.join('&');
+ return queryString;
+}
+
+my.setHashQueryString = function(queryParams) {
+ window.location.hash = window.location.hash.split('?')[0] + my.composeQueryString(queryParams);
+}
+
// ## notify
//
// Create a notification (a div.alert-message in div.alert-messsages) using provide messages and options. Options are:
diff --git a/test/index.html b/test/index.html
index 400d740d..dfd64b06 100644
--- a/test/index.html
+++ b/test/index.html
@@ -22,6 +22,7 @@
+
diff --git a/test/util.test.js b/test/util.test.js
new file mode 100644
index 00000000..dc18b60d
--- /dev/null
+++ b/test/util.test.js
@@ -0,0 +1,22 @@
+(function ($) {
+module("Util");
+
+test('parseHashUrl', function () {
+ var out = recline.View.parseHashUrl('graph?x=y');
+ equal(out.path, 'graph');
+ equal(out.query, '?x=y');
+ var out = recline.View.parseHashUrl('graph');
+ equal(out.path, 'graph');
+ equal(out.query, '');
+});
+
+test('composeQueryString', function () {
+ var params = {
+ x: 'y',
+ a: 'b'
+ };
+ var out = recline.View.composeQueryString(params);
+ equal(out, '?x="y"&a="b"');
+});
+
+})(this.jQuery);