feat(router): update recognize to support aux routes

modules/angular2/src/alt_router/constants.ts

@@ -0,0 +1 @@
+export const DEFAULT_OUTLET_NAME = "__DEFAULT";

modules/angular2/src/alt_router/recognize.ts

@@ -1,46 +1,66 @@
-import {RouteSegment, UrlSegment, Tree} from './segments';
+import {RouteSegment, UrlSegment, Tree, TreeNode, rootNode} from './segments';
 import {RoutesMetadata, RouteMetadata} from './metadata/metadata';
-import {Type, isPresent, stringify} from 'angular2/src/facade/lang';
+import {Type, isBlank, isPresent, stringify} from 'angular2/src/facade/lang';
+import {ListWrapper, StringMapWrapper} from 'angular2/src/facade/collection';
 import {PromiseWrapper} from 'angular2/src/facade/promise';
 import {BaseException} from 'angular2/src/facade/exceptions';
 import {ComponentResolver} from 'angular2/core';
+import {DEFAULT_OUTLET_NAME} from './constants';
 import {reflector} from 'angular2/src/core/reflection/reflection';
 
 export function recognize(componentResolver: ComponentResolver, type: Type,
                           url: Tree<UrlSegment>): Promise<Tree<RouteSegment>> {
-  return _recognize(componentResolver, type, url, url.root)
+  return componentResolver.resolveComponent(type).then(factory => {
-      .then(nodes => new Tree<RouteSegment>(nodes));
+    let segment =
+        new RouteSegment([url.root], url.root.parameters, DEFAULT_OUTLET_NAME, type, factory);
+    return _recognizeMany(componentResolver, type, rootNode(url).children)
+        .then(children => new Tree<RouteSegment>(new TreeNode<RouteSegment>(segment, children)));
+  });
 }
 
-function _recognize(componentResolver: ComponentResolver, type: Type, url: Tree<UrlSegment>,
+function _recognize(componentResolver: ComponentResolver, parentType: Type,
-                    current: UrlSegment): Promise<RouteSegment[]> {
+                    url: TreeNode<UrlSegment>): Promise<TreeNode<RouteSegment>[]> {
-  let metadata = _readMetadata(type);  // should read from the factory instead
+  let metadata = _readMetadata(parentType);  // should read from the factory instead
 
-  let matched;
+  let match;
   try {
-    matched = _match(metadata, url, current);
+    match = _match(metadata, url);
   } catch (e) {
     return PromiseWrapper.reject(e, null);
   }
 
+  let main = _constructSegment(componentResolver, match);
+  let aux =
+      _recognizeMany(componentResolver, parentType, match.aux).then(_checkOutletNameUniqueness);
+  return PromiseWrapper.all([main, aux]).then(ListWrapper.flatten);
+}
+
+function _recognizeMany(componentResolver: ComponentResolver, parentType: Type,
+                        urls: TreeNode<UrlSegment>[]): Promise<TreeNode<RouteSegment>[]> {
+  let recognized = urls.map(u => _recognize(componentResolver, parentType, u));
+  return PromiseWrapper.all(recognized).then(ListWrapper.flatten);
+}
+
+function _constructSegment(componentResolver: ComponentResolver,
+                           matched: _MatchResult): Promise<TreeNode<RouteSegment>[]> {
   return componentResolver.resolveComponent(matched.route.component)
       .then(factory => {
-        let segment = new RouteSegment(matched.consumedUrlSegments, matched.parameters, "",
+        let segment = new RouteSegment(matched.consumedUrlSegments, matched.parameters,
+                                       matched.consumedUrlSegments[0].outlet,
                                        matched.route.component, factory);
 
-        if (isPresent(matched.leftOver)) {
+        if (isPresent(matched.leftOverUrl)) {
-          return _recognize(componentResolver, matched.route.component, url, matched.leftOver)
+          return _recognize(componentResolver, matched.route.component, matched.leftOverUrl)
-              .then(children => [segment].concat(children));
+              .then(children => [new TreeNode<RouteSegment>(segment, children)]);
         } else {
-          return [segment];
+          return [new TreeNode<RouteSegment>(segment, [])];
         }
       });
 }
 
-function _match(metadata: RoutesMetadata, url: Tree<UrlSegment>,
+function _match(metadata: RoutesMetadata, url: TreeNode<UrlSegment>): _MatchResult {
-                current: UrlSegment): _MatchingResult {
   for (let r of metadata.routes) {
-    let matchingResult = _matchWithParts(r, url, current);
+    let matchingResult = _matchWithParts(r, url);
     if (isPresent(matchingResult)) {
       return matchingResult;
     }
@@ -48,30 +68,63 @@ function _match(metadata: RoutesMetadata, url: Tree<UrlSegment>,
   throw new BaseException("Cannot match any routes");
 }
 
-function _matchWithParts(route: RouteMetadata, url: Tree<UrlSegment>,
+function _matchWithParts(route: RouteMetadata, url: TreeNode<UrlSegment>): _MatchResult {
-                         current: UrlSegment): _MatchingResult {
   let parts = route.path.split("/");
-  let parameters = {};
+  let positionalParams = {};
   let consumedUrlSegments = [];
 
-  let u = current;
+  let lastParent: TreeNode<UrlSegment> = null;
+  let lastSegment: TreeNode<UrlSegment> = null;
+
+  let current = url;
   for (let i = 0; i < parts.length; ++i) {
-    consumedUrlSegments.push(u);
     let p = parts[i];
-    if (p.startsWith(":")) {
+    let isLastSegment = i === parts.length - 1;
-      let segment = u.segment;
+    let isLastParent = i === parts.length - 2;
-      parameters[p.substring(1)] = segment;
+    let isPosParam = p.startsWith(":");
-    } else if (p != u.segment) {
+
-      return null;
+    if (isBlank(current)) return null;
+    if (!isPosParam && p != current.value.segment) return null;
+    if (isLastSegment) {
+      lastSegment = current;
     }
-    u = url.firstChild(u);
+    if (isLastParent) {
-  }
+      lastParent = current;
-  return new _MatchingResult(route, consumedUrlSegments, parameters, u);
     }
 
-class _MatchingResult {
+    if (isPosParam) {
+      positionalParams[p.substring(1)] = current.value.segment;
+    }
+
+    consumedUrlSegments.push(current.value);
+
+    current = ListWrapper.first(current.children);
+  }
+
+  let parameters = <{[key: string]: string}>StringMapWrapper.merge(lastSegment.value.parameters,
+                                                                   positionalParams);
+  let axuUrlSubtrees = isPresent(lastParent) ? lastParent.children.slice(1) : [];
+  return new _MatchResult(route, consumedUrlSegments, parameters, current, axuUrlSubtrees);
+}
+
+function _checkOutletNameUniqueness(nodes: TreeNode<RouteSegment>[]): TreeNode<RouteSegment>[] {
+  let names = {};
+  nodes.forEach(n => {
+    let segmentWithSameOutletName = names[n.value.outlet];
+    if (isPresent(segmentWithSameOutletName)) {
+      let p = segmentWithSameOutletName.stringifiedUrlSegments;
+      let c = n.value.stringifiedUrlSegments;
+      throw new BaseException(`Two segments cannot have the same outlet name: '${p}' and '${c}'.`);
+    }
+    names[n.value.outlet] = n.value;
+  });
+  return nodes;
+}
+
+class _MatchResult {
   constructor(public route: RouteMetadata, public consumedUrlSegments: UrlSegment[],
-              public parameters: {[key: string]: string}, public leftOver: UrlSegment) {}
+              public parameters: {[key: string]: string}, public leftOverUrl: TreeNode<UrlSegment>,
+              public aux: TreeNode<UrlSegment>[]) {}
 }
 
 function _readMetadata(componentType: Type) {

modules/angular2/test/alt_router/recognize_spec.ts

@@ -19,28 +19,111 @@ import {recognize} from 'angular2/src/alt_router/recognize';
 import {Routes, Route} from 'angular2/alt_router';
 import {provide, Component, ComponentResolver} from 'angular2/core';
 import {UrlSegment, Tree} from 'angular2/src/alt_router/segments';
+import {DefaultRouterUrlParser} from 'angular2/src/alt_router/router_url_parser';
+import {DEFAULT_OUTLET_NAME} from 'angular2/src/alt_router/constants';
 
 export function main() {
   describe('recognize', () => {
     it('should handle position args',
        inject([AsyncTestCompleter, ComponentResolver], (async, resolver) => {
-         recognize(resolver, ComponentA, tree(["b", "paramB", "c", "paramC"]))
+         recognize(resolver, ComponentA, tree("b/paramB/c/paramC/d"))
              .then(r => {
-               let b = r.root;
+               let a = r.root;
+               expect(stringifyUrl(a.urlSegments)).toEqual([""]);
+               expect(a.type).toBe(ComponentA);
+
+               let b = r.firstChild(r.root);
                expect(stringifyUrl(b.urlSegments)).toEqual(["b", "paramB"]);
                expect(b.type).toBe(ComponentB);
 
-               let c = r.firstChild(r.root);
+               let c = r.firstChild(r.firstChild(r.root));
                expect(stringifyUrl(c.urlSegments)).toEqual(["c", "paramC"]);
                expect(c.type).toBe(ComponentC);
 
+               let d = r.firstChild(r.firstChild(r.firstChild(r.root)));
+               expect(stringifyUrl(d.urlSegments)).toEqual(["d"]);
+               expect(d.type).toBe(ComponentD);
+
+               async.done();
+             });
+       }));
+
+    it('should handle aux routes',
+       inject([AsyncTestCompleter, ComponentResolver], (async, resolver) => {
+         recognize(resolver, ComponentA, tree("b/paramB(/d//right:d)"))
+             .then(r => {
+               let c = r.children(r.root);
+               expect(stringifyUrl(c[0].urlSegments)).toEqual(["b", "paramB"]);
+               expect(c[0].outlet).toEqual(DEFAULT_OUTLET_NAME);
+               expect(c[0].type).toBe(ComponentB);
+
+               expect(stringifyUrl(c[1].urlSegments)).toEqual(["d"]);
+               expect(c[1].outlet).toEqual("aux");
+               expect(c[1].type).toBe(ComponentD);
+
+               expect(stringifyUrl(c[2].urlSegments)).toEqual(["d"]);
+               expect(c[2].outlet).toEqual("right");
+               expect(c[2].type).toBe(ComponentD);
+
+               async.done();
+             });
+       }));
+
+    it("should error when two segments with the same outlet name",
+       inject([AsyncTestCompleter, ComponentResolver], (async, resolver) => {
+         recognize(resolver, ComponentA, tree("b/paramB(right:d//right:e)"))
+             .catch(e => {
+               expect(e.message).toEqual(
+                   "Two segments cannot have the same outlet name: 'right:d' and 'right:e'.");
+               async.done();
+             });
+       }));
+
+    it('should handle nested aux routes',
+       inject([AsyncTestCompleter, ComponentResolver], (async, resolver) => {
+         recognize(resolver, ComponentA, tree("b/paramB(/d(right:e))"))
+             .then(r => {
+               let c = r.children(r.root);
+               expect(stringifyUrl(c[0].urlSegments)).toEqual(["b", "paramB"]);
+               expect(c[0].outlet).toEqual(DEFAULT_OUTLET_NAME);
+               expect(c[0].type).toBe(ComponentB);
+
+               expect(stringifyUrl(c[1].urlSegments)).toEqual(["d"]);
+               expect(c[1].outlet).toEqual("aux");
+               expect(c[1].type).toBe(ComponentD);
+
+               expect(stringifyUrl(c[2].urlSegments)).toEqual(["e"]);
+               expect(c[2].outlet).toEqual("right");
+               expect(c[2].type).toBe(ComponentE);
+
+               async.done();
+             });
+       }));
+
+    it('should handle matrix parameters',
+       inject([AsyncTestCompleter, ComponentResolver], (async, resolver) => {
+         recognize(resolver, ComponentA, tree("b/paramB;b1=1;b2=2(/d;d1=1;d2=2)"))
+             .then(r => {
+               let c = r.children(r.root);
+               expect(c[0].parameters).toEqual({'b': 'paramB', 'b1': '1', 'b2': '2'});
+               expect(c[1].parameters).toEqual({'d1': '1', 'd2': '2'});
+
                async.done();
              });
        }));
 
     it('should error when no matching routes',
        inject([AsyncTestCompleter, ComponentResolver], (async, resolver) => {
-         recognize(resolver, ComponentA, tree(["invalid"]))
+         recognize(resolver, ComponentA, tree("invalid"))
+             .catch(e => {
+               expect(e.message).toEqual("Cannot match any routes");
+               async.done();
+             });
+       }));
+
+    it('should handle no matching routes (too short)',
+       inject([AsyncTestCompleter, ComponentResolver], (async, resolver) => {
+         recognize(resolver, ComponentA, tree("b"))
              .catch(e => {
                expect(e.message).toEqual("Cannot match any routes");
                async.done();
@@ -49,7 +132,7 @@ export function main() {
 
     it("should error when a component doesn't have @Routes",
        inject([AsyncTestCompleter, ComponentResolver], (async, resolver) => {
-         recognize(resolver, ComponentA, tree(["d", "invalid"]))
+         recognize(resolver, ComponentA, tree("d/invalid"))
              .catch(e => {
                expect(e.message)
                    .toEqual("Component 'ComponentD' does not have route configuration");
@@ -59,22 +142,27 @@ export function main() {
   });
 }
 
-function tree(nodes: string[]) {
+function tree(url: string): Tree<UrlSegment> {
-  return new Tree<UrlSegment>(nodes.map(v => new UrlSegment(v, {}, "")));
+  return new DefaultRouterUrlParser().parse(url);
 }
 
 function stringifyUrl(segments: UrlSegment[]): string[] {
   return segments.map(s => s.segment);
 }
 
-@Component({selector: 'c', template: 't'})
-class ComponentC {
-}
-
 @Component({selector: 'd', template: 't'})
 class ComponentD {
 }
 
+@Component({selector: 'e', template: 't'})
+class ComponentE {
+}
+
+@Component({selector: 'c', template: 't'})
+@Routes([new Route({path: "d", component: ComponentD})])
+class ComponentC {
+}
+
 @Component({selector: 'b', template: 't'})
 @Routes([new Route({path: "c/:c", component: ComponentC})])
 class ComponentB {
@@ -83,7 +171,8 @@ class ComponentB {
 @Component({selector: 'a', template: 't'})
 @Routes([
   new Route({path: "b/:b", component: ComponentB}),
-  new Route({path: "d", component: ComponentD})
+  new Route({path: "d", component: ComponentD}),
+  new Route({path: "e", component: ComponentE})
 ])
 class ComponentA {
 }