From 32f1d1627fbdaa96122b7fd8b33903d5f12d3e43 Mon Sep 17 00:00:00 2001
From: yflory <yann.flory@xwiki.com>
Date: Tue, 3 Sep 2019 13:30:35 +0200
Subject: [PATCH] Refresh properties modal when receiving metadata updates

---
 www/common/common-ui-elements.js            | 274 +++++++++++---------
 www/common/cryptpad-common.js               |   2 +
 www/common/outer/async-store.js             |   5 +-
 www/common/proxy-manager.js                 |   2 +-
 www/common/sframe-chainpad-netflux-outer.js |   4 +
 www/common/sframe-common-outer.js           |   1 -
 6 files changed, 160 insertions(+), 128 deletions(-)

diff --git a/www/common/common-ui-elements.js b/www/common/common-ui-elements.js
index a02fb8851..f4f5108e6 100644
--- a/www/common/common-ui-elements.js
+++ b/www/common/common-ui-elements.js
@@ -271,14 +271,12 @@ define([
                         }
                     }));
                 }).nThen(function (waitFor) {
-                    console.log('koko');
                     // Send the command
                     sframeChan.query('Q_SET_PAD_METADATA', {
                         channel: channel,
                         command: 'ADD_PENDING_OWNERS',
                         value: toAdd
                     }, waitFor(function (err, res) {
-                        console.error(arguments);
                         err = err || (res && res.error);
                         if (err) {
                             waitFor.abort();
@@ -286,8 +284,6 @@ define([
                         } // XXX
                     }));
                 }).nThen(function (waitFor) {
-                    console.log('okok');
-                    // TODO send notifications
                     sel.forEach(function (el) {
                         var friend = friends[$(el).attr('data-curve')];
                         if (!friend) { return; }
@@ -318,13 +314,17 @@ define([
             return $div2;
         };
 
+        var pending = false;
         redrawAll = function () {
-            $div1.empty();
-            $div2.empty();
+            if (pending) { return; }
+            pending = true;
             common.getPadMetadata(null, function (obj) {
+                pending = false;
                 if (obj && obj.error) { return; }
                 owners = obj.owners;
                 pending_owners = obj.pending_owners;
+                $div1.empty();
+                $div2.empty();
                 $div1.append(drawRemove(false)).append(drawRemove(true));
                 $div2.append(drawAdd());
             });
@@ -333,6 +333,15 @@ define([
         $div1.append(drawRemove(false)).append(drawRemove(true));
         $div2.append(drawAdd());
 
+        var handler = sframeChan.on('EV_RT_METADATA', function (md) {
+            if (!$div1.length) {
+                return void handler.stop();
+            }
+            owners = md.owners;
+            pending_owners = md.pending_owners;
+            redrawAll();
+        });
+
         // Create modal
         var link = h('div.cp-share-columns', [
             div1,
@@ -349,139 +358,158 @@ define([
         return UI.dialog.customModal(link, {buttons: linkButtons});
     };
     var getRightsProperties = function (common, data, cb) {
-        var $d = $('<div>');
-        if (!data) { return void cb(void 0, $d); }
+        var $div = $('<div>');
+        if (!data) { return void cb(void 0, $div); }
 
-        $('<label>', {'for': 'cp-app-prop-owners'}).text(Messages.creation_owners)
-            .appendTo($d);
-        var owners = Messages.creation_noOwner;
-        var priv = common.getMetadataMgr().getPrivateData();
-        var edPublic = priv.edPublic;
-        var owned = false;
-        if (data.owners && data.owners.length) {
-            if (data.owners.indexOf(edPublic) !== -1) {
-                owned = true;
-            }
-            var names = [];
-            var strangers = 0;
-            data.owners.forEach(function (ed) {
-                // If a friend is an owner, add their name to the list
-                // otherwise, increment the list of strangers
-                if (ed === edPublic) {
-                    names.push(Messages.yourself);
-                    return;
+        var draw = function () {
+            var $d = $('<div>');
+            $('<label>', {'for': 'cp-app-prop-owners'}).text(Messages.creation_owners)
+                .appendTo($d);
+            var owners = Messages.creation_noOwner;
+            var priv = common.getMetadataMgr().getPrivateData();
+            var edPublic = priv.edPublic;
+            var owned = false;
+            if (data.owners && data.owners.length) {
+                if (data.owners.indexOf(edPublic) !== -1) {
+                    owned = true;
                 }
-                if (!Object.keys(priv.friends || {}).some(function (c) {
-                    var friend = priv.friends[c] || {};
-                    if (friend.edPublic !== ed || c === 'me') { return; }
-                    names.push(friend.displayName);
-                    return true;
-                })) {
-                    strangers++;
+                var names = [];
+                var strangers = 0;
+                data.owners.forEach(function (ed) {
+                    // If a friend is an owner, add their name to the list
+                    // otherwise, increment the list of strangers
+                    if (ed === edPublic) {
+                        names.push(Messages.yourself);
+                        return;
+                    }
+                    if (!Object.keys(priv.friends || {}).some(function (c) {
+                        var friend = priv.friends[c] || {};
+                        if (friend.edPublic !== ed || c === 'me') { return; }
+                        names.push(friend.displayName);
+                        return true;
+                    })) {
+                        strangers++;
+                    }
+                });
+                if (strangers) {
+                    names.push(Messages._getKey('properties_unknownUser', [strangers]));
                 }
-            });
-            if (strangers) {
-                names.push(Messages._getKey('properties_unknownUser', [strangers]));
+                owners = names.join(', ');
             }
-            owners = names.join(', ');
-        }
-        $d.append(UI.dialog.selectable(owners, {
-            id: 'cp-app-prop-owners',
-        }));
-        if (owned) {
-            var manageOwners = h('button.no-margin', 'Manage owners'); // XXX
-            $(manageOwners).click(function () {
-                var modal = createOwnerModal(common, data);
-                UI.openCustomModal(modal, {
-                    wide: true,
+            $d.append(UI.dialog.selectable(owners, {
+                id: 'cp-app-prop-owners',
+            }));
+            if (owned) {
+                var manageOwners = h('button.no-margin', 'Manage owners'); // XXX
+                $(manageOwners).click(function () {
+                    var modal = createOwnerModal(common, data);
+                    UI.openCustomModal(modal, {
+                        wide: true,
+                    });
                 });
-            });
-            $d.append(h('p', manageOwners));
-        }
-
-        if (!data.noExpiration) {
-            var expire = Messages.creation_expireFalse;
-            if (data.expire && typeof (data.expire) === "number") {
-                expire = new Date(data.expire).toLocaleString();
+                $d.append(h('p', manageOwners));
             }
-            $('<label>', {'for': 'cp-app-prop-expire'}).text(Messages.creation_expiration)
-                .appendTo($d);
-            $d.append(UI.dialog.selectable(expire, {
-                id: 'cp-app-prop-expire',
-            }));
-        }
 
-        if (!data.noPassword) {
-            var hasPassword = data.password;
-            if (hasPassword) {
-                $('<label>', {'for': 'cp-app-prop-password'}).text(Messages.creation_passwordValue)
+            if (!data.noExpiration) {
+                var expire = Messages.creation_expireFalse;
+                if (data.expire && typeof (data.expire) === "number") {
+                    expire = new Date(data.expire).toLocaleString();
+                }
+                $('<label>', {'for': 'cp-app-prop-expire'}).text(Messages.creation_expiration)
                     .appendTo($d);
-                var password = UI.passwordInput({
-                    id: 'cp-app-prop-password',
-                    readonly: 'readonly'
-                });
-                var $pwInput = $(password).find('.cp-password-input');
-                $pwInput.val(data.password).click(function () {
-                    $pwInput[0].select();
-                });
-                $d.append(password);
+                $d.append(UI.dialog.selectable(expire, {
+                    id: 'cp-app-prop-expire',
+                }));
             }
 
-            var parsed = Hash.parsePadUrl(data.href || data.roHref);
-            if (!data.noEditPassword && owned && parsed.hashData.type === 'pad' && parsed.type !== "sheet") { // FIXME SHEET fix password change for sheets
-                var sframeChan = common.getSframeChannel();
-                var changePwTitle = Messages.properties_changePassword;
-                var changePwConfirm = Messages.properties_confirmChange;
-                if (!hasPassword) {
-                    changePwTitle = Messages.properties_addPassword;
-                    changePwConfirm = Messages.properties_confirmNew;
+            if (!data.noPassword) {
+                var hasPassword = data.password;
+                if (hasPassword) {
+                    $('<label>', {'for': 'cp-app-prop-password'}).text(Messages.creation_passwordValue)
+                        .appendTo($d);
+                    var password = UI.passwordInput({
+                        id: 'cp-app-prop-password',
+                        readonly: 'readonly'
+                    });
+                    var $pwInput = $(password).find('.cp-password-input');
+                    $pwInput.val(data.password).click(function () {
+                        $pwInput[0].select();
+                    });
+                    $d.append(password);
                 }
-                $('<label>', {'for': 'cp-app-prop-change-password'})
-                    .text(changePwTitle).appendTo($d);
-                var newPassword = UI.passwordInput({
-                    id: 'cp-app-prop-change-password',
-                    style: 'flex: 1;'
-                });
-                var passwordOk = h('button', Messages.properties_changePasswordButton);
-                var changePass = h('span.cp-password-container', [
-                    newPassword,
-                    passwordOk
-                ]);
-                $(passwordOk).click(function () {
-                    var newPass = $(newPassword).find('input').val();
-                    if (data.password === newPass ||
-                        (!data.password && !newPass)) {
-                        return void UI.alert(Messages.properties_passwordSame);
+
+                var parsed = Hash.parsePadUrl(data.href || data.roHref);
+                if (!data.noEditPassword && owned && parsed.hashData.type === 'pad' && parsed.type !== "sheet") { // FIXME SHEET fix password change for sheets
+                    var sframeChan = common.getSframeChannel();
+                    var changePwTitle = Messages.properties_changePassword;
+                    var changePwConfirm = Messages.properties_confirmChange;
+                    if (!hasPassword) {
+                        changePwTitle = Messages.properties_addPassword;
+                        changePwConfirm = Messages.properties_confirmNew;
                     }
-                    UI.confirm(changePwConfirm, function (yes) {
-                        if (!yes) { return; }
-                        sframeChan.query("Q_PAD_PASSWORD_CHANGE", {
-                            href: data.href || data.roHref,
-                            password: newPass
-                        }, function (err, data) {
-                            if (err || data.error) {
-                                return void UI.alert(Messages.properties_passwordError);
-                            }
-                            UI.findOKButton().click();
-                            // If we didn't have a password, we have to add the /p/
-                            // If we had a password and we changed it to a new one, we just have to reload
-                            // If we had a password and we removed it, we have to remove the /p/
-                            if (data.warning) {
-                                return void UI.alert(Messages.properties_passwordWarning, function () {
+                    $('<label>', {'for': 'cp-app-prop-change-password'})
+                        .text(changePwTitle).appendTo($d);
+                    var newPassword = UI.passwordInput({
+                        id: 'cp-app-prop-change-password',
+                        style: 'flex: 1;'
+                    });
+                    var passwordOk = h('button', Messages.properties_changePasswordButton);
+                    var changePass = h('span.cp-password-container', [
+                        newPassword,
+                        passwordOk
+                    ]);
+                    $(passwordOk).click(function () {
+                        var newPass = $(newPassword).find('input').val();
+                        if (data.password === newPass ||
+                            (!data.password && !newPass)) {
+                            return void UI.alert(Messages.properties_passwordSame);
+                        }
+                        UI.confirm(changePwConfirm, function (yes) {
+                            if (!yes) { return; }
+                            sframeChan.query("Q_PAD_PASSWORD_CHANGE", {
+                                href: data.href || data.roHref,
+                                password: newPass
+                            }, function (err, data) {
+                                if (err || data.error) {
+                                    return void UI.alert(Messages.properties_passwordError);
+                                }
+                                UI.findOKButton().click();
+                                // If we didn't have a password, we have to add the /p/
+                                // If we had a password and we changed it to a new one, we just have to reload
+                                // If we had a password and we removed it, we have to remove the /p/
+                                if (data.warning) {
+                                    return void UI.alert(Messages.properties_passwordWarning, function () {
+                                        common.gotoURL(hasPassword && newPass ? undefined : (data.href || data.roHref));
+                                    }, {force: true});
+                                }
+                                return void UI.alert(Messages.properties_passwordSuccess, function () {
                                     common.gotoURL(hasPassword && newPass ? undefined : (data.href || data.roHref));
-                                }, {force: true});
-                            }
-                            return void UI.alert(Messages.properties_passwordSuccess, function () {
-                                common.gotoURL(hasPassword && newPass ? undefined : (data.href || data.roHref));
-                            }, {force: true});
+                                }, {force: true});
+                            });
                         });
                     });
-                });
-                $d.append(changePass);
+                    $d.append(changePass);
+                }
             }
-        }
+            return $d;
+        };
+
+        var sframeChan = common.getSframeChannel();
+        var handler = sframeChan.on('EV_RT_METADATA', function (md) {
+            if (!$div.length) {
+                handler.stop();
+                return;
+            }
+            md = JSON.parse(JSON.stringify(md));
+            data.owners = md.owners;
+            data.expire = md.expire;
+            data.pending_owners = md.pending_owners;
+            $div.empty();
+            $div.append(draw());
+        });
+        $div.append(draw());
 
-        cb(void 0, $d);
+        cb(void 0, $div);
     };
     var getPadProperties = function (common, data, cb) {
         var $d = $('<div>');
@@ -568,6 +596,8 @@ define([
         } else {
             cb(void 0, $d);
         }
+
+
     };
     UIElements.getProperties = function (common, data, cb) {
         var c1;
diff --git a/www/common/cryptpad-common.js b/www/common/cryptpad-common.js
index 56e5edcae..9d5a32e23 100644
--- a/www/common/cryptpad-common.js
+++ b/www/common/cryptpad-common.js
@@ -757,6 +757,7 @@ define([
     pad.onDisconnectEvent = Util.mkEvent();
     pad.onConnectEvent = Util.mkEvent();
     pad.onErrorEvent = Util.mkEvent();
+    pad.onMetadataEvent = Util.mkEvent();
 
     pad.getPadMetadata = function (data, cb) {
         postMessage('GET_PAD_METADATA', data, cb);
@@ -1208,6 +1209,7 @@ define([
         PAD_DISCONNECT: common.padRpc.onDisconnectEvent.fire,
         PAD_CONNECT: common.padRpc.onConnectEvent.fire,
         PAD_ERROR: common.padRpc.onErrorEvent.fire,
+        PAD_METADATA: common.padRpc.onMetadataEvent.fire,
         // Drive
         DRIVE_LOG: common.drive.onLog.fire,
         DRIVE_CHANGE: common.drive.onChange.fire,
diff --git a/www/common/outer/async-store.js b/www/common/outer/async-store.js
index a293de8e4..36954bcf5 100644
--- a/www/common/outer/async-store.js
+++ b/www/common/outer/async-store.js
@@ -1205,7 +1205,6 @@ define([
                     }
                 },
                 onMetadataUpdate: function (metadata) {
-                    console.log('onMetadataUpdate', metadata);
                     channel.data = metadata || {};
                     var allData = store.manager.findChannel(data.channel);
                     allData.forEach(function (obj) {
@@ -1214,7 +1213,7 @@ define([
                             obj.data.expire = +metadata.expire;
                         }
                     });
-                    //channel.bcast("PAD_METADATA", metadata);
+                    channel.bcast("PAD_METADATA", metadata);
                 },
                 crypto: {
                     // The encryption and decryption is done in the outer window.
@@ -1374,7 +1373,6 @@ define([
         };
 
         Store.getPadMetadata = function (clientId, data, cb) {
-            console.log(data);
             if (!data.channel) { return void cb({ error: 'ENOTFOUND'}); }
             var channel = channels[data.channel];
             if (!channel) { return void cb({ error: 'ENOTFOUND' }); }
@@ -1397,7 +1395,6 @@ define([
             cb(channel.data || {});
         };
         Store.setPadMetadata = function (clientId, data, cb) {
-            console.log(data);
             if (!data.channel) { return void cb({ error: 'ENOTFOUND'}); }
             if (!data.command) { return void cb({ error: 'EINVAL' }); }
             store.rpc.setMetadata(data, function (err, res) {
diff --git a/www/common/proxy-manager.js b/www/common/proxy-manager.js
index 5cfae1a38..9ef3a9563 100644
--- a/www/common/proxy-manager.js
+++ b/www/common/proxy-manager.js
@@ -742,7 +742,7 @@ define([
         datas.forEach(function (d) {
             var atime = d.data.atime;
 
-            var value = attr ? d.data[attr] : JSON.parse(JSON.stringify(d.data));
+            var value = data.attr ? d.data[data.attr] : JSON.parse(JSON.stringify(d.data));
             if (!res.value || res.atime < atime) {
                 res.atime = atime;
                 res.value = value;
diff --git a/www/common/sframe-chainpad-netflux-outer.js b/www/common/sframe-chainpad-netflux-outer.js
index 9dbfb1816..9e3b957fc 100644
--- a/www/common/sframe-chainpad-netflux-outer.js
+++ b/www/common/sframe-chainpad-netflux-outer.js
@@ -118,6 +118,10 @@ define([], function () {
             onOpen(data);
         });
 
+        padRpc.onMetadataEvent.reg(function (data) {
+            sframeChan.event('EV_RT_METADATA', data);
+        });
+
         padRpc.onErrorEvent.reg(function (err) {
             sframeChan.event('EV_RT_ERROR', err);
         });
diff --git a/www/common/sframe-common-outer.js b/www/common/sframe-common-outer.js
index 2a03392be..ba6a7d481 100644
--- a/www/common/sframe-common-outer.js
+++ b/www/common/sframe-common-outer.js
@@ -1025,7 +1025,6 @@ define([
                         channel: secret.channel
                     };
                 }
-                console.log(data);
                 Cryptpad.getPadMetadata(data, cb);
             });
             sframeChan.on('Q_SET_PAD_METADATA', function (data, cb) {