How do I listen for and react to a blank route using {can.route}?

Question

I want to set up routing with CanJS so that depending on what url I hit, some corresponding control is set up. My problem is trying to find a way of expressing a default route to listen for in the control: "If none match, then do this". Any tips on doing this?

This is my code so far. Seems to work for urls like /#!/plant/1/day/3 and /#!/plant/1, but not for /#! or /

can.route('plant/:plant_id/day/:day', {});
can.route('plant/:plant_id', {});
can.route('', {});

var Router = can.Control({}, {
  init : function () {},

  "{can.route}" : function (route, event, newVal, oldVal) {
    console.log('Init default control');
  },

  "{can.route} plant_id" : function (route, event, newVal, oldVal) {
    console.log('Init plant control');
  },

  "{can.route} day" : function (route, event, newVal, oldVal) {
    console.log('Init day control');
  }
});

P.S. I actually managed to do it using the Can.Control.route plugin by doing this:

"route" : function (route, event, newVal, oldVal) {
    console.log('route Default route', arguments);
}

But the route plugin seems to both set up routes and react to them, and I wanted to know how to do this without the specific plugin.

score 2 · Answer 1 · answered Oct 24 '13 at 13:27

2

Your solution works but you could also use the can.Control.route plugins which lets you define and listen to routes directly in a controller action:

var Router = can.Control({
    init : function(el, options) {
    },

    "/:plantId route" : function(data) {
        // the route says /id
        // data.id is the id or default value
    },

    route : function(data){
        // the route is empty
    }
});
new Router(window);

answered Oct 24 '13 at 13:27

Daff

43,734
9
106
120

Yeah, as you can see from the last section of my post, I had stumbled upon that, but I just wanted to know a way of doing it without resorting to yet another plugin. Still giving you some credit for answering though :) I see you are active in the javascript mvc forums btw; any clue why my chances of getting an answer on SO seems so much better? Never get any views on the MVC forum. – oligofren Oct 26 '13 at 13:49
Oh I didn't see you updated the post. Anyway, I try to answer in the forums as well but SO is usually easier. Not the biggest fan of Zohos forums. – Daff Oct 27 '13 at 16:11

score 0 · Answer 2 · answered Oct 23 '13 at 23:05

Ended up doing something like the follow, but it feels less than ideal ...

    "{can.route} change" : function (ev, attr, how, newVal, oldVal) {
        if(newVal=== 'add' && (!ev.attr('plant_id') && !ev.attr('day')))
        console.log('{can.route} Default route', arguments);
    },

score 0 · Answer 3 · answered Nov 02 '13 at 23:23

I noticed the same problem with the default '/' route. I dove into pushstate.js and found that it wasn't working properly with the default route. You can see more details here: https://forum.javascriptmvc.com/#Topic/32525000001460049

I haven't tested anything without pushstate.js (using #!), so this only applies to using pushstate.

How do I listen for and react to a blank route using {can.route}?

3 Answers3