From a0da525b6d2484449b5ca3f66d1471fe86a547db Mon Sep 17 00:00:00 2001
From: Avior <florian.bouillon@delta-wings.net>
Date: Tue, 8 Oct 2019 17:38:11 +0200
Subject: [PATCH] Updated FMRepeatInput. too many changes to explain :D

---
 modules/FMRepeatInput.ts | 136 ++++++++++++++++++++++++++++++---------
 1 file changed, 104 insertions(+), 32 deletions(-)

diff --git a/modules/FMRepeatInput.ts b/modules/FMRepeatInput.ts
index eb9711e..2becce3 100644
--- a/modules/FMRepeatInput.ts
+++ b/modules/FMRepeatInput.ts
@@ -9,56 +9,128 @@ import FMInput from "../FMInput"
  */
 export default class FMRepeatInput extends FMInput {
 
+	elements: FMInput[][] = []
+
+	private template: HTMLElement
+
+	private addBtn: HTMLElement
+
 	constructor(element: HTMLDivElement, form: FormManager) {
 		super(element, form)
 
 		//fetch Template
-		let template: HTMLElement = element.querySelector(".fmr-template")
-		template.style.display = "none"
+		this.template = element.querySelector(".fmr-template")
+		this.template.style.display = "none"
 
 		//fetch add button
-		let addBtn = element.querySelector(".fmr-add")
-		addBtn.addEventListener("click", () => {
-			let node = element.insertBefore(template.cloneNode(true), addBtn) as HTMLElement
-			node.classList.remove("fmr-template")
-			node.classList.add("fmr-element")
-			node.style.display = ""
-			let del = node.querySelector(".fmr-del")
-			del.addEventListener("click", () => {
+		this.addBtn = element.querySelector(".fmr-add")
+		this.addBtn.addEventListener("click", () => {
+			if (!this.addBtn.hasAttribute("disabled")) this.addLine()
+		})
+
+		//Observer to handle attributes changes
+		const observer = new MutationObserver((mutationList: any, observer: any) => {
+			for (let mutation of mutationList) {
+				if (mutation.type === 'attributes' && mutation.attributeName === "disabled") {
+					this.element.querySelectorAll(".fmr-add, .fmr-del").forEach((el: HTMLElement) => {
+						if (this.element.hasAttribute("disabled")) el.style.display = "none"
+						else el.style.display = ""
+					})
+					if (this.element.hasAttribute("disabled")) this.addBtn.setAttribute("disabled", "")
+					else this.addBtn.removeAttribute("disabled")
+					for (const iterator of this.elements) {
+						for (const i2 of iterator) {
+							if (this.element.hasAttribute("disabled")) {
+								i2.element.setAttribute("disabled", "")
+								continue
+							}
+							i2.element.removeAttribute("disabled")
+						}
+					}
+				}
+			}
+		})
+		observer.observe(this.element, {attributes: true})
+	}
+
+	addLine(values?: any[]|any) {
+		// the new line
+		let node = this.element.insertBefore(this.template.cloneNode(true), this.addBtn) as HTMLElement
+		node.classList.remove("fmr-template")
+		node.classList.add("fmr-element")
+		node.style.display = ""
+
+		// loop through inputs ot init them
+		let sub: FMInput[] = []
+		node.querySelectorAll("[data-input]").forEach((el: HTMLElement) => {
+			let input = this.form.getInit(el)
+			if (this.element.hasAttribute("disabled")) {
+				input.element.disabled = true
+			}
+			sub.push(input)
+			// if values is a named array
+			if (values != undefined && values[input.getName()] != undefined) {
+				input.setValue(values[input.getName()])
+			}
+			// if value is a single string/number/etc
+			if (typeof(values) != "object" && values != undefined) {
+				input.setValue(values)
+			}
+		})
+		this.elements.push(sub)
+
+		// get the delete button
+		let del = node.querySelector(".fmr-del")
+		del.addEventListener("click", () => {
+			if (!del.hasAttribute("disabled")) {
+				let id = this.element.querySelectorAll(".fmr-element").length-1
+				this.elements.splice(id)
 				node.remove()
-			})
+			}
 		})
-
 	}
 
-	loopInputs(): FMInput[][] {
-		let inputs: FMInput[][] = []
-		this.element.querySelectorAll(".fmr-element").forEach((pouet: HTMLElement) => {
-			let subElement: FMInput[] = []
-			pouet.querySelectorAll("[data-input]").forEach((localElement: HTMLElement) => {
-				subElement.push(this.form.getInit(localElement))
-			});
-			inputs.push(subElement)
+	setValue(value: any[][]|string) {
+		//remove every elements
+		this.element.querySelectorAll(".fmr-element").forEach(el => {
+			el.remove()
+			this.elements = []
 		})
-		return inputs
-	}
+		//ef string finish function
+		if (typeof(value) == "string") return
 
-	setValue(value: any[][]) {
-		for (const index in value) {
+		//create each line
+		for (const indexStr in value) {
+			let index = parseInt(indexStr)
 			if (value.hasOwnProperty(index)) {
-				const element = value[index];
-				console.log(index,element, value)
+				const el = value[index];
+
+				if (this.element.querySelectorAll(".fmr-element").length <= index) {
+					//add element
+					if ((el as any) == "") continue
+					this.addLine(el)
+					continue
+				}
+				// update element
 			}
 		}
 	}
 
-	getValue(): any[][] {
-		let values: any[][] = []
-		let elements = this.loopInputs()
-		for (const line of elements) {
-			let lineArray: any[] = []
+	getValue(): any[any] {
+		let values = []
+		for (const line of this.elements) {
+			let lineArray: any = {}
+			//one element repeat
+			if (line.length == 1) {
+				for (const col of line) {
+					values.push(col.getValue())
+				}
+				continue
+			}
+			// multi elements repeat
 			for (const col of line) {
-				lineArray.push(col.getValue())
+				// if ()
+				lineArray[col.getName()] = col.getValue()
 			}
 			values.push(lineArray)
 		}