<!doctype html>
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7" ng-app="docsApp"  lang="en" ng-controller="DocsController"> <![endif]-->
<!--[if IE 7]>    <html class="no-js lt-ie9 lt-ie8" ng-app="docsApp"  lang="en" ng-controller="DocsController"> <![endif]-->
<!--[if IE 8]>    <html class="no-js lt-ie9" ng-app="docsApp"  lang="en" ng-controller="DocsController"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" ng-app="docsApp"  lang="en" ng-controller="DocsController"> <!--<![endif]-->
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="Description"
        content="AngularJS is what HTML would have been, had it been designed for building web-apps.
                 Declarative templates with data-binding, MVC, dependency injection and great
                 testability story all implemented with pure client-side JavaScript!">
  <meta name="fragment" content="!">
  <title ng-bind-template="UI Router: {{partialTitle}}">Docs</title>
  <script type="text/javascript">
    // dynamically add base tag as well as css and javascript files.
    // we can't add css/js the usual way, because some browsers (FF) eagerly prefetch resources
    // before the base attribute is added, causing 404 and terribly slow loading of the docs app.
    (function() {
      var indexFile = (location.pathname.match(/\/(index[^\.]*\.html)/) || ['', ''])[1],
          rUrl = /(#!\/|api|index[^\.]*\.html).*$/,
          origin = location.origin || (window.location.protocol + "//" + window.location.hostname + (window.location.port ? ':' + window.location.port: '')),
          baseUrl = origin + location.href.substr(origin.length).replace(rUrl, indexFile),
          headEl = document.getElementsByTagName('head')[0],
          sync = true;

      addTag('base', {href: baseUrl});
      addTag('link', {rel: 'stylesheet', href: 'css/bootstrap.min.css', type: 'text/css'});
      addTag('link', {rel: 'stylesheet', href: 'css/font-awesome.css', type: 'text/css'});
      addTag('link', {rel: 'stylesheet', href: 'css/prettify.css', type: 'text/css'});
      addTag('link', {rel: 'stylesheet', href: 'css/docs.css', type: 'text/css'});
      addTag('link', {rel: 'stylesheet', href: 'css/animations.css', type: 'text/css'});

      
         addTag('link', {rel: 'stylesheet', href: 'css/uirouter-docs.css', type: 'text/css'}, sync);
      

      addTag('script', {src: 'js/google-code-prettify.js'}, sync);
      addTag('script', {src: 'js/marked.js'}, sync);

      
        addTag('script', {src: 'js/angular.min.js'}, sync);
      
      
      addTag('script', {src: 'js/angular-bootstrap.js'}, sync);
      addTag('script', {src: 'js/angular-bootstrap-prettify.js'}, sync);
      addTag('script', {src: 'js/docs-setup.js'}, sync);
      addTag('script', {src: 'js/docs.js'}, sync);
      
      function addTag(name, attributes, sync) {
        var el = document.createElement(name),
            attrName;

        for (attrName in attributes) {
          el.setAttribute(attrName, attributes[attrName]);
        }

        sync ? document.write(outerHTML(el)) : headEl.appendChild(el);
      }

      function outerHTML(node){
        // if IE, Chrome take the internal method otherwise build one
        return node.outerHTML || (
            function(n){
                var div = document.createElement('div'), h;
                div.appendChild(n);
                h = div.innerHTML;
                div = null;
                return h;
            })(node);
      }
    })();

  </script>
</head>

<body>
  <header class="header">
    <div class="navbar navbar-fixed-top">
      <div class="navbar-inner">
        <div class="container">
          
          
            <a  class="brand">UI Router</a>
          
          <ul class="nav">
            <li ng-repeat="(url, name) in sections" ng-class="{active: isActivePath(url)}">
              <a ng-href="{{url}}"><i class="icon-book icon-white"></i> {{name}}</a>
            </li>
          </ul>
          <ul class="nav pull-right">
	<li><a href="https://github.com/angular-ui/ui-router"><i class="icon-github icon-white"></i> Github</a></li>
	<li><a href="https://github.com/angular-ui/ui-router/wiki"><i class="icon-book icon-white"></i> Guide</a></li>
	<li><a href="http://angular-ui.github.io/ui-router/sample/"><i class="icon-rocket icon-white"></i> Sample App</a></li>
	<li><a href="https://github.com/angular-ui/ui-router/wiki/Frequently-Asked-Questions"><i class="icon-question-sign icon-white"></i> FAQ</a></li>
</ul>
        </div>
      </div>
    </div>
  </header>

  <div role="main" class="container">
    <div class="row clear-navbar"></div>

    <div class="row">
      <div class="span12">
        <!--[if lt IE 7]>
        <p class="alert alert-error">Your browser is <em>ancient!</em>
          <a href="http://browsehappy.com/">Upgrade to a different browser</a> or
          <a href="http://www.google.com/chromeframe/?redirect=true">install Google Chrome Frame</a> to
          experience this site.
        </p>
        <![endif]-->

        <!--[if lt IE 9]>
        <div class="alert">
          You are using an old version of Internet Explorer.
          For better and safer browsing experience please <a href="http://www.microsoft.com/IE9">upgrade IE</a>
          or install <a href="http://google.com/chrome">Google Chrome browser</a>.
        </div>
        <![endif]-->
      </div>

    </div>

    <div class="row">
      <div class="span3">
        <form class="form-search" ng-submit="submitForm()">
          
          <input type="text" ng-model="search" placeholder="search the docs"
                 tabindex="1" accesskey="s" class="search-query">
          
          <div class="spacer"></div>

          <ul class="nav nav-list well" ng-show="pages.length">
            <li ng-repeat="page in pages track by page.url" ng-class="navClass(page)" class="api-list-item expand">
              <a href="{{page.url}}" tabindex="2">{{page.shortName}}</a>
            </li>
          </ul>

          <ul class="nav nav-list well" ng-repeat="module in modules track by module.url" class="api-list-item">
            <li class="nav-header module">
              <a class="guide">module</a>
              <a class="code" href="{{module.url}}">{{module.name}}</a>
            </li>

            <li ng-repeat="page in module.others track by page.url" ng-class="navClass(page)" class="api-list-item expand">
              <a href="{{page.url}}" tabindex="2">{{page.shortName}}</a>
            </li>

            <li class="nav-header section" ng-show="module.directives.length">
              <a class="guide">directive</a>
            </li>
            <li ng-repeat="page in module.directives track by page.url" ng-class="navClass(page)" class="api-list-item expand">
              <a href="{{page.url}}" tabindex="2">{{page.shortName}}</a>
            </li>

            <li class="nav-header section" ng-show="module.controllers.length">
              <a class="guide">controller</a>
            </li>
            <li ng-repeat="page in module.controllers track by page.url" ng-class="navClass(page)" class="api-list-item expand">
              <a href="{{page.url}}" tabindex="2">{{page.shortName}}</a>
            </li>

            <li class="nav-header section" ng-show="module.filters.length">
              <a class="guide">filter</a>
            </li>
            <li ng-repeat="page in module.filters track by page.url" ng-class="navClass(page)" class="api-list-item expand">
              <a href="{{page.url}}" tabindex="2">{{page.shortName}}</a>
            </li>

            <li class="nav-header section" ng-show="module.services.length">
              <a class="guide">service</a>
            </li>
            <li ng-repeat="service in module.services track by service.instance.url" ng-class="navClass(service.instance, service.provider)" class="api-list-item expand">
              <a ng-show="service.provider" class="pull-right" href="{{service.provider.url}}" tabindex="2"><i class="icon-cog"></i></a>
              <a href="{{service.instance.url}}" tabindex="2">{{service.name}}</a>
            </li>

            <li class="nav-header section" ng-show="module.types.length">
              <a class="guide">Types</a>
            </li>
            <li ng-repeat="page in module.types track by page.url" ng-class="navClass(page)" class="api-list-item expand">
              <a href="{{page.url}}" tabindex="2">{{page.shortName}}</a>
            </li>

            <li class="nav-header section" ng-show="module.globals.length">
              <a class="global guide">global APIs</a>
              &nbsp;
            </li>
            <li ng-repeat="page in module.globals track by page.url" ng-class="navClass(page)" class="api-list-item expand">
              <a href="{{page.url}}" tabindex="2">{{page.id}}</a>
            </li>

          </ul>

        </form>
      </div>
      <div class="span9">

        <ul class="breadcrumb">
          <li ng-repeat="crumb in breadcrumb">
            <span ng-hide="crumb.url">{{crumb.name}}</span>
            <a ng-show="crumb.url" href="{{crumb.url}}">{{crumb.name}}</a>
            <span ng-show="crumb.url" class="divider">/</span>
          </li>
        </ul>

        <div id="loading" ng-show="loading">Loading...</div>

        <div ng-hide="loading" ng-include src="currentPage.partialUrl" onload="afterPartialLoaded()" autoscroll class="content slide-reveal"></div>

      </div>
    </div>
  </div>

</body>
</html>
