github/overleaf
1
0
Fork 0
mirror of https://github.com/overleaf/overleaf.git synced 2024-11-21 20:47:08 -05:00
Code Issues Projects Releases Packages Wiki Activity

Group online users into dropdown menu when more than 3

Browse source
This commit is contained in:
James Allen 2015-09-02 14:31:52 +01:00
parent 34c8f22dd7
commit 7446572ed9
3 changed files with 59 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

19
services/web/app/views/project/editor/header.jade
View file

@ -57,6 +57,7 @@ header.toolbar.toolbar-header(ng-cloak, ng-hide="state.loading")
ng-show="onlineUsersArray.length > 0"
ng-controller="OnlineUsersController"
)
span(ng-if="onlineUsersArray.length < 4")
span.online-user(
ng-repeat="user in onlineUsersArray",
ng-style="{ 'background-color': 'hsl({{ getHueForUserId(user.user_id) }}, 70%, 50%)' }",
@ -67,6 +68,24 @@ header.toolbar.toolbar-header(ng-cloak, ng-hide="state.loading")
ng-click="gotoUser(user)"
) {{ user.name.slice(0,1) }}
span.dropdown(dropdown, ng-if="onlineUsersArray.length >= 4")
span.online-user.online-user-multi(
dropdown-toggle,
tooltip="#{translate('connected_users')}",
tooltip-placement="left"
)
strong {{ onlineUsersArray.length }}
i.fa.fa-fw.fa-user
ul.dropdown-menu.pull-right
li.dropdown-header #{translate('connected_users')}
li(ng-repeat="user in onlineUsersArray")
a(href, ng-click="gotoUser(user)")
span.online-user(
ng-style="{ 'background-color': 'hsl({{ getHueForUserId(user.user_id) }}, 70%, 50%)' }"
) {{ user.name.slice(0,1) }}
| {{ user.name }}
a.btn.btn-full-height(
href,
ng-if="permissions.admin",

6
services/web/public/coffee/ide/online-users/OnlineUsersManager.coffee
View file

@ -56,7 +56,11 @@ define [
user.doc = @ide.fileTreeManager.findEntityById(user.doc_id)
if user.name?.trim().length == 0
user.name = user.email
user.name = user.email.trim()
user.initial = user.name?[0]
if !user.initial or user.initial == " "
user.initial = "?"
@$scope.onlineUsersArray.push user

27
services/web/public/stylesheets/app/editor/online-users.less
View file

@ -1,6 +1,8 @@
@online-user-color: rgb(0, 170, 255);
.online-users {
.online-user {
background-color: rgb(0, 170, 255);
background-color: @online-user-color;
width: 24px;
display: inline-block;
height: 24px;
@ -11,4 +13,27 @@
border-radius: 3px;
cursor: pointer;
}
.online-user-multi {
width: auto;
min-width: 24px;
padding-left: 8px;
padding-right: 5px;
}
.dropdown-menu {
a {
// Override toolbar link styles
display: block;
padding: 4px 10px 5px;
margin: 1px 2px;
color: @text-color;
&:hover, &:active {
color: @text-color;
background-color: @gray-lightest;
text-shadow: none;
.box-shadow(none);
}
}
}
}