category formatting

src/main/webapp/directives/category.html

@@ -1,6 +1,6 @@
 <span> <input type="checkbox" checked="checked" /> 
 	<label ng-click="categoryClick({id: node.id})"
-		   ng-class="{selected: (node.id == selectedId && selectedType == 'category')}">{{node.name}}
+		   ng-class="{selected: (node.id == selectedId && selectedType == 'category')}">{{formatCategoryName({category:node})}}
 	</label>
 	<ul>
 		<li ng-repeat="feed in node.feeds">

src/main/webapp/js/controllers.js

@@ -12,14 +12,16 @@ module.controller('CategoryTreeCtrl',
 					name : "News",
 					feeds : [ {
 						id : "2",
-						name : "Cyanide & Happiness"
+						name : "Cyanide & Happiness",
+						unread : 34
 					} ],
 					children : [ {
 						id : "2",
 						name : "Comics",
 						feeds : [ {
 							id : "1",
-							name : "Dilbert"
+							name : "Dilbert",
+							unread : 4
 						} ]
 					} ]
 				}, {
@@ -27,11 +29,35 @@ module.controller('CategoryTreeCtrl',
 					name : "Blogs",
 					feeds : [ {
 						id : "3",
-						name : "Engadget"
+						name : "Engadget",
+						unread : 0
 					} ]
 				} ]
 			};
 
+			var unreadCount = function(category) {
+				var count = 0;
+				console.log(category)
+				for ( var child in category.children) {
+					count = count + unreadCount(child);
+				}
+				for ( var feed in category.feeds) {
+					if (feed.unread) {
+						count = count + feed.unread;
+					}
+				}
+				return count;
+			}
+
+			$scope.formatCategoryName = function(category) {
+				var count = unreadCount(category);
+				var label = category.name;
+				if (count > 0) {
+					label = label + " (" + count + ")";
+				}
+				return label;
+			}
+
 			$scope.feedClicked = function(id) {
 				$location.path('/feeds/view/feed/' + id);
 			};

src/main/webapp/js/directives.js

@@ -7,7 +7,8 @@ module.directive('category', function($compile) {
 			selectedType: '=',
 			selectedId: '=',
 			feedClick: '&',
-			categoryClick: '&'
+			categoryClick: '&',
+			formatCategoryName: '&' 
 		},
 		restrict : 'E',
 		replace: true,
@@ -15,7 +16,7 @@ module.directive('category', function($compile) {
 		link: function(scope, element) {
             if (scope.node.children) {
                 var ul = element.find('ul');
-                ul.prepend('<category ng-repeat="child in node.children" node="child" feed-click="feedClick({id:id})" category-click="categoryClick({id:id})" selected-type="selectedType" selected-id="selectedId"></category>');
+                ul.prepend('<category ng-repeat="child in node.children" node="child" feed-click="feedClick({id:id})" category-click="categoryClick({id:id})" selected-type="selectedType" selected-id="selectedId" format-category-name="formatCategoryName({category:category})"></category>');
                 $compile(ul.contents())(scope);
             }
 	     }

src/main/webapp/templates/feeds.html

@@ -4,7 +4,7 @@
 			<div class="css-treeview">
 				<ul>
 					<li ng-repeat="node in root.children">
-						<category node="node" feed-click="feedClicked(id)" category-click="categoryClicked(id)" selected-type="selectedType" selected-id="selectedId"></category>
+						<category node="node" feed-click="feedClicked(id)" category-click="categoryClicked(id)" selected-type="selectedType" selected-id="selectedId" format-category-name="formatCategoryName(category)"></category>
 					</li>
 				</ul>
 			</div>