End of huge refactoring: cleaner input elements

UI/Input/FixedInputElement.ts

@@ -17,13 +17,19 @@ export class FixedInputElement<T> extends InputElement<T> {
     GetValue(): UIEventSource<T> {
         return this.value;
     }
+    
+    ShowValue(t: T): boolean {
+        return false;
+    }
 
-    protected InnerRender(): string {
+    InnerRender(): string {
         return this.rendering.Render();
     }
 
     IsValid(t: T): boolean {
-        return t === this.value.data;
+        return t == this.value.data;
     }
+    
+    
 
 }

UI/Input/InputElement.ts

@@ -7,5 +7,7 @@ export abstract class InputElement<T> extends UIElement{
     abstract GetValue() : UIEventSource<T>;
     
     abstract IsValid(t: T) : boolean;
+    
+    abstract ShowValue(t: T) : boolean;
 
 }

UI/Input/InputElementWrapper.ts

@@ -25,6 +25,10 @@ export class InputElementWrapper<T> extends InputElement<T>{
     GetValue(): UIEventSource<T> {
         return this.input.GetValue();
     }
+    
+    ShowValue(t: T) {
+        return this.input.ShowValue(t);
+    }
 
     InnerRender(): string {
         return this.pre.Render() + this.input.Render() + this.post.Render();

UI/Input/RadioButton.ts

@@ -31,7 +31,7 @@ export class RadioButton<T> extends InputElement<T> {
         ;
 
         this.value.addCallback((t) => {
-            self.SetCorrectValue(t);
+            self.ShowValue(t);
         })
 
 
@@ -79,11 +79,13 @@ export class RadioButton<T> extends InputElement<T> {
         return "<form id='" + this.id + "-form'>" + body + "</form>";
     }
 
-    private SetCorrectValue(t: T) {
+    public ShowValue(t: T): boolean {
         if (t === undefined) {
-            return;
+            return false;
+        }
+        if (!this.IsValid(t)) {
+            return false;
         }
-        console.log("Trying to find an option for", t)
         // We check that what is selected matches the previous rendering
         for (let i = 0; i < this._elements.length; i++) {
             const e = this._elements[i];
@@ -119,9 +121,15 @@ export class RadioButton<T> extends InputElement<T> {
                 checkButtons();
             }
         );
-
-        if (this._selectFirstAsDefault) {
-            this.SetCorrectValue(this.value.data);
+        if (this._selectedElementIndex.data !== null) {
+            const el = document.getElementById(this.IdFor(this._selectedElementIndex.data));
+            if (el) {
+                // @ts-ignore
+                el.checked = true;
+                checkButtons();
+            }
+        } else if (this._selectFirstAsDefault) {
+            this.ShowValue(this.value.data);
             if (this._selectedElementIndex.data === null || this._selectedElementIndex.data === undefined) {
                 const el = document.getElementById(this.IdFor(0));
                 if (el) {

UI/Input/TextField.ts

@@ -60,7 +60,14 @@ export class TextField<T> extends InputElement<T> {
         return this.mappedValue;
     }
 
-     InnerRender(): string {
+    ShowValue(t: T): boolean {
+        if (!this.IsValid(t)) {
+            return false;
+        }
+        this.mappedValue.setData(t);
+    }
+
+    InnerRender(): string {
         return "<form onSubmit='return false' class='form-text-field'>" +
             "<input type='text' placeholder='" + this._placeholder.InnerRender() + "' id='text-" + this.id + "'>" +
             "</form>";
@@ -68,7 +75,7 @@ export class TextField<T> extends InputElement<T> {
 
     InnerUpdate(htmlElement: HTMLElement) {
         const field = document.getElementById('text-' + this.id);
-        if(field === null){
+        if (field === null) {
             return;
         }
         const self = this;
@@ -84,10 +91,16 @@ export class TextField<T> extends InputElement<T> {
             }
         });
 
+        if (this.IsValid(this.mappedValue.data)) {
+            // @ts-ignore
+            field.value = this._toString(this.mappedValue.data);
+        }
+
 
     }
 
     IsValid(t: T): boolean {
+        console.log("TXT IS valid?",t,this._toString(t))
         if(t === undefined || t === null){
             return false;
         }