hide chat if local display name is empty

conference.js

             APP.UI.setUserAvatar(data.attributes.id, data.value);
         });
 
-        APP.UI.addListener(UIEvents.NICKNAME_CHANGED, (nickname) => {
+        APP.UI.addListener(UIEvents.NICKNAME_CHANGED, (nickname = '') => {
+            nickname = nickname.trim();
+
+            if (nickname === APP.settings.getDisplayName()) {
+                return;
+            }
+
             APP.settings.setDisplayName(nickname);
             room.setDisplayName(nickname);
             APP.UI.changeDisplayName(APP.conference.localId, nickname);

css/chat.css

     overflow-x: hidden;
     word-wrap: break-word;
 }
+#chatspace.is-conversation-mode #chatconversation {
+    visibility: visible;
+}
 
 .localuser {
     color: #087dba;
     box-shadow: none;
 }
 
+#chatspace.is-conversation-mode #usermsg {
+    visibility: visible;
+}
+
 #nickname {
     position: absolute;
     text-align: center;
     width: 95%;
 }
 
+#chatspace.is-conversation-mode #nickname {
+    visibility: hidden;
+}
+
 #nickinput {
     margin-top: 20px;
     font-size: 14px;
     visibility: hidden;
 }
 
+#chatspace.is-conversation-mode #smileysarea {
+    visibility: visible;
+}
+
 #smileysContainer {
     display: none;
     position: absolute;

modules/UI/UI.js

         messageHandler.notify(
             displayName, 'notify.somebody',
             'connected', 'notify.grantedTo', {
-                to: displayName
+                to: UIUtil.escapeHtml(displayName)
             }
         );
     } else {

modules/UI/side_pannels/chat/Chat.js

 
     /**
      * Sets the chat conversation mode.
+     * @param {boolean} isConversationMode if chat should be in
+     * conversation mode or not.
      */
     setChatConversationMode (isConversationMode) {
+        $('#chatspace').toggleClass('is-conversation-mode', isConversationMode);
         if (isConversationMode) {
-            $('#nickname').css({visibility: 'hidden'});
-            $('#chatconversation').css({visibility: 'visible'});
-            $('#usermsg').css({visibility: 'visible'});
-            $('#smileysarea').css({visibility: 'visible'});
             $('#usermsg').focus();
         }
     },

modules/UI/side_pannels/settings/SettingsMenu.js

         function update() {
             let displayName = $('#setDisplayName').val();
 
-            if (displayName && Settings.getDisplayName() !== displayName) {
-                emitter.emit(UIEvents.NICKNAME_CHANGED, displayName);
-            }
+            emitter.emit(UIEvents.NICKNAME_CHANGED, displayName);
 
             let language = $("#languages_selectbox").val();
             if (language !== Settings.getLanguage()) {