Skip to content

Instantly share code, notes, and snippets.

@trek
Last active March 30, 2019 18:47
Show Gist options
  • Save trek/42f95212d52c8d24794f2f90001a9185 to your computer and use it in GitHub Desktop.
Save trek/42f95212d52c8d24794f2f90001a9185 to your computer and use it in GitHub Desktop.
<img class='rounded-full object-cover' src={{this.src}} alt={{this.alt}} height={{this.size}} width={{this.size}} onerror={{this.useLetterform}}>
import Component from '@glimmer/component';
import { tracked } from '@glimmer/tracking';
import { action } from '@ember/object';
export default class AvatarComponent extends Component {
size = 48;
@tracked letterform;
get alt() {
return `Profile image for ${this.args.name}`;
}
get src() {
if (this.letterform) {
return this.letterform;
}
let { companyId } = this.args;
return `https://s3.amazonaws.com/somebucket/companies/${companyId}`;
}
@action useLetterform() {
this.letterform = dataUriAsSrc(this.args.name, this.size);
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment