WIP: preventing duplicated initialization logic is added

dist/types/ui/ui.dom.d.ts

@@ -1,14 +1,15 @@
 import { FormulizeOptions } from '../formulize.interface';
 export declare abstract class UIDom {
-    protected elem: HTMLElement;
-    protected options: FormulizeOptions;
     protected container: JQuery;
     protected statusBox: JQuery;
     protected textBox: JQuery;
     protected cursor: JQuery;
+    protected elem: HTMLElement;
+    protected options: FormulizeOptions;
     protected readonly cursorIndex: number;
     protected readonly dragElem: JQuery;
-    constructor(elem: HTMLElement, options?: FormulizeOptions);
+    protected initializeDOM(): void;
+    protected isAlreadyInitialized(): boolean;
     protected attachEvents(): void;
     protected getPrevUnit(elem: HTMLElement): HTMLElement;
     protected getNextUnit(elem: HTMLElement): HTMLElement;

src/ui/ui.base.ts

@@ -1,9 +1,17 @@
 import { FormulizeOptions } from '../../dist/types/formulize/option.interface';
 import { UIHook } from './ui.hook';
+import { defaultOptions } from '../option.value';
 
 export abstract class UIBase extends UIHook {
-    public constructor(elem: HTMLElement, options?: FormulizeOptions) {
-        super(elem, options);
+    public constructor(elem: HTMLElement, options: FormulizeOptions = { ...defaultOptions }) {
+        super();
+        this.elem = elem;
+        this.options = options;
+
+        if (this.isAlreadyInitialized())
+            return;
+
+        this.initializeDOM();
         this.attachEvents();
     }
 }

src/ui/ui.dom.ts

@@ -8,6 +8,8 @@ export abstract class UIDom {
     protected statusBox: JQuery;
     protected textBox: JQuery;
     protected cursor: JQuery;
+    protected elem: HTMLElement;
+    protected options: FormulizeOptions;
 
     protected get cursorIndex(): number {
         return this.cursor
@@ -20,7 +22,7 @@ export abstract class UIDom {
             .find(`.${this.options.id}-drag`);
     }
 
-    constructor(protected elem: HTMLElement, protected options: FormulizeOptions = { ...defaultOptions }) {
+    protected initializeDOM() {
         this.container = $(this.elem);
         this.container.addClass(`${this.options.id}-container`);
         this.container.wrap(`<div class="${this.options.id}-wrapper"></div>`);
@@ -33,6 +35,13 @@ export abstract class UIDom {
         this.textBox.trigger('focus');
     }
 
+    protected isAlreadyInitialized(): boolean {
+        const selfAndContainer = $(this.elem)
+            .closest(`.${this.options.id}-container`)
+            .add(this.elem);
+        return !!selfAndContainer.filter(`.${this.options.id}-container`).length;
+    }
+
     protected attachEvents() {
         throw new Error('method not implemented');
     }