65 lines
1.4 KiB
JavaScript
65 lines
1.4 KiB
JavaScript
|
|
class Webcomponent extends HTMLElement {
|
|
#config = {
|
|
template: {
|
|
fetch : true
|
|
}
|
|
};
|
|
|
|
constructor(config) {
|
|
super();
|
|
|
|
if (config) {
|
|
this.#config = {...this.#config, ...( config ? config : {} ) };
|
|
}
|
|
|
|
if (this.config.template.fetch) {
|
|
this.fetchTemplate();
|
|
}
|
|
}
|
|
|
|
fetchTemplate() {
|
|
this.attachShadow({mode: 'open'}).appendChild(
|
|
document.querySelector("template#" + this.tagName.toLowerCase()).content.cloneNode(true)
|
|
);
|
|
}
|
|
|
|
getName() {
|
|
return Object.getPrototypeOf(this).constructor.name;
|
|
}
|
|
|
|
getSlot(name) {
|
|
return this.querySelector('[slot="' + name + '"]');
|
|
}
|
|
|
|
emptyElement(element) {
|
|
while (element.lastChild) {
|
|
element.removeChild(element.lastChild);
|
|
}
|
|
|
|
return element;
|
|
}
|
|
|
|
buildUrl(url, data) {
|
|
return url + ( Object.entries(data).length ? "?" + Object.keys(data).map(function(key) {
|
|
return [key, data[key]].map(encodeURIComponent).join("=");
|
|
}).join("&") : "" );
|
|
}
|
|
|
|
on(type, listener, options) {
|
|
this.addEventListener(type, listener, options);
|
|
|
|
return this;
|
|
}
|
|
|
|
get config() {
|
|
return this.#config;
|
|
}
|
|
|
|
set config(value) {
|
|
return this.#config = value;
|
|
}
|
|
}
|
|
|
|
export { Webcomponent };
|