From 3653c3ecaa2d9bde5564192b50997aadd3428576 Mon Sep 17 00:00:00 2001
From: Pieter Vander Vennet <pietervdvn@gmail.com>
Date: Fri, 11 Sep 2020 00:23:19 +0200
Subject: [PATCH] Fixed input for sets (fix #112)

---
 UI/Input/InputElementMap.ts |  5 +++--
 UI/Input/TextField.ts       | 16 +++++++++++++-
 UI/TagRendering.ts          | 43 ++++++++++++++-----------------------
 3 files changed, 34 insertions(+), 30 deletions(-)

diff --git a/UI/Input/InputElementMap.ts b/UI/Input/InputElementMap.ts
index b5611bb..5c8e31d 100644
--- a/UI/Input/InputElementMap.ts
+++ b/UI/Input/InputElementMap.ts
@@ -13,7 +13,8 @@ export default class InputElementMap<T, X> extends InputElement<X> {
     constructor(inputElement: InputElement<T>,
                 isSame: (x0: X, x1: X) => boolean,
                 toX: (t: T) => X,
-                fromX: (x: X) => T
+                fromX: (x: X) => T,
+                extraSources: UIEventSource<any>[] = []
     ) {
         super();
         this.isSame = isSame;
@@ -30,7 +31,7 @@ export default class InputElementMap<T, X> extends InputElement<X> {
                     return currentX;
                 }
                 return newX;
-            }), [], x => {
+            }), extraSources, x => {
                 const newT = fromX(x);
                 return newT;
             });
diff --git a/UI/Input/TextField.ts b/UI/Input/TextField.ts
index 5f392dc..ec4df9b 100644
--- a/UI/Input/TextField.ts
+++ b/UI/Input/TextField.ts
@@ -224,8 +224,22 @@ export class TextField<T> extends InputElement<T> {
 
     }
 
+    public SetCursorPosition(i: number) {
+        const field = document.getElementById('text-' + this.id);
+        if(field === undefined || field === null){
+            return;
+        }
+        if(i === -1){
+            // @ts-ignore
+            i = field.value.length;
+        }
+        field.focus();
+        // @ts-ignore
+        field.setSelectionRange(i, i);
+    }
+
     IsValid(t: T): boolean {
-        if(t === undefined || t === null){
+        if (t === undefined || t === null) {
             return false;
         }
         const result = this._toString(t);
diff --git a/UI/TagRendering.ts b/UI/TagRendering.ts
index c39f7d5..c9a24e9 100644
--- a/UI/TagRendering.ts
+++ b/UI/TagRendering.ts
@@ -13,7 +13,6 @@ import {CheckBoxes} from "./Input/Checkboxes";
 import {InputElement} from "./Input/InputElement";
 import {SaveButton} from "./SaveButton";
 import {RadioButton} from "./Input/RadioButton";
-import {InputElementWrapper} from "./Input/InputElementWrapper";
 import {FixedInputElement} from "./Input/FixedInputElement";
 import {TextField, ValidatedTextField} from "./Input/TextField";
 import {TagRenderingOptions} from "../Customizations/TagRenderingOptions";
@@ -205,7 +204,7 @@ export class TagRendering extends UIElement implements TagDependantUIElement {
         InputElement<TagsFilter> {
 
 
-        let freeformElement: InputElement<TagsFilter> = undefined;
+        let freeformElement: TextField<TagsFilter> = undefined;
         if (options.freeform !== undefined) {
             freeformElement = this.InputForFreeForm(options.freeform);
         }
@@ -264,29 +263,24 @@ export class TagRendering extends UIElement implements TagDependantUIElement {
                         }
                     }
                     return indices;
-                }
+                },
+                [freeformElement?.GetValue()]
             );
-
-            freeformElement?.IsSelected.addCallback((isSelected) => {
-                console.log("SELECTED FF", isSelected)
-                if (isSelected) {
-                    const es = checkBoxes.GetValue();
-                    const i = elements.length - 1
-                    if (es.data.indexOf(i) >= 0) {
-                        return;
-                    }
-                    es.data.push(i);
-                    es.ping();
-                }
-            });
-
-            freeformElement?.GetValue()?.addCallback(() => {
+            
+            freeformElement?.GetValue()?.addCallbackAndRun(value => {
                 const es = checkBoxes.GetValue();
-                const i = elements.length - 1
-                if (es.data.indexOf(i) < 0) {
+                const i = elements.length - 1;
+                const index = es.data.indexOf(i);
+                if (value === undefined) {
+                    if (index >= 0) {
+                        es.data.splice(index, 1);
+                        es.ping();
+                    }
+                } else if (index < 0) {
                     es.data.push(i);
                     es.ping();
                 }
+                freeformElement.SetCursorPosition(-1);
             });
 
             return inputEl;
@@ -314,7 +308,7 @@ export class TagRendering extends UIElement implements TagDependantUIElement {
         renderTemplate: string | Translation,
         placeholder?: string | Translation,
         extraTags?: TagsFilter,
-    }): InputElement<TagsFilter> {
+    }): TextField<TagsFilter> {
         if (freeform?.template === undefined) {
             return undefined;
         }
@@ -372,16 +366,11 @@ export class TagRendering extends UIElement implements TagDependantUIElement {
         }
 
 
-        const textField = new TextField({
+        return new TextField({
             placeholder: this._freeform.placeholder,
             fromString: pickString,
             toString: toString
         });
-
-        const pre = prepost[0] !== undefined ? this.ApplyTemplate(prepost[0]) : "";
-        const post = prepost[2] !== undefined ? this.ApplyTemplate(prepost[2]) : "";
-
-        return new InputElementWrapper(pre, textField, post);
     }