Fix bug with multiple image uploads, refactoring of TextField

UI/Input/InputElementMap.ts

@@ -35,7 +35,7 @@ export default class InputElementMap<T, X> extends InputElement<X> {
             }), extraSources, x => {
                 return fromX(x);
             });
-    }
+    }w
 
     GetValue(): UIEventSource<X> {
         return this._value;

UI/Input/InputElementWrapper.ts

@@ -1,42 +0,0 @@
-import {InputElement} from "./InputElement";
-import {UIElement} from "../UIElement";
-import Translations from "../i18n/Translations";
-import {UIEventSource} from "../../Logic/UIEventSource";
-
-export class InputElementWrapper<T> extends InputElement<T>{
-    private pre: UIElement ;
-    private input: InputElement<T>;
-    private post: UIElement ;
-    
-    IsSelected: UIEventSource<boolean>
-    
-    
-    constructor(
-        pre: UIElement | string,
-        input: InputElement<T>,
-        post: UIElement | string
-        
-    ) {
-        super(undefined);
-        // this.pre = typeof(pre) === 'string' ?  new FixedUiElement(pre) : pre
-        this.pre = Translations.W(pre)
-        this.input = input;
-        // this.post =typeof(post) === 'string' ?  new FixedUiElement(post) : post
-        this.post = Translations.W(post)
-        this.IsSelected = input.IsSelected;
-    }
-    
-    
-    GetValue(): UIEventSource<T> {
-        return this.input.GetValue();
-    }
-    
-    InnerRender(): string {
-        return this.pre.Render() + this.input.Render() + this.post.Render();
-    }
-
-    IsValid(t: T): boolean {
-        return this.input.IsValid(t);
-    }
-    
-}

UI/Input/MultiLingualTextFields.ts

@@ -3,19 +3,19 @@ import {UIEventSource} from "../../Logic/UIEventSource";
 import {TextField} from "./TextField";
 
 export default class MultiLingualTextFields extends InputElement<any> {
-    private _fields: Map<string, TextField<string>> = new Map<string, TextField<string>>();
-    private _value: UIEventSource<any>;
-    IsSelected: UIEventSource<boolean> = new UIEventSource<boolean>(false);
+    private _fields: Map<string, TextField> = new Map<string, TextField>();
+    private readonly _value: UIEventSource<any>;
+    public readonly IsSelected: UIEventSource<boolean> = new UIEventSource<boolean>(false);
 
-    constructor(languages: UIEventSource<string[]>, 
+    constructor(languages: UIEventSource<string[]>,
                 textArea: boolean = false,
                 value: UIEventSource<Map<string, UIEventSource<string>>> = undefined) {
         super(undefined);
         this._value = value ?? new UIEventSource({});
-        
-        this._value.addCallbackAndRun(latestData =>  {
-            if(typeof(latestData) === "string"){
-                console.warn("Refusing string for multilingual input",latestData);
+
+        this._value.addCallbackAndRun(latestData => {
+            if (typeof (latestData) === "string") {
+                console.warn("Refusing string for multilingual input", latestData);
                 self._value.setData({});
             }
         })
@@ -26,7 +26,7 @@ export default class MultiLingualTextFields extends InputElement<any> {
             if (languages === undefined) {
                 return;
             }
-            const newFields = new Map<string, TextField<string>>();
+            const newFields = new Map<string, TextField>();
             for (const language of languages) {
                 if (language.length != 2) {
                     continue;
@@ -34,7 +34,7 @@ export default class MultiLingualTextFields extends InputElement<any> {
                 
                 let oldField = self._fields.get(language);
                 if (oldField === undefined) {
-                    oldField = TextField.StringInput(textArea);
+                    oldField = new TextField({textArea: textArea});
                     oldField.GetValue().addCallback(str => {
                         self._value.data[language] = str;
                         self._value.ping();

UI/Input/MultiTagInput.ts

@@ -1,10 +1,5 @@
-import {InputElement} from "./InputElement";
 import {UIEventSource} from "../../Logic/UIEventSource";
-import {UIElement} from "../UIElement";
-import Combine from "../Base/Combine";
-import {SubtleButton} from "../Base/SubtleButton";
 import TagInput from "./SingleTagInput";
-import {FixedUiElement} from "../Base/FixedUiElement";
 import {MultiInput} from "./MultiInput";
 
 export class MultiTagInput extends MultiInput<string> {

UI/Input/SingleTagInput.ts

@@ -7,6 +7,7 @@ import {Utils} from "../../Utils";
 import {UIElement} from "../UIElement";
 import {VariableUiElement} from "../Base/VariableUIElement";
 import {FromJSON} from "../../Customizations/JSON/FromJSON";
+import ValidatedTextField from "./ValidatedTextField";
 
 export default class SingleTagInput extends InputElement<string> {
 
@@ -32,12 +33,10 @@ export default class SingleTagInput extends InputElement<string> {
             }
         ));
 
-        this.key = TextField.KeyInput();
+        this.key = ValidatedTextField.KeyInput();
 
-        this.value = new TextField<string>({
+        this.value = new TextField({
                 placeholder: "value - if blank, matches if key is NOT present",
-                fromString: str => str,
-                toString: str => str,
                 value: new UIEventSource<string>("")
             }
         );

UI/Input/TextField.ts

@@ -51,6 +51,8 @@ export class TextField extends InputElement<string> {
             // @ts-ignore
             field.value = t;
         });
+        this.dumbMode = false;
+        this.SetClass("deadbeef")
     }
 
     GetValue(): UIEventSource<string> {
@@ -60,17 +62,24 @@ export class TextField extends InputElement<string> {
     InnerRender(): string {
 
         if (this._isArea) {
-            return `<textarea id="${this.id}" class="form-text-field" rows="${this._textAreaRows}" cols="50" style="max-width: 100%; width: 100%; box-sizing: border-box"></textarea>`
+            return `<span id="${this.id}"><textarea id="txt-${this.id}" class="form-text-field" rows="${this._textAreaRows}" cols="50" style="max-width: 100%; width: 100%; box-sizing: border-box"></textarea></span>`
         }
 
         const placeholder = this._placeholder.InnerRender().replace("'", "&#39");
 
-        return `<form onSubmit='return false' class='form-text-field'>` +
-            `<input type='text' placeholder='${placeholder}' id='${this.id}'>` +
-            `</form>`;
+        return `<span id="${this.id}"><form onSubmit='return false' class='form-text-field'>` +
+            `<input type='text' placeholder='${placeholder}' id='txt-${this.id}'>` +
+            `</form></span>`;
+    }
+    
+    Update() {
+        console.log("Updating TF")
+        super.Update();
     }
 
-    InnerUpdate(field) {
+    InnerUpdate() {
+        console.log("Inner Updating TF")
+        const field = document.getElementById("txt-" + this.id);
         const self = this;
         field.oninput = () => {
             // @ts-ignore

UI/Input/ValidatedTextField.ts

@@ -186,7 +186,6 @@ export default class ValidatedTextField {
         isValid?: ((string: string) => boolean)
     }): InputElement<T> {
         const textField = new TextField(options);
-
         return new InputElementMap(
             textField, (a, b) => a === b,
             fromString, toString