From 165ffa812d820d6836b6092aa860b06792e67849 Mon Sep 17 00:00:00 2001 From: Alexei Koshelev Date: Wed, 14 Jun 2023 00:20:54 +0300 Subject: [PATCH 01/22] Added getUserInitials utils --- apps/common/main/lib/util/utils.js | 12 ++++++++++++ 1 file changed, 12 insertions(+) diff --git a/apps/common/main/lib/util/utils.js b/apps/common/main/lib/util/utils.js index 18b6c3b2ea..285041b45e 100644 --- a/apps/common/main/lib/util/utils.js +++ b/apps/common/main/lib/util/utils.js @@ -1176,6 +1176,18 @@ Common.Utils.UserInfoParser = new(function() { } })(); +Common.Utils.getUserInitials = function(username) { + var fio = username.split(' '); + var initials = fio[0].substring(0, 1).toUpperCase(); + for (var i = fio.length-1; i>0; i--) { + if (fio[i][0]!=='(' && fio[i][0]!==')') { + initials += fio[i].substring(0, 1).toUpperCase(); + break; + } + } + return initials; +}; + Common.Utils.getKeyByValue = function(obj, value) { for(var prop in obj) { if(obj.hasOwnProperty(prop)) { From d6491613a328309809f718e1f06d1e74056cc219 Mon Sep 17 00:00:00 2001 From: Alexei Koshelev Date: Wed, 14 Jun 2023 00:26:06 +0300 Subject: [PATCH 02/22] Added user avatar for comments --- apps/common/main/lib/controller/Comments.js | 10 +++++ .../main/lib/template/Comments.template | 30 ++++++++++++--- .../lib/template/CommentsPopover.template | 30 ++++++++++++--- apps/common/main/resources/less/comments.less | 37 ++++++++++++++----- 4 files changed, 86 insertions(+), 21 deletions(-) diff --git a/apps/common/main/lib/controller/Comments.js b/apps/common/main/lib/controller/Comments.js index d5b1b5c1f8..020303606f 100644 --- a/apps/common/main/lib/controller/Comments.js +++ b/apps/common/main/lib/controller/Comments.js @@ -838,9 +838,11 @@ define([ comment.set('comment', data.asc_getText()); comment.set('userid', data.asc_getUserId()); comment.set('username', data.asc_getUserName()); + comment.set('initials', Common.Utils.getUserInitials(AscCommon.UserInfoParser.getParsedName(data.asc_getUserName()))); comment.set('parsedName', AscCommon.UserInfoParser.getParsedName(data.asc_getUserName())); comment.set('parsedGroups', AscCommon.UserInfoParser.getParsedGroups(data.asc_getUserName())); comment.set('usercolor', (user) ? user.get('color') : null); + comment.set('avatar', data.asc_getUserAvatar ? data.asc_getUserAvatar() : null); comment.set('resolved', data.asc_getSolved()); comment.set('quote', data.asc_getQuoteText()); comment.set('userdata', data.asc_getUserData()); @@ -873,8 +875,10 @@ define([ id : Common.UI.getId(), userid : data.asc_getReply(i).asc_getUserId(), username : data.asc_getReply(i).asc_getUserName(), + initials : Common.Utils.getUserInitials(AscCommon.UserInfoParser.getParsedName(data.asc_getReply(i).asc_getUserName())), parsedName : AscCommon.UserInfoParser.getParsedName(data.asc_getReply(i).asc_getUserName()), usercolor : (user) ? user.get('color') : null, + avatar : data.asc_getReply(i).asc_getUserAvatar ? data.asc_getReply(i).asc_getUserAvatar() : null, date : t.dateToLocaleTimeString(dateReply), reply : data.asc_getReply(i).asc_getText(), userdata : data.asc_getReply(i).asc_getUserData(), @@ -1337,9 +1341,11 @@ define([ guid : data.asc_getGuid(), userid : data.asc_getUserId(), username : data.asc_getUserName(), + initials : Common.Utils.getUserInitials(AscCommon.UserInfoParser.getParsedName(data.asc_getUserName())), parsedName : AscCommon.UserInfoParser.getParsedName(data.asc_getUserName()), parsedGroups : AscCommon.UserInfoParser.getParsedGroups(data.asc_getUserName()), usercolor : (user) ? user.get('color') : null, + avatar : data.asc_getUserAvatar ? data.asc_getUserAvatar() : null, date : this.dateToLocaleTimeString(date), quote : data.asc_getQuoteText(), comment : data.asc_getText(), @@ -1393,8 +1399,10 @@ define([ id : Common.UI.getId(), userid : data.asc_getReply(i).asc_getUserId(), username : data.asc_getReply(i).asc_getUserName(), + initials : Common.Utils.getUserInitials(AscCommon.UserInfoParser.getParsedName(data.asc_getReply(i).asc_getUserName())), parsedName : AscCommon.UserInfoParser.getParsedName(data.asc_getReply(i).asc_getUserName()), usercolor : (user) ? user.get('color') : null, + avatar : data.asc_getReply(i).asc_getUserAvatar ? data.asc_getReply(i).asc_getUserAvatar() : null, date : this.dateToLocaleTimeString(date), reply : data.asc_getReply(i).asc_getText(), userdata : data.asc_getReply(i).asc_getUserData(), @@ -1435,6 +1443,8 @@ define([ date: this.dateToLocaleTimeString(date), userid: this.currentUserId, username: AscCommon.UserInfoParser.getCurrentName(), + avatar: null, //TODO : Метод получения аватарки текущего пользователя + initials: Common.Utils.getUserInitials(AscCommon.UserInfoParser.getParsedName(AscCommon.UserInfoParser.getCurrentName())), parsedName: AscCommon.UserInfoParser.getParsedName(AscCommon.UserInfoParser.getCurrentName()), usercolor: (user) ? user.get('color') : null, editTextInPopover: true, diff --git a/apps/common/main/lib/template/Comments.template b/apps/common/main/lib/template/Comments.template index 36f249ac81..0c747184ec 100644 --- a/apps/common/main/lib/template/Comments.template +++ b/apps/common/main/lib/template/Comments.template @@ -3,10 +3,19 @@ -
-
<%= scope.getEncodedName(parsedName) %> + -
<%=date%>
<% if (quote!==null && quote!=='') { %>
<%=scope.getFixedQuote(quote)%>
<% } %> @@ -30,10 +39,19 @@
<% } %>
style="padding-bottom: 0;" <% } %>;> -
-
<%=item.get("usercolor")%><% } else { %> #cfcfcf <% } %>; " >
<%= scope.getEncodedName(item.get("parsedName")) %> + -
<%=item.get("date")%>
<% if (!item.get("editText")) { %>
<%=scope.pickLink(item.get("reply"))%>
<% if (!scope.viewmode) { %> diff --git a/apps/common/main/lib/template/CommentsPopover.template b/apps/common/main/lib/template/CommentsPopover.template index 71b665002c..29bc93c28f 100644 --- a/apps/common/main/lib/template/CommentsPopover.template +++ b/apps/common/main/lib/template/CommentsPopover.template @@ -3,10 +3,19 @@ -
-
<%= scope.getEncodedName(parsedName) %> + -
<%=date%>
<% if (!editTextInPopover || (hint && !fullInfoInHint) || scope.viewmode) { %>
<%=scope.pickLink(comment)%>
<% } else { %> @@ -31,10 +40,19 @@
<% } %>
-
-
<%=item.get("usercolor")%><% } else { %> #cfcfcf <% } %>; " >
<%= scope.getEncodedName(item.get("parsedName")) %> + -
<%=item.get("date")%>
<% if (!item.get("editTextInPopover")) { %>
<%=scope.pickLink(item.get("reply"))%>
<% if ((fullInfoInHint || !hint) && !scope.viewmode) { %> diff --git a/apps/common/main/resources/less/comments.less b/apps/common/main/resources/less/comments.less index 80749dcbe7..1ef740d473 100644 --- a/apps/common/main/resources/less/comments.less +++ b/apps/common/main/resources/less/comments.less @@ -169,6 +169,18 @@ padding: 0px 20px 10px 20px; } + .user-info { + display: flex; + padding: 10px 65px 0 0px; + } + + .user-info-text { + flex: 1; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + } + .user-name { color: @text-normal-ie; color: @text-normal; @@ -177,8 +189,6 @@ overflow: hidden; text-overflow: ellipsis; white-space: nowrap; - padding: 10px 65px 0 0px; - height: 26px; cursor: default; .rtl & { @@ -187,15 +197,24 @@ } .color { - width: 12px; - height: 12px; - border: @scaled-one-px-value-ie solid @border-toolbar-ie; - border: @scaled-one-px-value solid @border-toolbar; - margin: 0 5px 3px 0; + display: inline-block; + width: 26px; + height: 26px; + border-radius: 20px; + border-width: @scaled-two-px-value; + margin-right: 8px; vertical-align: middle; + background-size: cover; + background-position: center; + + text-align: center; + line-height: 26px; + color: #ffffff; + font-weight: 700; .rtl & { - margin: 0 0 3px 5px; + margin-right: 0px; + margin-left: 8px; } } @@ -447,7 +466,7 @@ } .inner-edit-ct { - padding: 7px 0px 0px 0px; + padding: 10px 0px 0px 0px; .btn-inner-close { .margin-left-7(); From 4de1f54f4c6742f873504f8c5b82d5033f5efa12 Mon Sep 17 00:00:00 2001 From: Alexei Koshelev Date: Wed, 14 Jun 2023 00:35:14 +0300 Subject: [PATCH 03/22] Added user avatar for chat --- apps/common/main/lib/controller/Chat.js | 15 ++++++++- apps/common/main/lib/view/Chat.js | 23 ++++++++----- apps/common/main/resources/less/chat.less | 40 +++++++++++++++-------- 3 files changed, 56 insertions(+), 22 deletions(-) diff --git a/apps/common/main/lib/controller/Chat.js b/apps/common/main/lib/controller/Chat.js index 443bfdf286..61d64811b6 100644 --- a/apps/common/main/lib/controller/Chat.js +++ b/apps/common/main/lib/controller/Chat.js @@ -148,6 +148,9 @@ define([ id : user.asc_getId(), idOriginal : user.asc_getIdOriginal(), username : user.asc_getUserName(), + parsedName : AscCommon.UserInfoParser.getParsedName(user.asc_getUserName()), + initials : Common.Utils.getUserInitials(AscCommon.UserInfoParser.getParsedName(user.asc_getUserName())), + avatar : user.asc_getUserAvatar ? user.asc_getUserAvatar() : null, online : true, color : user.asc_getColor(), view : user.asc_getView(), @@ -172,6 +175,9 @@ define([ id : change.asc_getId(), idOriginal : change.asc_getIdOriginal(), username : change.asc_getUserName(), + parsedName : AscCommon.UserInfoParser.getParsedName(change.asc_getUserName()), + initials : Common.Utils.getUserInitials(AscCommon.UserInfoParser.getParsedName(change.asc_getUserName())), + avatar : change.asc_getUserAvatar ? change.asc_getUserAvatar() : null, online : change.asc_getState(), color : change.asc_getColor(), view : change.asc_getView(), @@ -180,6 +186,9 @@ define([ } else { user.set({online: change.asc_getState()}); user.set({username: change.asc_getUserName()}); + user.set({parsedName: AscCommon.UserInfoParser.getParsedName(change.asc_getUserName())}); + user.set({initials: Common.Utils.getUserInitials(change.asc_getUserName())}); + user.set({avatar: change.asc_getUserAvatar ? change.asc_getUserAvatar() : null}); } } }, @@ -193,7 +202,11 @@ define([ array.push(new Common.Models.ChatMessage({ userid : msg.useridoriginal, message : msg.message, - username : msg.username + username : msg.username, + parsedName : AscCommon.UserInfoParser.getParsedName(msg.username), + //TODO : В msg должен приходить avatar (Думаю что из sdk) + // Можно чтобы sdk в msg добавили ещё одно свойство "avatar" + // Либо вместо всех свойств о пользователе добавили свойство "user", класса asc_CUser. Как в методе onUserConnection })); }); diff --git a/apps/common/main/lib/view/Chat.js b/apps/common/main/lib/view/Chat.js index 2fa4c213b5..11e5ce9e28 100644 --- a/apps/common/main/lib/view/Chat.js +++ b/apps/common/main/lib/view/Chat.js @@ -59,7 +59,7 @@ define([ storeMessages: undefined, tplUser: ['
  • "<% if (!user.get("online")) { %> class="offline"<% } %>>', - '
    ;" >
    <%= scope.getUserName(user.get("username")) %>', + '
    ;" >
    <%= user.get("parsedName") %>', '
    ', '
    • '].join(''), @@ -73,10 +73,19 @@ define([ '<% if (msg.get("type")==1) { %>', '
    <%= msg.get("message") %>
    ', '<% } else { %>', - '
    ', - '
    <%=msg.get("usercolor")%><% } else { %> #cfcfcf <% } %>; " >
    <%= scope.getUserName(msg.get("username")) %>', + '
    ', + 'style="background-image: url(<%=msg.get("avatar")%>); <% if (msg.get("usercolor")!==null) { %> border-color:<%=msg.get("usercolor")%>; border-style:solid;<% }%>"', + '<% } else { %>', + 'style="background-color: <% if (msg.get("usercolor")!==null) { %> <%=msg.get("usercolor")%> <% } else { %> #cfcfcf <% }%>;"', + '<% } %>', + '><% if (!msg.get("avatar")) { %><%=msg.get("initials")%><% } %>
    ', + '
    ', + '
    ', + '<%= msg.get("parsedName") %>', + '
    ', + '', '
    ', - '', '<% } %>', ''].join(''), @@ -208,6 +217,8 @@ define([ var user = this.storeUsers.findOriginalUser(m.get('userid')); m.set({ usercolor : user ? user.get('color') : null, + avatar : user ? user.get('avatar') : null, + initials : user ? user.get('initials') : Common.Utils.getUserInitials(m.get('parsedName')), message : this._pickLink(m.get('message')) }, {silent:true}); }, @@ -266,10 +277,6 @@ define([ return str_res; }, - getUserName: function (username) { - return Common.Utils.String.htmlEncode(AscCommon.UserInfoParser.getParsedName(username)); - }, - hide: function () { Common.UI.BaseView.prototype.hide.call(this,arguments); this.fireEvent('hide', this ); diff --git a/apps/common/main/resources/less/chat.less b/apps/common/main/resources/less/chat.less index 70f5b16287..b41460d622 100644 --- a/apps/common/main/resources/less/chat.less +++ b/apps/common/main/resources/less/chat.less @@ -60,14 +60,13 @@ .color { display: inline-block; vertical-align: middle; - margin: 0 5px 3px 0; - width: 12px; - height: 12px; - border: 1px solid @border-toolbar-ie; - border: 1px solid @border-toolbar; + margin: 0 10px 3px 0; + width: 6px; + height: 6px; + border-radius: 6px; .rtl & { - margin: 0 0 3px 5px; + margin: 0 0 3px 10px; } } @@ -96,6 +95,7 @@ padding: 0; li { + display: flex; list-style: none; padding: 5px 10px 8px 20px; @@ -122,18 +122,32 @@ } .color { - width: 12px; - height: 12px; - border: 1px solid @border-toolbar-ie; - border: 1px solid @border-toolbar; - margin: 0 5px 3px 0; + display: inline-block; + width: 26px; + height: 26px; + border-radius: 20px; + border-width: @scaled-two-px-value; + margin-right: 8px; vertical-align: middle; - + background-size: cover; + background-position: center; + + text-align: center; + line-height: 26px; + color: #ffffff; + font-weight: 700; + .rtl & { - margin: 0 0 3px 5px; + margin-right: 0px; + margin-left: 8px; } } + .user-content { + flex: 1; + line-height: 12.65px; + } + .message { word-wrap: break-word; width: 100%; From eb5f542cadae3f26e7d7ffa077c82a6a6a8af4a0 Mon Sep 17 00:00:00 2001 From: Alexei Koshelev Date: Wed, 14 Jun 2023 00:36:05 +0300 Subject: [PATCH 04/22] Added user avatar for users list in header --- apps/common/main/lib/view/Header.js | 8 ++++++- apps/common/main/resources/less/header.less | 23 ++++++++++++++------- 2 files changed, 23 insertions(+), 8 deletions(-) diff --git a/apps/common/main/lib/view/Header.js b/apps/common/main/lib/view/Header.js index 4172b2b051..557300fc8f 100644 --- a/apps/common/main/lib/view/Header.js +++ b/apps/common/main/lib/view/Header.js @@ -57,7 +57,13 @@ define([ var templateUserItem = '
  • " class="<% if (!user.get("online")) { %> offline <% } if (user.get("view")) {%> viewmode <% } %>">' + '
    ' + - '
    ;">
    '+ + '
    ' + + 'style="background-image: url(<%=user.get("avatar")%>); <% if (user.get("color")!==null) { %> border-color:<%=user.get("color")%>; border-style: solid;<% }%>"' + + '<% } else { %>' + + 'style="background-color: <% if (user.get("color")!==null) { %> <%=user.get("color")%> <% } else { %> #cfcfcf <% }%>;"' + + '<% } %>' + + '><% if (!user.get("avatar")) { %><%=user.get("initials")%><% } %>
    ' + '' + '<% if (len>1) { %><% } %>' + '
    '+ diff --git a/apps/common/main/resources/less/header.less b/apps/common/main/resources/less/header.less index 984335df48..4086849d2c 100644 --- a/apps/common/main/resources/less/header.less +++ b/apps/common/main/resources/less/header.less @@ -438,24 +438,33 @@ li { list-style: none; - padding: 2px 0; + margin-top: 12px; overflow: hidden; &.offline, &.viewmode { display: none; } } + + li:first-child { + margin-top: 0px; + } } .color { - width: 12px; - height: 12px; + width: 26px; + height: 26px; + border-radius: 20px; + border-width: @scaled-two-px-value; display: inline-block; vertical-align: middle; - border: @scaled-one-px-value solid @border-toolbar; - .margin-right-5(); - margin-top: 0; - margin-bottom: 2px; + background-size: cover; + background-position: center; + .margin-right-8(); + + line-height: 26px; + color: #ffffff; + text-align: center; } .user-name { From 7791356efe4ab8e612e718420cacc68a3f31e3df Mon Sep 17 00:00:00 2001 From: Alexei Koshelev Date: Thu, 15 Jun 2023 01:03:58 +0300 Subject: [PATCH 05/22] Refactoring previos commits --- apps/common/main/lib/controller/Chat.js | 3 --- apps/common/main/lib/controller/Comments.js | 2 +- apps/common/main/lib/view/Header.js | 14 +------------- 3 files changed, 2 insertions(+), 17 deletions(-) diff --git a/apps/common/main/lib/controller/Chat.js b/apps/common/main/lib/controller/Chat.js index 61d64811b6..20785c0efc 100644 --- a/apps/common/main/lib/controller/Chat.js +++ b/apps/common/main/lib/controller/Chat.js @@ -204,9 +204,6 @@ define([ message : msg.message, username : msg.username, parsedName : AscCommon.UserInfoParser.getParsedName(msg.username), - //TODO : В msg должен приходить avatar (Думаю что из sdk) - // Можно чтобы sdk в msg добавили ещё одно свойство "avatar" - // Либо вместо всех свойств о пользователе добавили свойство "user", класса asc_CUser. Как в методе onUserConnection })); }); diff --git a/apps/common/main/lib/controller/Comments.js b/apps/common/main/lib/controller/Comments.js index 020303606f..a9c439a1dd 100644 --- a/apps/common/main/lib/controller/Comments.js +++ b/apps/common/main/lib/controller/Comments.js @@ -1443,7 +1443,7 @@ define([ date: this.dateToLocaleTimeString(date), userid: this.currentUserId, username: AscCommon.UserInfoParser.getCurrentName(), - avatar: null, //TODO : Метод получения аватарки текущего пользователя + avatar: user ? user.get('avatar') : null, initials: Common.Utils.getUserInitials(AscCommon.UserInfoParser.getParsedName(AscCommon.UserInfoParser.getCurrentName())), parsedName: AscCommon.UserInfoParser.getParsedName(AscCommon.UserInfoParser.getCurrentName()), usercolor: (user) ? user.get('color') : null, diff --git a/apps/common/main/lib/view/Header.js b/apps/common/main/lib/view/Header.js index 557300fc8f..0dd6db5d81 100644 --- a/apps/common/main/lib/view/Header.js +++ b/apps/common/main/lib/view/Header.js @@ -850,7 +850,7 @@ define([ html: true }); } - $btnUserName && $btnUserName.text(this.getInitials(name)); + $btnUserName && $btnUserName.text(Common.Utils.getUserInitials(name)); return this; }, @@ -901,18 +901,6 @@ define([ } }, - getInitials: function(name) { - var fio = name.split(' '); - var initials = fio[0].substring(0, 1).toUpperCase(); - for (var i = fio.length-1; i>0; i--) { - if (fio[i][0]!=='(' && fio[i][0]!==')') { - initials += fio[i].substring(0, 1).toUpperCase(); - break; - } - } - return initials; - }, - setDocumentReadOnly: function (readonly) { this.readOnly = readonly; this.setDocumentCaption(this.documentCaption); From 5d513b1add0c4162280cfae8389f0d3329195d96 Mon Sep 17 00:00:00 2001 From: Alexei Koshelev Date: Thu, 15 Jun 2023 19:32:10 +0300 Subject: [PATCH 06/22] Added user avatar for review --- apps/common/main/lib/controller/ReviewChanges.js | 3 +++ .../lib/template/ReviewChangesPopover.template | 16 +++++++++++++--- 2 files changed, 16 insertions(+), 3 deletions(-) diff --git a/apps/common/main/lib/controller/ReviewChanges.js b/apps/common/main/lib/controller/ReviewChanges.js index 5e23d10acf..f1019b7212 100644 --- a/apps/common/main/lib/controller/ReviewChanges.js +++ b/apps/common/main/lib/controller/ReviewChanges.js @@ -513,6 +513,8 @@ define([ userid : item.get_UserId(), username : item.get_UserName(), usercolor : (user) ? user.get('color') : null, + initials : Common.Utils.getUserInitials(AscCommon.UserInfoParser.getParsedName(item.get_UserName())), + avatar : (user) ? user.get('avatar') : null, date : me.dateToLocaleTimeString(date), changetext : changetext, id : Common.UI.getId(), @@ -1068,6 +1070,7 @@ define([ this.popoverChanges && this.popoverChanges.each(function (model) { var user = users.findOriginalUser(model.get('userid')); model.set('usercolor', (user) ? user.get('color') : null); + model.set('avatar', (user) ? user.get('avatar') : null); }); }, diff --git a/apps/common/main/lib/template/ReviewChangesPopover.template b/apps/common/main/lib/template/ReviewChangesPopover.template index 409e4c0e5d..b89bced635 100644 --- a/apps/common/main/lib/template/ReviewChangesPopover.template +++ b/apps/common/main/lib/template/ReviewChangesPopover.template @@ -1,8 +1,18 @@
    -
    -
    <%= scope.getUserName(username) %> + + -
    <%=date%>
    <%=changetext%>
    <% if (goto) { %> From 5cf046897e428cfdfbcdf35318350d037994f7a1 Mon Sep 17 00:00:00 2001 From: Alexei Koshelev Date: Thu, 15 Jun 2023 19:33:08 +0300 Subject: [PATCH 07/22] Fix show avatar for comments --- apps/common/main/lib/controller/Comments.js | 74 +++++++++------------ 1 file changed, 33 insertions(+), 41 deletions(-) diff --git a/apps/common/main/lib/controller/Comments.js b/apps/common/main/lib/controller/Comments.js index a9c439a1dd..8e81f8f1e3 100644 --- a/apps/common/main/lib/controller/Comments.js +++ b/apps/common/main/lib/controller/Comments.js @@ -842,7 +842,7 @@ define([ comment.set('parsedName', AscCommon.UserInfoParser.getParsedName(data.asc_getUserName())); comment.set('parsedGroups', AscCommon.UserInfoParser.getParsedGroups(data.asc_getUserName())); comment.set('usercolor', (user) ? user.get('color') : null); - comment.set('avatar', data.asc_getUserAvatar ? data.asc_getUserAvatar() : null); + comment.set('avatar', (user) ? user.get('avatar') : null); comment.set('resolved', data.asc_getSolved()); comment.set('quote', data.asc_getQuoteText()); comment.set('userdata', data.asc_getUserData()); @@ -878,7 +878,7 @@ define([ initials : Common.Utils.getUserInitials(AscCommon.UserInfoParser.getParsedName(data.asc_getReply(i).asc_getUserName())), parsedName : AscCommon.UserInfoParser.getParsedName(data.asc_getReply(i).asc_getUserName()), usercolor : (user) ? user.get('color') : null, - avatar : data.asc_getReply(i).asc_getUserAvatar ? data.asc_getReply(i).asc_getUserAvatar() : null, + avatar : (user) ? user.get('avatar') : null, date : t.dateToLocaleTimeString(dateReply), reply : data.asc_getReply(i).asc_getText(), userdata : data.asc_getReply(i).asc_getUserData(), @@ -1284,50 +1284,42 @@ define([ onUpdateUsers: function() { var users = this.userCollection, - hasGroup = false; - for (var name in this.groupCollection) { - hasGroup = true; - this.groupCollection[name].each(function (model) { - var user = users.findOriginalUser(model.get('userid')), - color = (user) ? user.get('color') : null, + hasGroup = false, + updateCommentData = function(comment, user, isNotReply) { + var color = (user) ? user.get('color') : null, + avatar = (user) ? user.get('avatar') : null, needrender = false; - if (color !== model.get('usercolor')) { + if (color !== comment.get('usercolor')) { + needrender = true; + comment.set('usercolor', color, {silent: true}); + } + if (avatar !== comment.get('avatar')) { needrender = true; - model.set('usercolor', color, {silent: true}); + comment.set('avatar', avatar, {silent: true}); } - model.get('replys').forEach(function (reply) { - user = users.findOriginalUser(reply.get('userid')); - color = (user) ? user.get('color') : null; - if (color !== reply.get('usercolor')) { - needrender = true; - reply.set('usercolor', color, {silent: true}); - } - }); + //If a comment and not a reply + if(isNotReply){ + comment.get('replys').forEach(function (reply) { + var needrenderReply = updateCommentData(reply, users.findOriginalUser(reply.get('userid')), false); + needrender = needrenderReply || needrender; + }); + + if (needrender) + comment.trigger('change'); + } - if (needrender) - model.trigger('change'); + return needrender; + }; + + for (var name in this.groupCollection) { + hasGroup = true; + this.groupCollection[name].each(function (comment) { + updateCommentData(comment, users.findOriginalUser(comment.get('userid')), true); }); } - !hasGroup && this.collection.each(function (model) { - var user = users.findOriginalUser(model.get('userid')), - color = (user) ? user.get('color') : null, - needrender = false; - if (color !== model.get('usercolor')) { - needrender = true; - model.set('usercolor', color, {silent: true}); - } - - model.get('replys').forEach(function (reply) { - user = users.findOriginalUser(reply.get('userid')); - color = (user) ? user.get('color') : null; - if (color !== reply.get('usercolor')) { - needrender = true; - reply.set('usercolor', color, {silent: true}); - } - }); - if (needrender) - model.trigger('change'); + !hasGroup && this.collection.each(function (comment) { + updateCommentData(comment, users.findOriginalUser(comment.get('userid')), true); }); }, @@ -1345,7 +1337,7 @@ define([ parsedName : AscCommon.UserInfoParser.getParsedName(data.asc_getUserName()), parsedGroups : AscCommon.UserInfoParser.getParsedGroups(data.asc_getUserName()), usercolor : (user) ? user.get('color') : null, - avatar : data.asc_getUserAvatar ? data.asc_getUserAvatar() : null, + avatar : (user) ? user.get('avatar') : null, date : this.dateToLocaleTimeString(date), quote : data.asc_getQuoteText(), comment : data.asc_getText(), @@ -1402,7 +1394,7 @@ define([ initials : Common.Utils.getUserInitials(AscCommon.UserInfoParser.getParsedName(data.asc_getReply(i).asc_getUserName())), parsedName : AscCommon.UserInfoParser.getParsedName(data.asc_getReply(i).asc_getUserName()), usercolor : (user) ? user.get('color') : null, - avatar : data.asc_getReply(i).asc_getUserAvatar ? data.asc_getReply(i).asc_getUserAvatar() : null, + avatar : (user) ? user.get('avatar') : null, date : this.dateToLocaleTimeString(date), reply : data.asc_getReply(i).asc_getText(), userdata : data.asc_getReply(i).asc_getUserData(), From 026ca0c917e1b8e881f2409be4bd4705d4499e09 Mon Sep 17 00:00:00 2001 From: Alexei Koshelev Date: Tue, 4 Jul 2023 02:21:38 +0300 Subject: [PATCH 08/22] Fix rtl for comments and chat --- apps/common/main/resources/less/chat.less | 1 + apps/common/main/resources/less/comments.less | 11 ++++++----- 2 files changed, 7 insertions(+), 5 deletions(-) diff --git a/apps/common/main/resources/less/chat.less b/apps/common/main/resources/less/chat.less index 6818910d9f..26958947a9 100644 --- a/apps/common/main/resources/less/chat.less +++ b/apps/common/main/resources/less/chat.less @@ -155,6 +155,7 @@ .user-content { flex: 1; + overflow: hidden; line-height: 12.65px; } diff --git a/apps/common/main/resources/less/comments.less b/apps/common/main/resources/less/comments.less index 3972feefb8..f61b59904a 100644 --- a/apps/common/main/resources/less/comments.less +++ b/apps/common/main/resources/less/comments.less @@ -171,7 +171,8 @@ .user-info { display: flex; - padding: 10px 65px 0 0px; + padding-top: 10px; + .padding-right(65px); } .user-info-text { @@ -190,10 +191,6 @@ text-overflow: ellipsis; white-space: nowrap; cursor: default; - - .rtl & { - padding: 10px 0px 0 65px; - } } .color { @@ -482,6 +479,10 @@ height: 16px; margin-top: 10px; position: absolute; + + .rtl & { + transform: scale(-1, 1); + } } .lock-area { From a4f634c08e2e7fa0ce2994f1862236a50d0d219c Mon Sep 17 00:00:00 2001 From: Alexei Koshelev Date: Tue, 4 Jul 2023 03:03:15 +0300 Subject: [PATCH 09/22] [SSE DE PE] Added avatar in editor header --- apps/common/main/lib/view/Header.js | 17 ++++++++++++++++- apps/common/main/resources/less/header.less | 4 ++++ apps/documenteditor/main/app/controller/Main.js | 1 + .../main/app/controller/Main.js | 1 + .../main/app/controller/Main.js | 1 + 5 files changed, 23 insertions(+), 1 deletion(-) diff --git a/apps/common/main/lib/view/Header.js b/apps/common/main/lib/view/Header.js index 0dd6db5d81..ab18430f30 100644 --- a/apps/common/main/lib/view/Header.js +++ b/apps/common/main/lib/view/Header.js @@ -850,10 +850,25 @@ define([ html: true }); } - $btnUserName && $btnUserName.text(Common.Utils.getUserInitials(name)); + $btnUserName && this.updateAvatarEl(); + return this; }, + setUserAvatar: function(avatar) { + this.options.userAvatar = avatar; + $btnUserName && this.updateAvatarEl(); + }, + + updateAvatarEl(){ + if(this.options.userAvatar){ + $btnUserName.css({'background-image': 'url('+ this.options.userAvatar +')'}); + $btnUserName.text(''); + } else { + $btnUserName.text(Common.Utils.getUserInitials(this.options.userName)); + } + }, + getButton: function(type) { if (type == 'save') return this.btnSave; diff --git a/apps/common/main/resources/less/header.less b/apps/common/main/resources/less/header.less index e2afcd59e0..3628237b1f 100644 --- a/apps/common/main/resources/less/header.less +++ b/apps/common/main/resources/less/header.less @@ -399,6 +399,10 @@ background-color: @icon-toolbar-header; color: @toolbar-header-text-on-background-ie; color: @toolbar-header-text-on-background; + vertical-align: middle; + background-size: cover; + background-position: center; + font-size: 10px; line-height: 20px; overflow: hidden; diff --git a/apps/documenteditor/main/app/controller/Main.js b/apps/documenteditor/main/app/controller/Main.js index 3c84692f8e..f42e152d17 100644 --- a/apps/documenteditor/main/app/controller/Main.js +++ b/apps/documenteditor/main/app/controller/Main.js @@ -1626,6 +1626,7 @@ define([ this.appOptions.canUseCommentPermissions && AscCommon.UserInfoParser.setCommentPermissions(this.permissions.commentGroups); this.appOptions.canUseUserInfoPermissions && AscCommon.UserInfoParser.setUserInfoPermissions(this.permissions.userInfoGroups); appHeader.setUserName(AscCommon.UserInfoParser.getParsedName(AscCommon.UserInfoParser.getCurrentName())); + appHeader.setUserAvatar(this.appOptions.user.avatar); this.appOptions.canRename && appHeader.setCanRename(true); this.appOptions.canBrandingExt = params.asc_getCanBranding() && (typeof this.editorConfig.customization == 'object' || this.editorConfig.plugins); diff --git a/apps/presentationeditor/main/app/controller/Main.js b/apps/presentationeditor/main/app/controller/Main.js index 182ac6f53c..6bd5855d43 100644 --- a/apps/presentationeditor/main/app/controller/Main.js +++ b/apps/presentationeditor/main/app/controller/Main.js @@ -1277,6 +1277,7 @@ define([ this.appOptions.canUseCommentPermissions && AscCommon.UserInfoParser.setCommentPermissions(this.permissions.commentGroups); this.appOptions.canUseUserInfoPermissions && AscCommon.UserInfoParser.setUserInfoPermissions(this.permissions.userInfoGroups); appHeader.setUserName(AscCommon.UserInfoParser.getParsedName(AscCommon.UserInfoParser.getCurrentName())); + appHeader.setUserAvatar(this.appOptions.user.avatar); this.appOptions.canRename && appHeader.setCanRename(true); this.appOptions.canBrandingExt = params.asc_getCanBranding() && (typeof this.editorConfig.customization == 'object' || this.editorConfig.plugins); diff --git a/apps/spreadsheeteditor/main/app/controller/Main.js b/apps/spreadsheeteditor/main/app/controller/Main.js index f2fd9cda9a..3d4abf32ae 100644 --- a/apps/spreadsheeteditor/main/app/controller/Main.js +++ b/apps/spreadsheeteditor/main/app/controller/Main.js @@ -1357,6 +1357,7 @@ define([ this.appOptions.canUseCommentPermissions && AscCommon.UserInfoParser.setCommentPermissions(this.permissions.commentGroups); this.appOptions.canUseUserInfoPermissions && AscCommon.UserInfoParser.setUserInfoPermissions(this.permissions.userInfoGroups); this.headerView.setUserName(AscCommon.UserInfoParser.getParsedName(AscCommon.UserInfoParser.getCurrentName())); + this.headerView.setUserAvatar(this.appOptions.user.avatar); } else this.appOptions.canModifyFilter = true; From 4fc6c066a5db0e1544514a54e34ea3b538b55124 Mon Sep 17 00:00:00 2001 From: Julia Radzhabova Date: Sat, 7 Oct 2023 14:41:20 +0300 Subject: [PATCH 10/22] Api config: add image field to user info --- apps/api/documents/api.js | 1 + apps/documenteditor/main/app/controller/Main.js | 3 ++- apps/presentationeditor/main/app/controller/Main.js | 2 +- apps/spreadsheeteditor/main/app/controller/Main.js | 2 +- 4 files changed, 5 insertions(+), 3 deletions(-) diff --git a/apps/api/documents/api.js b/apps/api/documents/api.js index 825a6830ca..1204d5f51e 100644 --- a/apps/api/documents/api.js +++ b/apps/api/documents/api.js @@ -87,6 +87,7 @@ id: 'user id', name: 'user name', group: 'group name' // for customization.reviewPermissions or permissions.reviewGroups or permissions.commentGroups. Can be multiple groups separated by commas (,) : 'Group1' or 'Group1,Group2' + image: 'image url' }, recent: [ { diff --git a/apps/documenteditor/main/app/controller/Main.js b/apps/documenteditor/main/app/controller/Main.js index f42e152d17..cfec44cb3a 100644 --- a/apps/documenteditor/main/app/controller/Main.js +++ b/apps/documenteditor/main/app/controller/Main.js @@ -500,6 +500,7 @@ define([ _user.put_Id(this.appOptions.user.id); _user.put_FullName(this.appOptions.user.fullname); _user.put_IsAnonymousUser(!!this.appOptions.user.anonymous); + // this.appOptions.user.image && _user.put_UserImage(this.appOptions.user.image); docInfo = new Asc.asc_CDocInfo(); docInfo.put_Id(data.doc.key); @@ -1626,7 +1627,7 @@ define([ this.appOptions.canUseCommentPermissions && AscCommon.UserInfoParser.setCommentPermissions(this.permissions.commentGroups); this.appOptions.canUseUserInfoPermissions && AscCommon.UserInfoParser.setUserInfoPermissions(this.permissions.userInfoGroups); appHeader.setUserName(AscCommon.UserInfoParser.getParsedName(AscCommon.UserInfoParser.getCurrentName())); - appHeader.setUserAvatar(this.appOptions.user.avatar); + appHeader.setUserAvatar(this.appOptions.user.image); this.appOptions.canRename && appHeader.setCanRename(true); this.appOptions.canBrandingExt = params.asc_getCanBranding() && (typeof this.editorConfig.customization == 'object' || this.editorConfig.plugins); diff --git a/apps/presentationeditor/main/app/controller/Main.js b/apps/presentationeditor/main/app/controller/Main.js index 6bd5855d43..4d2c6ecdb6 100644 --- a/apps/presentationeditor/main/app/controller/Main.js +++ b/apps/presentationeditor/main/app/controller/Main.js @@ -1277,7 +1277,7 @@ define([ this.appOptions.canUseCommentPermissions && AscCommon.UserInfoParser.setCommentPermissions(this.permissions.commentGroups); this.appOptions.canUseUserInfoPermissions && AscCommon.UserInfoParser.setUserInfoPermissions(this.permissions.userInfoGroups); appHeader.setUserName(AscCommon.UserInfoParser.getParsedName(AscCommon.UserInfoParser.getCurrentName())); - appHeader.setUserAvatar(this.appOptions.user.avatar); + appHeader.setUserAvatar(this.appOptions.user.image); this.appOptions.canRename && appHeader.setCanRename(true); this.appOptions.canBrandingExt = params.asc_getCanBranding() && (typeof this.editorConfig.customization == 'object' || this.editorConfig.plugins); diff --git a/apps/spreadsheeteditor/main/app/controller/Main.js b/apps/spreadsheeteditor/main/app/controller/Main.js index 3d4abf32ae..f45744fc96 100644 --- a/apps/spreadsheeteditor/main/app/controller/Main.js +++ b/apps/spreadsheeteditor/main/app/controller/Main.js @@ -1357,7 +1357,7 @@ define([ this.appOptions.canUseCommentPermissions && AscCommon.UserInfoParser.setCommentPermissions(this.permissions.commentGroups); this.appOptions.canUseUserInfoPermissions && AscCommon.UserInfoParser.setUserInfoPermissions(this.permissions.userInfoGroups); this.headerView.setUserName(AscCommon.UserInfoParser.getParsedName(AscCommon.UserInfoParser.getCurrentName())); - this.headerView.setUserAvatar(this.appOptions.user.avatar); + this.headerView.setUserAvatar(this.appOptions.user.image); } else this.appOptions.canModifyFilter = true; From 2c2a2ec31d293f78b37d8c37c0a139367bdf43c1 Mon Sep 17 00:00:00 2001 From: Julia Radzhabova Date: Tue, 10 Oct 2023 00:08:04 +0300 Subject: [PATCH 11/22] Add onRequestUserImage/setUserImage events for user avatars --- apps/api/documents/api.js | 11 ++++++- apps/common/Gateway.js | 8 +++++ apps/common/main/lib/collection/Users.js | 4 +++ apps/common/main/lib/controller/Chat.js | 24 +++++++++++--- .../main/lib/controller/ExternalUsers.js | 31 ++++++++++++++++++- apps/common/main/lib/view/Header.js | 9 ++++++ .../main/app/controller/Main.js | 3 +- .../main/app/controller/Main.js | 3 +- .../main/app/controller/Main.js | 3 +- 9 files changed, 87 insertions(+), 9 deletions(-) diff --git a/apps/api/documents/api.js b/apps/api/documents/api.js index 1204d5f51e..3d8b62a2d8 100644 --- a/apps/api/documents/api.js +++ b/apps/api/documents/api.js @@ -279,6 +279,7 @@ 'onRequestSelectDocument': , // used for compare and combine documents. must call setRequestedDocument method. use instead of onRequestCompareFile/setRevisedFile 'onRequestSelectSpreadsheet': , // used for mailmerge id de and external links in sse. must call setRequestedSpreadsheet method. use instead of onRequestMailMergeRecipients/setMailMergeRecipients 'onRequestReferenceSource': , // used for external links in sse. must call setReferenceSource method + 'onRequestUserImage': , // must call setUserImage method } } @@ -732,6 +733,13 @@ }); }; + var _setUserImage = function(data) { + _sendCommand({ + command: 'setUserImage', + data: data + }); + }; + var _setFavorite = function(data) { _sendCommand({ command: 'setFavorite', @@ -822,7 +830,8 @@ setReferenceData : _setReferenceData, setRequestedDocument: _setRequestedDocument, setRequestedSpreadsheet: _setRequestedSpreadsheet, - setReferenceSource: _setReferenceSource + setReferenceSource: _setReferenceSource, + setUserImage: _setUserImage } }; diff --git a/apps/common/Gateway.js b/apps/common/Gateway.js index 03bae36ebb..daa14c94a5 100644 --- a/apps/common/Gateway.js +++ b/apps/common/Gateway.js @@ -153,6 +153,10 @@ if (window.Common === undefined) { 'setReferenceSource': function(data) { $me.trigger('setreferencesource', data); + }, + + 'setUserImage': function(data) { + $me.trigger('setuserimage', data); } }; @@ -382,6 +386,10 @@ if (window.Common === undefined) { _postMessage({event:'onRequestReferenceSource'}); }, + requestUserImage: function (data) { + _postMessage({event:'onRequestUserImage', data: data}); + }, + pluginsReady: function() { _postMessage({ event: 'onPluginsReady' }); }, diff --git a/apps/common/main/lib/collection/Users.js b/apps/common/main/lib/collection/Users.js index bc24e4e65b..d6651af831 100644 --- a/apps/common/main/lib/collection/Users.js +++ b/apps/common/main/lib/collection/Users.js @@ -87,6 +87,10 @@ define([ function(model){ return model.get('idOriginal') == id; }); + }, + + findOriginalUsers: function(id) { + return this.where({idOriginal: id}); } }); diff --git a/apps/common/main/lib/controller/Chat.js b/apps/common/main/lib/controller/Chat.js index 20785c0efc..3fd22ad27d 100644 --- a/apps/common/main/lib/controller/Chat.js +++ b/apps/common/main/lib/controller/Chat.js @@ -103,6 +103,7 @@ define([ this.api.asc_registerCallback('asc_onCoAuthoringChatReceiveMessage', _.bind(this.onReceiveMessage, this)); if ( !this.mode.isEditDiagram && !this.mode.isEditMailMerge && !this.mode.isEditOle ) { + Common.NotificationCenter.on('avatars:update', _.bind(this.avatarsUpdate, this)); this.api.asc_registerCallback('asc_onAuthParticipantsChanged', _.bind(this.onUsersChanged, this)); this.api.asc_registerCallback('asc_onConnectionStateChanged', _.bind(this.onUserConnection, this)); this.api.asc_coAuthoringGetUsers(); @@ -138,7 +139,7 @@ define([ var usersStore = this.getApplication().getCollection('Common.Collections.Users'); if (usersStore) { - var arrUsers = [], name, user; + var arrUsers = [], name, user, arrIds = []; for (name in users) { if (undefined !== name) { @@ -150,18 +151,19 @@ define([ username : user.asc_getUserName(), parsedName : AscCommon.UserInfoParser.getParsedName(user.asc_getUserName()), initials : Common.Utils.getUserInitials(AscCommon.UserInfoParser.getParsedName(user.asc_getUserName())), - avatar : user.asc_getUserAvatar ? user.asc_getUserAvatar() : null, online : true, color : user.asc_getColor(), view : user.asc_getView(), hidden : !(user.asc_getIdOriginal()===this.currentUserId || AscCommon.UserInfoParser.isUserVisible(user.asc_getUserName())) }); arrUsers[(user.asc_getId() == currentUserId ) ? 'unshift' : 'push'](usermodel); + arrIds.push(user.asc_getIdOriginal()); } } } usersStore[usersStore.size() > 0 ? 'add' : 'reset'](arrUsers); + arrIds.length && Common.UI.ExternalUsers.getImages(arrIds); } }, @@ -170,6 +172,7 @@ define([ if (usersStore){ var user = usersStore.findUser(change.asc_getId()); + var arrIds = []; if (!user) { usersStore.add(new Common.Models.User({ id : change.asc_getId(), @@ -177,7 +180,6 @@ define([ username : change.asc_getUserName(), parsedName : AscCommon.UserInfoParser.getParsedName(change.asc_getUserName()), initials : Common.Utils.getUserInitials(AscCommon.UserInfoParser.getParsedName(change.asc_getUserName())), - avatar : change.asc_getUserAvatar ? change.asc_getUserAvatar() : null, online : change.asc_getState(), color : change.asc_getColor(), view : change.asc_getView(), @@ -188,7 +190,21 @@ define([ user.set({username: change.asc_getUserName()}); user.set({parsedName: AscCommon.UserInfoParser.getParsedName(change.asc_getUserName())}); user.set({initials: Common.Utils.getUserInitials(change.asc_getUserName())}); - user.set({avatar: change.asc_getUserAvatar ? change.asc_getUserAvatar() : null}); + } + arrIds.push(user.asc_getIdOriginal()); + arrIds.length && Common.UI.ExternalUsers.getImages(arrIds); + } + }, + + avatarsUpdate: function(userImages) { + var usersStore = this.getApplication().getCollection('Common.Collections.Users'); + if (usersStore && userImages){ + for (var id in userImages) { + if (userImages.hasOwnProperty(id)) { + usersStore.findOriginalUsers(id).forEach(function(user){ + user.set({avatar: userImages[id]}); + }); + } } } }, diff --git a/apps/common/main/lib/controller/ExternalUsers.js b/apps/common/main/lib/controller/ExternalUsers.js index 48a1655cdd..39278b5e76 100644 --- a/apps/common/main/lib/controller/ExternalUsers.js +++ b/apps/common/main/lib/controller/ExternalUsers.js @@ -46,6 +46,7 @@ if (Common.UI === undefined) { Common.UI.ExternalUsers = new( function() { var externalUsers = [], + userImages = {}, isUsersLoading = false; var _get = function(type) { @@ -60,7 +61,34 @@ Common.UI.ExternalUsers = new( function() { } }; + var _getImages = function(ids) { + var arrRequest = [], + arrImages = {}, + hasImages = false; + for (var i=0; i Date: Tue, 10 Oct 2023 23:53:20 +0300 Subject: [PATCH 12/22] Refactoring loading images for users (use onRequestUsers/setUsers with type="info") --- apps/api/documents/api.js | 9 -- apps/common/Gateway.js | 12 +- apps/common/main/lib/controller/Chat.js | 33 +++--- .../main/lib/controller/ExternalUsers.js | 104 ++++++++++++------ .../main/lib/controller/ReviewChanges.js | 3 +- apps/common/main/lib/view/Header.js | 7 +- .../main/app/controller/Main.js | 4 +- .../main/app/controller/Main.js | 4 +- .../main/app/controller/Main.js | 4 +- 9 files changed, 103 insertions(+), 77 deletions(-) diff --git a/apps/api/documents/api.js b/apps/api/documents/api.js index 3d8b62a2d8..c1f3efe058 100644 --- a/apps/api/documents/api.js +++ b/apps/api/documents/api.js @@ -279,7 +279,6 @@ 'onRequestSelectDocument': , // used for compare and combine documents. must call setRequestedDocument method. use instead of onRequestCompareFile/setRevisedFile 'onRequestSelectSpreadsheet': , // used for mailmerge id de and external links in sse. must call setRequestedSpreadsheet method. use instead of onRequestMailMergeRecipients/setMailMergeRecipients 'onRequestReferenceSource': , // used for external links in sse. must call setReferenceSource method - 'onRequestUserImage': , // must call setUserImage method } } @@ -733,13 +732,6 @@ }); }; - var _setUserImage = function(data) { - _sendCommand({ - command: 'setUserImage', - data: data - }); - }; - var _setFavorite = function(data) { _sendCommand({ command: 'setFavorite', @@ -831,7 +823,6 @@ setRequestedDocument: _setRequestedDocument, setRequestedSpreadsheet: _setRequestedSpreadsheet, setReferenceSource: _setReferenceSource, - setUserImage: _setUserImage } }; diff --git a/apps/common/Gateway.js b/apps/common/Gateway.js index daa14c94a5..e2efd153d8 100644 --- a/apps/common/Gateway.js +++ b/apps/common/Gateway.js @@ -153,10 +153,6 @@ if (window.Common === undefined) { 'setReferenceSource': function(data) { $me.trigger('setreferencesource', data); - }, - - 'setUserImage': function(data) { - $me.trigger('setuserimage', data); } }; @@ -338,8 +334,8 @@ if (window.Common === undefined) { _postMessage({event:'onMakeActionLink', data: config}); }, - requestUsers: function (command) { - _postMessage({event:'onRequestUsers', data: {c: command}}); + requestUsers: function (command, id) { + _postMessage({event:'onRequestUsers', data: {c: command, id: id}}); }, requestSendNotify: function (emails) { @@ -386,10 +382,6 @@ if (window.Common === undefined) { _postMessage({event:'onRequestReferenceSource'}); }, - requestUserImage: function (data) { - _postMessage({event:'onRequestUserImage', data: data}); - }, - pluginsReady: function() { _postMessage({ event: 'onPluginsReady' }); }, diff --git a/apps/common/main/lib/controller/Chat.js b/apps/common/main/lib/controller/Chat.js index 3fd22ad27d..92ba591ac3 100644 --- a/apps/common/main/lib/controller/Chat.js +++ b/apps/common/main/lib/controller/Chat.js @@ -103,7 +103,7 @@ define([ this.api.asc_registerCallback('asc_onCoAuthoringChatReceiveMessage', _.bind(this.onReceiveMessage, this)); if ( !this.mode.isEditDiagram && !this.mode.isEditMailMerge && !this.mode.isEditOle ) { - Common.NotificationCenter.on('avatars:update', _.bind(this.avatarsUpdate, this)); + Common.NotificationCenter.on('mentions:setusers', _.bind(this.avatarsUpdate, this)); this.api.asc_registerCallback('asc_onAuthParticipantsChanged', _.bind(this.onUsersChanged, this)); this.api.asc_registerCallback('asc_onConnectionStateChanged', _.bind(this.onUserConnection, this)); this.api.asc_coAuthoringGetUsers(); @@ -145,6 +145,7 @@ define([ if (undefined !== name) { user = users[name]; if (user) { + var avatar = Common.UI.ExternalUsers.getImage(user.asc_getIdOriginal()); var usermodel = new Common.Models.User({ id : user.asc_getId(), idOriginal : user.asc_getIdOriginal(), @@ -153,17 +154,18 @@ define([ initials : Common.Utils.getUserInitials(AscCommon.UserInfoParser.getParsedName(user.asc_getUserName())), online : true, color : user.asc_getColor(), + avatar : avatar, view : user.asc_getView(), hidden : !(user.asc_getIdOriginal()===this.currentUserId || AscCommon.UserInfoParser.isUserVisible(user.asc_getUserName())) }); arrUsers[(user.asc_getId() == currentUserId ) ? 'unshift' : 'push'](usermodel); - arrIds.push(user.asc_getIdOriginal()); + (avatar===undefined) && arrIds.push(user.asc_getIdOriginal()); } } } usersStore[usersStore.size() > 0 ? 'add' : 'reset'](arrUsers); - arrIds.length && Common.UI.ExternalUsers.getImages(arrIds); + arrIds.length && Common.UI.ExternalUsers.get('info', arrIds); } }, @@ -172,7 +174,7 @@ define([ if (usersStore){ var user = usersStore.findUser(change.asc_getId()); - var arrIds = []; + var avatar = Common.UI.ExternalUsers.getImage(change.asc_getIdOriginal()); if (!user) { usersStore.add(new Common.Models.User({ id : change.asc_getId(), @@ -182,6 +184,7 @@ define([ initials : Common.Utils.getUserInitials(AscCommon.UserInfoParser.getParsedName(change.asc_getUserName())), online : change.asc_getState(), color : change.asc_getColor(), + avatar : avatar, view : change.asc_getView(), hidden : !(change.asc_getIdOriginal()===this.currentUserId || AscCommon.UserInfoParser.isUserVisible(change.asc_getUserName())) })); @@ -190,22 +193,22 @@ define([ user.set({username: change.asc_getUserName()}); user.set({parsedName: AscCommon.UserInfoParser.getParsedName(change.asc_getUserName())}); user.set({initials: Common.Utils.getUserInitials(change.asc_getUserName())}); + user.set({avatar: avatar}); } - arrIds.push(user.asc_getIdOriginal()); - arrIds.length && Common.UI.ExternalUsers.getImages(arrIds); + (avatar===undefined) && Common.UI.ExternalUsers.get('info', [change.asc_getIdOriginal()]); } }, - avatarsUpdate: function(userImages) { + avatarsUpdate: function(type, users) { + if (type!=='info') return; + var usersStore = this.getApplication().getCollection('Common.Collections.Users'); - if (usersStore && userImages){ - for (var id in userImages) { - if (userImages.hasOwnProperty(id)) { - usersStore.findOriginalUsers(id).forEach(function(user){ - user.set({avatar: userImages[id]}); - }); - } - } + if (usersStore && users && users.length>0 ){ + _.each(users, function(item) { + usersStore.findOriginalUsers(item.id).forEach(function(user){ + user.set({avatar: item.image}); + }); + }); } }, diff --git a/apps/common/main/lib/controller/ExternalUsers.js b/apps/common/main/lib/controller/ExternalUsers.js index 39278b5e76..317e77a99f 100644 --- a/apps/common/main/lib/controller/ExternalUsers.js +++ b/apps/common/main/lib/controller/ExternalUsers.js @@ -46,52 +46,81 @@ if (Common.UI === undefined) { Common.UI.ExternalUsers = new( function() { var externalUsers = [], - userImages = {}, - isUsersLoading = false; + isUsersLoading = false, + externalUsersInfo = [], + isUsersInfoLoading = false, + stackUsersInfoResponse = []; - var _get = function(type) { - if (isUsersLoading) return; - - type = type || 'mention'; - if (externalUsers[type]===undefined) { - isUsersLoading = true; - Common.Gateway.requestUsers(type || 'mention'); + var _get = function(type, ids) { + if (type==='info') { + (typeof ids !== 'object') && (ids = [ids]); + ids && (ids = _.uniq(ids)); + if (ids.length>100) { + while (ids.length>0) { + Common.Gateway.requestUsers('info', ids.splice(0, 100)); + } + } else + Common.Gateway.requestUsers('info', ids); } else { - Common.NotificationCenter.trigger('mentions:setusers', type, externalUsers[type]); - } - }; + if (isUsersLoading) return; - var _getImages = function(ids) { - var arrRequest = [], - arrImages = {}, - hasImages = false; - for (var i=0; i0) + _onUsersInfo(stackUsersInfoResponse.shift()); + }; + + var _init = function(canRequestUsers) { + Common.Gateway.on('setusers', _onUsersInfo); if (!canRequestUsers) return; Common.Gateway.on('setusers', function(data) { + if (data.c === 'info') return; if (data.users===null) {// clear user lists externalUsers = []; return; @@ -101,14 +130,17 @@ Common.UI.ExternalUsers = new( function() { isUsersLoading = false; Common.NotificationCenter.trigger('mentions:setusers', type, externalUsers[type]); }); - Common.NotificationCenter.on('mentions:clearusers', function() { - externalUsers = []; + + Common.NotificationCenter.on('mentions:clearusers', function(type) { + if (type !== 'info') + externalUsers[type || 'mention'] = undefined; }); }; return { init: _init, get: _get, - getImages: _getImages + getImage: _getImage, + setImage: _setImage } })(); diff --git a/apps/common/main/lib/controller/ReviewChanges.js b/apps/common/main/lib/controller/ReviewChanges.js index f1019b7212..0cc73b7461 100644 --- a/apps/common/main/lib/controller/ReviewChanges.js +++ b/apps/common/main/lib/controller/ReviewChanges.js @@ -1056,7 +1056,8 @@ define([ if (data) { this.document.info.sharingSettings = data.sharingSettings; Common.NotificationCenter.trigger('collaboration:sharingupdate', data.sharingSettings); - Common.NotificationCenter.trigger('mentions:clearusers', this); + Common.NotificationCenter.trigger('mentions:clearusers', 'mention'); + Common.NotificationCenter.trigger('mentions:clearusers', 'protect'); } }, diff --git a/apps/common/main/lib/view/Header.js b/apps/common/main/lib/view/Header.js index ed854eba07..334049f16f 100644 --- a/apps/common/main/lib/view/Header.js +++ b/apps/common/main/lib/view/Header.js @@ -514,7 +514,7 @@ define([ 'collaboration:sharingdeny': function(mode) {Common.Utils.asyncCall(onLostEditRights, me, mode);} }); Common.NotificationCenter.on('uitheme:changed', this.changeLogo.bind(this)); - Common.NotificationCenter.on('avatars:update', this.avatarsUpdate.bind(this)); + Common.NotificationCenter.on('mentions:setusers', this.avatarsUpdate.bind(this)); }, render: function (el, role) { @@ -874,8 +874,9 @@ define([ } }, - avatarsUpdate: function(userImages) { - (this.options.userAvatar===undefined) && (userImages[this.options.currentUserId]!==undefined) && this.setUserAvatar(userImages[this.options.currentUserId]); + avatarsUpdate: function(type, users) { + if (type!=='info') return; + this.setUserAvatar(Common.UI.ExternalUsers.getImage(this.options.currentUserId)); }, getButton: function(type) { diff --git a/apps/documenteditor/main/app/controller/Main.js b/apps/documenteditor/main/app/controller/Main.js index 83b4a78e7f..6856197683 100644 --- a/apps/documenteditor/main/app/controller/Main.js +++ b/apps/documenteditor/main/app/controller/Main.js @@ -1628,6 +1628,7 @@ define([ this.appOptions.canUseUserInfoPermissions && AscCommon.UserInfoParser.setUserInfoPermissions(this.permissions.userInfoGroups); appHeader.setUserName(AscCommon.UserInfoParser.getParsedName(AscCommon.UserInfoParser.getCurrentName())); appHeader.setUserId(this.appOptions.user.id); + appHeader.setUserAvatar(this.appOptions.user.image); this.appOptions.canRename && appHeader.setCanRename(true); this.appOptions.canBrandingExt = params.asc_getCanBranding() && (typeof this.editorConfig.customization == 'object' || this.editorConfig.plugins); @@ -1635,7 +1636,8 @@ define([ this.editorConfig.customization && Common.UI.LayoutManager.init(this.editorConfig.customization.layout, this.appOptions.canBrandingExt); this.editorConfig.customization && Common.UI.FeaturesManager.init(this.editorConfig.customization.features, this.appOptions.canBrandingExt); Common.UI.ExternalUsers.init(this.appOptions.canRequestUsers); - Common.UI.ExternalUsers.getImages([this.appOptions.user.id]); + this.appOptions.user.image && Common.UI.ExternalUsers.setImage(this.appOptions.user.id, this.appOptions.user.image); + Common.UI.ExternalUsers.get('info', this.appOptions.user.id); if (this.appOptions.canComments) Common.NotificationCenter.on('comments:cleardummy', _.bind(this.onClearDummyComment, this)); diff --git a/apps/presentationeditor/main/app/controller/Main.js b/apps/presentationeditor/main/app/controller/Main.js index c99f054739..5d5f63d298 100644 --- a/apps/presentationeditor/main/app/controller/Main.js +++ b/apps/presentationeditor/main/app/controller/Main.js @@ -1278,6 +1278,7 @@ define([ this.appOptions.canUseUserInfoPermissions && AscCommon.UserInfoParser.setUserInfoPermissions(this.permissions.userInfoGroups); appHeader.setUserName(AscCommon.UserInfoParser.getParsedName(AscCommon.UserInfoParser.getCurrentName())); appHeader.setUserId(this.appOptions.user.id); + appHeader.setUserAvatar(this.appOptions.user.image); this.appOptions.canRename && appHeader.setCanRename(true); this.appOptions.canBrandingExt = params.asc_getCanBranding() && (typeof this.editorConfig.customization == 'object' || this.editorConfig.plugins); @@ -1285,7 +1286,8 @@ define([ this.editorConfig.customization && Common.UI.LayoutManager.init(this.editorConfig.customization.layout, this.appOptions.canBrandingExt); this.editorConfig.customization && Common.UI.FeaturesManager.init(this.editorConfig.customization.features, this.appOptions.canBrandingExt); Common.UI.ExternalUsers.init(this.appOptions.canRequestUsers); - Common.UI.ExternalUsers.getImages([this.appOptions.user.id]); + this.appOptions.user.image && Common.UI.ExternalUsers.setImage(this.appOptions.user.id, this.appOptions.user.image); + Common.UI.ExternalUsers.get('info', this.appOptions.user.id); // change = true by default in editor this.appOptions.canLiveView = !!params.asc_getLiveViewerSupport() && (this.editorConfig.mode === 'view'); // viewer: change=false when no flag canLiveViewer (i.g. old license), change=true by default when canLiveViewer==true diff --git a/apps/spreadsheeteditor/main/app/controller/Main.js b/apps/spreadsheeteditor/main/app/controller/Main.js index 4b885e5f23..b1c703ec1e 100644 --- a/apps/spreadsheeteditor/main/app/controller/Main.js +++ b/apps/spreadsheeteditor/main/app/controller/Main.js @@ -1358,6 +1358,7 @@ define([ this.appOptions.canUseUserInfoPermissions && AscCommon.UserInfoParser.setUserInfoPermissions(this.permissions.userInfoGroups); this.headerView.setUserName(AscCommon.UserInfoParser.getParsedName(AscCommon.UserInfoParser.getCurrentName())); this.headerView.setUserId(this.appOptions.user.id); + this.headerView.setUserAvatar(this.appOptions.user.image); } else this.appOptions.canModifyFilter = true; @@ -1399,7 +1400,8 @@ define([ this.editorConfig.customization && Common.UI.LayoutManager.init(this.editorConfig.customization.layout, this.appOptions.canBrandingExt); this.editorConfig.customization && Common.UI.FeaturesManager.init(this.editorConfig.customization.features, this.appOptions.canBrandingExt); Common.UI.ExternalUsers.init(this.appOptions.canRequestUsers); - Common.UI.ExternalUsers.getImages([this.appOptions.user.id]); + this.appOptions.user.image && Common.UI.ExternalUsers.setImage(this.appOptions.user.id, this.appOptions.user.image); + Common.UI.ExternalUsers.get('info', this.appOptions.user.id); } this.appOptions.canUseHistory = this.appOptions.canLicense && this.editorConfig.canUseHistory && this.appOptions.canCoAuthoring && !this.appOptions.isOffline; From 1b6e3c7416ba89cda4bab35988c4831dd1fda90d Mon Sep 17 00:00:00 2001 From: Julia Radzhabova Date: Wed, 11 Oct 2023 00:21:17 +0300 Subject: [PATCH 13/22] Fix user image in review changes --- .../main/lib/controller/ReviewChanges.js | 25 ++++++++++++++++--- 1 file changed, 21 insertions(+), 4 deletions(-) diff --git a/apps/common/main/lib/controller/ReviewChanges.js b/apps/common/main/lib/controller/ReviewChanges.js index 0cc73b7461..9068f31856 100644 --- a/apps/common/main/lib/controller/ReviewChanges.js +++ b/apps/common/main/lib/controller/ReviewChanges.js @@ -122,9 +122,14 @@ define([ Common.NotificationCenter.on('collaboration:sharing', this.changeAccessRights.bind(this)); Common.NotificationCenter.on('collaboration:sharingdeny', this.onLostEditRights.bind(this)); Common.NotificationCenter.on('protect:wslock', _.bind(this.onChangeProtectSheet, this)); + Common.NotificationCenter.on('mentions:setusers', this.avatarsUpdate.bind(this)); + + this.userCollection.on({ + add : _.bind(this.onUpdateUsers, this), + change : _.bind(this.onUpdateUsers, this), + reset : _.bind(this.onUpdateUsers, this) + }); - this.userCollection.on('reset', _.bind(this.onUpdateUsers, this)); - this.userCollection.on('add', _.bind(this.onUpdateUsers, this)); }, setConfig: function (data, api) { this.setApi(api); @@ -322,7 +327,7 @@ define([ // helpers readSDKChange: function (data) { - var me = this, arr = []; + var me = this, arr = [], arrIds = []; _.each(data, function(item) { var changetext = '', proptext = '', value = item.get_Value(), @@ -508,13 +513,14 @@ define([ var date = (item.get_DateTime() == '') ? new Date() : new Date(item.get_DateTime()), user = me.userCollection.findOriginalUser(item.get_UserId()), isProtectedReview = me._state.docProtection.isReviewOnly, + avatar = Common.UI.ExternalUsers.getImage(item.get_UserId()), change = new Common.Models.ReviewChange({ uid : Common.UI.getId(), userid : item.get_UserId(), username : item.get_UserName(), usercolor : (user) ? user.get('color') : null, initials : Common.Utils.getUserInitials(AscCommon.UserInfoParser.getParsedName(item.get_UserName())), - avatar : (user) ? user.get('avatar') : null, + avatar : avatar, date : me.dateToLocaleTimeString(date), changetext : changetext, id : Common.UI.getId(), @@ -530,7 +536,9 @@ define([ }); arr.push(change); + (avatar===undefined) && arrIds.push(item.get_UserId()); }); + arrIds.length && Common.UI.ExternalUsers.get('info', arrIds); return arr; }, @@ -1075,6 +1083,15 @@ define([ }); }, + avatarsUpdate: function(type, users) { + if (type!=='info') return; + + this.popoverChanges && this.popoverChanges.each(function (model) { + var user = _.findWhere(users, {id: model.get('userid')}) + user && user.image && model.set('avatar', user.image); + }); + }, + onAuthParticipantsChanged: function(users) { if (this.view && this.view.btnCompare) { var length = 0; From 673b53e3bf4190886aae588c292bca28569354b3 Mon Sep 17 00:00:00 2001 From: Alexei Koshelev Date: Wed, 11 Oct 2023 15:11:08 +0300 Subject: [PATCH 14/22] [SSE DE PE] Change template for user avatar --- .../main/lib/template/Comments.template | 24 ++++++++++---- .../lib/template/CommentsPopover.template | 32 +++++++++++++------ .../template/ReviewChangesPopover.template | 14 +++++--- apps/common/main/lib/view/Chat.js | 10 ++++-- apps/common/main/lib/view/Header.js | 24 ++++++++------ apps/common/main/resources/less/chat.less | 13 ++++++-- apps/common/main/resources/less/comments.less | 12 +++++-- apps/common/main/resources/less/header.less | 25 ++++++++++++--- 8 files changed, 114 insertions(+), 40 deletions(-) diff --git a/apps/common/main/lib/template/Comments.template b/apps/common/main/lib/template/Comments.template index 0c747184ec..5b0fae5901 100644 --- a/apps/common/main/lib/template/Comments.template +++ b/apps/common/main/lib/template/Comments.template @@ -4,13 +4,19 @@
  • " class="<% if (!user.get("online")) { %> offline <% } if (user.get("view")) {%> viewmode <% } %>">' + '
    ' + - '
    ' + - 'style="background-image: url(<%=user.get("avatar")%>); <% if (user.get("color")!==null) { %> border-color:<%=user.get("color")%>; border-style: solid;<% }%>"' + - '<% } else { %>' + - 'style="background-color: <% if (user.get("color")!==null) { %> <%=user.get("color")%> <% } else { %> #cfcfcf <% }%>;"' + - '<% } %>' + - '><% if (!user.get("avatar")) { %><%=user.get("initials")%><% } %>
    ' + + '
    '+ + 'style="<% if (user.get("color")!==null) { %> border-color:<%=user.get("color")%>; border-style:solid;<% }%>"'+ + '<% } else { %>'+ + 'style="background-color: <% if (user.get("color")!==null) { %> <%=user.get("color")%> <% } else { %> #cfcfcf <% }%>;"'+ + '<% } %>'+ + '>'+ + '<% if (user.get("avatar")) { %>'+ + '" />'+ + '<% } else { %>'+ + '<%=user.get("initials")%>'+ + '<% } %>'+ + '
    '+ '' + '<% if (len>1) { %><% } %>' + '
    '+ @@ -862,8 +868,8 @@ define([ updateAvatarEl(){ if(this.options.userAvatar){ - $btnUserName.css({'background-image': 'url('+ this.options.userAvatar +')'}); - $btnUserName.text(''); + $btnUserName.css({'background': 'none'}); + $btnUserName.html(''); } else { $btnUserName.text(Common.Utils.getUserInitials(this.options.userName)); } diff --git a/apps/common/main/resources/less/chat.less b/apps/common/main/resources/less/chat.less index 26958947a9..08b325a65f 100644 --- a/apps/common/main/resources/less/chat.less +++ b/apps/common/main/resources/less/chat.less @@ -132,6 +132,7 @@ } .color { + position: relative; display: inline-block; width: 26px; height: 26px; @@ -139,8 +140,7 @@ border-width: @scaled-two-px-value; margin-right: 8px; vertical-align: middle; - background-size: cover; - background-position: center; + overflow: hidden; text-align: center; line-height: 26px; @@ -151,6 +151,15 @@ margin-right: 0px; margin-left: 8px; } + + + img { + position: absolute; + width: 100%; + height: 100%; + top: 0; + left: 0; + } } .user-content { diff --git a/apps/common/main/resources/less/comments.less b/apps/common/main/resources/less/comments.less index f61b59904a..fd35520fc5 100644 --- a/apps/common/main/resources/less/comments.less +++ b/apps/common/main/resources/less/comments.less @@ -194,6 +194,7 @@ } .color { + position: relative; display: inline-block; width: 26px; height: 26px; @@ -201,8 +202,7 @@ border-width: @scaled-two-px-value; margin-right: 8px; vertical-align: middle; - background-size: cover; - background-position: center; + overflow: hidden; text-align: center; line-height: 26px; @@ -213,6 +213,14 @@ margin-right: 0px; margin-left: 8px; } + + img { + position: absolute; + width: 100%; + height: 100%; + top: 0; + left: 0; + } } .user-name-colored { diff --git a/apps/common/main/resources/less/header.less b/apps/common/main/resources/less/header.less index 3628237b1f..de951c704c 100644 --- a/apps/common/main/resources/less/header.less +++ b/apps/common/main/resources/less/header.less @@ -392,6 +392,7 @@ } .color-user-name { + position: relative; width: 20px; height: 20px; border-radius: 20px; @@ -399,16 +400,22 @@ background-color: @icon-toolbar-header; color: @toolbar-header-text-on-background-ie; color: @toolbar-header-text-on-background; - vertical-align: middle; - background-size: cover; - background-position: center; font-size: 10px; line-height: 20px; overflow: hidden; margin: 0 6px; text-align: center; + + img { + position: absolute; + width: 100%; + height: 100%; + top: 0; + left: 0; + } } + } .cousers-menu { @@ -462,19 +469,27 @@ } .color { + position: relative; width: 26px; height: 26px; border-radius: 20px; border-width: @scaled-two-px-value; display: inline-block; vertical-align: middle; - background-size: cover; - background-position: center; + overflow: hidden; .margin-right-8(); line-height: 26px; color: #ffffff; text-align: center; + + img { + position: absolute; + width: 100%; + height: 100%; + top: 0; + left: 0; + } } .user-name { From 97659356a66ececf27e1730a22f9f59cf6b19e77 Mon Sep 17 00:00:00 2001 From: Alexei Koshelev Date: Wed, 11 Oct 2023 18:56:14 +0300 Subject: [PATCH 15/22] [SSE DE PE] Add avatar in version history --- apps/common/main/lib/view/History.js | 16 ++++++++++-- apps/common/main/resources/less/history.less | 25 +++++++++++++------ .../main/app/controller/Main.js | 4 +++ .../main/app/controller/Main.js | 4 +++ .../main/app/controller/Main.js | 4 +++ 5 files changed, 44 insertions(+), 9 deletions(-) diff --git a/apps/common/main/lib/view/History.js b/apps/common/main/lib/view/History.js index aa0172b25f..ca4a0f9023 100644 --- a/apps/common/main/lib/view/History.js +++ b/apps/common/main/lib/view/History.js @@ -91,8 +91,20 @@ define([ '
    ', '<% } %>', '
    ', - '
    ', - '
    <%= Common.Utils.String.htmlEncode(AscCommon.UserInfoParser.getParsedName(username)) %>', + '
    ', + 'style="<% if (usercolor !== null) { %> border-color:<%=usercolor%>; border-style:solid;<% }%>"', + '<% } else { %>', + 'style="background-color: <% if (usercolor !== null) { %> <%=usercolor%> <% } else { %> #cfcfcf <% }%>;"', + '<% } %>', + '>', + '<% if (avatar) { %>', + '', + '<% } else { %>', + '<%=initials%>', + '<% } %>', + '
    ', + '<%= Common.Utils.String.htmlEncode(AscCommon.UserInfoParser.getParsedName(username)) %>', '
    ', '<% if (canRestore && selected) { %>', '', diff --git a/apps/common/main/resources/less/history.less b/apps/common/main/resources/less/history.less index 1ae582bcb7..9be0484c0b 100644 --- a/apps/common/main/resources/less/history.less +++ b/apps/common/main/resources/less/history.less @@ -139,15 +139,26 @@ } .color { - width: 12px; - height: 12px; - border: @scaled-one-px-value-ie solid @border-toolbar-ie; - border: @scaled-one-px-value solid @border-toolbar; - margin: 0 5px 3px 0; + position: relative; + width: 26px; + height: 26px; + border-radius: 20px; + border-width: @scaled-two-px-value; + display: inline-block; vertical-align: middle; + overflow: hidden; + .margin-right-8(); - .rtl & { - margin: 0 0 3px 5px; + color: #ffffff; + line-height: 26px; + text-align: center; + + img { + position: absolute; + width: 100%; + height: 100%; + top: 0; + left: 0; } } diff --git a/apps/documenteditor/main/app/controller/Main.js b/apps/documenteditor/main/app/controller/Main.js index cfec44cb3a..d8d8979719 100644 --- a/apps/documenteditor/main/app/controller/Main.js +++ b/apps/documenteditor/main/app/controller/Main.js @@ -721,6 +721,8 @@ define([ userid : version.user.id, username : version.user.name || this.textAnonymous, usercolor: user.get('color'), + initials : Common.Utils.getUserInitials(AscCommon.UserInfoParser.getParsedName(version.user.name || this.textAnonymous)), + avatar : undefined, created: version.created, docId: version.key, markedAsVersion: (group!==version.versionGroup), @@ -771,6 +773,8 @@ define([ userid : change.user.id, username : change.user.name || this.textAnonymous, usercolor: user.get('color'), + initials : Common.Utils.getUserInitials(AscCommon.UserInfoParser.getParsedName(change.user.name || this.textAnonymous)), + avatar : undefined, created: change.created, docId: version.key, docIdPrev: docIdPrev, diff --git a/apps/presentationeditor/main/app/controller/Main.js b/apps/presentationeditor/main/app/controller/Main.js index 4d2c6ecdb6..7317cfe9b2 100644 --- a/apps/presentationeditor/main/app/controller/Main.js +++ b/apps/presentationeditor/main/app/controller/Main.js @@ -2637,6 +2637,8 @@ define([ userid : version.user.id, username : version.user.name, usercolor: user.get('color'), + initials : Common.Utils.getUserInitials(AscCommon.UserInfoParser.getParsedName(version.user.name || this.textAnonymous)), + avatar : undefined, created: version.created, docId: version.key, markedAsVersion: (group!==version.versionGroup), @@ -2687,6 +2689,8 @@ define([ userid : change.user.id, username : change.user.name, usercolor: user.get('color'), + initials : Common.Utils.getUserInitials(AscCommon.UserInfoParser.getParsedName(change.user.name || this.textAnonymous)), + avatar : undefined, created: change.created, docId: version.key, docIdPrev: docIdPrev, diff --git a/apps/spreadsheeteditor/main/app/controller/Main.js b/apps/spreadsheeteditor/main/app/controller/Main.js index f45744fc96..78ebace5b6 100644 --- a/apps/spreadsheeteditor/main/app/controller/Main.js +++ b/apps/spreadsheeteditor/main/app/controller/Main.js @@ -3252,6 +3252,8 @@ define([ userid : version.user.id, username : version.user.name, usercolor: user.get('color'), + initials : Common.Utils.getUserInitials(AscCommon.UserInfoParser.getParsedName(version.user.name || this.textAnonymous)), + avatar : undefined, created: version.created, docId: version.key, markedAsVersion: (group!==version.versionGroup), @@ -3302,6 +3304,8 @@ define([ userid : change.user.id, username : change.user.name, usercolor: user.get('color'), + initials : Common.Utils.getUserInitials(AscCommon.UserInfoParser.getParsedName(change.user.name || this.textAnonymous)), + avatar : undefined, created: change.created, docId: version.key, docIdPrev: docIdPrev, From 1bee469c6e14bde2739e53544e688603ab38ff66 Mon Sep 17 00:00:00 2001 From: Julia Radzhabova Date: Wed, 11 Oct 2023 23:12:57 +0300 Subject: [PATCH 16/22] Load user images for version history --- apps/documenteditor/main/app/controller/Main.js | 14 +++++++++----- .../presentationeditor/main/app/controller/Main.js | 14 +++++++++----- apps/spreadsheeteditor/main/app/controller/Main.js | 14 +++++++++----- 3 files changed, 27 insertions(+), 15 deletions(-) diff --git a/apps/documenteditor/main/app/controller/Main.js b/apps/documenteditor/main/app/controller/Main.js index 7ebdfac281..b7f11299e9 100644 --- a/apps/documenteditor/main/app/controller/Main.js +++ b/apps/documenteditor/main/app/controller/Main.js @@ -692,7 +692,8 @@ define([ this._renameDialog && this._renameDialog.close(); var versions = opts.data.history, historyStore = this.getApplication().getCollection('Common.Collections.HistoryVersions'), - currentVersion = null; + currentVersion = null, + arrIds = []; if (historyStore) { var arrVersions = [], ver, version, group = -1, prev_ver = -1, arrColors = [], docIdPrev = '', usersStore = this.getApplication().getCollection('Common.Collections.HistoryUsers'), user = null, usersCnt = 0; @@ -714,7 +715,8 @@ define([ }); usersStore.add(user); } - + var avatar = Common.UI.ExternalUsers.getImage(version.user.id); + (avatar===undefined) && arrIds.push(version.user.id); arrVersions.push(new Common.Models.HistoryVersion({ version: version.versionGroup, revision: version.version, @@ -722,7 +724,7 @@ define([ username : version.user.name || this.textAnonymous, usercolor: user.get('color'), initials : Common.Utils.getUserInitials(AscCommon.UserInfoParser.getParsedName(version.user.name || this.textAnonymous)), - avatar : undefined, + avatar : avatar, created: version.created, docId: version.key, markedAsVersion: (group!==version.versionGroup), @@ -765,7 +767,8 @@ define([ }); usersStore.add(user); } - + avatar = Common.UI.ExternalUsers.getImage(change.user.id); + (avatar===undefined) && arrIds.push(change.user.id); arrVersions.push(new Common.Models.HistoryVersion({ version: version.versionGroup, revision: version.version, @@ -774,7 +777,7 @@ define([ username : change.user.name || this.textAnonymous, usercolor: user.get('color'), initials : Common.Utils.getUserInitials(AscCommon.UserInfoParser.getParsedName(change.user.name || this.textAnonymous)), - avatar : undefined, + avatar : avatar, created: change.created, docId: version.key, docIdPrev: docIdPrev, @@ -807,6 +810,7 @@ define([ } if (currentVersion) this.getApplication().getController('Common.Controllers.History').onSelectRevision(null, null, currentVersion); + arrIds.length && Common.UI.ExternalUsers.get('info', arrIds); } } }, diff --git a/apps/presentationeditor/main/app/controller/Main.js b/apps/presentationeditor/main/app/controller/Main.js index 25fc78b420..b8a7ea2d49 100644 --- a/apps/presentationeditor/main/app/controller/Main.js +++ b/apps/presentationeditor/main/app/controller/Main.js @@ -2611,7 +2611,8 @@ define([ this._renameDialog && this._renameDialog.close(); var versions = opts.data.history, historyStore = this.getApplication().getCollection('Common.Collections.HistoryVersions'), - currentVersion = null; + currentVersion = null, + arrIds = []; if (historyStore) { var arrVersions = [], ver, version, group = -1, prev_ver = -1, arrColors = [], docIdPrev = '', usersStore = this.getApplication().getCollection('Common.Collections.HistoryUsers'), user = null, usersCnt = 0; @@ -2633,7 +2634,8 @@ define([ }); usersStore.add(user); } - + var avatar = Common.UI.ExternalUsers.getImage(version.user.id); + (avatar===undefined) && arrIds.push(version.user.id); arrVersions.push(new Common.Models.HistoryVersion({ version: version.versionGroup, revision: version.version, @@ -2641,7 +2643,7 @@ define([ username : version.user.name, usercolor: user.get('color'), initials : Common.Utils.getUserInitials(AscCommon.UserInfoParser.getParsedName(version.user.name || this.textAnonymous)), - avatar : undefined, + avatar : avatar, created: version.created, docId: version.key, markedAsVersion: (group!==version.versionGroup), @@ -2684,7 +2686,8 @@ define([ }); usersStore.add(user); } - + avatar = Common.UI.ExternalUsers.getImage(change.user.id); + (avatar===undefined) && arrIds.push(change.user.id); arrVersions.push(new Common.Models.HistoryVersion({ version: version.versionGroup, revision: version.version, @@ -2693,7 +2696,7 @@ define([ username : change.user.name, usercolor: user.get('color'), initials : Common.Utils.getUserInitials(AscCommon.UserInfoParser.getParsedName(change.user.name || this.textAnonymous)), - avatar : undefined, + avatar : avatar, created: change.created, docId: version.key, docIdPrev: docIdPrev, @@ -2726,6 +2729,7 @@ define([ } if (currentVersion) this.getApplication().getController('Common.Controllers.History').onSelectRevision(null, null, currentVersion); + arrIds.length && Common.UI.ExternalUsers.get('info', arrIds); } } }, diff --git a/apps/spreadsheeteditor/main/app/controller/Main.js b/apps/spreadsheeteditor/main/app/controller/Main.js index 21b76cbb16..c17e3d495e 100644 --- a/apps/spreadsheeteditor/main/app/controller/Main.js +++ b/apps/spreadsheeteditor/main/app/controller/Main.js @@ -3226,7 +3226,8 @@ define([ this._renameDialog && this._renameDialog.close(); var versions = opts.data.history, historyStore = this.getApplication().getCollection('Common.Collections.HistoryVersions'), - currentVersion = null; + currentVersion = null, + arrIds = []; if (historyStore) { var arrVersions = [], ver, version, group = -1, prev_ver = -1, arrColors = [], docIdPrev = '', usersStore = this.getApplication().getCollection('Common.Collections.HistoryUsers'), user = null, usersCnt = 0; @@ -3248,7 +3249,8 @@ define([ }); usersStore.add(user); } - + var avatar = Common.UI.ExternalUsers.getImage(version.user.id); + (avatar===undefined) && arrIds.push(version.user.id); arrVersions.push(new Common.Models.HistoryVersion({ version: version.versionGroup, revision: version.version, @@ -3256,7 +3258,7 @@ define([ username : version.user.name, usercolor: user.get('color'), initials : Common.Utils.getUserInitials(AscCommon.UserInfoParser.getParsedName(version.user.name || this.textAnonymous)), - avatar : undefined, + avatar : avatar, created: version.created, docId: version.key, markedAsVersion: (group!==version.versionGroup), @@ -3299,7 +3301,8 @@ define([ }); usersStore.add(user); } - + avatar = Common.UI.ExternalUsers.getImage(change.user.id); + (avatar===undefined) && arrIds.push(change.user.id); arrVersions.push(new Common.Models.HistoryVersion({ version: version.versionGroup, revision: version.version, @@ -3308,7 +3311,7 @@ define([ username : change.user.name, usercolor: user.get('color'), initials : Common.Utils.getUserInitials(AscCommon.UserInfoParser.getParsedName(change.user.name || this.textAnonymous)), - avatar : undefined, + avatar : avatar, created: change.created, docId: version.key, docIdPrev: docIdPrev, @@ -3341,6 +3344,7 @@ define([ } // if (currentVersion) // this.getApplication().getController('Common.Controllers.History').onSelectRevision(null, null, currentVersion); + arrIds.length && Common.UI.ExternalUsers.get('info', arrIds); } } }, From b34aa484378c2447b79e4409433a3d27317efe53 Mon Sep 17 00:00:00 2001 From: Julia Radzhabova Date: Thu, 12 Oct 2023 00:38:15 +0300 Subject: [PATCH 17/22] Load users images for comments --- apps/common/main/lib/controller/Comments.js | 118 +++++++++++++++----- 1 file changed, 90 insertions(+), 28 deletions(-) diff --git a/apps/common/main/lib/controller/Comments.js b/apps/common/main/lib/controller/Comments.js index 8e81f8f1e3..d18bbcc04e 100644 --- a/apps/common/main/lib/controller/Comments.js +++ b/apps/common/main/lib/controller/Comments.js @@ -176,6 +176,7 @@ define([ this.userCollection = this.getApplication().getCollection('Common.Collections.Users'); this.userCollection.on('reset', _.bind(this.onUpdateUsers, this)); this.userCollection.on('add', _.bind(this.onUpdateUsers, this)); + Common.NotificationCenter.on('mentions:setusers', this.avatarsUpdate.bind(this)); this.bindViewEvents(this.view, this.events); }, @@ -743,7 +744,8 @@ define([ // SDK onApiAddComment: function (id, data) { - var comment = this.readSDKComment(id, data); + var requestObj = {}, + comment = this.readSDKComment(id, data, requestObj); if (comment) { if (comment.get('groupName')) { this.addCommentToGroupCollection(comment); @@ -763,15 +765,17 @@ define([ this.showPopover = undefined; this.editPopover = false; } + requestObj.arrIds && requestObj.arrIds.length && Common.UI.ExternalUsers.get('info', requestObj.arrIds); } }, onApiAddComments: function (data) { + var requestObj = {}; for (var i = 0; i < data.length; ++i) { - var comment = this.readSDKComment(data[i].asc_getId(), data[i]); + var comment = this.readSDKComment(data[i].asc_getId(), data[i], requestObj); comment.get('groupName') ? this.addCommentToGroupCollection(comment) : this.collection.push(comment); } - this.updateComments(true, this.getComparator() === 'position-asc' || this.getComparator() === 'position-desc'); + requestObj.arrIds && requestObj.arrIds.length && Common.UI.ExternalUsers.get('info', requestObj.arrIds); }, onApiRemoveComment: function (id, silentUpdate) { for (var name in this.groupCollection) { @@ -833,10 +837,16 @@ define([ date = (data.asc_getOnlyOfficeTime()) ? new Date(this.stringOOToLocalDate(data.asc_getOnlyOfficeTime())) : ((data.asc_getTime() == '') ? new Date() : new Date(this.stringUtcToLocalDate(data.asc_getTime()))); - var user = this.userCollection.findOriginalUser(data.asc_getUserId()); - var needSort = (this.getComparator() == 'author-asc' || this.getComparator() == 'author-desc') && (data.asc_getUserName() !== comment.get('username')); + var userid = data.asc_getUserId(), + user = this.userCollection.findOriginalUser(userid), + avatar = Common.UI.ExternalUsers.getImage(userid), + arrIds = []; + (avatar===undefined) && arrIds.push(userid); + var hideComment = !AscCommon.UserInfoParser.canViewComment(data.asc_getUserName()), + needSort = (this.getComparator() == 'author-asc' || this.getComparator() == 'author-desc') && (data.asc_getUserName() !== comment.get('username')) || + hideComment !== comment.get('hide'); comment.set('comment', data.asc_getText()); - comment.set('userid', data.asc_getUserId()); + comment.set('userid', userid); comment.set('username', data.asc_getUserName()); comment.set('initials', Common.Utils.getUserInitials(AscCommon.UserInfoParser.getParsedName(data.asc_getUserName()))); comment.set('parsedName', AscCommon.UserInfoParser.getParsedName(data.asc_getUserName())); @@ -848,9 +858,9 @@ define([ comment.set('userdata', data.asc_getUserData()); comment.set('time', date.getTime()); comment.set('date', t.dateToLocaleTimeString(date)); - comment.set('editable', (t.mode.canEditComments || (data.asc_getUserId() == t.currentUserId)) && AscCommon.UserInfoParser.canEditComment(data.asc_getUserName())); - comment.set('removable', (t.mode.canDeleteComments || (data.asc_getUserId() == t.currentUserId)) && AscCommon.UserInfoParser.canDeleteComment(data.asc_getUserName())); - comment.set('hide', !AscCommon.UserInfoParser.canViewComment(data.asc_getUserName())); + comment.set('editable', (t.mode.canEditComments || (userid == t.currentUserId)) && AscCommon.UserInfoParser.canEditComment(data.asc_getUserName())); + comment.set('removable', (t.mode.canDeleteComments || (userid == t.currentUserId)) && AscCommon.UserInfoParser.canDeleteComment(data.asc_getUserName())); + comment.set('hide', hideComment); if (!comment.get('hide')) { var usergroups = comment.get('parsedGroups'); @@ -870,15 +880,18 @@ define([ dateReply = (data.asc_getReply(i).asc_getOnlyOfficeTime()) ? new Date(this.stringOOToLocalDate(data.asc_getReply(i).asc_getOnlyOfficeTime())) : ((data.asc_getReply(i).asc_getTime() == '') ? new Date() : new Date(this.stringUtcToLocalDate(data.asc_getReply(i).asc_getTime()))); - user = this.userCollection.findOriginalUser(data.asc_getReply(i).asc_getUserId()); + userid = data.asc_getReply(i).asc_getUserId(); + user = this.userCollection.findOriginalUser(userid); + avatar = Common.UI.ExternalUsers.getImage(userid); + (avatar===undefined) && arrIds.push(userid); replies.push(new Common.Models.Reply({ id : Common.UI.getId(), - userid : data.asc_getReply(i).asc_getUserId(), + userid : userid, username : data.asc_getReply(i).asc_getUserName(), initials : Common.Utils.getUserInitials(AscCommon.UserInfoParser.getParsedName(data.asc_getReply(i).asc_getUserName())), parsedName : AscCommon.UserInfoParser.getParsedName(data.asc_getReply(i).asc_getUserName()), usercolor : (user) ? user.get('color') : null, - avatar : (user) ? user.get('avatar') : null, + avatar : avatar, date : t.dateToLocaleTimeString(dateReply), reply : data.asc_getReply(i).asc_getText(), userdata : data.asc_getReply(i).asc_getUserData(), @@ -887,8 +900,8 @@ define([ editTextInPopover : false, showReplyInPopover : false, scope : t.view, - editable : (t.mode.canEditComments || (data.asc_getReply(i).asc_getUserId() == t.currentUserId)) && AscCommon.UserInfoParser.canEditComment(data.asc_getReply(i).asc_getUserName()), - removable : (t.mode.canDeleteComments || (data.asc_getReply(i).asc_getUserId() == t.currentUserId)) && AscCommon.UserInfoParser.canDeleteComment(data.asc_getReply(i).asc_getUserName()) + editable : (t.mode.canEditComments || (userid == t.currentUserId)) && AscCommon.UserInfoParser.canEditComment(data.asc_getReply(i).asc_getUserName()), + removable : (t.mode.canDeleteComments || (userid == t.currentUserId)) && AscCommon.UserInfoParser.canDeleteComment(data.asc_getReply(i).asc_getUserName()) })); } @@ -906,6 +919,7 @@ define([ // this.api.asc_showComment(id, true); // } } + arrIds.length && Common.UI.ExternalUsers.get('info', arrIds); } }, onApiLockComment: function (id,userId) { @@ -1323,21 +1337,65 @@ define([ }); }, - readSDKComment: function (id, data) { + avatarsUpdate: function(type, users) { + if (type!=='info') return; + + var hasGroup = false, + updateCommentData = function(comment, isNotReply) { + var user = _.findWhere(users, {id: comment.get('userid')}), + needrender = false; + if (user && user.image) { + var avatar = user.image; + if (avatar !== comment.get('avatar')) { + needrender = true; + comment.set('avatar', avatar, {silent: true}); + } + } + + //If a comment and not a reply + if(isNotReply){ + comment.get('replys').forEach(function (reply) { + var needrenderReply = updateCommentData(reply, false); + needrender = needrenderReply || needrender; + }); + + if (needrender) + comment.trigger('change'); + } + + return needrender; + }; + + for (var name in this.groupCollection) { + hasGroup = true; + this.groupCollection[name].each(function (comment) { + updateCommentData(comment, true); + }); + } + !hasGroup && this.collection.each(function (comment) { + updateCommentData(comment, true); + }); + }, + + readSDKComment: function (id, data, requestObj) { + requestObj && !requestObj.arrIds && (requestObj.arrIds = []); var date = (data.asc_getOnlyOfficeTime()) ? new Date(this.stringOOToLocalDate(data.asc_getOnlyOfficeTime())) : ((data.asc_getTime() == '') ? new Date() : new Date(this.stringUtcToLocalDate(data.asc_getTime()))); - var user = this.userCollection.findOriginalUser(data.asc_getUserId()), - groupname = id.substr(0, id.lastIndexOf('_')+1).match(/^(doc|sheet[0-9_]+)_/); + var userid = data.asc_getUserId(), + user = this.userCollection.findOriginalUser(userid), + groupname = id.substr(0, id.lastIndexOf('_')+1).match(/^(doc|sheet[0-9_]+)_/), + avatar = Common.UI.ExternalUsers.getImage(userid); + (avatar===undefined) && requestObj.arrIds.push(userid); var comment = new Common.Models.Comment({ uid : id, guid : data.asc_getGuid(), - userid : data.asc_getUserId(), + userid : userid, username : data.asc_getUserName(), initials : Common.Utils.getUserInitials(AscCommon.UserInfoParser.getParsedName(data.asc_getUserName())), parsedName : AscCommon.UserInfoParser.getParsedName(data.asc_getUserName()), parsedGroups : AscCommon.UserInfoParser.getParsedGroups(data.asc_getUserName()), usercolor : (user) ? user.get('color') : null, - avatar : (user) ? user.get('avatar') : null, + avatar : avatar, date : this.dateToLocaleTimeString(date), quote : data.asc_getQuoteText(), comment : data.asc_getText(), @@ -1353,8 +1411,8 @@ define([ showReplyInPopover : false, hideAddReply : !_.isUndefined(this.hidereply) ? this.hidereply : (this.showPopover ? true : false), scope : this.view, - editable : (this.mode.canEditComments || (data.asc_getUserId() == this.currentUserId)) && AscCommon.UserInfoParser.canEditComment(data.asc_getUserName()), - removable : (this.mode.canDeleteComments || (data.asc_getUserId() == this.currentUserId)) && AscCommon.UserInfoParser.canDeleteComment(data.asc_getUserName()), + editable : (this.mode.canEditComments || (userid == this.currentUserId)) && AscCommon.UserInfoParser.canEditComment(data.asc_getUserName()), + removable : (this.mode.canDeleteComments || (userid == this.currentUserId)) && AscCommon.UserInfoParser.canDeleteComment(data.asc_getUserName()), hide : !AscCommon.UserInfoParser.canViewComment(data.asc_getUserName()), hint : !this.mode.canComments, fullInfoInHint : this.fullInfoHintMode, @@ -1376,7 +1434,8 @@ define([ return comment; }, - readSDKReplies: function (data) { + readSDKReplies: function (data, requestObj) { + requestObj && !requestObj.arrIds && (requestObj.arrIds = []); var i = 0, replies = [], date = null; @@ -1386,15 +1445,18 @@ define([ date = (data.asc_getReply(i).asc_getOnlyOfficeTime()) ? new Date(this.stringOOToLocalDate(data.asc_getReply(i).asc_getOnlyOfficeTime())) : ((data.asc_getReply(i).asc_getTime() == '') ? new Date() : new Date(this.stringUtcToLocalDate(data.asc_getReply(i).asc_getTime()))); - var user = this.userCollection.findOriginalUser(data.asc_getReply(i).asc_getUserId()); + var userid = data.asc_getReply(i).asc_getUserId(), + user = this.userCollection.findOriginalUser(userid), + avatar = Common.UI.ExternalUsers.getImage(userid); + (avatar===undefined) && requestObj.arrIds.push(userid); replies.push(new Common.Models.Reply({ id : Common.UI.getId(), - userid : data.asc_getReply(i).asc_getUserId(), + userid : userid, username : data.asc_getReply(i).asc_getUserName(), initials : Common.Utils.getUserInitials(AscCommon.UserInfoParser.getParsedName(data.asc_getReply(i).asc_getUserName())), parsedName : AscCommon.UserInfoParser.getParsedName(data.asc_getReply(i).asc_getUserName()), usercolor : (user) ? user.get('color') : null, - avatar : (user) ? user.get('avatar') : null, + avatar : avatar, date : this.dateToLocaleTimeString(date), reply : data.asc_getReply(i).asc_getText(), userdata : data.asc_getReply(i).asc_getUserData(), @@ -1403,8 +1465,8 @@ define([ editTextInPopover : false, showReplyInPopover : false, scope : this.view, - editable : (this.mode.canEditComments || (data.asc_getReply(i).asc_getUserId() == this.currentUserId)) && AscCommon.UserInfoParser.canEditComment(data.asc_getReply(i).asc_getUserName()), - removable : (this.mode.canDeleteComments || (data.asc_getReply(i).asc_getUserId() == this.currentUserId)) && AscCommon.UserInfoParser.canDeleteComment(data.asc_getReply(i).asc_getUserName()) + editable : (this.mode.canEditComments || (userid == this.currentUserId)) && AscCommon.UserInfoParser.canEditComment(data.asc_getReply(i).asc_getUserName()), + removable : (this.mode.canDeleteComments || (userid == this.currentUserId)) && AscCommon.UserInfoParser.canDeleteComment(data.asc_getReply(i).asc_getUserName()) })); } } @@ -1435,7 +1497,7 @@ define([ date: this.dateToLocaleTimeString(date), userid: this.currentUserId, username: AscCommon.UserInfoParser.getCurrentName(), - avatar: user ? user.get('avatar') : null, + avatar: Common.UI.ExternalUsers.getImage(this.currentUserId), initials: Common.Utils.getUserInitials(AscCommon.UserInfoParser.getParsedName(AscCommon.UserInfoParser.getCurrentName())), parsedName: AscCommon.UserInfoParser.getParsedName(AscCommon.UserInfoParser.getCurrentName()), usercolor: (user) ? user.get('color') : null, From a6e2f515699dace029802c3980266c7e3ea4d488 Mon Sep 17 00:00:00 2001 From: Julia Radzhabova Date: Thu, 12 Oct 2023 16:58:39 +0300 Subject: [PATCH 18/22] Fix user image in comments --- apps/common/main/lib/controller/Comments.js | 15 ++++++++------- 1 file changed, 8 insertions(+), 7 deletions(-) diff --git a/apps/common/main/lib/controller/Comments.js b/apps/common/main/lib/controller/Comments.js index d18bbcc04e..793e18f18a 100644 --- a/apps/common/main/lib/controller/Comments.js +++ b/apps/common/main/lib/controller/Comments.js @@ -852,7 +852,7 @@ define([ comment.set('parsedName', AscCommon.UserInfoParser.getParsedName(data.asc_getUserName())); comment.set('parsedGroups', AscCommon.UserInfoParser.getParsedGroups(data.asc_getUserName())); comment.set('usercolor', (user) ? user.get('color') : null); - comment.set('avatar', (user) ? user.get('avatar') : null); + comment.set('avatar', avatar); comment.set('resolved', data.asc_getSolved()); comment.set('quote', data.asc_getQuoteText()); comment.set('userdata', data.asc_getUserData()); @@ -1301,15 +1301,16 @@ define([ hasGroup = false, updateCommentData = function(comment, user, isNotReply) { var color = (user) ? user.get('color') : null, - avatar = (user) ? user.get('avatar') : null, needrender = false; if (color !== comment.get('usercolor')) { needrender = true; comment.set('usercolor', color, {silent: true}); } - if (avatar !== comment.get('avatar')) { - needrender = true; - comment.set('avatar', avatar, {silent: true}); + if (user && user.image) { + if (user.image !== comment.get('avatar')) { + needrender = true; + comment.set('avatar', user.image, {silent: true}); + } } //If a comment and not a reply @@ -1426,7 +1427,7 @@ define([ var filter = !!group && (group!==-1) && (!usergroups || usergroups.length<1 || usergroups.indexOf(group)<0); comment.set('filtered', filter); } - var replies = this.readSDKReplies(data); + var replies = this.readSDKReplies(data, requestObj); if (replies.length) { comment.set('replys', replies); } @@ -1448,7 +1449,7 @@ define([ var userid = data.asc_getReply(i).asc_getUserId(), user = this.userCollection.findOriginalUser(userid), avatar = Common.UI.ExternalUsers.getImage(userid); - (avatar===undefined) && requestObj.arrIds.push(userid); + (avatar===undefined) && requestObj && requestObj.arrIds.push(userid); replies.push(new Common.Models.Reply({ id : Common.UI.getId(), userid : userid, From f7eb7dd48100c9f084bea7318d8cb29f1b5f0271 Mon Sep 17 00:00:00 2001 From: Alexei Koshelev Date: Thu, 12 Oct 2023 18:02:57 +0300 Subject: [PATCH 19/22] Revert "[SSE DE PE] Change template for user avatar" This reverts commit 673b53e3bf4190886aae588c292bca28569354b3. --- .../main/lib/template/Comments.template | 24 ++++---------- .../lib/template/CommentsPopover.template | 32 ++++++------------- .../template/ReviewChangesPopover.template | 14 +++----- apps/common/main/lib/view/Chat.js | 10 ++---- apps/common/main/lib/view/Header.js | 24 ++++++-------- apps/common/main/resources/less/chat.less | 13 ++------ apps/common/main/resources/less/comments.less | 12 ++----- apps/common/main/resources/less/header.less | 25 +++------------ 8 files changed, 40 insertions(+), 114 deletions(-) diff --git a/apps/common/main/lib/template/Comments.template b/apps/common/main/lib/template/Comments.template index 5b0fae5901..0c747184ec 100644 --- a/apps/common/main/lib/template/Comments.template +++ b/apps/common/main/lib/template/Comments.template @@ -4,19 +4,13 @@
  • " class="<% if (!user.get("online")) { %> offline <% } if (user.get("view")) {%> viewmode <% } %>">' + '
    ' + - '
    '+ - 'style="<% if (user.get("color")!==null) { %> border-color:<%=user.get("color")%>; border-style:solid;<% }%>"'+ - '<% } else { %>'+ - 'style="background-color: <% if (user.get("color")!==null) { %> <%=user.get("color")%> <% } else { %> #cfcfcf <% }%>;"'+ - '<% } %>'+ - '>'+ - '<% if (user.get("avatar")) { %>'+ - '" />'+ - '<% } else { %>'+ - '<%=user.get("initials")%>'+ - '<% } %>'+ - '
    '+ + '
    ' + + 'style="background-image: url(<%=user.get("avatar")%>); <% if (user.get("color")!==null) { %> border-color:<%=user.get("color")%>; border-style: solid;<% }%>"' + + '<% } else { %>' + + 'style="background-color: <% if (user.get("color")!==null) { %> <%=user.get("color")%> <% } else { %> #cfcfcf <% }%>;"' + + '<% } %>' + + '><% if (!user.get("avatar")) { %><%=user.get("initials")%><% } %>
    ' + '' + '<% if (len>1) { %><% } %>' + '
    '+ @@ -873,8 +867,8 @@ define([ updateAvatarEl(){ if(this.options.userAvatar){ - $btnUserName.css({'background': 'none'}); - $btnUserName.html(''); + $btnUserName.css({'background-image': 'url('+ this.options.userAvatar +')'}); + $btnUserName.text(''); } else { $btnUserName.text(Common.Utils.getUserInitials(this.options.userName)); } diff --git a/apps/common/main/resources/less/chat.less b/apps/common/main/resources/less/chat.less index 08b325a65f..26958947a9 100644 --- a/apps/common/main/resources/less/chat.less +++ b/apps/common/main/resources/less/chat.less @@ -132,7 +132,6 @@ } .color { - position: relative; display: inline-block; width: 26px; height: 26px; @@ -140,7 +139,8 @@ border-width: @scaled-two-px-value; margin-right: 8px; vertical-align: middle; - overflow: hidden; + background-size: cover; + background-position: center; text-align: center; line-height: 26px; @@ -151,15 +151,6 @@ margin-right: 0px; margin-left: 8px; } - - - img { - position: absolute; - width: 100%; - height: 100%; - top: 0; - left: 0; - } } .user-content { diff --git a/apps/common/main/resources/less/comments.less b/apps/common/main/resources/less/comments.less index fd35520fc5..f61b59904a 100644 --- a/apps/common/main/resources/less/comments.less +++ b/apps/common/main/resources/less/comments.less @@ -194,7 +194,6 @@ } .color { - position: relative; display: inline-block; width: 26px; height: 26px; @@ -202,7 +201,8 @@ border-width: @scaled-two-px-value; margin-right: 8px; vertical-align: middle; - overflow: hidden; + background-size: cover; + background-position: center; text-align: center; line-height: 26px; @@ -213,14 +213,6 @@ margin-right: 0px; margin-left: 8px; } - - img { - position: absolute; - width: 100%; - height: 100%; - top: 0; - left: 0; - } } .user-name-colored { diff --git a/apps/common/main/resources/less/header.less b/apps/common/main/resources/less/header.less index de951c704c..3628237b1f 100644 --- a/apps/common/main/resources/less/header.less +++ b/apps/common/main/resources/less/header.less @@ -392,7 +392,6 @@ } .color-user-name { - position: relative; width: 20px; height: 20px; border-radius: 20px; @@ -400,22 +399,16 @@ background-color: @icon-toolbar-header; color: @toolbar-header-text-on-background-ie; color: @toolbar-header-text-on-background; + vertical-align: middle; + background-size: cover; + background-position: center; font-size: 10px; line-height: 20px; overflow: hidden; margin: 0 6px; text-align: center; - - img { - position: absolute; - width: 100%; - height: 100%; - top: 0; - left: 0; - } } - } .cousers-menu { @@ -469,27 +462,19 @@ } .color { - position: relative; width: 26px; height: 26px; border-radius: 20px; border-width: @scaled-two-px-value; display: inline-block; vertical-align: middle; - overflow: hidden; + background-size: cover; + background-position: center; .margin-right-8(); line-height: 26px; color: #ffffff; text-align: center; - - img { - position: absolute; - width: 100%; - height: 100%; - top: 0; - left: 0; - } } .user-name { From e8fdf7db2882e53f7f4d34731a4ae10e19f88e3a Mon Sep 17 00:00:00 2001 From: Alexei Koshelev Date: Thu, 12 Oct 2023 18:54:29 +0300 Subject: [PATCH 20/22] [SSE DE PE] Change template for user avatar in version history --- apps/common/main/lib/view/History.js | 12 +++--------- apps/common/main/resources/less/chat.less | 1 + apps/common/main/resources/less/comments.less | 1 + apps/common/main/resources/less/header.less | 1 + apps/common/main/resources/less/history.less | 17 +++++------------ 5 files changed, 11 insertions(+), 21 deletions(-) diff --git a/apps/common/main/lib/view/History.js b/apps/common/main/lib/view/History.js index ca4a0f9023..11292eef9b 100644 --- a/apps/common/main/lib/view/History.js +++ b/apps/common/main/lib/view/History.js @@ -93,17 +93,11 @@ define([ '
    ', '
    ', - 'style="<% if (usercolor !== null) { %> border-color:<%=usercolor%>; border-style:solid;<% }%>"', + 'style="background-image: url(<%=avatar%>); <% if (usercolor!==null) { %> border-color:<%=usercolor%>; border-style:solid;<% }%>"', '<% } else { %>', - 'style="background-color: <% if (usercolor !== null) { %> <%=usercolor%> <% } else { %> #cfcfcf <% }%>;"', + 'style="background-color: <% if (usercolor!==null) { %> <%=usercolor%> <% } else { %> #cfcfcf <% }%>;"', '<% } %>', - '>', - '<% if (avatar) { %>', - '', - '<% } else { %>', - '<%=initials%>', - '<% } %>', - '
    ', + '><% if (!avatar) { %><%=initials%><% } %>
    ', '<%= Common.Utils.String.htmlEncode(AscCommon.UserInfoParser.getParsedName(username)) %>', '
    • ', '<% if (canRestore && selected) { %>', diff --git a/apps/common/main/resources/less/chat.less b/apps/common/main/resources/less/chat.less index 26958947a9..1a8cf629d1 100644 --- a/apps/common/main/resources/less/chat.less +++ b/apps/common/main/resources/less/chat.less @@ -139,6 +139,7 @@ border-width: @scaled-two-px-value; margin-right: 8px; vertical-align: middle; + background-color: #ffffff; background-size: cover; background-position: center; diff --git a/apps/common/main/resources/less/comments.less b/apps/common/main/resources/less/comments.less index f61b59904a..74f988d27f 100644 --- a/apps/common/main/resources/less/comments.less +++ b/apps/common/main/resources/less/comments.less @@ -201,6 +201,7 @@ border-width: @scaled-two-px-value; margin-right: 8px; vertical-align: middle; + background-color: #ffffff; background-size: cover; background-position: center; diff --git a/apps/common/main/resources/less/header.less b/apps/common/main/resources/less/header.less index 3628237b1f..890af29f84 100644 --- a/apps/common/main/resources/less/header.less +++ b/apps/common/main/resources/less/header.less @@ -468,6 +468,7 @@ border-width: @scaled-two-px-value; display: inline-block; vertical-align: middle; + background-color: #ffffff; background-size: cover; background-position: center; .margin-right-8(); diff --git a/apps/common/main/resources/less/history.less b/apps/common/main/resources/less/history.less index 9be0484c0b..610722aa24 100644 --- a/apps/common/main/resources/less/history.less +++ b/apps/common/main/resources/less/history.less @@ -139,27 +139,20 @@ } .color { - position: relative; + display: inline-block; width: 26px; height: 26px; border-radius: 20px; border-width: @scaled-two-px-value; - display: inline-block; - vertical-align: middle; - overflow: hidden; .margin-right-8(); + vertical-align: middle; + background-color: #ffffff; + background-size: cover; + background-position: center; color: #ffffff; line-height: 26px; text-align: center; - - img { - position: absolute; - width: 100%; - height: 100%; - top: 0; - left: 0; - } } .revision-expand { From de308395de85385bf0cb356d01feadcb9dcc1467 Mon Sep 17 00:00:00 2001 From: Julia Radzhabova Date: Fri, 13 Oct 2023 14:47:36 +0300 Subject: [PATCH 21/22] Fix user images in chat --- apps/api/documents/api.js | 2 +- apps/common/main/lib/controller/Chat.js | 15 ++++++++++++--- apps/common/main/lib/controller/Comments.js | 4 ++-- apps/common/main/lib/controller/ReviewChanges.js | 4 ++-- apps/common/main/lib/view/Chat.js | 13 +++++++++++-- 5 files changed, 28 insertions(+), 10 deletions(-) diff --git a/apps/api/documents/api.js b/apps/api/documents/api.js index c1f3efe058..1204d5f51e 100644 --- a/apps/api/documents/api.js +++ b/apps/api/documents/api.js @@ -822,7 +822,7 @@ setReferenceData : _setReferenceData, setRequestedDocument: _setRequestedDocument, setRequestedSpreadsheet: _setRequestedSpreadsheet, - setReferenceSource: _setReferenceSource, + setReferenceSource: _setReferenceSource } }; diff --git a/apps/common/main/lib/controller/Chat.js b/apps/common/main/lib/controller/Chat.js index 92ba591ac3..2f717bcd19 100644 --- a/apps/common/main/lib/controller/Chat.js +++ b/apps/common/main/lib/controller/Chat.js @@ -202,14 +202,23 @@ define([ avatarsUpdate: function(type, users) { if (type!=='info') return; - var usersStore = this.getApplication().getCollection('Common.Collections.Users'); - if (usersStore && users && users.length>0 ){ + var usersStore = this.getApplication().getCollection('Common.Collections.Users'), + msgStore = this.getApplication().getCollection('Common.Collections.ChatMessages'), + needrender = false; + if (users && users.length>0 ){ _.each(users, function(item) { - usersStore.findOriginalUsers(item.id).forEach(function(user){ + usersStore && usersStore.findOriginalUsers(item.id).forEach(function(user){ user.set({avatar: item.image}); }); + msgStore && msgStore.where({userid: item.id}).forEach(function(msg){ + if (item.image!==undefined && item.image !== msg.get('avatar')) { + needrender = true; + msg.set('avatar', item.image, {silent: true}); + } + }); }); } + needrender && this.panelChat && this.panelChat.renderMessages(); }, onReceiveMessage: function(messages, clear){ diff --git a/apps/common/main/lib/controller/Comments.js b/apps/common/main/lib/controller/Comments.js index 793e18f18a..4d7f7f7f77 100644 --- a/apps/common/main/lib/controller/Comments.js +++ b/apps/common/main/lib/controller/Comments.js @@ -1306,7 +1306,7 @@ define([ needrender = true; comment.set('usercolor', color, {silent: true}); } - if (user && user.image) { + if (user && (user.image!==undefined)) { if (user.image !== comment.get('avatar')) { needrender = true; comment.set('avatar', user.image, {silent: true}); @@ -1345,7 +1345,7 @@ define([ updateCommentData = function(comment, isNotReply) { var user = _.findWhere(users, {id: comment.get('userid')}), needrender = false; - if (user && user.image) { + if (user && (user.image!==undefined)) { var avatar = user.image; if (avatar !== comment.get('avatar')) { needrender = true; diff --git a/apps/common/main/lib/controller/ReviewChanges.js b/apps/common/main/lib/controller/ReviewChanges.js index 9068f31856..3aed1a14a7 100644 --- a/apps/common/main/lib/controller/ReviewChanges.js +++ b/apps/common/main/lib/controller/ReviewChanges.js @@ -1079,7 +1079,7 @@ define([ this.popoverChanges && this.popoverChanges.each(function (model) { var user = users.findOriginalUser(model.get('userid')); model.set('usercolor', (user) ? user.get('color') : null); - model.set('avatar', (user) ? user.get('avatar') : null); + user && user.get('avatar') && model.set('avatar', user.get('avatar')); }); }, @@ -1088,7 +1088,7 @@ define([ this.popoverChanges && this.popoverChanges.each(function (model) { var user = _.findWhere(users, {id: model.get('userid')}) - user && user.image && model.set('avatar', user.image); + user && (user.image!==undefined) && model.set('avatar', user.image); }); }, diff --git a/apps/common/main/lib/view/Chat.js b/apps/common/main/lib/view/Chat.js index 11e5ce9e28..033ab7567b 100644 --- a/apps/common/main/lib/view/Chat.js +++ b/apps/common/main/lib/view/Chat.js @@ -205,6 +205,13 @@ define([ } }, + renderMessages: function() { + if (this.panelMessages && this.storeMessages) { + this.panelMessages.html(this.templateMsgList({messages: this.storeMessages.models, msgtpl: this.tplMsg, scope: this})); + this.panelMessages.scroller.update({minScrollbarLength : 40, alwaysVisibleY: true}); + } + }, + _onBtnAddMessage: function(e) { if (this.txtMessage) { this.fireEvent('message:add', [this, this.txtMessage.val().trim()]); @@ -214,13 +221,15 @@ define([ }, _prepareMessage: function(m) { - var user = this.storeUsers.findOriginalUser(m.get('userid')); + var user = this.storeUsers.findOriginalUser(m.get('userid')), + avatar = Common.UI.ExternalUsers.getImage(m.get('userid')); m.set({ usercolor : user ? user.get('color') : null, - avatar : user ? user.get('avatar') : null, + avatar : avatar, initials : user ? user.get('initials') : Common.Utils.getUserInitials(m.get('parsedName')), message : this._pickLink(m.get('message')) }, {silent:true}); + (avatar===undefined) && Common.UI.ExternalUsers.get('info', [m.get('userid')]); }, _pickLink: function(message) { From 617d11f6a94e8dd72ece96fb6b36ea0dde31a5f3 Mon Sep 17 00:00:00 2001 From: Julia Radzhabova Date: Fri, 13 Oct 2023 15:57:38 +0300 Subject: [PATCH 22/22] Refactoring --- apps/documenteditor/main/app/controller/Main.js | 1 - 1 file changed, 1 deletion(-) diff --git a/apps/documenteditor/main/app/controller/Main.js b/apps/documenteditor/main/app/controller/Main.js index b7f11299e9..64ad60f865 100644 --- a/apps/documenteditor/main/app/controller/Main.js +++ b/apps/documenteditor/main/app/controller/Main.js @@ -500,7 +500,6 @@ define([ _user.put_Id(this.appOptions.user.id); _user.put_FullName(this.appOptions.user.fullname); _user.put_IsAnonymousUser(!!this.appOptions.user.anonymous); - // this.appOptions.user.image && _user.put_UserImage(this.appOptions.user.image); docInfo = new Asc.asc_CDocInfo(); docInfo.put_Id(data.doc.key);