Server-side tracking of new message count

client/js/shout.js

@@ -132,8 +132,8 @@ $(function() {
 		$("body").removeClass("signed-out");
 		$("#sign-in").detach();
 
-		var id = $.cookie("target");
-		var target = sidebar.find("[data-target='" + id + "']").trigger("click");
+		var id = data.active;
+		var target = sidebar.find("[data-id='" + id + "']").trigger("click");
 		if (target.length === 0) {
 			var first = sidebar.find(".chan")
 				.eq(0)
@@ -371,13 +371,14 @@ $(function() {
 			return;
 		}
 
-		if (self.hasClass("chan")) {
-			$.cookie("target", target);
-		}
 		chat.data(
 			"id",
 			self.data("id")
 		);
+		socket.emit(
+			"open",
+			self.data("id")
+		);
 
 		sidebar.find(".active").removeClass("active");
 		self.addClass("active")

client/js/shout.templates.js

@@ -1,8 +1,7 @@
 (function() {
   var template = Handlebars.template, templates = Handlebars.templates = Handlebars.templates || {};
 templates['chan'] = template({"1":function(depth0,helpers,partials,data) {
-  var helper, functionType="function", helperMissing=helpers.helperMissing, escapeExpression=this.escapeExpression;
-  return "<button data-id=\""
+  var stack1, helper, functionType="function", helperMissing=helpers.helperMissing, escapeExpression=this.escapeExpression, buffer = "<button data-id=\""
     + escapeExpression(((helper = (helper = helpers.id || (depth0 != null ? depth0.id : depth0)) != null ? helper : helperMissing),(typeof helper === functionType ? helper.call(depth0, {"name":"id","hash":{},"data":data}) : helper)))
     + "\" data-target=\"#chan-"
     + escapeExpression(((helper = (helper = helpers.id || (depth0 != null ? depth0.id : depth0)) != null ? helper : helperMissing),(typeof helper === functionType ? helper.call(depth0, {"name":"id","hash":{},"data":data}) : helper)))
@@ -10,10 +9,16 @@ templates['chan'] = template({"1":function(depth0,helpers,partials,data) {
     + escapeExpression(((helper = (helper = helpers.name || (depth0 != null ? depth0.name : depth0)) != null ? helper : helperMissing),(typeof helper === functionType ? helper.call(depth0, {"name":"name","hash":{},"data":data}) : helper)))
     + "\" class=\"chan "
     + escapeExpression(((helper = (helper = helpers.type || (depth0 != null ? depth0.type : depth0)) != null ? helper : helperMissing),(typeof helper === functionType ? helper.call(depth0, {"name":"type","hash":{},"data":data}) : helper)))
-    + "\">\n	<span class=\"badge\"></span>\n	<span class=\"close\"></span>\n	"
+    + "\">\n	<span class=\"badge\">";
+  stack1 = helpers['if'].call(depth0, (depth0 != null ? depth0.unread : depth0), {"name":"if","hash":{},"fn":this.program(2, data),"inverse":this.noop,"data":data});
+  if (stack1 != null) { buffer += stack1; }
+  return buffer + "</span>\n	<span class=\"close\"></span>\n	"
     + escapeExpression(((helper = (helper = helpers.name || (depth0 != null ? depth0.name : depth0)) != null ? helper : helperMissing),(typeof helper === functionType ? helper.call(depth0, {"name":"name","hash":{},"data":data}) : helper)))
     + "\n</button>\n";
-},"compiler":[6,">= 2.0.0-beta.1"],"main":function(depth0,helpers,partials,data) {
+},"2":function(depth0,helpers,partials,data) {
+  var helper, functionType="function", helperMissing=helpers.helperMissing, escapeExpression=this.escapeExpression;
+  return escapeExpression(((helper = (helper = helpers.unread || (depth0 != null ? depth0.unread : depth0)) != null ? helper : helperMissing),(typeof helper === functionType ? helper.call(depth0, {"name":"unread","hash":{},"data":data}) : helper)));
+  },"compiler":[6,">= 2.0.0-beta.1"],"main":function(depth0,helpers,partials,data) {
   var stack1, buffer = "";
   stack1 = helpers.each.call(depth0, (depth0 != null ? depth0.channels : depth0), {"name":"each","hash":{},"fn":this.program(1, data),"inverse":this.noop,"data":data});
   if (stack1 != null) { buffer += stack1; }

client/templates/chan.tpl

@@ -1,6 +1,6 @@
 {{#each channels}}
 <button data-id="{{id}}" data-target="#chan-{{id}}" data-title="{{name}}" class="chan {{type}}">
-	<span class="badge"></span>
+	<span class="badge">{{#if unread}}{{unread}}{{/if}}</span>
 	<span class="close"></span>
 	{{name}}
 </button>

src/client.js

@@ -49,6 +49,7 @@ var inputs = [
 
 function Client(sockets, name, config) {
 	_.merge(this, {
+		activeChannel: -1,
 		config: config,
 		id: id++,
 		name: name,
@@ -236,6 +237,14 @@ Client.prototype.more = function(data) {
 	});
 };
 
+Client.prototype.open = function(data) {
+	var target = this.find(data);
+	if (target) {
+		target.chan.unread = 0;
+		this.activeChannel = target.chan.id;
+	}
+};
+
 Client.prototype.quit = function() {
 	this.networks.forEach(function(network) {
 		var irc = network.irc;

src/models/chan.js

@@ -16,6 +16,7 @@ function Chan(attr) {
 		messages: [],
 		name: "",
 		type: Chan.Type.CHANNEL,
+		unread: 5,
 		users: []
 	}, attr));
 }

src/plugins/irc-events/message.js

@@ -9,6 +9,7 @@ module.exports = function(irc, network) {
 		if (target.toLowerCase() == irc.me.toLowerCase()) {
 			target = data.from;
 		}
+
 		var chan = _.findWhere(network.channels, {name: target});
 		if (typeof chan === "undefined") {
 			chan = new Chan({
@@ -21,19 +22,27 @@ module.exports = function(irc, network) {
 				chan: chan
 			});
 		}
+
 		var type = "";
 		var text = data.message;
 		if (text.split(" ")[0] === "\u0001ACTION") {
 			type = Msg.Type.ACTION;
 			text = text.replace(/\u0001|ACTION/g, "");
 		}
+
 		text.split(" ").forEach(function(w) {
 			if (w.indexOf(irc.me) === 0) type += " highlight";
 		});
+
 		var self = false;
 		if (data.from.toLowerCase() == irc.me.toLowerCase()) {
 			self = true;
 		}
+
+		if (chan.id != client.activeChannel) {
+			chan.unread++;
+		}
+
 		var msg = new Msg({
 			type: type || Msg.Type.MESSAGE,
 			from: data.from,

src/server.js

@@ -80,8 +80,15 @@ function init(socket, client, token) {
 				client.connect(data);
 			}
 		);
+		socket.on(
+			"open",
+			function(data) {
+				client.open(data);
+			}
+		)
 		socket.join(client.id);
 		socket.emit("init", {
+			active: client.activeChannel,
 			networks: client.networks,
 			token: token || ""
 		});