UI.ts

export class Control { readonly element: HTMLElement protected children: Control[] private _parent: Control; constructor(element: string | HTMLElement, className?: string, parent?: Control, content?: string | Control) { if (typeof element === "string") { element = document.createElement(element) } this.element = element this.children = [] if (className) { element.classList.add(className) } if (parent) { parent.appendChild(this) } if (content !== undefined && content != null) { if (typeof content === "string") { S.setText(this.element, content, true) } else { this.appendChild(content) } } } public get parent(): Control { return this._parent; } protected setParent(v: Control) { if (this._parent) { this._parent.removeChild(this) } this._parent = v } getChildren() { return this.children as ReadonlyArray<Control> } removeChild(control: Control) { this.children.remove(control) control.element.remove() } replaceChild(control: Control, old?: Control) { S.replace(control.element, old.element) this.children.remove(old) control.setParent(this) this.children.push(control) } appendChild(control: Control) { control.setParent(this) this.children.push(control) this.element.appendChild(control.element) } clear() { for (let c of this.children) { c.clear() c.remove() } this.children = [] this.element.innerHTML = "" } remove() { if (this.parent) { this.parent.removeChild(this) } else { this.element.remove() } } dispatchEvent(event: Event) { this.element.dispatchEvent(event) } addEventListener(type: string, listener: (this: HTMLInputElement, ev: Event) => any, options?: boolean | AddEventListenerOptions) { this.element.addEventListener(type, listener, options) } }

Be the first to comment

You can use [html][/html], [css][/css], [php][/php] and more to embed the code. Urls are automatically hyperlinked. Line breaks and paragraphs are automatically generated.