import {Directive} from '../core/metadata';
import {StringMap, StringMapWrapper} from 'angular2/src/core/facade/collection';

import {Router} from './router';
import {Location} from './location';
import {Instruction, stringifyInstruction} from './instruction';

/**
 * The RouterLink directive lets you link to specific parts of your app.
 *
 * Consider the following route configuration:

 * ```
 * @RouteConfig([
 *   { path: '/user', component: UserCmp, as: 'user' }
 * ]);
 * class MyComp {}
 * ```
 *
 * When linking to this `user` route, you can write:
 *
 * ```
 * <a [router-link]="['./user']">link to user component</a>
 * ```
 *
 * RouterLink expects the value to be an array of route names, followed by the params
 * for that level of routing. For instance `['/team', {teamId: 1}, 'user', {userId: 2}]`
 * means that we want to generate a link for the `team` route with params `{teamId: 1}`,
 * and with a child route `user` with params `{userId: 2}`.
 *
 * The first route name should be prepended with `/`, `./`, or `../`.
 * If the route begins with `/`, the router will look up the route from the root of the app.
 * If the route begins with `./`, the router will instead look in the current component's
 * children for the route. And if the route begins with `../`, the router will look at the
 * current component's parent.
 */
@Directive({
  selector: '[router-link]',
  inputs: ['routeParams: routerLink'],
  host: {
    '(click)': 'onClick()',
    '[attr.href]': 'visibleHref',
    '[class.router-link-active]': 'isRouteActive'
  }
})
export class RouterLink {
  private _routeParams: any[];

  // the url displayed on the anchor element.
  visibleHref: string;

  // the instruction passed to the router to navigate
  private _navigationInstruction: Instruction;

  constructor(private _router: Router, private _location: Location) {}

  get isRouteActive(): boolean { return this._router.isRouteActive(this._navigationInstruction); }

  set routeParams(changes: any[]) {
    this._routeParams = changes;
    this._navigationInstruction = this._router.generate(this._routeParams);

    // TODO: is this the right spot for this?
    var navigationHref = '/' + stringifyInstruction(this._navigationInstruction);
    this.visibleHref = this._location.normalizeAbsolutely(navigationHref);
  }

  onClick(): boolean {
    this._router.navigateByInstruction(this._navigationInstruction);
    return false;
  }
}