Web Component Test

by Emily Humphrey

HTML

<my-avatar service="twitter" username="chdhmphry" />

JavaScript

var MyAvatarPrototype = Object.create(HTMLElement.prototype);
MyAvatarPrototype.createdCallback = function() {
    var username = this.getAttribute('username');
    var service = this.getAttribute('service');
    var url = 'http://avatars.io/' + service + '/' + username;
    var img = document.createElement( 'img' );
    img.setAttribute('src', url);
    this.appendChild(img);
};
document.registerElement('my-avatar', {
    prototype: MyAvatarPrototype
});