mirror of
https://github.com/TryGhost/Ghost.git
synced 2024-11-25 19:48:50 +03:00
5a1b3d90fb
no issue - disabled members search/filter/chart as they won't work without all members loaded into memory (they will be added back later) - added `ember-ella-sparse` to handle a sparse array of members - updated `fetchMembersTask` to return a sparse array instance - updated components that work on a `member` instance to use `.get` because all items in a sparse array are proxy objects - changed list loading behaviour to not refresh the list from the API unless the client-side list is more than a minute old - allows for much snappier nav between list and details screens
37 lines
1.1 KiB
JavaScript
37 lines
1.1 KiB
JavaScript
import Component from '@glimmer/component';
|
|
import {htmlSafe} from '@ember/string';
|
|
|
|
const stringToHslColor = function (str, saturation, lightness) {
|
|
var hash = 0;
|
|
for (var i = 0; i < str.length; i++) {
|
|
hash = str.charCodeAt(i) + ((hash << 5) - hash);
|
|
}
|
|
|
|
var h = hash % 360;
|
|
return 'hsl(' + h + ', ' + saturation + '%, ' + lightness + '%)';
|
|
};
|
|
|
|
export default class GhMemberAvatarComponent extends Component {
|
|
get memberName() {
|
|
let {member} = this.args;
|
|
|
|
// can be a proxy in a sparse array so .get is required
|
|
return member.get('name') || member.get('email') || 'NM';
|
|
}
|
|
|
|
get backgroundStyle() {
|
|
let color = stringToHslColor(this.memberName, 55, 55);
|
|
return htmlSafe(`background-color: ${color}`);
|
|
}
|
|
|
|
get initials() {
|
|
if (this.memberName === 'NM') {
|
|
return 'NM';
|
|
}
|
|
|
|
let names = this.memberName.split(' ');
|
|
let intials = names.length > 1 ? [names[0][0], names[names.length - 1][0]] : [names[0][0]];
|
|
return intials.join('').toUpperCase();
|
|
}
|
|
}
|