Solidarity transport implementation

web/layouts/_partials/address_autocomplete.html

@@ -1,13 +1,12 @@
 {{ define "address_autocomplete" }}
 
-
-<div class="col-span-6 relative" x-data="{
-    input: {{if .Address}}'{{.Address.Properties.label}}'{{else}}null{{end}},
-    address: {{if .Address}}JSON.stringify({{printf "%s" .Address.MarshalJSON}}){{else}}null{{end}},
-    addressObject: {{if .Address}}{{printf "%s" .Address.MarshalJSON}}{{else}}null{{end}},
+<div class="col-span-6 relative" x-data='{
+    input: {{if .Address}}"{{.Address.properties.label}}"{{else}}null{{end}},
+    address: {{if .Address}}JSON.stringify({{template "geojson" .Address}}){{else}}null{{end}},
+    addressObject: {{if .Address}}{{template "geojson" .Address }}{{else}}null{{end}},
     responselength: 0,
     async autocomplete() {
-        if(this.input == null || this.input == '') {
+        if(this.input == null || this.input == "") {
             this.responselength = 0
             return []
         }
@@ -15,22 +14,22 @@
             this.responselength = 0
             return []
         }
-        result = await fetch('https://api.geocode.earth/v1/autocomplete/\?api_key=ge-4949288cd450ad31&text=' + this.input)
+        result = await fetch("https://api.geocode.earth/v1/autocomplete/\?api_key=ge-4949288cd450ad31&text=" + this.input)
         json = await result.json()
 
-        this.responselength = json['features'].length
-        return json['features']
+        this.responselength = json["features"].length
+        return json["features"]
     },
     select(a) {
         this.address = JSON.stringify(a)
         this.addressObject = a
         this.input = a.properties.label
     }
-}">
+}'>
     <input type="hidden" name="{{ .FieldName }}" x-model="address">
     <label for="address" class="block text-sm font-medium text-gray-700">{{ if .FieldLabel }}{{.FieldLabel}}{{else}}Adresse{{end}}</label>
     <input type="text" 
-        class="mt-1 focus:ring-co-blue focus:border-co-blue block w-full shadow-sm sm:text-sm border-gray-300 rounded-2xl"
+        class="p-2 mt-1 focus:ring-co-blue focus:border-co-blue block w-full shadow-sm sm:text-sm border-gray-300 rounded-2xl"
         x-model="input">
 
     <ul x-show="responselength > 0"
@@ -46,3 +45,14 @@
     </ul>
 </div>
 {{ end }}
+
+{{define "geojson"}}{
+  "type": "Feature",
+  "geometry": {
+    "type": "Point",
+    "coordinates": [{{index .geometry.coordinates 0}}, {{index .geometry.coordinates 1}}],
+  },
+  "properties": {
+    "label": "{{.properties.label}}"
+  }
+}{{end}}

web/layouts/_partials/mainmenu.html

@@ -1,19 +1,20 @@
 {{define "mainmenu"}}
 
-{{range .LayoutState.MenuItems}}
+{{range .LayoutState.Menu}}
+{{if moduleAvailable .name }}
 <nav class="px-2 space-y-1">
-    <a href="{{.Link}}"
-        {{ if .Active }}
+    <a href="{{.link}}"
+        {{ if eq .name $.LayoutState.ActiveMenu }}
         class="bg-white text-co-blue group flex items-center px-2 py-2 text-base font-medium rounded-2xl">
         {{ else}}
         class="text-white hover:bg-white hover:bg-opacity-5 hover:text-co-blue group flex items-center px-2 py-2 text-base font-medium rounded-2xl">
         {{end}}
 
-        {{$.IconSet.Icon .Icon "mr-4 flex-shrink-0 h-6 w-6"}}
+        {{$.IconSet.Icon .icon "mr-4 flex-shrink-0 h-6 w-6"}}
         
-        {{.Title}}
+        {{.title}}
     </a>
 </nav>
 {{end}}
-
+{{end}}
 {{end}}

web/layouts/_partials/orb_address_autocomplete.html

@@ -0,0 +1,59 @@
+
+{{ define "address_autocomplete" }}
+
+<div class="col-span-6 relative" x-data='{
+    input: {{if .Address}}"{{.Address.Properties.label}}"{{else}}null{{end}},
+    address: {{if .Address}}JSON.stringify({{template "geojson" .Address}}){{else}}null{{end}},
+    addressObject: {{if .Address}}{{template "geojson" .Address }}{{else}}null{{end}},
+    responselength: 0,
+    async autocomplete() {
+        if(this.input == null || this.input == "") {
+            this.responselength = 0
+            return []
+        }
+        if(this.addressObject != null && this.input == this.addressObject.properties.label) {
+            this.responselength = 0
+            return []
+        }
+        result = await fetch("https://api.geocode.earth/v1/autocomplete/\?api_key=ge-4949288cd450ad31&text=" + this.input)
+        json = await result.json()
+
+        this.responselength = json["features"].length
+        return json["features"]
+    },
+    select(a) {
+        this.address = JSON.stringify(a)
+        this.addressObject = a
+        this.input = a.properties.label
+    }
+}'>
+    <input type="hidden" name="{{ .FieldName }}" x-model="address">
+    <label for="address" class="block text-sm font-medium text-gray-700">{{ if .FieldLabel }}{{.FieldLabel}}{{else}}Adresse{{end}}</label>
+    <input type="text" 
+        class="p-2 mt-1 focus:ring-co-blue focus:border-co-blue block w-full shadow-sm sm:text-sm border-gray-300 rounded-2xl"
+        x-model="input">
+
+    <ul x-show="responselength > 0"
+    class="absolute z-10 mt-1 w-full bg-white shadow-lg max-h-60 rounded-xl py-1 text-base overflow-auto focus:outline-none sm:text-sm" tabindex="-1" role="listbox" aria-labelledby="listbox-label" aria-activedescendant="listbox-option-3">
+        <template x-for="item in autocomplete">
+            <a href="#">
+                <li class="text-gray-900 hover:bg-gray-200 cursor-default select-none relative py-2 pl-3 pr-9" 
+                    @click="select(item)">
+                    <span class="font-normal block truncate" x-text="item.properties.label" ></span>
+                </li>
+            </a>
+        </template>
+    </ul>
+</div>
+{{ end }}
+
+{{define "geojson"}}{
+  "type": "Feature",
+  "geometry": {
+    "type": "Point",
+    "coordinates": [{{index .Point 0}}, {{index .Point 1}}],
+  },
+  "properties": {
+    "label": "{{.Properties.label}}"
+  }
+}{{end}}