replace css tree with an angular one, fix 100% cpu usage

src/main/webapp/css/app.css

@@ -1,3 +1,7 @@
+.pointer {
+	cursor: pointer;
+}
+
 .main .spinner {
 	display: inline-block;
 	margin-left: 11px;
@@ -43,6 +47,28 @@
 	white-space: nowrap;
 }
 
+.css-treeview .indent {
+	margin-left: 22px;
+}
+
+.css-treeview ul {
+	list-style: none;
+	margin-left: 0px;
+}
+
+.css-treeview .icon-fldr {
+	background: url("../images/tree_icons.png") no-repeat;
+	cursor: pointer;
+}
+
+.css-treeview .icon-fldr-open {
+	background-position: 0 -16px;
+}
+
+.css-treeview .icon-fldr-closed {
+	background-position: 0 -32px;
+}
+
 .css-treeview .error {
 	color: red;
 	font-style: italic;

src/main/webapp/directives/category.html

@@ -1,10 +1,11 @@
 <li>
-	<input type="checkbox" ng-model="node.expanded"
-		ng-click="toggleCategory(node)" />
-	<label ng-click="categoryClick({id: node.id})"
-		ng-class="{selected: (node.id == selectedId && selectedType == 'category'), unread: unreadCount({category:node})}">{{formatCategoryName({category:node})}}
-	</label>
-	<ul>
+	<span class="icon-fldr" ng-class="{'icon-fldr-closed': !node.expanded, 'icon-fldr-open': node.expanded}" ng-click="toggleCategory(node)"></span>
+	<span ng-click="categoryClick({id: node.id})" class="pointer">
+		<span class="icon-fldr icon-fldr-folder" ng-click="toggleCategory(node)"></span>
+		<span ng-class="{selected: (node.id == selectedId && selectedType == 'category'), unread: unreadCount({category:node})}">{{formatCategoryName({category:node})}}
+		</span>
+	</span>
+	<ul ng-show="node.expanded" class="indent">
 		<recursive>
 			<category ng-repeat="child in node.children"
 				node="child" feed-click="feedClick({id:id})"

src/main/webapp/js/directives.js

@@ -121,6 +121,7 @@ module.directive('category', function($compile) {
 			};
 
 			$scope.toggleCategory = function(category) {
+				category.expanded = !category.expanded;
 				SubscriptionService.collapse({
 					id : category.id,
 					collapse : !category.expanded