Add minimap baseElement; add this as special rendering, add minimap beneath direction input element

test.ts

@@ -10,11 +10,15 @@ import {FixedUiElement} from "./UI/Base/FixedUiElement";
 import Img from "./UI/Base/Img";
 import {AttributedImage} from "./UI/Image/AttributedImage";
 import {Imgur} from "./Logic/ImageProviders/Imgur";
-import ReviewForm from "./UI/Reviews/ReviewForm";
-import {OsmConnection} from "./Logic/Osm/OsmConnection";
+import Minimap from "./UI/Base/Minimap";
+import Loc from "./Models/Loc";
+import AvailableBaseLayers from "./Logic/Actors/AvailableBaseLayers";
+import ShowDataLayer from "./UI/ShowDataLayer";
+import LayoutConfig from "./Customizations/JSON/LayoutConfig";
+import {AllKnownLayouts} from "./Customizations/AllKnownLayouts";
 
 
-function TestSlideshow(){
+function TestSlideshow() {
     const elems = new UIEventSource([
         new FixedUiElement("A"),
         new FixedUiElement("qmsldkfjqmlsdkjfmqlskdjfmqlksdf").SetClass("text-xl"),
@@ -25,17 +29,17 @@ function TestSlideshow(){
     new SlideShow(elems).AttachTo("maindiv")
 }
 
-function TestTagRendering(){
+function TestTagRendering() {
     State.state = new State(undefined)
     const tagsSource = new UIEventSource({
-        id:"node/1"
+        id: "node/1"
     })
     new TagRenderingQuestion(
         tagsSource,
         new TagRenderingConfig({
             multiAnswer: false,
             freeform: {
-                key:"valve"
+                key: "valve"
             },
             question: "What valves are supported?",
             render: "This pump supports {valve}",
@@ -45,25 +49,94 @@ function TestTagRendering(){
                     then: "This pump supports dunlop"
                 },
                 {
-                    if:"valve=shrader",
-                    then:"shrader is supported",
+                    if: "valve=shrader",
+                    then: "shrader is supported",
                 }
             ],
-            
+
         }, undefined, "test")
     ).AttachTo("maindiv")
     new VariableUiElement(tagsSource.map(tags => tags["valves"])).SetClass("alert").AttachTo("extradiv")
 }
 
-function TestAllInputMethods(){
+function TestAllInputMethods() {
 
     new Combine(ValidatedTextField.tpList.map(tp => {
         const tf = ValidatedTextField.InputForType(tp.name);
 
         return new Combine([tf, new VariableUiElement(tf.GetValue()).SetClass("alert")]);
-    })).AttachTo("maindiv")    
+    })).AttachTo("maindiv")
 }
 
-new ReviewForm(() => {
-    return undefined;
-}, new OsmConnection(true, new UIEventSource<string>(undefined), "test")).AttachTo("maindiv");
+
+const location = new UIEventSource<Loc>({
+    lon: 4.84771728515625,
+    lat: 51.17920846421931,
+    zoom: 14
+})
+const map0 = new Minimap({
+    location: location,
+    allowMoving: true,
+    background: new AvailableBaseLayers(location).availableEditorLayers.map(layers => layers[2])
+})
+map0.SetStyle("width: 500px; height: 250px; overflow: hidden; border: 2px solid red")
+    .AttachTo("maindiv")
+
+const layout = AllKnownLayouts.layoutsList[1]
+State.state = new State(layout)
+console.log("LAYOUT is", layout.id)
+
+const feature = {
+        "type": "Feature",
+        _matching_layer_id: "bike_repair_station",
+        "properties": {
+            id: "node/-1",
+            "amenity": "bicycle_repair_station"
+        },
+        "geometry": {
+            "type": "Point",
+            "coordinates": [
+                4.84771728515625,
+                51.17920846421931
+            ]
+        }
+    }
+
+;
+
+State.state.allElements.addOrGetElement(feature)
+
+const featureSource = new UIEventSource([{
+    freshness: new Date(),
+    feature: feature
+}])
+
+new ShowDataLayer(
+    featureSource,
+    map0.leafletMap,
+    new UIEventSource<LayoutConfig>(layout)
+)
+
+const map1 = new Minimap({
+        location: location,
+        allowMoving: true,
+        background: new AvailableBaseLayers(location).availableEditorLayers.map(layers => layers[5])
+    },
+)
+
+map1.SetStyle("width: 500px; height: 250px; overflow: hidden; border : 2px solid black")
+    .AttachTo("extradiv")
+
+
+
+
+
+new ShowDataLayer(
+    featureSource,
+    map1.leafletMap,
+    new UIEventSource<LayoutConfig>(layout)
+)
+
+featureSource.ping()
+
+// */