AngularJS ui-router

HTML

<script src="http://txt.fliglio.com/ui-router.js"></script>
		<div class="navbar navbar-fixed-top">
			<div class="navbar-inner"><div class="container">
				<ul class="nav">
					<li ng-class="{ active: $state.includes('home') }"><a href="#/">Home</a></li>
                    <li ng-class="{ active: $state.includes('settings') }"><a href="#/settings">Settings</a></li>
				</ul>
				<p class="navbar-text" ui-view="hint"></p>
			</div></div>
		</div>
        <div breadcrumb style="margin-top:60px"></div>
		<div class="container"ui-view ></div>
		<hr>
            
		<pre>
			$state = {{$state.current.name}}
			$stateParams = {{$stateParams}}
		</pre>

CSS

@import url('http://txt.fliglio.com/bootstrap.css');

JavaScript

/* myApp module */
angular.module('myApp', ['ui.state', 'accountSettings'])
    .config(['$stateProvider', '$routeProvider', '$urlRouterProvider', 
            function ($stateProvider, $routeProvider, $urlRouterProvider) {
    
        var home = {
            name: 'home',
            url: '/',
            onEnter: function($rootScope) {
                $rootScope.$broadcast("NavDataChanged", {
                   depth: 0
               });
            },
            template: 
                '<div class="hero-unit">'+
                    '<h1>\'Allo, \'Allo!</h1>'+
                    '<ul><li ng-repeat="thing in awesomeThings">{{thing}}</li></ul>'+
                    '<p>installed. Check out <a href="#/settings">settings</a> to see some cool stuff</p></div>'+
                '</div>',
            controller: ['$scope', function ($scope) {
                $scope.awesomeThings = ['AngularJS', 'AngularJS-Ui-Router'];
            }]
        };
             
        $stateProvider
            .state(home);
    }])
    .run(['$rootScope', '$state', '$stateParams', function ($rootScope,   $state,   $stateParams) {
        $rootScope.$state = $state;
        $rootScope.$stateParams = $stateParams;
        $state.transitionTo('home');
    }]);

/* accountSettings Module */
angular.module('accountSettings', ['ui.state'])
    .config(['$stateProvider', '$routeProvider', '$urlRouterProvider', 
            function ($stateProvider, $routeProvider, $urlRouterProvider) {
        
        var settings = {
            name: 'settings',
            url: '/settings',
            abstract: true,
            onEnter: function($rootScope) {
                $rootScope.$broadcast("NavDataChanged", {
                   depth: 1
               });
            },
            template: 
                '<div class="row"><div class="span3"><div class="pa-sidebar well well-small">'+
                  '<ul class="nav nav-list">'+
                    '<li...