Skip to content

Commit

Permalink
Avatars should respect aspect ratio
Browse files Browse the repository at this point in the history 
Fixes #22473
  • Loading branch information
@vboctor
Romain CABASSOT authored and vboctor committed Mar 25, 2017
1 parent 7a5c037 commit f6229fb
Show file tree
Hide file tree
Showing 6 changed files with 88 additions and 28 deletions.
2 changes: 1 addition & 1 deletion bugnote_view_inc.php
View file
Expand Up @@ -155,7 +155,7 @@
?>
<tr class="bugnote" id="c<?php echo $t_activity['id'] ?>">
<td class="category">
<div class="pull-left padding-2"><?php print_avatar( $t_activity['user_id'] ); ?>
<div class="pull-left padding-2"><?php print_avatar( $t_activity['user_id'], 'bugnote', 80 ); ?>
</div>
<div class="pull-left padding-2">
<p class="no-margin">
Expand Down
2 changes: 1 addition & 1 deletion core/classes/TimelineEvent.class.php
View file
Expand Up @@ -77,7 +77,7 @@ public function html_start( $p_action_icon = 'fa-check' ) {
$t_html = '<div class="profile-activity clearfix">';

if( !empty( $t_avatar ) ) {
$t_html .= '<img class="pull-left" src="' . htmlspecialchars( $t_avatar->image ) . '"/>';
$t_html .= prepare_avatar( $t_avatar, 'profile-activity', 40 );
} else {
$t_html .= '<i class="pull-left thumbicon fa ' . $p_action_icon . ' btn-primary no-hover"></i>';
}
Expand Down
11 changes: 4 additions & 7 deletions core/layout_api.php
View file
Expand Up @@ -480,7 +480,7 @@ function layout_navbar_user_menu( $p_show_avatar = true ) {
echo '<li class="grey">';
echo '<a data-toggle="dropdown" href="#" class="dropdown-toggle">';
if( $p_show_avatar ) {
layout_navbar_user_avatar( 'nav-user-photo' );
layout_navbar_user_avatar();
echo '<span class="user-info">';
echo $t_username;
echo '</span>';
Expand Down Expand Up @@ -700,7 +700,7 @@ function layout_navbar_subproject_option_list( $p_parent_id, $p_project_id = nul
* @param string $p_img_class css class to use with the img tag
* @return null
*/
function layout_navbar_user_avatar( $p_img_class = '' ) {
function layout_navbar_user_avatar( $p_img_class = 'nav' ) {
$t_default_avatar = '<i class="ace-icon fa fa-user fa-2x white"></i> ';

if( OFF === config_get( 'show_avatar' ) ) {
Expand All @@ -715,12 +715,9 @@ function layout_navbar_user_avatar( $p_img_class = '' ) {
}

if( access_has_project_level( config_get( 'show_avatar_threshold' ), null, $p_user_id ) ) {
$t_avatar = Avatar::get( $p_user_id, 32 );
$t_avatar = Avatar::get( $p_user_id, 40 );
if( false !== $t_avatar ) {
$t_image = htmlspecialchars( $t_avatar->image );
$t_text = htmlspecialchars( $t_avatar->text );

echo '<img class="nav-user-photo" src="' . $t_image . '" alt="' . $t_text . '" />';
echo prepare_raw_avatar( $t_avatar, $p_img_class, 40 );
return;
}
}
Expand Down
48 changes: 48 additions & 0 deletions core/prepare_api.php
View file
Expand Up @@ -104,3 +104,51 @@ function prepare_version_string( $p_project_id, $p_version_id ) {

return $t_version_text;
}

/**
* Prepares avatar for raw outputting (only avatar image).
*
* @param Avatar $p_avatar An instance of class Avatar.
* @param string $p_class_prefix CSS class prefix to add to the avatar's surrounding div and to the img.
* The CSS classes to implement will be named [$p_class_prefix]-avatar_container-[$p_size] and
* [$p_class_prefix]-avatar-[$p_size].
* @param integer $p_size Image maximum size.
* @return the HTML string of the avatar.
*/
function prepare_raw_avatar( $p_avatar, $p_class_prefix, $p_size) {
if( $p_avatar === null ) {
return '';
}

$t_image = htmlspecialchars( $p_avatar->image );
$t_text = htmlspecialchars( $p_avatar->text );

$t_avatar_class = $p_class_prefix . '-avatar' . '-' . $p_size;
return '<img class="' . $t_avatar_class . '" src="' . $t_image . '" alt="' .
$t_text . '" />';
}

/**
* Prepares avatar for outputting.
*
* @param Avatar $p_avatar An instance of class Avatar.
* @param string $p_class_prefix CSS class prefix to add to the avatar's surrounding div and to the img.
* The CSS classes to implement will be named [$p_class_prefix]-avatar-container-[$p_size] and
* [$p_class_prefix]-avatar-[$p_size].
* @param integer $p_size Image maximum size.
* @return the HTML string of the avatar.
*/
function prepare_avatar( $p_avatar, $p_class_prefix, $p_size ) {
if( $p_avatar === null ) {
return '';
}

$t_link = htmlspecialchars( $p_avatar->link );

$t_container_class = $p_class_prefix . '-avatar-container' . '-' . $p_size;
return '<div class="' . $t_container_class . '">' .
'<a rel="nofollow" href="' . $t_link . '">' .
prepare_raw_avatar( $p_avatar, $p_class_prefix, $p_size ) .
'</a></div>';
}

19 changes: 5 additions & 14 deletions core/print_api.php
View file
Expand Up @@ -182,24 +182,15 @@ function print_successful_redirect( $p_redirect_to ) {
/**
* Print avatar image for the given user ID
*
* @param integer $p_user_id A user identifier.
* @param integer $p_size Image pixel size.
* @param integer $p_user_id A user identifier.
* @param string $p_class_prefix CSS classs prefix.
* @param integer $p_size Image pixel size.
* @return void
*/
function print_avatar( $p_user_id, $p_size = 80 ) {
function print_avatar( $p_user_id, $p_class_prefix, $p_size = 80 ) {
$t_avatar = Avatar::get( $p_user_id, $p_size );
if( $t_avatar === null ) {
return;
}

$t_image = htmlspecialchars( $t_avatar->image );
$t_link = htmlspecialchars( $t_avatar->link );
$t_text = htmlspecialchars( $t_avatar->text );

echo '<a rel="nofollow" href="' . $t_link . '">' .
'<img class="avatar" src="' . $t_image . '" alt="' .
$t_text . '" width="' . $p_size . '" height="' .
$p_size . '" /></a>';
echo prepare_avatar( $t_avatar, $p_class_prefix, $p_size );
}

/**
Expand Down
34 changes: 29 additions & 5 deletions css/ace-mantis.css
View file
Expand Up @@ -214,25 +214,49 @@ pre {
position: relative;
}

.ace-nav .nav-user-photo {
border-radius: 4px !important;
.ace-nav .nav-avatar-container-40 {
width: 48px;
height: 40px;
float: left;
}

.ace-nav .nav-avatar-40 {
margin: -4px 8px 0 0;
border-radius: 100%;
border: 2px solid #FFF;
max-width: 40px;
max-height: 40px;
border-radius: 4px !important;
}
.profile-activity img {
.profile-activity-avatar-40 {
border-radius: 15% !important;
margin-bottom: 6px !important;
}

.profile-activity-avatar-container-40 {
width: 48px;
line-height: 40px;
float: left;
text-align: center;
}

.table-responsive {
margin-bottom: 0 !important;
}

.avatar
{
.bugnote-avatar-80 {
border: 2px solid #c9d6e5;
border-radius: 15%;
box-shadow: none;
margin:0;
max-width: 80px;
max-height: 80px;
}

.bugnote-avatar-container-80 {
line-height: 80px;
width: 84px;
text-align: center;
}

.input-sm {
Expand Down

0 comments on commit f6229fb

Please sign in to comment.