Structure: pushState url format parameter

- Provide an alternative way to set the pushState url, using a format
  string that make use of the {path} token for substitution as an
  alternative to the somewhat more opaque urlStructure parameter.

mockup/patterns/structure/js/views/app.js

@@ -144,7 +144,15 @@ define([
           path = '';
         }
         /* maintain history here */
-        if (self.options.urlStructure) {
+        if (self.options.pushStateUrl) {
+          // permit an extra slash in pattern, but strip that if there
+          // as path always will be prefixed with a `/`
+          var pushStateUrl = self.options.pushStateUrl.replace(
+            '/{path}', '{path}');
+          var url = pushStateUrl.replace('{path}', path);
+          window.history.pushState(null, null, url);
+        } else if (self.options.urlStructure) {
+          // fallback to urlStructure specification
           var url = self.options.urlStructure.base + path + self.options.urlStructure.appended;
           window.history.pushState(null, null, url);
         }
@@ -162,7 +170,8 @@ define([
 
       });
 
-      if (self.options.urlStructure && utils.featureSupport.history()){
+      if ((self.options.pushStateUrl || self.options.urlStructure)
+          && utils.featureSupport.history()){
         $(window).bind('popstate', function () {
           /* normalize this url first... */
           var win = utils.getWindow();
@@ -174,8 +183,14 @@ define([
           if(url.indexOf('#') !== -1){
             url = url.split('#')[0];
           }
-          base = self.options.urlStructure.base;
-          appended = self.options.urlStructure.appended;
+          if (self.options.pushStateUrl) {
+            var tmp = self.options.pushStateUrl.split('{path}');
+            base = tmp[0];
+            appended = tmp[1];
+          } else {
+            base = self.options.urlStructure.base;
+            appended = self.options.urlStructure.appended;
+          }
           // take off the base url
           var path = url.substring(base.length);
           if(path.substring(path.length - appended.length) === appended){

mockup/tests/pattern-structure-test.js

@@ -1670,6 +1670,7 @@ define([
           "base": "http://localhost:8081/traverse_view",
           "appended": ""
         },
+        "pushStateUrl": "http://localhost:8081/traverse_view{path}",
         "traverseView": true
       };
 
@@ -1749,7 +1750,8 @@ define([
       $('body').off('structure-url-changed');
     });
 
-    it('test navigate to folder push states', function() {
+    it('test navigate to folder push states - urlStructure', function() {
+      delete this.structure.pushStateUrl;
       this.$el = $('<div class="pat-structure"></div>').attr(
         'data-pat-structure', JSON.stringify(this.structure)).appendTo('body');
       registry.scan(this.$el);
@@ -1769,7 +1771,45 @@ define([
         'http://localhost:8081/traverse_view');
     });
 
-    it('test navigate to folder pop states', function() {
+    it('test navigate to folder pop states - urlStructure', function() {
+      delete this.structure.pushStateUrl;
+      this.$el = $('<div class="pat-structure"></div>').attr(
+        'data-pat-structure', JSON.stringify(this.structure)).appendTo('body');
+      registry.scan(this.$el);
+      this.clock.tick(1000);
+      // Need to inject this to the mocked window location attribute the
+      // code will check against.  This url is set before the trigger.
+      dummyWindow.location = {
+          'href': 'http://localhost:8081/traverse_view/folder/folder'};
+      // then trigger off the real window.
+      $(window).trigger('popstate');
+      this.clock.tick(1000);
+      expect(structureUrlChangedPath).to.eql('/folder/folder');
+    });
+
+    it('test navigate to folder push states - pushStateUrl', function() {
+      delete this.structure.urlStructure;
+      this.$el = $('<div class="pat-structure"></div>').attr(
+        'data-pat-structure', JSON.stringify(this.structure)).appendTo('body');
+      registry.scan(this.$el);
+      this.clock.tick(1000);
+      var pattern = this.$el.data('patternStructure');
+      var item = this.$el.find('.itemRow').eq(0);
+      expect(item.data().id).to.equal('folder');
+      $('.title a.manage', item).trigger('click');
+      this.clock.tick(1000);
+      expect(history.pushed.url).to.equal(
+        'http://localhost:8081/traverse_view/folder');
+      expect(structureUrlChangedPath).to.eql('');
+
+      $('.fc-breadcrumbs a', this.$el).eq(0).trigger('click');
+      this.clock.tick(1000);
+      expect(history.pushed.url).to.equal(
+        'http://localhost:8081/traverse_view');
+    });
+
+    it('test navigate to folder pop states - pushStateUrl', function() {
+      delete this.structure.urlStructure;
       this.$el = $('<div class="pat-structure"></div>').attr(
         'data-pat-structure', JSON.stringify(this.structure)).appendTo('body');
       registry.scan(this.$el);