Added message types

client/css/style.css

@@ -126,19 +126,22 @@ h2 {
 	bottom: 26px;
 	left: 0;
 	overflow-y: auto;
-	padding: 4px 0;
+	padding: 4px 8px;
 	position: absolute;
 	right: 160px;
 	top: 36px;
 	word-wrap: break-word;
 	z-index: 0;
 }
-#chat .messages .message {
-	padding: 0 8px;
-}
-#chat .messages .time {
+#chat .message .time {
 	color: #bbb;
 }
-#chat .messages .user {
+#chat .message .user {
 	color: #f00;
 }
+#chat .message .text {
+	color: #999;
+}
+#chat .message.normal .text {
+	color: #000;
+}

client/index.html

@@ -50,10 +50,10 @@
 
 	<script type="text/html" id="messages">
 	{{#messages}}
-	<div class="message">
+	<div class="message {{type}}">
 		<span class="time">{{time}}</span>
 		<span class="user">{{user}}</span>
-		{{text}}
+		<span class="text">{{text}}</span>
 	</div>
 	{{/messages}}
 	</script>

lib/models.js

@@ -30,7 +30,8 @@ models.Message = Backbone.Model.extend({
 	defaults: {
 		time: "",
 		user: "",
-		text: ""
+		text: "",
+		type: "normal"
 	},
 	initialize: function() {
 		this.set("time", moment().format("HH:mm"));

lib/server.js

@@ -114,8 +114,8 @@ function handleInput(input) {
 		irc.notice(user, text);
 		channel.get("messages").add(
 			new models.Message({
-				type: "notice",
-				text: "Notice to " + user + ": " + text
+				text: "Notice to " + user + ": " + text,
+				type: "notice"
 			})
 		);
 		break;
@@ -166,7 +166,8 @@ function handleInput(input) {
 	default:
 		channel.get("messages").add(
 			new models.Message({
-				text: "Unknown command: `/" + cmd + "`"
+				text: "Unknown command: `/" + cmd + "`",
+				type: "error"
 			})
 		);
 
@@ -211,7 +212,8 @@ function handleEvent(argv) {
 		var from = argv.nick ? argv.nick : argv.prefix;
 		var message = new models.Message({
 			user: from,
-			text: "notice: " + argv.args[1]
+			text: "notice: " + argv.args[1],
+			type: "notice"
 		});
 		channels.each(function(channel) {
 			channel.get("messages").add(message);
@@ -237,7 +239,8 @@ function handleEvent(argv) {
 			messages.add(
 				new models.Message({
 					user: argv.nick,
-					text: "has joined the channel."
+					text: "has joined the channel.",
+					type: "join"
 				})
 			);
 		}
@@ -258,7 +261,8 @@ function handleEvent(argv) {
 			messages.add(
 				new models.Message({
 					user: argv.nick,
-					text: "has left the channel."
+					text: "has left the channel.",
+					type: "part"
 				})
 			);
 		}
@@ -287,8 +291,8 @@ function handleEvent(argv) {
 		messages.add(
 			new models.Message({
 				user: argv.nick,
-				text: "changed the topic of " + argv.args[0] + " to: "
-					+ argv.args[1]
+				text: "changed topic to: " + argv.args[1],
+				type: "topic"
 			})
 		);
 		break;
@@ -300,8 +304,8 @@ function handleEvent(argv) {
 			var messages = channel.get("messages");
 			messages.add(
 				new models.Message({
-					text: "Topic for " + argv.args[1] + ": "
-						+ argv.args[2]
+					text: "Topic for " + argv.args[1] + ": " + argv.args[2],
+					type: "topic"
 				})
 			);
 		}
@@ -335,7 +339,8 @@ function handleEvent(argv) {
 	case "ERROR":
 		channels.first().get("messages").add(
 			new models.Message({
-				text: argv.args.slice(2).join(" ")
+				text: argv.args.slice(2).join(" "),
+				type: "error"
 			})
 		);
 		break;