vbatts/quay
Archived
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

Merge pull request #2368 from coreos-inc/entity-search-avatar

Browse source 
Display avatars in entity search autocomplete
This commit is contained in:
josephschorr 2017-02-21 16:49:45 -05:00 committed by GitHub
commit 0214b1ba9f
4 changed files with 57 additions and 36 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

49
static/css/directives/ui/entity-search.css
View file

@ -55,4 +55,53 @@
.entity-search-element .menuitem .avatar {
margin-right: 4px;
}
.entity-mini-listing {
margin: 2px;
white-space: nowrap !important;
position: relative;
}
.entity-mini-listing i {
margin-right: 8px;
position: relative;
}
.entity-mini-listing i.fa {
width: 20px;
text-align: center;
font-size: 16px;
line-height: 16px;
color: #444;
}
.entity-mini-listing i.fa-exclamation-triangle {
position: absolute;
right: -14px;
top: 4px;
color: #c09853;
}
.entity-mini-listing i.fa.ci-robot {
position: relative;
top: -2px;
}
.entity-mini-listing i.fa .avatar-image {
position: absolute;
top: -2px;
left: 0px;
}
.entity-mini-listing .warning {
margin-top: 6px;
font-size: 10px;
padding: 4px;
}
.entity-mini-listing span.title {
color: #aaa;
font-size: 12px;
display: block;
}

29
static/css/quay.css
View file

@ -1135,35 +1135,6 @@ form input.ng-valid.ng-dirty,
text-overflow: ellipsis;
}
.entity-mini-listing {
margin: 2px;
white-space: nowrap !important;
position: relative;
}
.entity-mini-listing i {
margin-right: 8px;
}
.entity-mini-listing i.fa-exclamation-triangle {
position: absolute;
right: -14px;
top: 4px;
color: #c09853;
}
.entity-mini-listing .warning {
margin-top: 6px;
font-size: 10px;
padding: 4px;
}
.entity-mini-listing span.title {
color: #aaa;
font-size: 12px;
display: block;
}
.editable {
position: relative;
}

10
static/js/directives/ui/entity-search.js
View file

@ -43,7 +43,7 @@ angular.module('quay').directive('entitySearch', function () {
// True if the menu should pull right.
'pullRight': '@pullRight'
},
controller: function($rootScope, $scope, $element, Restangular, UserService, ApiService, UtilService, Config) {
controller: function($rootScope, $scope, $element, Restangular, UserService, ApiService, UtilService, AvatarService, Config) {
$scope.lazyLoading = true;
$scope.teams = null;
@ -286,16 +286,16 @@ angular.module('quay').directive('entitySearch', function () {
},
'suggestion': function (datum) {
template = '<div class="entity-mini-listing">';
if (datum.entity.kind == 'user' && !datum.entity.is_robot) {
template += '<i class="fa fa-user fa-lg"></i>';
if ((datum.entity.kind == 'user' && !datum.entity.is_robot) || (datum.entity.kind == 'org')) {
template += '<i class="fa fa-user fa-lg"><img class="avatar-image" src="' +
AvatarService.getAvatar(datum.entity.avatar.hash, 20, 'blank') +
'"></i>';
} else if (datum.entity.kind == 'external') {
template += '<i class="fa fa-user fa-lg"></i>';
} else if (datum.entity.kind == 'user' && datum.entity.is_robot) {
template += '<i class="fa ci-robot fa-lg"></i>';
} else if (datum.entity.kind == 'team') {
template += '<i class="fa fa-group fa-lg"></i>';
} else if (datum.entity.kind == 'org') {
template += '<i class="fa">' + AvatarService.getAvatar(datum.entity.avatar, 16) + '</i>';
}
template += '<span class="name">' + datum.value + '</span>';

5
static/js/services/avatar-service.js
View file

@ -6,7 +6,7 @@ angular.module('quay').factory('AvatarService', ['Config', '$sanitize', 'md5',
var avatarService = {};
var cache = {};
avatarService.getAvatar = function(hash, opt_size) {
avatarService.getAvatar = function(hash, opt_size, opt_notfound) {
var size = opt_size || 16;
switch (Config['AVATAR_KIND']) {
case 'local':
@ -14,7 +14,8 @@ angular.module('quay').factory('AvatarService', ['Config', '$sanitize', 'md5',
break;
case 'gravatar':
return '//www.gravatar.com/avatar/' + hash + '?d=404&size=' + size;
var notfound = opt_notfound || '404';
return '//www.gravatar.com/avatar/' + hash + '?d=' + notfound + '&size=' + size;
break;
}
};