Merge pull request #1158 from SaptakS/chat-user-check

Adds check whether username already exists

onionshare/web/chat_mode.py

@@ -63,7 +63,8 @@ class ChatModeWeb:
         def update_session_username():
             history_id = self.cur_history_id
             data = request.get_json()
-            session["name"] = data.get("username", session.get("name"))
+            if data.get("username", "") not in self.connected_users:
+                session["name"] = data.get("username", session.get("name"))
             self.web.add_request(
                 request.path, {"id": history_id, "status_code": 200},
             )
@@ -104,10 +105,11 @@ class ChatModeWeb:
             """Sent by a client when the user updates their username.
             The message is sent to all people in the room."""
             current_name = session.get("name")
-            session["name"] = message["username"]
-            self.connected_users[
-                self.connected_users.index(current_name)
-            ] = session.get("name")
+            if message["username"] not in self.connected_users:
+                session["name"] = message["username"]
+                self.connected_users[
+                    self.connected_users.index(current_name)
+                ] = session.get("name")
             emit(
                 "status",
                 {

share/static/css/style.css

@@ -192,6 +192,11 @@ ul.breadcrumbs li a:link, ul.breadcrumbs li a:visited {
   font-size: 1em;
 }
 
+.chat-users .editable-username #username-error {
+  color: #c90c0c;
+  margin: 0.5rem;
+}
+
 .chat-users #user-list li {
   margin-bottom: 1em;
 }

share/static/js/chat.js

@@ -46,7 +46,7 @@ $(function () {
     $('#username').on('keyup', function (event) {
       if ($('#username').val() !== '' && $('#username').val() !== current_username) {
         if (event.keyCode == 13) {
-          current_username = updateUsername(socket);
+          current_username = updateUsername(socket) || current_username;
         }
       }
     });
@@ -82,17 +82,20 @@ var emitMessage = function (socket) {
 
 var updateUsername = function (socket) {
   var username = $('#username').val();
-  socket.emit('update_username', { username: username });
-  $.ajax({
-    method: 'POST',
-    url: `http://${document.domain}:${location.port}/update-session-username`,
-    contentType: 'application/json',
-    dataType: 'json',
-    data: JSON.stringify({ 'username': username })
-  }).done(function (response) {
-    console.log(response);
-  });
-  return username;
+  if (!checkUsernameExists(username)) {
+    socket.emit('update_username', { username: username });
+    $.ajax({
+      method: 'POST',
+      url: `http://${document.domain}:${location.port}/update-session-username`,
+      contentType: 'application/json',
+      dataType: 'json',
+      data: JSON.stringify({ 'username': username })
+    }).done(function (response) {
+      console.log(response);
+    });
+    return username;
+  }
+  return false;
 }
 
 /************************************/
@@ -110,6 +113,18 @@ var createUserListHTML = function (connected_users, current_user) {
   return userListHTML;
 }
 
+var checkUsernameExists = function (username) {
+  $('#username-error').text('');
+  var userMatches = $('#user-list li').filter(function () {
+    return $(this).text() === username;
+  });
+  if (userMatches.length) {
+    $('#username-error').text('User with that username exists!');
+    return true;
+  }
+  return false;
+}
+
 var getScrollDiffBefore = function () {
   return $('#chat').scrollTop() - ($('#chat')[0].scrollHeight - $('#chat')[0].offsetHeight);
 }

share/templates/chat.html

@@ -24,6 +24,7 @@
     <div class="chat-users">
       <div class="editable-username">
         <input id="username" value="{{ username }}" />
+        <p id="username-error"></p>
       </div>
       <ul id="user-list">
       </ul>