Enhance typing feedback

index.js

@@ -30,4 +30,8 @@ io.on('connection', function(socket){
     socket.on('typing', function(data){
         socket.broadcast.emit('typing', data);
     });
+
+	socket.on('stop-typing', function(data) {
+		socket.broadcast.emit('stop-typing', data);
+	});
 });

public/chat.js

@@ -8,6 +8,8 @@ var message = document.getElementById('message'),
       output = document.getElementById('output'),
       feedback = document.getElementById('feedback');
 
+var currentTimer = undefined;
+
 // Emit events (upon click, emit to chat the message and handle)
 btn.addEventListener('click', function(){
     socket.emit('chat', {
@@ -18,9 +20,14 @@ btn.addEventListener('click', function(){
 });
 
 // Attach event listener to message input field
-message.addEventListener('keypress', function(){
+message.addEventListener('keypress', function() {
+	if(currentTimer) {
+		clearTimeout(currentTimer);
+	}
+
+	currentTimer = setTimeout(emitStopTyping, 1000);
     socket.emit('typing', handle.value);
-})
+});
 
 // get existing messages
 socket.on('initial-connection', function(messages) {
@@ -29,13 +36,26 @@ socket.on('initial-connection', function(messages) {
 	}
 });
 
+message.addEventListener('focusout', function(e) {
+	emitStopTyping();
+});
+
 // Listen for events
 socket.on('chat', appendMessage);
 
+
 socket.on('typing', function(data){
     feedback.innerHTML = '<p><em>' + data + ' is typing a message...</em></p>';
 });
 
+socket.on('stop-typing', function(data) {
+	feedback.innerHTML = '';
+});
+
+function emitStopTyping() {
+	socket.emit('stop-typing', null);
+}
+
 function appendMessage(data) {
 	feedback.innerHTML = '';
     output.innerHTML += '<p><strong>' + data.handle + ': </strong>' + data.message + '</p>';