summaryrefslogtreecommitdiff
path: root/public
diff options
context:
space:
mode:
authorWu Cheng-Han2015-07-04 22:19:09 +0800
committerWu Cheng-Han2015-07-04 22:19:09 +0800
commit85c67212ad5f5a0d5ceb9104d4ed22d8e8e54457 (patch)
treea2b8efa65663f21e530ebfe32fb649e392e582be /public
parent01685c255fda6e13f1cd2980130d2e388d52125c (diff)
Added profile image on onlineList
Diffstat (limited to 'public')
-rw-r--r--public/css/index.css9
-rw-r--r--public/js/index.js12
2 files changed, 18 insertions, 3 deletions
diff --git a/public/css/index.css b/public/css/index.css
index e1d5745f..b78be36f 100644
--- a/public/css/index.css
+++ b/public/css/index.css
@@ -107,9 +107,16 @@ form,
margin-top: 2px;
}
.ui-user-icon {
- font-size: 20px;
+ width: 20px;
+ height: 20px;
+ display: block;
+ border-radius: 3px;
margin-top: 2px;
+ margin-bottom: 2px;
margin-right: 5px;
+ background-position: center center;
+ background-repeat: no-repeat;
+ background-size: contain;
}
.ui-user-status {
margin-top: 5px;
diff --git a/public/js/index.js b/public/js/index.js
index 4d617adb..bf3a3ab2 100644
--- a/public/js/index.js
+++ b/public/js/index.js
@@ -1112,7 +1112,7 @@ var options = {
item: '<li class="ui-user-item">\
<span class="id" style="display:none;"></span>\
<a href="#">\
- <span class="pull-left"><i class="fa fa-square ui-user-icon"></i></span><span class="ui-user-name name"></span><span class="pull-right"><i class="fa fa-circle ui-user-status"></i></span>\
+ <span class="pull-left"><i class="ui-user-icon"></i></span><span class="ui-user-name name"></span><span class="pull-right"><i class="fa fa-circle ui-user-status"></i></span>\
</a>\
</li>'
};
@@ -1214,7 +1214,14 @@ function renderUserStatusList(list) {
var item = items[j];
var userstatus = $(item.elm).find('.ui-user-status');
var usericon = $(item.elm).find('.ui-user-icon');
- usericon.css('color', item.values().color);
+ if(item.values().login && item.values().photo) {
+ usericon.css('background-image', 'url(' + item.values().photo + ')');
+ usericon.css('box-shadow', '0px 0px 2px ' + item.values().color);
+ //add 1px more to right, make it feel aligned
+ usericon.css('margin-right', '6px');
+ } else {
+ usericon.css('background-color', item.values().color);
+ }
userstatus.removeClass('ui-user-status-offline ui-user-status-online ui-user-status-idle');
if (item.values().idle)
userstatus.addClass('ui-user-status-idle');
@@ -1240,6 +1247,7 @@ function deduplicateOnlineUsers(list) {
//keep idle state if any of self client not idle
if (!user.idle) {
_onlineUsers[j].idle = user.idle;
+ _onlineUsers[j].color = user.color;
}
found = true;
break;