Indexable routes

readme.md

This example will allow for decorating all or some routes of a router with a different routing strategy. Here we check if the settings option indexed: true. If it is set, we then reconfigure the routing path to joinPath(moduleId, 'index') This allows for easy nested routing per folder, for the following type of application layout.

pages
  index
  contacts
    index

Pretty awesome!

However would be nice if we could centralise this kind of logic on the router itself instead of having to go through all this on the individual route level :P

app-alt.ts

// alternative way

ChildRouteLocator.prototype.convertInstructionToConfigurationUrl = (instruction) => {

};

app.ts

import {Router, RouterConfiguration} from 'aurelia-router';
import {inject} from 'aurelia-framework';

// Decoarate with indexed: true setting on all routes
let routes = [
  { route: '', moduleId: 'pages', title: 'Home', name: 'home', nav: true },
  { route: 'account',  moduleId: 'pages/account', title: 'Account', name: 'account', nav: true }
]

const indexedRoutes = routes.map(route => {
  route['settings'] = {indexed: true};
  return route;
})

function joinPath(path, postFix) {
  let lastChar = path[path.length -1];
  if (lastChar !== '/') {
    postFix = '/' + postFix;         
  } 
  return path + postFix;  
}

function navStrat(instruction) {
  let path = joinPath(instruction.fragment, 'index');
  instruction.config.moduleId = path;
  instruction.config.href = instruction.fragment;
}

function indexable(route) {
    if (route.settings && route.settings.indexed) {
      route.navigationStrategy = navStrat;
    }    
    return route;
}

export class App {
  router: Router;

  constructor() {}

  configureRouter(config: RouterConfiguration, router: Router){
    config.title = 'Contacts';
    config.map(routes.map(indexable));

    this.router = router;
  }
}