use ui-router instead of routeProvider

src/main/webapp/css/app.css

@@ -64,11 +64,6 @@
 	text-overflow: ellipsis;
 }
 
-.css-treeview a:hover {
-	cursor: pointer;
-	color: black;
-}
-
 /* entry list*/
 .entrylist-header {
 	border-bottom: 1px solid #eee;

src/main/webapp/directives/toolbar.html

@@ -13,6 +13,7 @@
 			<a class="btn dropdown-toggle" data-toggle="dropdown" href="settings"><i class="icon-cog"></i><span class="caret"></span></a>
 			<ul class="dropdown-menu pull-right">
 				<li><a href="settings"><i class="icon-wrench"></i> Settings</a></li>
+				<li><a ng-click="toAdmin()"><i class="icon-edit"></i> Admin</a></li>
 				<li class="divider"></li>
 				<li><a href="logout"><i class="icon-user"></i> Logout</a></li>
 			</ul>

src/main/webapp/js/controllers.js

@@ -5,14 +5,17 @@ module.run(function($rootScope) {
 		// args.entry - the entry
 		$rootScope.$broadcast('mark', args);
 	});
+	$rootScope.$on('emitReload', function(event, args) {
+		$rootScope.$broadcast('reload');
+	});
 });
 
-module.controller('CategoryTreeCtrl', function($scope, $routeParams, $location,
-		$route, SubscriptionService) {
+module.controller('CategoryTreeCtrl', function($scope, $stateParams, $location,
+		$state, $route, SubscriptionService) {
 
-	$scope.$on('$routeChangeSuccess', function() {
-		$scope.selectedType = $routeParams._type;
-		$scope.selectedId = $routeParams._id;
+	$scope.$on('$stateChangeSuccess', function() {
+		$scope.selectedType = $stateParams._type;
+		$scope.selectedId = $stateParams._id;
 	});
 
 	$scope.SubscriptionService = SubscriptionService;
@@ -52,17 +55,23 @@ module.controller('CategoryTreeCtrl', function($scope, $routeParams, $location,
 
 	$scope.feedClicked = function(id) {
 		if ($scope.selectedType == 'feed' && id == $scope.selectedId) {
-			$route.reload();
+			$scope.$emit('emitReload');
 		} else {
-			$location.path('/feeds/view/feed/' + id);
+			$state.transitionTo('feeds.view', {
+				_type : 'feed',
+				_id : id
+			});
 		}
 	};
 
 	$scope.categoryClicked = function(id) {
 		if ($scope.selectedType == 'category' && id == $scope.selectedId) {
-			$route.reload();
+			$scope.$emit('emitReload');
 		} else {
-			$location.path('/feeds/view/category/' + id);
+			$state.transitionTo('feeds.view', {
+				_type : 'category',
+				_id : id
+			});
 		}
 	};
 
@@ -88,11 +97,11 @@ module.controller('CategoryTreeCtrl', function($scope, $routeParams, $location,
 	});
 });
 
-module.controller('FeedListCtrl', function($scope, $routeParams, $http, $route,
+module.controller('FeedListCtrl', function($scope, $stateParams, $http, $route,
 		$window, EntryService, SettingsService) {
 
-	$scope.selectedType = $routeParams._type;
-	$scope.selectedId = $routeParams._id;
+	$scope.selectedType = $stateParams._type;
+	$scope.selectedId = $stateParams._id;
 
 	$scope.name = null;
 	$scope.entries = [];
@@ -101,7 +110,7 @@ module.controller('FeedListCtrl', function($scope, $routeParams, $http, $route,
 	$scope.$watch('settingsService.settings.readingMode', function(newValue,
 			oldValue) {
 		if (newValue && oldValue && newValue != oldValue) {
-			$route.reload();
+			$scope.$emit('emitReload');
 		}
 	});
 
@@ -219,7 +228,7 @@ module.controller('FeedListCtrl', function($scope, $routeParams, $http, $route,
 			openNextEntry(e);
 		})
 	});
-	
+
 	Mousetrap.bind('shift+space', function(e) {
 		$scope.$apply(function() {
 			openPreviousEntry(e);
@@ -230,4 +239,12 @@ module.controller('FeedListCtrl', function($scope, $routeParams, $http, $route,
 			openPreviousEntry(e);
 		})
 	});
+	
+	$scope.$on('reload', function(event, args) {
+		$scope.name = null;
+		$scope.entries = [];
+		$scope.busy = false;
+		$scope.hasMore = true;
+		$scope.loadMoreEntries();
+	});
 });

src/main/webapp/js/directives.js

@@ -122,8 +122,8 @@ module.directive('category', function($compile) {
 	};
 });
 
-module.directive('toolbar', function($routeParams, $route, SettingsService,
-		EntryService, SubscriptionService) {
+module.directive('toolbar', function($stateParams, $route, $location, 
+		SettingsService, EntryService, SubscriptionService) {
 	return {
 		scope : {},
 		restrict : 'E',
@@ -142,19 +142,22 @@ module.directive('toolbar', function($routeParams, $route, SettingsService,
 
 			$scope.settingsService = SettingsService;
 			$scope.refresh = function() {
-				$route.reload();
+				$scope.$emit('emitReload');
 			};
 			$scope.markAllAsRead = function() {
 				EntryService.mark({
-					type : $routeParams._type,
-					id : $routeParams._id,
+					type : $stateParams._type,
+					id : $stateParams._id,
 					read : true,
 				}, function() {
 					SubscriptionService.init(function() {
-						$route.reload();
+						$scope.$emit('emitReload');
 					});
 				});
-			}
+			};
+			$scope.toAdmin = function() {
+				$location.path('admin');
+			};
 		},
 		link : function($scope, element) {
 			element.find('.read-mode button').bind('click', function() {

src/main/webapp/js/main.js

@@ -1,12 +1,28 @@
-var app = angular.module('commafeed', [ 'ui', 'ui.bootstrap',
-		'commafeed.directives', 'commafeed.controllers', 'commafeed.services',
+var app = angular.module('commafeed', [ 'ui', 'ui.bootstrap', 'ui.state',
+		'commafeed.directives', 'commafeed.controllers', 'commafeed.services', 
 		'ngSanitize', 'ngUpload', 'infinite-scroll' ]);
 
-app.config([ '$routeProvider', function($routeProvider) {
-	$routeProvider.when('/feeds/view/:_type/:_id', {
-		templateUrl : 'templates/feeds.html'
+app.config(function($urlRouterProvider, $stateProvider) {
+	$stateProvider.state('feeds', {
+		abstract: true,
+		url: '/feeds',
+		templateUrl: 'templates/feeds.html'
 	});
-	$routeProvider.otherwise({
-		redirectTo : '/feeds/view/category/all'
+	$stateProvider.state('feeds.view', {
+		url: '/view/:_type/:_id',
+		templateUrl : 'templates/feeds.view.html'
 	});
-} ]);
+	
+	$stateProvider.state('admin', {
+		abstract: true,
+		url: '/admin',
+		templateUrl: 'templates/admin.html'
+	});
+	$stateProvider.state('admin.users', {
+		url: '/users',
+		templateUrl : 'templates/admin.users.html'
+	});
+	
+	$urlRouterProvider.when('/', '/feeds/view/category/all');
+	$urlRouterProvider.when('/admin', '/admin/users');
+});

src/main/webapp/templates/admin.html

@@ -0,0 +1 @@
+<div ui-view></div>

src/main/webapp/templates/admin.users.html

@@ -0,0 +1 @@
+Manage users

src/main/webapp/templates/feeds.html

@@ -1,27 +1,24 @@
-<div ng-controller="FeedListCtrl">
-
-	<div class="entrylist-header">
-		<h3 ui-if="name"><span>{{name}}&nbsp;</span><span ng-show="name && selectedType == 'category'"> &#187;</span></h3>
-	</div>
-	
-	<div infinite-scroll="loadMoreEntries()" infinite-scroll-disabled="busy || !settingsService.settings.readingMode" infinite-scroll-distance="1" id="feed-accordion">
-		<div ng-repeat="entry in entries" class="entry">
-			<a scroll-to="isOpen && current == entry" scroll-to-offset="-58" href="{{entry.url}}" target="_blank" class="entry-heading" ng-click="entryClicked(entry, $event)" 
-				ng-class="{open: current == entry, closed: current != entry}">
-				<span ui-if="selectedType == 'category'" class="feed-name">{{entry.feedName}}</span>
-				<span class="entry-date">{{entry.date}}</span>
-				<span class="entry-name" ng-class="{unread: entry.read == false, shrink: selectedType == 'category'}" ng-bind-html-unsafe="entry.title"></span>
-				
-			</a>
-			<div class="entry-body" ui-if="isOpen && current == entry">
-				<div>
-					<h4>
-						<a href="{{entry.url}}" target="_blank" ng-bind-html-unsafe="entry.title"></a>
-					</h4>
-				</div>	
-				<div ng-bind-html-unsafe="entry.content"></div>
+<div class="container-fluid">
+	<div class="row-fluid">
+		<div class="span2 sidebar-nav-fixed">
+			<subscribe></subscribe>
+			<div class="css-treeview" ng-controller="CategoryTreeCtrl">
+				<ul>
+					<category node="SubscriptionService.subscriptions"
+						feed-click="feedClicked(id)" category-click="categoryClicked(id)"
+						selected-type="selectedType" selected-id="selectedId"
+						format-category-name="formatCategoryName(category)"
+						format-feed-name="formatFeedName(feed)"> </category>
+				</ul>
+			</div>
+		</div>
+		<div class="span10">
+			<div class="toolbar">
+				<toolbar></toolbar>
+			</div>
+			<div class="entryList">
+				<div ui-view></div>
 			</div>
 		</div>
-		<div class="no-entries" ng-show="entries.length.name && entries.length == 0 && !busy">"{{name}}" has no unread items.</div>
 	</div>
 </div>

src/main/webapp/templates/feeds.view.html

@@ -0,0 +1,27 @@
+<div ng-controller="FeedListCtrl">
+
+	<div class="entrylist-header">
+		<h3 ui-if="name"><span>{{name}}&nbsp;</span><span ng-show="name && selectedType == 'category'"> &#187;</span></h3>
+	</div>
+	
+	<div infinite-scroll="loadMoreEntries()" infinite-scroll-disabled="busy || !settingsService.settings.readingMode" infinite-scroll-distance="1" id="feed-accordion">
+		<div ng-repeat="entry in entries" class="entry">
+			<a scroll-to="isOpen && current == entry" scroll-to-offset="-58" href="{{entry.url}}" target="_blank" class="entry-heading" ng-click="entryClicked(entry, $event)" 
+				ng-class="{open: current == entry, closed: current != entry}">
+				<span ui-if="selectedType == 'category'" class="feed-name">{{entry.feedName}}</span>
+				<span class="entry-date">{{entry.date}}</span>
+				<span class="entry-name" ng-class="{unread: entry.read == false, shrink: selectedType == 'category'}" ng-bind-html-unsafe="entry.title"></span>
+				
+			</a>
+			<div class="entry-body" ui-if="isOpen && current == entry">
+				<div>
+					<h4>
+						<a href="{{entry.url}}" target="_blank" ng-bind-html-unsafe="entry.title"></a>
+					</h4>
+				</div>	
+				<div ng-bind-html-unsafe="entry.content"></div>
+			</div>
+		</div>
+		<div class="no-entries" ng-show="entries.length.name && entries.length == 0 && !busy">"{{name}}" has no unread items.</div>
+	</div>
+</div>