Lea/web-apps
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

Header: show editing users in format <username>(<opened browser tabs>)

Browse source
This commit is contained in:
Julia Radzhabova 2018-06-05 11:54:49 +03:00
parent 71997cf64e
commit 8212070fa3
4 changed files with 43 additions and 61 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
apps/common/main/lib/collection/Users.js
View file

@ -61,12 +61,11 @@ define([
},
getEditingCount: function() {
var count = 0;
this.each(function(user){
user.get('online') && !user.get('view') && ++count;
});
return this.filter(function(item){return item.get('online') && !item.get('view')}).length;
},
return count;
getEditingOriginalCount: function() {
return this.chain().filter(function(item){return item.get('online') && !item.get('view')}).groupBy(function(item) {return item.get('idOriginal');}).size().value();
},
findUser: function(id) {

2
apps/common/main/lib/controller/ReviewChanges.js
View file

@ -691,7 +691,7 @@ define([
onUpdateUsers: function() {
var users = this.userCollection;
this.popoverChanges.each(function (model) {
this.popoverChanges && this.popoverChanges.each(function (model) {
var user = users.findOriginalUser(model.get('userid'));
model.set('usercolor', (user) ? user.get('color') : null);
});

74
apps/common/main/lib/view/Header.js
View file

@ -57,16 +57,18 @@ define([
var templateUserItem =
'<li id="<%= user.get("iid") %>" class="<% if (!user.get("online")) { %> offline <% } if (user.get("view")) {%> viewmode <% } %>">' +
'<div class="color" style="background-color: <%= user.get("color") %>;" >' +
'<label class="name"><%= fnEncode(user.get("username")) %></label>' +
'</div>' +
'<div class="user-name">' +
'<div class="color" style="background-color: <%= user.get("color") %>;"></div>'+
'<label><%= fnEncode(user.get("username")) %></label>' +
'<% if (len>1) { %><label style="margin-left:3px;">(<%=len%>)</label><% } %>' +
'</div>'+
'</li>';
var templateUserList = _.template(
'<ul>' +
'<% _.each(users, function(item) { %>' +
'<%= usertpl({user: item, fnEncode: fnEncode}) %>' +
'<% }); %>' +
'<% for (originalId in users) { %>' +
'<%= usertpl({user: users[originalId][0], fnEncode: fnEncode, len: users[originalId].length}) %>' +
'<% } %>' +
'</ul>');
var templateRightBox = '<section>' +
@ -115,63 +117,37 @@ define([
'<label id="title-user-name" style="pointer-events: none;"></label>' +
'</section>';
function onAddUser(model, collection, opts) {
if ( $userList ) {
var $ul = $userList.find('ul');
if ( !$ul.length ) {
$userList.html( templateUserList({
users: collection.models,
usertpl: _.template(templateUserItem),
fnEncode: Common.Utils.String.htmlEncode
})
);
} else {
$ul.append( _.template(templateUserItem)({
user: model,
fnEncode: Common.Utils.String.htmlEncode
}) );
}
$userList.scroller && $userList.scroller.update({minScrollbarLength : 40, alwaysVisibleY: true});
}
applyUsers( collection.getEditingCount() );
};
function onUsersChanged(model, collection) {
if (model.changed.online != undefined && $userList) {
$userList.find('#'+ model.get('iid'))[model.changed.online ? 'removeClass' : 'addClass']('offline');
$userList.scroller && $userList.scroller.update({minScrollbarLength : 40, alwaysVisibleY: true});
}
applyUsers(model.collection.getEditingCount());
};
function onResetUsers(collection, opts) {
var usercount = collection.getEditingCount();
if ( $userList ) {
if ( usercount > 1 || usercount > 0 && appConfig && !appConfig.isEdit && !appConfig.canComments) {
$userList.html(templateUserList({
users: collection.models,
users: collection.chain().filter(function(item){return item.get('online') && !item.get('view')}).groupBy(function(item) {return item.get('idOriginal');}).value(),
usertpl: _.template(templateUserItem),
fnEncode: Common.Utils.String.htmlEncode
}));
$userList.scroller = new Common.UI.Scroller({
el: $userList.find('ul'),
useKeyboard: true,
minScrollbarLength: 40,
alwaysVisibleY: true
});
if (!$userList.scroller)
$userList.scroller = new Common.UI.Scroller({
el: $userList.find('ul'),
useKeyboard: true,
minScrollbarLength: 40,
alwaysVisibleY: true
});
$userList.scroller.update({minScrollbarLength : 40, alwaysVisibleY: true});
} else {
$userList.empty();
}
}
applyUsers( usercount );
applyUsers( usercount, collection.getEditingOriginalCount() );
};
function applyUsers(count) {
function onUsersChanged(model) {
onResetUsers(model.collection);
};
function applyUsers(count, originalCount) {
var has_edit_users = count > 1 || count > 0 && appConfig && !appConfig.isEdit && !appConfig.canComments; // has other user(s) who edit document
if ( has_edit_users ) {
$btnUsers
@ -192,7 +168,7 @@ define([
$btnUsers.find('.caption')
.css({'font-size': ((has_edit_users) ? '12px' : '14px'),
'margin-top': ((has_edit_users) ? '0' : '-1px')})
.html((has_edit_users) ? count : '&plus;');
.html((has_edit_users) ? originalCount : '&plus;');
var usertip = $btnUsers.data('bs.tooltip');
if ( usertip ) {
@ -393,7 +369,7 @@ define([
storeUsers = this.options.storeUsers;
storeUsers.bind({
add : onAddUser,
add : onUsersChanged,
change : onUsersChanged,
reset : onResetUsers
});

19
apps/common/main/resources/less/header.less
View file

@ -233,15 +233,22 @@
display: inline-block;
vertical-align: middle;
border: 1px solid @gray-dark;
margin: 0 5px 1px 0;
}
.name {
display: block;
padding-left: 16px;
margin-top: -5px;
.user-name {
color: @gray-deep;
font-size: 12px;
font-weight: bold;
white-space: nowrap;
text-overflow: ellipsis;
vertical-align: middle;
cursor: default;
label {
overflow: hidden;
text-overflow: ellipsis;
vertical-align: middle;
max-width: 200px;
}
}
}
}