From 8d579c037645ff3b33bdb4c059b8ba1a90f7ba66 Mon Sep 17 00:00:00 2001 From: ansuz Date: Wed, 25 Aug 2021 12:57:24 +0530 Subject: [PATCH] Add avatars to rich text comments and mentions --- www/common/common-ui-elements.js | 21 ++++++++++++-------- www/common/sframe-common.js | 13 ++++++++++--- www/pad/comments.js | 33 +++++++++++++++++++++----------- 3 files changed, 45 insertions(+), 22 deletions(-) diff --git a/www/common/common-ui-elements.js b/www/common/common-ui-elements.js index a4d84796d..943050e62 100644 --- a/www/common/common-ui-elements.js +++ b/www/common/common-ui-elements.js @@ -3456,7 +3456,8 @@ define([ name: f.displayName, curvePublic: f.curvePublic, profile: f.profile, - notifications: f.notifications + notifications: f.notifications, + uid: f.uid, }; }); }; @@ -3555,7 +3556,7 @@ define([ }; // Set the value to receive from the autocomplete var toInsert = function (data, key) { - var name = data.name.replace(/[^a-zA-Z0-9]+/g, "-"); + var name = (data.name.replace(/[^a-zA-Z0-9]+/g, "-") || "").trim() || Messages.anonymous; // XXX return "[@"+name+"|"+key+"]"; }; @@ -3608,18 +3609,20 @@ define([ var avatar = h('span.cp-avatar', { contenteditable: false }); - common.displayAvatar($(avatar), data.avatar, data.name); + + var displayName = (data.name || "").trim() || Messages.anonymous; + common.displayAvatar($(avatar), data.avatar, displayName); // XXX return h('span.cp-mentions', { 'data-curve': data.curvePublic, 'data-notifications': data.notifications, 'data-profile': data.profile, - 'data-name': Util.fixHTML(data.name), + 'data-name': Util.fixHTML(displayName), 'data-avatar': data.avatar || "", }, [ avatar, h('span.cp-mentions-name', { contenteditable: false - }, data.name) + }, displayName) ]); }; } @@ -3651,7 +3654,7 @@ define([ }).map(function (key) { var data = sources[key]; return { - label: data.name, + label: (data.name || "").trim() || Messages.anonymous, value: key }; }); @@ -3686,10 +3689,12 @@ define([ var obj = sources[key]; if (!obj) { return; } var avatar = h('span.cp-avatar'); - common.displayAvatar($(avatar), obj.avatar, obj.name); + var displayName = (obj.name || "").trim() || Messages.anonymous; + + common.displayAvatar($(avatar), obj.avatar, displayName, Util.noop, obj.uid); // XXX var li = h('li.cp-autocomplete-value', [ avatar, - h('span', obj.name) + h('span', displayName), ]); return $(li).appendTo(ul); }; diff --git a/www/common/sframe-common.js b/www/common/sframe-common.js index 206137c86..01c48b540 100644 --- a/www/common/sframe-common.js +++ b/www/common/sframe-common.js @@ -249,11 +249,18 @@ define([ if (existing.indexOf(n) !== -1) { n = 0; } return n; }; - funcs.getAuthorId = function(authors, curve) { + funcs.getAuthorId = function(authors, curve, tokenId) { var existing = Object.keys(authors || {}).map(Number); - if (!funcs.isLoggedIn()) { return authorUid(existing); } - var uid; + if (!funcs.isLoggedIn()) { + existing.some(function (id) { + var author = authors[id] || {}; + if (author.uid !== tokenId) { return; } + uid = Number(id); + return true; + }); + return uid || authorUid(existing); + } existing.some(function(id) { var author = authors[id] || {}; if (author.curvePublic !== curve) { return; } diff --git a/www/pad/comments.js b/www/pad/comments.js index 6069aa1d0..6280a72bf 100644 --- a/www/pad/comments.js +++ b/www/pad/comments.js @@ -43,18 +43,21 @@ define([ var canonicalize = function(t) { return t.replace(/\r\n/g, '\n'); }; - var getAuthorId = function(Env, curve) { - return Env.common.getAuthorId(Env.comments.authors, curve); + var getAuthorId = function(Env, curve, uid) { + return Env.common.getAuthorId(Env.comments.authors, curve, uid); }; - // Return the author ID and add/update the data for registered users - // Return the username for unregistered users + // Return the author ID and add/update user data + // associate data with a curvePublic for registered users and the uid otherwise var updateAuthorData = function(Env, onChange) { var userData = Env.metadataMgr.getUserData(); + var myAuthorId; if (!Env.common.isLoggedIn()) { - return userData.name; + myAuthorId = getAuthorId(Env, undefined, userData.uid); + } else { + myAuthorId = getAuthorId(Env, userData.curvePublic); } - var myAuthorId = getAuthorId(Env, userData.curvePublic); + var data = Env.comments.authors[myAuthorId] = Env.comments.authors[myAuthorId] || {}; var old = Sortify(data); data.name = userData.name; @@ -62,6 +65,8 @@ define([ data.profile = userData.profile; data.curvePublic = userData.curvePublic; data.notifications = userData.notifications; + data.uid = userData.uid; + if (typeof(onChange) === "function" && Sortify(data) !== old) { onChange(); } @@ -82,6 +87,9 @@ define([ var userData = Env.metadataMgr.getUserData(); var privateData = Env.metadataMgr.getPrivateData(); var others = {}; + + + // XXX mentioned users should be excluded from the list of notified recipients to avoid notifying them twice // Get all the other registered users with a mailbox thread.m.forEach(function(obj) { var u = obj.u; @@ -93,7 +101,8 @@ define([ curvePublic: author.curvePublic, comment: obj.m, content: obj.v, - notifications: author.notifications + notifications: author.notifications, + uid: author.uid, }; }); // Send the notification @@ -146,7 +155,7 @@ define([ 'aria-required': true, contenteditable: true, }); - Env.common.displayAvatar($(avatar), userData.avatar, name); + Env.common.displayAvatar($(avatar), userData.avatar, name, Util.noop, userData.uid); var cancel = h('button.btn.btn-cancel', { tabindex: 1 @@ -224,7 +233,9 @@ define([ if (Env.common.isLoggedIn()) { var authors = {}; - Object.keys((Env.comments && Env.comments.authors) ||  {}).forEach(function(id) { + Object.keys((Env.comments && Env.comments.authors) ||  {}) + .filter(function (id) { return Util.find(Env, ['commments', 'authors', id, 'curvePublic']); }) + .forEach(function(id) { var obj = Util.clone(Env.comments.authors[id]); authors[obj.curvePublic] = obj; }); @@ -369,7 +380,7 @@ define([ var name = Util.fixHTML(author.name || Messages.anonymous); var date = new Date(msg.t); var avatar = h('span.cp-avatar'); - Env.common.displayAvatar($(avatar), author.avatar, name); + Env.common.displayAvatar($(avatar), author.avatar, name, Util.noop, author.uid); if (author.profile) { $(avatar).click(function(e) { Env.common.openURL(Hash.hashToHref(author.profile, 'profile')); @@ -393,7 +404,7 @@ define([ } cleanMentions($el); var avatar = h('span.cp-avatar'); - Env.common.displayAvatar($(avatar), avatarUrl, name); + Env.common.displayAvatar($(avatar), avatarUrl, name, Util.noop, author.uid); $el.append([ avatar, h('span.cp-mentions-name', name)