Router now supports hash query in #foo?a=b&c=d format.

.eslintrc.js

@@ -191,7 +191,7 @@ module.exports = {
     "no-underscore-dangle": 1, // disallow dangling underscores in identifiers
     "object-curly-spacing": [2, "always"],
     "one-var": [2, "never"], // allow just one var statement per function (off by default)
-    "operator-assignment": [1, "never"], // require assignment operator shorthand where possible or prohibit it entirely (off by default)
+    "operator-assignment": [1, "always"], // require assignment operator shorthand where possible or prohibit it entirely (off by default)
     "padded-blocks": [1, "never"], // enforce padding within blocks (off by default)
     "quotes": [1, "double"], // specify whether double or single quotes should be used
     "semi": [2, "always"], // require or disallow use of semicolons instead of ASI

routing.js

@@ -54,27 +54,40 @@ function render(target, name, context) {
  * @globals contentElement, ready, EVENT_TEMPLATES_LOADED
  */
 function router() {
-  // Current route url (getting rid of "#" in hash as well):
-  var url = location.hash.slice(1) || "/";
-
-  // Get route by url:
-  var CurrentRoute = routes[url];
-
   var context = null;
+  var CurrentRoute = null;
   var listener = null;
+  var path = null;
+  var query;
   var templateName = null;
+  var urlArray = null;
+
+  // Current route url (getting rid of "#" in hash as well):
+  var matches = location.hash.match(/^#?([\w]*)(?:\?)?(.*)?/);
+  path = matches[1] ? matches[1] : "/";
+  query = matches[2] ? matches[2].split("&").reduce(function (accu, v) {
+    var vArray = v.split("=");
+    accu[vArray[0]] = vArray[1];
+    return accu;
+  }, {}) : {};
+
+  // console.log("url", url, "path", path, "queryObject", queryObject);
+  // Get route by path:
+  CurrentRoute = routes[path];
 
   // Do we have a route ?
   if (CurrentRoute) {
-    // Render route template with Handlebars:
-    context = new CurrentRoute();
-    templateName = (url === "/") ? "home" : url;
+    // Obtain the template context by passing the query to the controller.
+    context = new CurrentRoute(query);
+
+    // Render template with Handlebars
+    templateName = (path === "/") ? "home" : path;
     if (ready) {
-      console.log('Immediate render');
+      console.log("Immediate render");
       render(contentElement, templateName, context);
     }
     else {
-      console.log('Deferred render');
+      console.log("Deferred render");
       listener = contentElement.addEventListener(EVENT_TEMPLATES_LOADED, function () {
         render(contentElement, templateName, context);
         contentElement.removeEventListener(EVENT_TEMPLATES_LOADED, listener);
@@ -83,7 +96,7 @@ function router() {
     }
   }
   else {
-    console.warn("Content found but no route matching", url);
+    console.warn("Content found but no route matching", path);
   }
 }
 
@@ -92,17 +105,17 @@ window.addEventListener("hashchange", router);
 window.addEventListener("load", router);
 
 // Route declarations.
-route("/", function () {
-  console.log("Home controller");
+route("/", function (q) {
+  console.log("Home controller", q);
 });
 
-route("class", function () {
-  console.log("Class controller");
+route("class", function (q) {
+  console.log("Class controller", q);
   this.greeting = "Hello world!";
   this.moreText = "Bacon ipsum...";
 });
 
-route("species", function () {
-  console.log("Species controller");
+route("species", function (q) {
+  console.log("Species controller", q);
   this.heading = "I\"m page two!";
 });