Add quickswitch for lengthinput

UI/Input/LengthInput.ts

@@ -8,6 +8,7 @@ import {GeoOperations} from "../../Logic/GeoOperations";
 import Minimap, {MinimapObj} from "../Base/Minimap";
 import BackgroundMapSwitch from "../BigComponents/BackgroundMapSwitch";
 import BaseUIElement from "../BaseUIElement";
+import CR = Mocha.reporters.Base.cursor.CR;
 
 
 /**
@@ -61,27 +62,28 @@ export default class LengthInput extends InputElement<string> {
             })
             
         }
-        const element = new Combine([
+        const crosshair =  new Combine([Svg.length_crosshair_svg().SetStyle(
-            new Combine([Svg.length_crosshair_svg().SetStyle(
             `position: absolute;top: 0;left: 0;transform:rotate(${this.value.data ?? 0}deg);`)
-            ])
+        ])  .SetClass("block length-crosshair-svg relative")
-                .SetClass("block length-crosshair-svg relative")
+            .SetStyle("z-index: 1000; visibility: hidden")
-                .SetStyle("z-index: 1000; visibility: hidden"),
+        
+        const element = new Combine([
+            crosshair,
             layerControl?.SetStyle("position: absolute; bottom: 0.25rem; left: 0.25rem; z-index: 1000"),
             map?.SetClass("w-full h-full block absolute top-0 left-O overflow-hidden"),
         ])
-            .SetClass("relative block bg-white border border-black rounded-3xl overflow-hidden")
+            .SetClass("relative block bg-white border border-black rounded-xl overflow-hidden")
             .ConstructElement()
 
 
-        this.RegisterTriggers(element, map?.leafletMap)
+        this.RegisterTriggers(map?.ConstructElement(), map?.leafletMap, crosshair.ConstructElement())
         element.style.overflow = "hidden"
         element.style.display = "block"
 
         return element
     }
 
-    private RegisterTriggers(htmlElement: HTMLElement, leafletMap: UIEventSource<L.Map>) {
+    private RegisterTriggers(htmlElement: HTMLElement, leafletMap: UIEventSource<L.Map>, measurementCrosshair: HTMLElement) {
 
         let firstClickXY: [number, number] = undefined
         let lastClickXY: [number, number] = undefined
@@ -123,7 +125,7 @@ export default class LengthInput extends InputElement<string> {
             }
 
 
-            const measurementCrosshair = htmlElement.getElementsByClassName("length-crosshair-svg")[0] as HTMLElement
+           // const measurementCrosshair = htmlElement.getElementsByClassName("length-crosshair-svg")[0] as HTMLElement
 
             const measurementCrosshairInner: HTMLElement = <HTMLElement>measurementCrosshair.firstChild
             if (firstClickXY === undefined) {

UI/Input/ValidatedTextField.ts

@@ -3,7 +3,7 @@ import * as EmailValidator from "email-validator";
 import {parsePhoneNumberFromString} from "libphonenumber-js";
 import {InputElement} from "./InputElement";
 import {TextField} from "./TextField";
-import {UIEventSource} from "../../Logic/UIEventSource";
+import {Store, UIEventSource} from "../../Logic/UIEventSource";
 import CombinedInputElement from "./CombinedInputElement";
 import SimpleDatePicker from "./SimpleDatePicker";
 import OpeningHoursInput from "../OpeningHours/OpeningHoursInput";
@@ -556,7 +556,8 @@ class LengthTextField extends TextFieldDef {
         return !isNaN(t)
     }
 
-    inputHelper = (value, options) => {
+    inputHelper = (value: UIEventSource<string>, options:
+        { location?: [number,number]; args?: string[]; feature?: any; mapBackgroundLayer?: Store<BaseLayer>; }) => {
         options = options ?? {}
         options.location = options.location ?? [0, 0]
 
@@ -590,7 +591,8 @@ class LengthTextField extends TextFieldDef {
                 location, new UIEventSource<string[]>(args[1].split(","))
             )
         }
-        const li = new LengthInput(options?.mapBackgroundLayer, location, value)
+        const background = options?.mapBackgroundLayer
+        const li = new LengthInput(new UIEventSource<BaseLayer>(background.data), location, value)
         li.SetStyle("height: 20rem;")
         return li;
     }
@@ -864,7 +866,12 @@ export default class ValidatedTextField {
     ]
     public static allTypes: Map<string, TextFieldDef> = ValidatedTextField.allTypesDict();
     public static ForType(type: string = "string"): TextFieldDef {
-        return ValidatedTextField.allTypes.get(type)
+        const def = ValidatedTextField.allTypes.get(type)
+        if(def === undefined){
+            console.warn("Something tried to load a validated text field named",type, "but this type does not exist")
+            return this.ForType()
+        }
+        return def
     }
 
     public static HelpText(): BaseUIElement {

UI/Popup/TagRenderingQuestion.ts

@@ -413,7 +413,7 @@ export default class TagRenderingQuestion extends Combine {
         const tagsData = tags.data;
         const feature = state?.allElements?.ContainingFeatures?.get(tagsData.id)
         const center = feature != undefined ? GeoOperations.centerpointCoordinates(feature) : [0,0]
-        const input: InputElement<string> = ValidatedTextField.ForType(configuration.freeform.type).ConstructInputElement({
+        const input: InputElement<string> = ValidatedTextField.ForType(configuration.freeform.type)?.ConstructInputElement({
             country: () => tagsData._country,
             location: [center[1], center[0]],
             mapBackgroundLayer: state?.backgroundLayer,
@@ -425,10 +425,10 @@ export default class TagRenderingQuestion extends Combine {
         });
         
         // Init with correct value
-        input.GetValue().setData(tagsData[freeform.key] ?? freeform.default);
+        input?.GetValue().setData(tagsData[freeform.key] ?? freeform.default);
         
         // Add a length check
-        input.GetValue().addCallbackD((v : string | undefined) => {
+        input?.GetValue().addCallbackD((v : string | undefined) => {
             if(v?.length >= 255){
                 feedback.setData(Translations.t.validation.tooLong.Subs({count: v.length}))
             }