40 lines
1.1 KiB
TypeScript
40 lines
1.1 KiB
TypeScript
import { html } from '../types/html';
|
|
|
|
export class PageElement {
|
|
public readonly htmlRoot: HTMLElement;
|
|
|
|
public constructor(content: html, protected children: Array<PageElement> = []) {
|
|
this.htmlRoot = PageElement.createElement(content);
|
|
}
|
|
|
|
public attachToDOM(target: HTMLElement) {
|
|
target.appendChild(this.htmlRoot);
|
|
this.initialize();
|
|
}
|
|
|
|
protected initialize(): void {
|
|
this.children.forEach((c) => c.initialize());
|
|
}
|
|
|
|
protected query(query: string): HTMLElement {
|
|
return this.htmlRoot.querySelector(query) as HTMLElement;
|
|
}
|
|
|
|
protected attachElement(element: PageElement) {
|
|
this.htmlRoot.appendChild(element.htmlRoot);
|
|
this.children.push(element);
|
|
}
|
|
|
|
protected attachElementByReplacing(query: string, element: PageElement) {
|
|
const old = this.query(query);
|
|
old.parentElement!.replaceChild(element.htmlRoot, old);
|
|
this.children.push(element);
|
|
}
|
|
|
|
private static createElement(from: html): HTMLElement {
|
|
// won't work for all elements, eg.: <td>
|
|
const element: HTMLElement = document.createElement('div');
|
|
element.innerHTML = from;
|
|
return element.firstElementChild as HTMLElement;
|
|
}
|
|
}
|