Clickable users

client/css/style.css

@@ -11,9 +11,14 @@ h2 {
 	font: inherit;
 	margin: 0;
 }
-.nav > li > a:hover {
+.nav a[data-toggle]:hover {
 	background: #f9f9f9;
 }
+.user {
+	color: #f00;
+	cursor: pointer;
+	-webkit-user-select: none;
+}
 #wrap,
 #viewport {
 	height: 100%;
@@ -184,7 +189,7 @@ h2 {
 	padding: 0 8px;
 }
 #chat .messages {
-	border-left: 8px solid #fafafa;
+	border-left: 8px solid #f7f7f9;
 	bottom: 30px;
 	left: 0;
 	overflow-y: auto;
@@ -205,9 +210,6 @@ h2 {
 #chat .message .time {
 	color: #bbb;
 }
-#chat .message .user {
-	color: #f00;
-}
 #chat .message .type,
 #chat .message .text {
 	color: inherit;

client/index.html

@@ -99,9 +99,9 @@
 	</script>
 	<script type="text/html" id="user">
 	{{#users}}
-	<a href="{{name}}" class="user">
+	<div class="user">
-		{{mode}}{{name}}
+		{{name}}
-	</a>
+	</div>
 	{{/users}}
 	</script>
 	<script type="text/html" id="message">

client/js/chat.js

@@ -215,8 +215,13 @@ $(function() {
 		});
 	});
 	
-	chat.on("click", ".user", function(e) {
+	chat.on("dblclick", ".user", function() {
-		e.preventDefault();
+		var link = $(this);
+		var id = parseInt(link.closest(".window").attr("id").replace("window-", ""));
+		socket.emit("input", {
+			id: id,
+			text: "/whois " + link.text(),
+		});
 	});
 
 	chat.on("focus", "input[type=text]", function() {