Removed the unread message counter from the sidebar, only highlights …

…/ privmsgs are displayed. Unread info now changes the style on the link so it's noticable. Closes #20

client/js/controllers/messages.controller.js

@@ -126,7 +126,8 @@ App.MessagesController = Ember.ArrayController.extend({
 			var self = this,
 				tab = this.get('socket.tabs').findBy('_id', id),
 				events = this.get('content').filterProperty('unread', true),
-				counter = 0;
+				highlightCounter = 0,
+				counter = 0,
 				docs = [];
 
 			if (!tab) {
@@ -145,12 +146,14 @@ App.MessagesController = Ember.ArrayController.extend({
 					var topOffset = el[0].offsetTop;
 
 					if ((top === 0 || top < topOffset && topOffset < bottom) && App.get('isActive')) {
-						// XXX - Handle highlights
-
 						item.set('unread', false);
 						if (self.readDocs.indexOf(item._id) === -1) {
 							self.readDocs.push(item._id);
 							counter++;
+
+							if (item.extra.highlight) {
+								highlightCounter++;
+							}
 						}
 					}
 				}
@@ -159,7 +162,11 @@ App.MessagesController = Ember.ArrayController.extend({
 			var unread = tab.get('unread') - counter;
 				unread = (unread <= 0) ? 0 : unread;
 				tab.set('unread', unread);
-			// update the icon
+
+			var highlights = tab.get('highlights') - highlightCounter;
+				highlights = (highlights <= 0) ? 0 : highlights;
+				tab.set('highlights', highlights);
+			// update the icon(s)
 
 			if (this.get('timeout')) {
 				return false;

client/js/views/sidebaritem.view.js

@@ -15,12 +15,16 @@ App.SidebaritemView = Ember.View.extend({
 			tab.set('selected', false);
 		}
 
-		if (tab.type !== 'network') {
+		if (tab.get('type') !== 'network') {
 			classes.push('child');
 		}
 
+		if (tab.get('unread') > 0) {
+			classes.push('unread');
+		}
+
 		return classes.join(' ');
-	}.property('controller.parentController.user.selectedTab').cacheable(),
+	}.property('controller.parentController.user.selectedTab', 'controller.content.selected', 'controller.content.unread').cacheable(),
 
 	getClass: function() {
 		var classNames = [''],
@@ -40,6 +44,10 @@ App.SidebaritemView = Ember.View.extend({
 		return classNames.join(' ');
 	}.property('controller.content').cacheable(),
 
+	isPrivmsg: function() {
+		return (this.get('controller.content.type') === 'query');
+	}.property('controller.content.type').cacheable(),
+
 	url: function() {
 		var split = this.get('controller.content.url').split('/');
 

client/less/app.less

@@ -373,7 +373,16 @@ div.sidebar {
 				}
 			}
 
-			.child:not(.selected) {
+			.unread {
+				width: 210px;
+				z-index: 7000;
+
+				a {
+					border-left: 5px solid #225FA3;
+				}
+			}
+
+			.child:not(.selected,.unread) {
 				span.link {
 					padding-left: 6px;
 				}

client/templates/sidebaritem.hbs

@@ -1,7 +1,12 @@
 <a {{bind-attr href=view.url title=title}}>
 	<span {{bind-attr class=":link view.getClass"}}>
-		{{#if highlights}}<span class="alert highlight" {{action "markAsRead" _id bubbles=false}}>{{highlights}}</span>{{/if}}
-		{{#if unread}}<span class="alert unread" {{action "markAsRead" _id bubbles=false}}>{{unread}}</span>{{/if}}
+		{{#if view.isPrivmsg}}
+			{{#if unread}}
+				<span class="alert highlight" {{action "markAsRead" _id bubbles=false}}>{{unread}}</span>
+			{{/if}}
+		{{else}}
+			{{#if highlights}}<span class="alert highlight" {{action "markAsRead" _id bubbles=false}}>{{highlights}}</span>{{/if}}
+		{{/if}}
 		{{view.title}}
 	</span>
 </a>