40 lines
1.0 KiB
JavaScript
40 lines
1.0 KiB
JavaScript
|
|
function pureComponentFactory (name, functionalRender) {
|
|
class ComponentClass extends HTMLElement {
|
|
constructor (...args) {
|
|
super();
|
|
this.attachShadow({mode: 'open'});
|
|
console.log("CONSTRUCTOR");
|
|
return;
|
|
}
|
|
render(args) {
|
|
let newDom = functionalRender(args);
|
|
console.log("Rendering: ", newDom);
|
|
this.shadowRoot.innerHTML= newDom;
|
|
}
|
|
static get observedAttributes() {
|
|
//How do we make this flexible????
|
|
return ['count'];
|
|
}
|
|
connectedCallback() {
|
|
this.render(this.parseAttributes())
|
|
}
|
|
attributeChangedCallback() {
|
|
this.render(this.parseAttributes())
|
|
}
|
|
parseAttributes() {
|
|
console.log(this);
|
|
let attr = {};
|
|
for(let i = 0; i < this.attributes.length; ++i) {
|
|
attr[this.attributes[i].name] = this.getAttribute(this.attributes[i].name);
|
|
}
|
|
console.log("Parse attributes: ", attr);
|
|
return attr;
|
|
}
|
|
|
|
}
|
|
window.customElements.define(name, ComponentClass);
|
|
return ComponentClass;
|
|
}
|
|
|