Merge branch 'staging' into staging-soon

customize.dist/src/toolbar.less

@@ -105,6 +105,34 @@
     }
 }
 
+.cryptpad-toolbar-top {
+    display: block;
+    text-align: center;
+    .cryptpad-title {
+        text-align: center;
+        input {
+            border: 1px solid black;
+            background: #fff;
+            cursor: auto;
+            width: 300px;
+            padding: 5px;
+            -webkit-touch-callout: text;
+            -webkit-user-select: text;
+            -khtml-user-select: text;
+            -moz-user-select: text;
+            -ms-user-select: text;
+            user-select: text;
+            &:focus {
+                -webkit-touch-callout: text;
+                -webkit-user-select: text;
+                -khtml-user-select: text;
+                -moz-user-select: text;
+                -ms-user-select: text;
+                user-select: text;
+            }
+        }
+    }
+}
 .cryptpad-toolbar-leftside {
     float: left;
     margin-bottom: -1px;

customize.dist/toolbar.css

@@ -101,6 +101,34 @@
   border: 1px solid #A6A6A6;
   border-bottom-color: #979797;
 }
+.cryptpad-toolbar-top {
+  display: block;
+  text-align: center;
+}
+.cryptpad-toolbar-top .cryptpad-title {
+  text-align: center;
+}
+.cryptpad-toolbar-top .cryptpad-title input {
+  border: 1px solid black;
+  background: #fff;
+  cursor: auto;
+  width: 300px;
+  padding: 5px;
+  -webkit-touch-callout: text;
+  -webkit-user-select: text;
+  -khtml-user-select: text;
+  -moz-user-select: text;
+  -ms-user-select: text;
+  user-select: text;
+}
+.cryptpad-toolbar-top .cryptpad-title input:focus {
+  -webkit-touch-callout: text;
+  -webkit-user-select: text;
+  -khtml-user-select: text;
+  -moz-user-select: text;
+  -ms-user-select: text;
+  user-select: text;
+}
 .cryptpad-toolbar-leftside {
   float: left;
   margin-bottom: -1px;

customize.dist/translations/messages.fr.js

@@ -45,6 +45,7 @@ define(function () {
 
     out.userButton = 'UTILISATEUR';
     out.userButtonTitle = "Changer votre nom d'utilisateur";
+    out.changeNamePrompt = 'Changer votre nom (laisser vide pour rester anonyme) : ';
 
     out.renameButton = 'RENOMMER';
     out.renameButtonTitle = 'Changer le titre utilisé par ce document dans la page d\'accueil de Cryptpad';

customize.dist/translations/messages.js

@@ -45,7 +45,7 @@ define(function () {
 
     out.userButton = 'USER';
     out.userButtonTitle = 'Change your username';
-    out.changeNamePrompt = 'Change your name: ';
+    out.changeNamePrompt = 'Change your name (leave empty to be anonymous): ';
 
     out.renameButton = 'RENAME';
     out.renameButtonTitle = 'Change the title under which this document is listed on your home page';

www/code/main.js

@@ -112,9 +112,18 @@ define([
                 editor.setOption('readOnly', !bool);
             };
 
-            var userList = {}; // List of pretty name of all users (mapped with their server ID)
+            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 users = module.users;
+                if (users && users.length) {
+                    for (var userKey in userList) {
+                        if (users.indexOf(userKey) === -1) {
+                            delete userList[userKey];
+                        }
+                    }
+                }
+
                 for (var attrname in data) { userList[attrname] = data[attrname]; }
                 if(toolbarList && typeof toolbarList.onChange === "function") {
                     toolbarList.onChange(userList);
@@ -198,6 +207,7 @@ define([
                         console.error(err);
                         return;
                     }
+                    module.userName.lastName = myUserName;
                     onLocal();
                 });
             };
@@ -321,12 +331,12 @@ define([
                     editHash = Cryptpad.getEditHashFromKeys(info.channel, secret.keys);
                 }
 
+                // Store the object sent for the "change username" button so that we can update the field value correctly
+                var userNameButtonObject = module.userName = {};
                 /* add a "change username" button */
                 getLastName(function (err, lastName) {
-                    var usernameCb = function (newName) {
+                    userNameButtonObject.lastName = lastName;
-                        setName (newName);
+                    var $username = module.$userNameButton = Cryptpad.createButton('username', false, userNameButtonObject, setName);
-                    };
-                    var $username = Cryptpad.createButton('username', false, {lastName: lastName}, usernameCb);
                     $userBlock.append($username).hide();
                 });
 
@@ -501,6 +511,7 @@ define([
 
             var onReady = config.onReady = function (info) {
                 var realtime = module.realtime = info.realtime;
+                module.users = info.userList.users;
                 module.patchText = TextPatcher.create({
                     realtime: realtime,
                     //logging: true
@@ -555,6 +566,8 @@ define([
                     addToUserList(myData);
                     if (typeof(lastName) === 'string' && lastName.length) {
                         setName(lastName);
+                    } else {
+                        module.$userNameButton.click();
                     }
                     onLocal();
                 });

www/common/cryptpad-common.js

@@ -619,6 +619,32 @@ define([
     /*
      * Buttons
      */
+    var renamePad = common.renamePad = function (title, callback) {
+        if (title === null) { return; }
+
+        common.causesNamingConflict(title, function (err, conflicts) {
+            if (err) {
+                console.log("Unable to determine if name caused a conflict");
+                console.error(err);
+                callback(err, title);
+                return;
+            }
+
+            if (conflicts) {
+                common.alert(Messages.renameConflict);
+                return;
+            }
+
+            common.setPadTitle(title, function (err, data) {
+                if (err) {
+                    console.log("unable to set pad title");
+                    console.log(err);
+                    return;
+                }
+                callback(null, title);
+            });
+        });
+    };
     var createButton = common.createButton = function (type, rightside, data, callback) {
         var button;
         var size = "17px";
@@ -657,33 +683,9 @@ define([
                     button.click(function() {
                         var suggestion = suggestName();
 
-                        common.prompt(Messages.renamePrompt,
+                        common.prompt(Messages.renamePrompt, suggestion, function (title, ev) {
-                            suggestion, function (title, ev) {
+                            renamePad(title, callback);
-                                if (title === null) { return; }
+                        });
-
-                                common.causesNamingConflict(title, function (err, conflicts) {
-                                    if (err) {
-                                        console.log("Unable to determine if name caused a conflict");
-                                        console.error(err);
-                                        callback(err, title);
-                                        return;
-                                    }
-
-                                    if (conflicts) {
-                                        common.alert(Messages.renameConflict);
-                                        return;
-                                    }
-
-                                    common.setPadTitle(title, function (err, data) {
-                                        if (err) {
-                                            console.log("unable to set pad title");
-                                            console.log(err);
-                                            return;
-                                        }
-                                        callback(null, title);
-                                    });
-                                });
-                            });
                     });
                 }
                 break;
@@ -719,9 +721,8 @@ define([
                     title: Messages.userButton + '\n' + Messages.userButtonTitle
                 }).html('<span class="fa fa-user" style="font-family:FontAwesome;"></span>');
                 if (data && typeof data.lastName !== "undefined" && callback) {
-                    var lastName = data.lastName;
                     button.click(function() {
-                        common.prompt(Messages.changeNamePrompt, lastName, function (newName) {
+                        common.prompt(Messages.changeNamePrompt, data.lastName, function (newName) {
                             callback(newName);
                         });
                     });

www/common/toolbar.js

@@ -17,6 +17,7 @@ define([
     /** The toolbar class which contains the user list, debug link and lag. */
     var TOOLBAR_CLS = Bar.constants.toolbar = 'cryptpad-toolbar';
 
+    var TOP_CLS = Bar.constants.top = 'cryptpad-toolbar-top';
     var LEFTSIDE_CLS = Bar.constants.leftside = 'cryptpad-toolbar-leftside';
     var RIGHTSIDE_CLS = Bar.constants.rightside = 'cryptpad-toolbar-rightside';
 
@@ -34,6 +35,7 @@ define([
     var VIEWSHARE_CLS = Bar.constants.viewShare = "cryptpad-dropdown-viewShare";
     var DROPDOWN_CONTAINER_CLS = Bar.constants.dropdownContainer = "cryptpad-dropdown-container";
     var DROPDOWN_CLS = Bar.constants.dropdown = "cryptpad-dropdown";
+    var TITLE_CLS = Bar.constants.title = "cryptpad-title";
 
     /** Key in the localStore which indicates realtime activity should be disallowed. */
     // TODO remove? will never be used in cryptpad
@@ -67,6 +69,7 @@ define([
             'class': TOOLBAR_CLS,
             id: uid(),
         })
+        .append($('<div>', {'class': TOP_CLS}))
         .append($('<div>', {'class': LEFTSIDE_CLS}))
         .append($('<div>', {'class': RIGHTSIDE_CLS}));
 
@@ -300,6 +303,36 @@ define([
         $(lagElement).append(lagLight);
     };
 
+    var createTitle = function ($container, readOnly, cb) {
+        var $titleContainer = $('<span>', {
+            id: 'toolbarTitle',
+            'class': TITLE_CLS
+        }).appendTo($container);
+        var $text = $('<span>').appendTo($titleContainer);
+        if (readOnly === 1) { return; }
+        var $input = $('<input>', {
+            type: 'text'
+        }).appendTo($titleContainer).hide();
+        $input.on('keyup', function (e) {
+            if (e.which === 13) {
+                Cryptpad.renamePad(title, function (err, newtitle) {
+                    if (err) { return; }
+                    $text.text(newtitle);
+                    cb(null, newtitle);
+                    $input.hide();
+                    $text.show();
+                });
+            }
+        });
+        $text.on('click', function () {
+            console.log('click');
+            $text.hide();
+            $input.val($text.text());
+            $input.show();
+            $input.focus();
+        });
+    };
+
     var create = Bar.create = function ($container, myUserName, realtime, getLag, userList, config) {
         var readOnly = (typeof config.readOnly !== "undefined") ? (config.readOnly ? 1 : 0) : -1;
 
@@ -307,6 +340,7 @@ define([
         var userListElement = createUserList(toolbar.find('.' + LEFTSIDE_CLS), readOnly);
         var spinner = createSpinner(toolbar.find('.' + RIGHTSIDE_CLS));
         var lagElement = createLagElement(toolbar.find('.' + RIGHTSIDE_CLS));
+        var $titleElement = createTitle(toolbar.find('.' + TOP_CLS), readOnly, config.onRename);
         var userData = config.userData;
         // readOnly = 1 (readOnly enabled), 0 (disabled), -1 (old pad without readOnly mode)
         var saveElement;

www/pad/main.js

@@ -85,11 +85,12 @@ define([
         });
 
         editor.on('instanceReady', function (Ckeditor) {
+            var $bar = $('#pad-iframe')[0].contentWindow.$('#cke_1_toolbox');
+
             if (readOnly) {
                 $('#pad-iframe')[0].contentWindow.$('#cke_1_toolbox > .cke_toolbar').hide();
             }
 
-
             /* add a class to the magicline plugin so we can pick it out more easily */
 
             var ml = $('iframe')[0].contentWindow.CKEDITOR.instances.editor1.plugins.magicline
@@ -291,12 +292,13 @@ define([
                     name: myUserName
                 };
                 addToUserList(myData);
-                editor.fire('change');
-
                 Cryptpad.setAttribute('username', newName, function (err, data) {
                     if (err) {
                         console.error("Couldn't set username");
+                        return;
                     }
+                    module.userName.lastName = myUserName;
+                    editor.fire('change');
                 });
             };
 
@@ -402,6 +404,7 @@ define([
                         document.title = oldTitle;
                         return;
                     }
+                    $bar.find('.' + Toolbar.constants.title).find('span').text(newTitle);
                 });
             };
 
@@ -512,13 +515,19 @@ define([
                 realtimeOptions.onLocal();
             };
 
+            var renameCb = function (err, title) {
+                if (err) { return; }
+                document.title = title;
+                editor.fire('change');
+            };
+
             var onInit = realtimeOptions.onInit = function (info) {
-                var $bar = $('#pad-iframe')[0].contentWindow.$('#cke_1_toolbox');
                 toolbarList = info.userList;
                 var config = {
                     userData: userList,
                     readOnly: readOnly,
-                    ifrw: ifrw
+                    ifrw: ifrw,
+                    onRename: renameCb
                 };
                 if (readOnly) {delete config.changeNameID; }
                 toolbar = info.realtime.toolbar = Toolbar.create($bar, info.myID, info.realtime, info.getLag, info.userList, config);
@@ -535,12 +544,12 @@ define([
                     editHash = Cryptpad.getEditHashFromKeys(info.channel, secret.keys);
                 }
 
+                // Store the object sent for the "change username" button so that we can update the field value correctly
+                var userNameButtonObject = module.userName = {};
                 /* add a "change username" button */
                 getLastName(function (err, lastName) {
-                    var usernameCb = function (newName) {
+                    userNameButtonObject.lastName = lastName;
-                        setName (newName);
+                    var $username = module.$userNameButton = Cryptpad.createButton('username', false, userNameButtonObject, setName);
-                    };
-                    var $username = Cryptpad.createButton('username', false, {lastName: lastName}, usernameCb);
                     $userBlock.append($username).hide();
                 });
 
@@ -554,11 +563,6 @@ define([
                     $rightside.append($import);
 
                     /* add a rename button */
-                    var renameCb = function (err, title) {
-                        if (err) { return; }
-                        document.title = title;
-                        editor.fire('change');
-                    };
                     var $setTitle = Cryptpad.createButton('rename', true, {suggestName: suggestName}, renameCb);
                     $rightside.append($setTitle);
                 }
@@ -593,13 +597,8 @@ define([
                         console.log("Couldn't get pad title");
                         return;
                     }
+                    updateTitle(title || info.channel.slice(0, 8));
                     document.title = title || info.channel.slice(0, 8);
-                    Cryptpad.setPadTitle(title, function (err, data) {
-                        if (err) {
-                            console.log("Couldn't remember pad");
-                            console.error(err);
-                        }
-                    });
                 });
             };
 
@@ -638,6 +637,8 @@ define([
                     addToUserList(myData);
                     if (typeof(lastName) === 'string' && lastName.length) {
                         setName(lastName);
+                    } else {
+                        module.$userNameButton.click();
                     }
                     realtimeOptions.onLocal();
                 });

www/poll/main.js

@@ -475,6 +475,8 @@ define([
     setEditable(false);
 
     var ready = function (info) {
+        module.users = info.userList.users;
+
         console.log("Your realtime object is ready");
         module.ready = true;
 

www/slide/main.js

@@ -149,9 +149,18 @@ define([
                 editor.setOption('readOnly', !bool);
             };
 
-            var userList = {}; // List of pretty name of all users (mapped with their server ID)
+            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 users = module.users;
+                if (users && users.length) {
+                    for (var userKey in userList) {
+                        if (users.indexOf(userKey) === -1) {
+                            delete userList[userKey];
+                        }
+                    }
+                }
+
                 for (var attrname in data) { userList[attrname] = data[attrname]; }
                 if(toolbarList && typeof toolbarList.onChange === "function") {
                     toolbarList.onChange(userList);
@@ -246,6 +255,7 @@ define([
                         console.error(err);
                         return;
                     }
+                    module.userName.lastName = myUserName;
                     onLocal();
                 });
             };
@@ -398,12 +408,12 @@ define([
                     editHash = Cryptpad.getEditHashFromKeys(info.channel, secret.keys);
                 }
 
+                // Store the object sent for the "change username" button so that we can update the field value correctly
+                var userNameButtonObject = module.userName = {};
                 /* add a "change username" button */
                 getLastName(function (err, lastName) {
-                    var usernameCb = function (newName) {
+                    userNameButtonObject.lastName = lastName;
-                        setName (newName);
+                    var $username = module.$userNameButton = Cryptpad.createButton('username', false, userNameButtonObject, setName);
-                    };
-                    var $username = Cryptpad.createButton('username', false, {lastName: lastName}, usernameCb);
                     $userBlock.append($username).hide();
                 });
 
@@ -593,6 +603,7 @@ define([
 
             var onReady = config.onReady = function (info) {
                 var realtime = module.realtime = info.realtime;
+                module.users = info.userList.users;
                 module.patchText = TextPatcher.create({
                     realtime: realtime,
                     //logging: true
@@ -657,6 +668,8 @@ define([
                     addToUserList(myData);
                     if (typeof(lastName) === 'string' && lastName.length) {
                         setName(lastName);
+                    } else {
+                        module.$userNameButton.click();
                     }
                     onLocal();
                 });