hjuster
hjuster

Reputation: 4070

Dynamically create backbone routes

Here is my backbone router:

var Router = Backbone.Router.extend({
    routes: {
       "": "home",
       "home": "home",
       "about": "about",
       "works": "works",
       "work/:id" : "work",
       "news": "news",
       "contact": "contact"
    },

    initRoutes: function(e) {       
        this.on('route:home', function() {
            page.activepage = "home";
            page.render();
        }); 
        this.on('route:about', function() {
            page.activepage = "about";
            page.render();
        }); 
        this.on('route:works', function() {
            page.activepage = "works";
            page.render();
        }); 
        this.on('route:work', function(id) {
            page.activepage = "works";
            page.param = id;
            page.render();
        }); 
        this.on('route:news', function() {
            page.activepage = "news";
            page.render();
        });
        this.on('route:contact', function() {
            page.activepage = "contact";
            page.render();
        });
    },
    initialize: function(){
        var self = this;
        Backbone.history = Backbone.history || new Backbone.History({});
        root = "kitchenV3/"+lang;
        var enablePushState = true;
        var pushState = !! (enablePushState && window.history && window.history.pushState);
        Backbone.history.start({
            pushState: pushState,
            root: root
        });
        self.initRoutes();
    }
});

So as you can see all my routes are basically doing the same thing (rendering content depending on route name and parameter). So how to rewrite ,,this.on(route:about)..." to avoid recursion?

Upvotes: 2

Views: 2261

Answers (1)

Loamhoof
Loamhoof

Reputation: 8293

Use those routes:

routes: {
  '': 'myFunc',
  ':mod(/)': 'myFunc',
  ':mod/:id(/)': 'myFunc'
},
myFunc: function(mod, id) {
  page.activepage = mod || 'home';
  if(id) page.param = id;
  page.render();
}

And delete initRoutes. This should work fine.

Upvotes: 9

Related Questions