[Avatars] JS should not load same avatar twice
Old code first dit an ajax request to the avatar. Then a new image object with the same src was created and since we do not cache avatars yet :( this resulted in 2 sequential requests to the exact same URL Now if you set the displayname it will first set the placeholder and then load the avatar in the background. Only once this time!
This commit is contained in:
parent
6034c9142d
commit
50d862e5d1
|
@ -47,7 +47,7 @@
|
|||
*/
|
||||
|
||||
(function ($) {
|
||||
$.fn.avatar = function(user, size, ie8fix, hidedefault, callback) {
|
||||
$.fn.avatar = function(user, size, ie8fix, hidedefault, callback, displayname) {
|
||||
if (typeof(size) === 'undefined') {
|
||||
if (this.height() > 0) {
|
||||
size = this.height();
|
||||
|
@ -79,30 +79,51 @@
|
|||
'/avatar/{user}/{size}',
|
||||
{user: user, size: Math.ceil(size * window.devicePixelRatio)});
|
||||
|
||||
$.get(url, function(result) {
|
||||
if (typeof(result) === 'object') {
|
||||
if (!hidedefault) {
|
||||
if (result.data && result.data.displayname) {
|
||||
$div.imageplaceholder(user, result.data.displayname);
|
||||
// If the displayname is not defined we use the old code path
|
||||
if (typeof(displayname) === 'undefined') {
|
||||
$.get(url, function(result) {
|
||||
if (typeof(result) === 'object') {
|
||||
if (!hidedefault) {
|
||||
if (result.data && result.data.displayname) {
|
||||
$div.imageplaceholder(user, result.data.displayname);
|
||||
} else {
|
||||
// User does not exist
|
||||
$div.imageplaceholder(user, 'X');
|
||||
$div.css('background-color', '#b9b9b9');
|
||||
}
|
||||
} else {
|
||||
// User does not exist
|
||||
$div.imageplaceholder(user, 'X');
|
||||
$div.css('background-color', '#b9b9b9');
|
||||
$div.hide();
|
||||
}
|
||||
} else {
|
||||
$div.hide();
|
||||
$div.show();
|
||||
if (ie8fix === true) {
|
||||
$div.html('<img width="' + size + '" height="' + size + '" src="'+url+'#'+Math.floor(Math.random()*1000)+'">');
|
||||
} else {
|
||||
$div.html('<img width="' + size + '" height="' + size + '" src="'+url+'">');
|
||||
}
|
||||
}
|
||||
} else {
|
||||
if(typeof callback === 'function') {
|
||||
callback();
|
||||
}
|
||||
});
|
||||
} else {
|
||||
// We already have the displayname so set the placeholder (to show at least something)
|
||||
if (!hidedefault) {
|
||||
$div.imageplaceholder(displayname);
|
||||
}
|
||||
|
||||
var img = new Image();
|
||||
|
||||
// If the new image loads successfull set it.
|
||||
img.onload = function() {
|
||||
$div.show();
|
||||
if (ie8fix === true) {
|
||||
$div.html('<img width="' + size + '" height="' + size + '" src="'+url+'#'+Math.floor(Math.random()*1000)+'">');
|
||||
} else {
|
||||
$div.html('<img width="' + size + '" height="' + size + '" src="'+url+'">');
|
||||
}
|
||||
$div.text('');
|
||||
$div.append(img);
|
||||
}
|
||||
if(typeof callback === 'function') {
|
||||
callback();
|
||||
}
|
||||
});
|
||||
|
||||
img.width = size;
|
||||
img.height = size;
|
||||
img.src = url;
|
||||
}
|
||||
};
|
||||
}(jQuery));
|
||||
|
|
|
@ -65,8 +65,7 @@ var UserList = {
|
|||
* Avatar or placeholder
|
||||
*/
|
||||
if ($tr.find('div.avatardiv').length){
|
||||
$tr.find('.avatardiv').imageplaceholder(user.name, user.displayname);
|
||||
$('div.avatardiv', $tr).avatar(user.name, 32);
|
||||
$('div.avatardiv', $tr).avatar(user.name, 32, undefined, undefined, undefined, user.displayname);
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
Loading…
Reference in New Issue