diff --git a/chat.css b/chat.css
index 6ae9fb1..ab7155f 100644
--- a/chat.css
+++ b/chat.css
@@ -1,5 +1,5 @@
 #messages {
  background-color: #FFFF66;
  width: 90%;
- border-radius: 7px;
+ border-radius: 10px;
 }
diff --git a/chat.html b/chat.html
index fb0e6c4..80b8b4c 100644
--- a/chat.html
+++ b/chat.html
@@ -9,8 +9,10 @@
   </head>
   <body>
     <div id='messages'></div>
+    <div id='presenceDiv'
     <input type='text' id='name' placeholder='Your Name'>
     <input type='text' id='messageInput' placeholder='Message'>
+    <!--<div id="online"></div>-->
     <script>
       var dataRef = new Firebase('https://webwonders-chat.firebaseio.com');
       $('#messageInput').keypress(function (e) {
@@ -33,10 +35,69 @@
     <script>
       var nameBox = document.getElementById('#name')
       localStorage.setItem("user_name", JSON.stringify(message.name));
-      var nameStored = localStorage.getItem("user_name")
-      if (nameBox.val() === "before") {
+      var nameStored = localStorage.getItem("user_name");
+      if (nameBox.val() === "") {
         message.name = nameStored;
       }
+      
+    </script>
+    <script>
+      //online user code
+      
+  var userListRef = new Firebase("https://webwonders-chat.firebaseio.com");
+  var myUserRef = userListRef.push();
+
+  var connectedRef = new Firebase("https://webwonders-chat.firebaseio.com");
+  connectedRef.on("value", function(isOnline) {
+    if (isOnline.val()) {
+      myUserRef.onDisconnect().remove();
+      setUserStatus("★ online");
+    } else {
+      setUserStatus(currentStatus);
+    }
+  });
+
+  function setUserStatus(status) {
+    currentStatus = status;
+    myUserRef.set({ name: name, status: status });
+  }
+
+  function getMessageId(snapshot) {
+    return snapshot.name().replace(/[^a-z0-9\-\_]/gi,'');
+  }
+
+  userListRef.on("child_added", function(snapshot) {
+    var user = snapshot.val();
+    
+    $("<div/>")
+      .attr("id", getMessageId(snapshot))
+      .text(user.name + " is currently " + user.status)
+      .appendTo("#presenceDiv");
+  });
+
+  userListRef.on("child_removed", function(snapshot) {
+    $("#presenceDiv").children("#" + getMessageId(snapshot))
+      .remove();
+  });
+
+  userListRef.on("child_changed", function(snapshot) {
+    var user = snapshot.val();
+    $("#presenceDiv").children("#" + getMessageId(snapshot))
+      .text(user.name + " is currently " + user.status);
+  });
+
+  document.onIdle = function () {
+    setUserStatus("☆ idle");
+  }
+  document.onAway = function () {
+    setUserStatus("☄ away");
+  }
+  document.onBack = function (isIdle, isAway) {
+    setUserStatus("★ online");
+  }
+
+  setIdleTimeout(5000);
+  setAwayTimeout(10000);
     </script>
   </body>
 </html>
