custom callbacks from base element

This commit is contained in:
Fran Jurmanović
2021-06-02 14:05:38 +02:00
parent ffef98e7a5
commit ca51c304f3
21 changed files with 122 additions and 148 deletions

View File

@@ -1,43 +1,5 @@
import { html, render } from "@github/jtml";
import { AppMainElement } from "components/";
import { closest } from "core/utils";
import { BaseElement } from "common/";
class BaseComponentElement extends HTMLElement {
@closest appMain: AppMainElement;
bindEvents = () => {
const _elems = this.querySelectorAll("[data-action]");
_elems?.forEach((el) => {
for (const action of (el.getAttribute("data-action") || "")
.trim()
.split(/\s+/)) {
const eventSep = action.lastIndexOf(":");
const methodSep = action.lastIndexOf("#");
const tag = action.slice(eventSep + 1, methodSep);
const type = action.slice(0, eventSep);
const method = action.slice(methodSep + 1);
if (tag.toUpperCase() === this.tagName) {
el.addEventListener(type, this?.[method]);
} else {
this.childNodes.forEach((child: HTMLElement) => {
if (child.tagName == tag.toUpperCase()) {
el.addEventListener(type, child?.[method]);
}
});
}
}
});
};
render = () => {
return html``;
};
update = () => {
render(this.render(), this);
this.bindEvents();
};
}
class BaseComponentElement extends BaseElement {}
export default BaseComponentElement;