41 lines
847 B
JavaScript
41 lines
847 B
JavaScript
const template = document.createElement('template');
|
|
|
|
template.innerHTML = `
|
|
<style>
|
|
#profilePic {
|
|
border-radius: var(--wc-profile-pic-border-radius);
|
|
width: var(--wc-profile-pic-size);
|
|
height: var(--wc-profile-pic-size);
|
|
}
|
|
</style>
|
|
|
|
<img src="" id="profilePic"/>
|
|
`
|
|
|
|
class profilePic extends HTMLElement {
|
|
constructor() {
|
|
super();
|
|
|
|
this._shadowRoot = this.attachShadow({ 'mode': 'open' });
|
|
this._shadowRoot.appendChild(template.content.cloneNode(true));
|
|
this.$profilePic = this._shadowRoot.querySelector('#profilePic');
|
|
}
|
|
|
|
static get observedAttributes() {
|
|
return ['url'];
|
|
}
|
|
|
|
attributeChangedCallback(name, oldVal, newVal) {
|
|
if (oldVal != newVal) {
|
|
this[name] = newVal;
|
|
this.render();
|
|
}
|
|
}
|
|
|
|
render() {
|
|
this.url ? this.$profilePic.src = this.url : null;
|
|
}
|
|
}
|
|
|
|
window.customElements.define('wc-profile-pic', profilePic);
|