From 6d1e06cca3f0ea63b73815b4ddc74bb1cd9e6544 Mon Sep 17 00:00:00 2001
From: yflory <yann.flory@xwiki.com>
Date: Wed, 26 Oct 2016 15:02:30 +0200
Subject: [PATCH] Add notifications when a user joins or leaves the channel

---
 customize.dist/translations/messages.fr.js |  13 +-
 customize.dist/translations/messages.js    |  13 +-
 www/code/main.js                           |  39 ++---
 www/common/toolbar.js                      | 168 ++++++++++++++-------
 www/pad/main.js                            |  41 ++---
 www/slide/main.js                          |  37 ++---
 6 files changed, 191 insertions(+), 120 deletions(-)

diff --git a/customize.dist/translations/messages.fr.js b/customize.dist/translations/messages.fr.js
index 299bcd5b3..44a35ea05 100644
--- a/customize.dist/translations/messages.fr.js
+++ b/customize.dist/translations/messages.fr.js
@@ -28,8 +28,9 @@ define(function () {
     out.yourself = "Vous-même";
     out.anonymousUsers = "utilisateurs anonymes";
     out.anonymousUser = "utilisateur anonyme";
-    out.share = "Partage";
-    out.users = "Utilisateurs";
+    out.shareView = "URL de lecture seule";
+    out.shareEdit = "URL d'édition";
+    out.users = "Éditeurs";
 
     out.greenLight = "Tout fonctionne bien";
     out.orangeLight = "Votre connexion est lente, ce qui réduit la qualité de l'éditeur";
@@ -59,7 +60,7 @@ define(function () {
     out.forgetButtonTitle = 'Enlever ce document de la liste en page d\'accueil';
     out.forgetPrompt = 'Cliquer sur OK supprimera l\'URL de ce document de la mémoire de votre navigateur (localStorage), êtes-vous sûr ?';
 
-    out.shareButton = 'PARTAGER';
+    out.shareButton = 'Partager';
     out.shareButtonTitle = "Copier l'URL dans le presse-papiers";
     out.shareSuccess = 'URL copiée dans le presse-papiers';
     out.shareFailed = "Échec de la copie de l'URL dans le presse-papiers";
@@ -84,13 +85,17 @@ define(function () {
     out.openReadOnly = "Ouvrir dans un nouvel onglet";
     out.editing = "éditeur(s)";
     out.viewing = "lecteur(s)";
-    out.editShare = "Partager l'URL";
+    out.editShare = "Partager l'URL d'édition";
     out.editShareTitle = "Copier l'URL d'édition dans le presse-papiers";
     out.viewShare = "Partager l'URL de lecture";
     out.viewShareTitle = "Copier l'URL d'accès en lecture seule dans le presse-papiers";
     out.viewOpen = "Voir dans un nouvel onglet";
     out.viewOpenTitle = "Ouvrir le document en lecture seule dans un nouvel onglet";
 
+    out.notifyJoined = "{0} a rejoint la session collaborative";
+    out.notifyRenamed = "{0} a changé son nom en {1}";
+    out.notifyLeft = "{0} a quitté la session collaborative";
+
     out.disconnectAlert = 'Perte de la connexion au réseau !';
 
     out.tryIt = 'Essayez-le !';
diff --git a/customize.dist/translations/messages.js b/customize.dist/translations/messages.js
index 69cb4a4e7..89ec12f95 100644
--- a/customize.dist/translations/messages.js
+++ b/customize.dist/translations/messages.js
@@ -28,8 +28,9 @@ define(function () {
     out.yourself = "Yourself";
     out.anonymousUsers = "anonymous users";
     out.anonymousUser = "anonymous user";
-    out.share = "Share";
-    out.users = "Users";
+    out.shareView = "Read-only URL";
+    out.shareEdit = "Edit URL";
+    out.users = "Editing users";
 
     out.greenLight = "Everything is working fine";
     out.orangeLight = "Your slow connection may impact your experience";
@@ -59,7 +60,7 @@ define(function () {
     out.forgetButtonTitle = 'Remove this document from your home page listings';
     out.forgetPrompt = 'Clicking OK will remove the URL for this pad from localStorage, are you sure?';
 
-    out.shareButton = 'SHARE';
+    out.shareButton = 'Share';
     out.shareButtonTitle = "Copy URL to clipboard";
     out.shareSuccess = 'Copied URL to clipboard';
     out.shareFailed = "Failed to copy URL to clipboard";
@@ -84,13 +85,17 @@ define(function () {
     out.openReadOnly = "Open in a new tab";
     out.editing = "editor(s)";
     out.viewing = "viewer(s)";
-    out.editShare = "Share";
+    out.editShare = "Share edit URL";
     out.editShareTitle = "Copy the edit URL to clipboard";
     out.viewShare = "Share view URL";
     out.viewShareTitle = "Copy the read-only URL to clipboard";
     out.viewOpen = "View in new tab";
     out.viewOpenTitle = "Open the document in read-only mode in a new tab";
 
+    out.notifyJoined = "{0} has joined the collaborative session";
+    out.notifyRenamed = "{0} is now known as {1}";
+    out.notifyLeft = "{0} has left the collaborative session";
+
     out.disconnectAlert = 'Network connection lost!';
 
     out.tryIt = 'Try it out!';
diff --git a/www/code/main.js b/www/code/main.js
index 0483c1bf6..a5d7af164 100644
--- a/www/code/main.js
+++ b/www/code/main.js
@@ -115,21 +115,22 @@ define([
                 editor.setOption('readOnly', !bool);
             };
 
-            var userList = module.userList = {}; // List of pretty name of all users (mapped with their server ID)
-            var toolbarList; // List of users still connected to the channel (server IDs)
-            var addToUserList = function(data) {
+            var userData = module.userData = {}; // List of pretty name of all users (mapped with their server ID)
+            var userList; // List of users still connected to the channel (server IDs)
+            var addToUserData = function(data) {
                 var users = module.users;
+                for (var attrname in data) { userData[attrname] = data[attrname]; }
+
                 if (users && users.length) {
-                    for (var userKey in userList) {
+                    for (var userKey in userData) {
                         if (users.indexOf(userKey) === -1) {
-                            delete userList[userKey];
+                            delete userData[userKey];
                         }
                     }
                 }
 
-                for (var attrname in data) { userList[attrname] = data[attrname]; }
-                if(toolbarList && typeof toolbarList.onChange === "function") {
-                    toolbarList.onChange(userList);
+                if(userList && typeof userList.onChange === "function") {
+                    userList.onChange(userData);
                 }
             };
 
@@ -168,7 +169,7 @@ define([
                 var obj = {
                     content: textValue,
                     metadata: {
-                        users: userList,
+                        users: userData,
                         defaultTitle: defaultName
                     }
                 };
@@ -206,7 +207,7 @@ define([
                 myData[myID] = {
                    name: myUserName
                 };
-                addToUserList(myData);
+                addToUserData(myData);
                 Cryptpad.setAttribute('username', myUserName, function (err, data) {
                     if (err) {
                         console.log("Couldn't set username");
@@ -347,7 +348,7 @@ define([
                     if (json.metadata.users) {
                         var userData = json.metadata.users;
                         // Update the local user data
-                        addToUserList(userData);
+                        addToUserData(userData);
                     }
                     if (json.metadata.defaultTitle) {
                         updateDefaultTitle(json.metadata.defaultTitle);
@@ -359,9 +360,9 @@ define([
             };
 
              var onInit = config.onInit = function (info) {
-                toolbarList = info.userList;
+                userList = info.userList;
                 var config = {
-                    userData: userList,
+                    userData: userData,
                     readOnly: readOnly,
                     ifrw: ifrw,
                     title: {
@@ -372,7 +373,7 @@ define([
                     common: Cryptpad
                 };
                 if (readOnly) {delete config.changeNameID; }
-                toolbar = module.toolbar = Toolbar.create($bar, info.myID, info.realtime, info.getLag, info.userList, config);
+                toolbar = module.toolbar = Toolbar.create($bar, info.myID, info.realtime, info.getLag, userList, config);
 
                 var $rightside = $bar.find('.' + Toolbar.constants.rightside);
                 var $userBlock = $bar.find('.' + Toolbar.constants.username);
@@ -573,16 +574,16 @@ define([
                     // Update the toolbar list:
                     // Add the current user in the metadata if he has edit rights
                     if (readOnly) { return; }
-                    myData[myID] = {
-                        name: ""
-                    };
-                    addToUserList(myData);
                     if (typeof(lastName) === 'string' && lastName.length) {
                         setName(lastName);
                     } else {
+                        myData[myID] = {
+                            name: ""
+                        };
+                        addToUserData(myData);
+                        onLocal();
                         module.$userNameButton.click();
                     }
-                    onLocal();
                 });
             };
 
diff --git a/www/common/toolbar.js b/www/common/toolbar.js
index 26ade0842..1a5b9bde1 100644
--- a/www/common/toolbar.js
+++ b/www/common/toolbar.js
@@ -105,60 +105,61 @@ define([
             'class': USERBUTTONS_CONTAINER_CLS
         }).appendTo($userlistElement);
 
+        var createHandler = function ($elmt) {
+            return function () {
+                if ($elmt.is(':visible')) {
+                    $elmt.hide();
+                    return;
+                }
+                $userlistElement.find('.' + DROPDOWN_CLS).hide();
+                $elmt.show();
+            };
+        };
+
+        var fa_caretdown = '<span class="fa fa-caret-down" style="font-family:FontAwesome;"></span>';
+
+        // User list button
         var $editIcon = $('<button>', {
             'class': 'userlist dropbtn edit',
         });
         var $editIconSmall = $editIcon.clone().addClass('small');
-        var $shareIcon = $('<button>', {
-            'class': 'userlist dropbtn share',
-        });
-        var $shareIconSmall = $shareIcon.clone().addClass('small');
-
         var $dropdownEditUsers = $('<p>', {'class': USERLIST_CLS});
-/*        var $dropdownEditShare = $('<p>', {'class': EDITSHARE_CLS});
-        if (readOnly !== 1) {
-            $dropdownEditShare.append($shareTitle);
-        }
-*/        var $dropdownEditContainer = $('<div>', {'class': DROPDOWN_CONTAINER_CLS});
+        var $dropdownEditContainer = $('<div>', {'class': DROPDOWN_CONTAINER_CLS});
         var $dropdownEdit = $('<div>', {
             id: "cryptpad-dropdown-edit",
             'class': DROPDOWN_CLS
         }).append($dropdownEditUsers); //.append($dropdownEditShare);
+        $editIcon.click(createHandler($dropdownEdit));
+        $editIconSmall.click(createHandler($dropdownEdit));
+        $dropdownEditContainer.append($editIcon).append($editIconSmall).append($dropdownEdit);
+        $listElement.append($dropdownEditContainer);
 
-        var $shareTitle = $('<h2>').text(Messages.share);
-        var $shareTitle2 = $('<h2>').text(Messages.share + 'VIEW');
+        // Share button
+        var fa_share = '<span class="fa fa-share-alt" style="font-family:FontAwesome;"></span>';
+        var fa_editusers = '<span class="fa fa-users" style="font-family:FontAwesome;"></span>';
+        var fa_viewusers = '<span class="fa fa-eye" style="font-family:FontAwesome;"></span>';
+        var $shareIcon = $('<button>', {
+            'class': 'userlist dropbtn share',
+        }).html(fa_share + ' ' + Messages.shareButton + ' ' + fa_caretdown);
+        var $shareIconSmall = $shareIcon.clone().addClass('small').html(fa_share + ' ' + fa_caretdown);
+        var $shareTitle = $('<h2>').html(fa_editusers + ' ' + Messages.shareEdit);
+        var $shareTitleView = $('<h2>').html(fa_viewusers + ' ' + Messages.shareView);
         var $dropdownShareP = $('<p>', {'class': EDITSHARE_CLS}).append($shareTitle);
-        var $dropdownShareP2 = $('<p>', {'class': VIEWSHARE_CLS}).append($shareTitle2);
+        var $dropdownSharePView = $('<p>', {'class': VIEWSHARE_CLS}).append($shareTitleView);
         var $dropdownShareContainer = $('<div>', {'class': DROPDOWN_CONTAINER_CLS});
         var $dropdownShare = $('<div>', {
             id: "cryptpad-dropdown-share",
             'class': DROPDOWN_CLS
-        }).append($dropdownShareP).append($dropdownShareP2);
-
-        var createHandler = function ($elmt) {
-            return function () {
-                if ($elmt.is(':visible')) {
-                    $elmt.hide();
-                    return;
-                }
-                $userlistElement.find('.' + DROPDOWN_CLS).hide();
-                $elmt.show();
-            };
-        };
-        $editIcon.click(createHandler($dropdownEdit));
-        $editIconSmall.click(createHandler($dropdownEdit));
+        });
+        if (readOnly !== 1) {
+            // Hide the "Share edit URL" section when in read-only mode
+            $dropdownShare.append($dropdownShareP);
+        }
+        $dropdownShare.append($dropdownSharePView);
         $shareIcon.click(createHandler($dropdownShare));
         $shareIconSmall.click(createHandler($dropdownShare));
-
-        $dropdownEditContainer.append($editIcon).append($editIconSmall).append($dropdownEdit);
         $dropdownShareContainer.append($shareIcon).append($shareIconSmall).append($dropdownShare);
-
-        $listElement.append($dropdownEditContainer);
-/*        if (readOnly !== -1) {*/
-            $listElement.append($dropdownShareContainer);
-       /* }
-*/
-
+        $listElement.append($dropdownShareContainer);
     };
 
     var createUserList = function ($container, readOnly) {
@@ -206,27 +207,26 @@ define([
         }
         $stateElement.text('');
 
-        // Make sure the user block elements are displayed
+        // Make sure the elements are displayed
         var $userButtons = $(userlistElement).find("#userButtons");
         $userButtons.show();
-        var $userElement = $userAdminElement.find('.' + USERNAME_CLS);
-        $userElement.show();
 
         var numberOfUsers = userList.length;
 
         // If we are using old pads (readonly unavailable), only editing users are in userList.
         // With new pads, we also have readonly users in userList, so we have to intersect with
         // the userData to have only the editing users. We can't use userData directly since it
-        // contains data about users that have already left the channel.
+        // may contain data about users that have already left the channel.
         userList = readOnly === -1 ? userList : arrayIntersect(userList, Object.keys(userData));
 
-        var numberOfViewUsers = numberOfUsers - userList.length;
+        var numberOfEditUsers = userList.length;
+        var numberOfViewUsers = numberOfUsers - numberOfEditUsers;
 
         // Names of editing users
         var editUsersNames = getOtherUsers(myUserName, userList, userData);
 
         // Number of anonymous editing users
-        var anonymous = numberOfUsers - editUsersNames.length;
+        var anonymous = numberOfEditUsers - editUsersNames.length;
 
         // Update the userlist
         var editUsersList = '';
@@ -249,11 +249,12 @@ define([
         var fa_caretdown = '<span class="fa fa-caret-down" style="font-family:FontAwesome;"></span>';
         var fa_editusers = '<span class="fa fa-users" style="font-family:FontAwesome;"></span>';
         var fa_viewusers = '<span class="fa fa-eye" style="font-family:FontAwesome;"></span>';
-        $userButtons.find('.userlist.edit').html(fa_editusers + ' ' + userList.length + ' ' + Messages.editing + ', ' + fa_viewusers + ' ' + numberOfViewUsers + ' ' + Messages.viewing + ' ' + fa_caretdown);
-        $userButtons.find('.userlist.edit.small').html(fa_editusers + ' ' + userList.length + ', ' + fa_viewusers + ' ' + numberOfViewUsers + ' ' + fa_caretdown);
-        $userButtons.find('.userlist.share').html('SHARE ' + fa_caretdown);
-        $userButtons.find('.userlist.share.small').html('SHARE SMALL ' + fa_caretdown);
+        $userButtons.find('.userlist.edit').html(fa_editusers + ' ' + userList.length + ' ' + Messages.editing + '&nbsp;&nbsp; ' + fa_viewusers + ' ' + numberOfViewUsers + ' ' + Messages.viewing + ' ' + fa_caretdown);
+        $userButtons.find('.userlist.edit.small').html(fa_editusers + ' ' + userList.length + '&nbsp;&nbsp; ' + fa_viewusers + ' ' + numberOfViewUsers + ' ' + fa_caretdown);
 
+        // Change username button
+        var $userElement = $userAdminElement.find('.' + USERNAME_CLS);
+        $userElement.show();
         if (readOnly === 1) {
             $userElement.html('<span class="' + READONLY_CLS + '">' + Messages.readonly + '</span>');
         }
@@ -263,7 +264,6 @@ define([
             if (!name) {
                 name = Messages.anonymous;
             }
-            console.log($userElement);
             $userElement.find("button").show();
             $userElement.find("button").html(icon + ' ' + name);
         }
@@ -473,15 +473,71 @@ define([
             }
         }
 
-        userList.onChange = function(newUserData) {
-          var users = userList.users;
-          if (users.indexOf(myUserName) !== -1) { connected = true; }
-          if (!connected) { return; }
-          if(newUserData) { // Someone has changed his name/color
-            userData = newUserData;
-          }
-          updateUserList(myUserName, userListElement, users, userData, readOnly, $stateElement, $userAdminElement);
-        };
+        // Update user list
+        userList.change.push(function (newUserData) {
+            var users = userList.users;
+            if (users.indexOf(myUserName) !== -1) { connected = true; }
+            if (!connected) { return; }
+            /*if (newUserData) { // Someone has changed his name/color
+                userData = newUserData;
+            }*/
+            updateUserList(myUserName, userListElement, users, userData, readOnly, $stateElement, $userAdminElement);
+        });
+        // Display notifications when users are joining/leaving the session
+        var oldUserData;
+        if (typeof Cryptpad !== "undefined") {
+            var notify = function(type, name, oldname) {
+                // type : 1 (+1 user), 0 (rename existing user), -1 (-1 user)
+                if (typeof name === "undefined") { return; }
+                name = (name === "") ? Messages.anonymous : name;
+                switch(type) {
+                    case 1:
+                        Cryptpad.log(Messages._getKey("notifyJoined", [name]));
+                        break;
+                    case 0:
+                        oldname = (oldname === "") ? Messages.anonymous : oldname;
+                        Cryptpad.log(Messages._getKey("notifyRenamed", [oldname, name]));
+                        break;
+                    case -1:
+                        Cryptpad.log(Messages._getKey("notifyLeft", [name]));
+                        break;
+                    default:
+                        console.log("Invalid type of notification");
+                        break;
+                }
+            };
+            userList.change.push(function (newdata) {
+                // Notify for disconnected users
+                if (typeof oldUserData !== "undefined") {
+                    for (var u in oldUserData) {
+                        if (userList.users.indexOf(u) === -1) {
+                            notify(-1, oldUserData[u].name);
+                            delete oldUserData[u];
+                        }
+                    }
+                }
+                // Update the "oldUserData" object and notify for new users and names changed
+                if (typeof newdata === "undefined") { return; }
+                if (typeof oldUserData === "undefined") {
+                    oldUserData = JSON.parse(JSON.stringify(newdata));
+                    return;
+                }
+                if (readOnly === 0 && !oldUserData[myUserName]) {
+                    oldUserData = JSON.parse(JSON.stringify(newdata));
+                    return;
+                }
+                for (var k in newdata) {
+                    if (k !== myUserName && userList.users.indexOf(k) !== -1) {
+                        if (typeof oldUserData[k] === "undefined") {
+                            notify(1, newdata[k].name);
+                        } else if (oldUserData[k].name !== newdata[k].name) {
+                            notify(0, newdata[k].name, oldUserData[k].name);
+                        }
+                    }
+                }
+                oldUserData = JSON.parse(JSON.stringify(newdata));
+            });
+        }
 
         var ks = function () {
             if (connected) { kickSpinner(spinner, false); }
diff --git a/www/pad/main.js b/www/pad/main.js
index 6b3845ee6..96489bc7a 100644
--- a/www/pad/main.js
+++ b/www/pad/main.js
@@ -253,19 +253,22 @@ define([
             };
 
             var initializing = true;
-            var userList = module.userList = {}; // List of pretty names for all users (mapped with their ID)
-            var toolbarList; // List of users still connected to the channel (server IDs)
-            var addToUserList = function(data) {
+            var userData = module.userData = {}; // List of pretty names for all users (mapped with their ID)
+            var userList; // List of users still connected to the channel (server IDs)
+            var addToUserData = function(data) {
                 var users = module.users;
+                for (var attrname in data) { userData[attrname] = data[attrname]; }
+
                 if (users && users.length) {
-                    for (var userKey in userList) {
-                        if (users.indexOf(userKey) === -1) { delete userList[userKey]; }
+                    for (var userKey in userData) {
+                        console.log(userKey);
+                        if (users.indexOf(userKey) === -1) { console.log('delete'); delete userData[userKey]; }
                     }
                 }
 
-                for (var attrname in data) { userList[attrname] = data[attrname]; }
-                if(toolbarList && typeof toolbarList.onChange === "function") {
-                    toolbarList.onChange(userList);
+                if(userList && typeof userList.onChange === "function") {
+                    console.log(JSON.stringify(userData));
+                    userList.onChange(userData);
                 }
             };
 
@@ -293,7 +296,7 @@ define([
                 myData[myID] = {
                     name: myUserName
                 };
-                addToUserList(myData);
+                addToUserData(myData);
                 Cryptpad.setAttribute('username', newName, function (err, data) {
                     if (err) {
                         console.error("Couldn't set username");
@@ -345,7 +348,7 @@ define([
                 var hjson = Hyperjson.fromDOM(dom, isNotMagicLine, brFilter);
                 hjson[3] = {
                     metadata: {
-                        users: userList,
+                        users: userData,
                         defaultTitle: defaultName
                     }
                 };
@@ -421,7 +424,7 @@ define([
                     if (peerMetadata.metadata.users) {
                         var userData = peerMetadata.metadata.users;
                         // Update the local user data
-                        addToUserList(userData);
+                        addToUserData(userData);
                     }
                     if (peerMetadata.metadata.defaultTitle) {
                         updateDefaultTitle(peerMetadata.metadata.defaultTitle);
@@ -530,9 +533,9 @@ define([
             };
 
             var onInit = realtimeOptions.onInit = function (info) {
-                toolbarList = info.userList;
+                userList = info.userList;
                 var config = {
-                    userData: userList,
+                    userData: userData,
                     readOnly: readOnly,
                     ifrw: ifrw,
                     title: {
@@ -543,7 +546,7 @@ define([
                     common: Cryptpad
                 };
                 if (readOnly) {delete config.changeNameID; }
-                toolbar = info.realtime.toolbar = Toolbar.create($bar, info.myID, info.realtime, info.getLag, info.userList, config);
+                toolbar = info.realtime.toolbar = Toolbar.create($bar, info.myID, info.realtime, info.getLag, userList, config);
 
                 var $rightside = $bar.find('.' + Toolbar.constants.rightside);
                 var $userBlock = $bar.find('.' + Toolbar.constants.username);
@@ -643,16 +646,16 @@ define([
                     // Update the toolbar list:
                     // Add the current user in the metadata if he has edit rights
                     if (readOnly) { return; }
-                    myData[myID] = {
-                        name: ""
-                    };
-                    addToUserList(myData);
                     if (typeof(lastName) === 'string' && lastName.length) {
                         setName(lastName);
                     } else {
+                        myData[myID] = {
+                            name: ""
+                        };
+                        addToUserData(myData);
+                        realtimeOptions.onLocal();
                         module.$userNameButton.click();
                     }
-                    realtimeOptions.onLocal();
                 });
             };
 
diff --git a/www/slide/main.js b/www/slide/main.js
index de07c8ff9..711280624 100644
--- a/www/slide/main.js
+++ b/www/slide/main.js
@@ -152,21 +152,22 @@ define([
                 editor.setOption('readOnly', !bool);
             };
 
-            var userList = module.userList = {}; // List of pretty name of all users (mapped with their server ID)
-            var toolbarList; // List of users still connected to the channel (server IDs)
-            var addToUserList = function(data) {
+            var userData = module.userData = {}; // List of pretty name of all users (mapped with their server ID)
+            var userList; // List of users still connected to the channel (server IDs)
+            var addToUserData = function(data) {
                 var users = module.users;
+                for (var attrname in data) { userData[attrname] = data[attrname]; }
+
                 if (users && users.length) {
-                    for (var userKey in userList) {
+                    for (var userKey in userData) {
                         if (users.indexOf(userKey) === -1) {
-                            delete userList[userKey];
+                            delete userData[userKey];
                         }
                     }
                 }
 
-                for (var attrname in data) { userList[attrname] = data[attrname]; }
-                if(toolbarList && typeof toolbarList.onChange === "function") {
-                    toolbarList.onChange(userList);
+                if(userList && typeof userList.onChange === "function") {
+                    userList.onChange(userData);
                 }
             };
 
@@ -208,7 +209,7 @@ define([
                 var obj = {
                     content: textValue,
                     metadata: {
-                        users: userList,
+                        users: userData,
                         defaultTitle: defaultName
                     }
                 };
@@ -250,7 +251,7 @@ define([
                 myData[myID] = {
                    name: myUserName
                 };
-                addToUserList(myData);
+                addToUserData(myData);
                 Cryptpad.setAttribute('username', myUserName, function (err, data) {
                     if (err) {
                         console.log("Couldn't set username");
@@ -384,7 +385,7 @@ define([
                     if (json.metadata.users) {
                         var userData = json.metadata.users;
                         // Update the local user data
-                        addToUserList(userData);
+                        addToUserData(userData);
                     }
                     if (json.metadata.defaultTitle) {
                         updateDefaultTitle(json.metadata.defaultTitle);
@@ -404,9 +405,9 @@ define([
             };
 
             var onInit = config.onInit = function (info) {
-                toolbarList = info.userList;
+                userList = info.userList;
                 var config = {
-                    userData: userList,
+                    userData: userData,
                     readOnly: readOnly,
                     ifrw: ifrw,
                     title: {
@@ -672,16 +673,16 @@ define([
                     // Update the toolbar list:
                     // Add the current user in the metadata if he has edit rights
                     if (readOnly) { return; }
-                    myData[myID] = {
-                        name: ""
-                    };
-                    addToUserList(myData);
                     if (typeof(lastName) === 'string' && lastName.length) {
                         setName(lastName);
                     } else {
+                        myData[myID] = {
+                            name: ""
+                        };
+                        addToUserData(myData);
+                        onLocal();
                         module.$userNameButton.click();
                     }
-                    onLocal();
                 });
             };