Added a data entry system at /groups-add

Server/app/resources/basic/BasicController.jl

@@ -11,6 +11,7 @@ dict_layouts = Dict(
     :manifesto => generate_layout_html("main",controller,"manifesto"),
     :join_us => generate_layout_html("main",controller,"join_us",libraries=["Leaflet"]),
     :groups => generate_layout_html("main",controller,"groups",libraries=["Leaflet"]),
+    :groups_add => generate_layout_html("main",controller,"groups_add",libraries=["Leaflet"]),
     :cooperatives => generate_layout_html("main",controller,"cooperatives",libraries=["Leaflet"]),
     :communes => generate_layout_html("main",controller,"communes",libraries=["Leaflet"]),
     :parties => generate_layout_html("main",controller,"parties",libraries=["Leaflet"]),
@@ -162,6 +163,14 @@ function groups()
     )
 end
 
+function groups_add()
+    locale = get_locale()
+    html(:basic,:groups_add, layout = dict_layouts[:groups_add], context = @__MODULE__,
+        title = groups_info[locale][:title],
+        description = groups_info[locale][:description]
+    )
+end
+
 function cooperatives()
     locale = get_locale()
     html(:basic,:cooperatives, layout = dict_layouts[:cooperatives], context = @__MODULE__,
@@ -202,4 +211,16 @@ function political_compass()
     )
 end
 
+function groups_add_post()
+    data = collect(JSON3.read(rawpayload()))
+    push!(data,1)
+    dict = Dict(zip(["country","state","town","latitude","longitude","contact","members"],data))
+    insert_into_table("groups",dict)
 end
+
+end
+
+#=
+json_string = """["United States","California",null,38.24508142880928,-120.58593750000001,""]"""
+data = JSON3.read(json_string)´
+=#

Server/app/resources/basic/views/groups_add.jl.html

@@ -0,0 +1 @@
+<groups-add-component></groups-add-component>

Server/app/svelte/public/css/common.css

@@ -310,7 +310,7 @@ input[type="text"],input[type="email"],input[type="password"],input[type="number
     border-color: black;
     border: black solid 0.063rem;
     padding-left: 0.5rem;
-    font: 1.3rem var(--serif, serif);
+    font: 1.15rem var(--serif, serif);
 }
 
 input[type="text"] {

Server/app/svelte/public/js/communes.js

@@ -39,7 +39,7 @@ for (let c of communes) {
 
 export let communesMarkersLayer = L.layerGroup()
 
-export function addMarkersCommunes(map,content) {
+export function addMarkersCommunes(map,content,locale) {
     for (let g of communes) {
         let coordinates
         let text = "<b>"+content["Commune"]+"</b><br>"
@@ -50,7 +50,14 @@ export function addMarkersCommunes(map,content) {
             }
             else if (field=="location") {
                 let location = g[field][0]
-                let locationString = location.map(x => content[x]).join(", ")
+                let locationString
+                if (locale=="en") {
+                    locationString = location.map(x => x).join(", ")
+                }
+                else {
+                    locationString = location.map(x => content[x]).join(", ")
+                }
+
                 text += fieldText + locationString + "<br>"
                 coordinates = g[field][1]
             }

Server/app/svelte/public/js/coops.js

@@ -2,7 +2,7 @@ export let coops = [
     {
         logo: "chiron_logo",
         name: "Chiron Health",
-        location: [["Estonia","KohtlaJarve"],[59.41038769769602, 27.287802936242034]],
+        location: [["Estonia","Kohtla-Järve"],[59.41038769769602, 27.287802936242034]],
         market:   "wellnessAndHealth",
         workers: 2,
         status: "inDevelopment",
@@ -13,7 +13,7 @@ export let coops = [
     {
         logo: "kuusk_logo",
         name: "Kuusk",
-        location: [["Estonia","KohtlaJarve"],[59.399947051803004, 27.277159931677055]],
+        location: [["Estonia","Kohtla-Järve"],[59.399947051803004, 27.277159931677055]],
         market: "herbalTeas",
         workers: 1,
         status: "inDevelopment",
@@ -36,7 +36,7 @@ for (let g of coops) {
 
 export let coopsMarkersLayer = L.layerGroup()
 
-export function addMarkersCoops(map,content) {
+export function addMarkersCoops(map,content,locale) {
     for (let g of coops) {
         let coordinates
         let text = "<b>"+content["Cooperative"]+"</b><br>"
@@ -56,7 +56,13 @@ export function addMarkersCoops(map,content) {
             }
             else if (field=="location") {
                 let location = g[field][0]
-                let locationString = location.map(x => content[x]).join(", ")
+                let locationString
+                if (locale=="en") {
+                    locationString = location.map(x => x).join(", ")
+                }
+                else {
+                    locationString = location.map(x => content[x]).join(", ")
+                }
                 text += fieldText + locationString + "<br>"
                 coordinates = g[field][1]
             }

Server/app/svelte/public/js/groups.js

@@ -25,7 +25,7 @@ export let groups = [
         contact: ["https://discord.gg/Qk8KUk787z","DiscordInviteLink"]
     },
     {
-        location: [["Estonia","KohtlaJarve"], [59.40629447076191, 27.280605339416322]],
+        location: [["Estonia","Kohtla-Järve"], [59.40629447076191, 27.280605339416322]],
         members: 3,
         contact: ["https://discord.gg/Qk8KUk787z","DiscordInviteLink"]
     },
@@ -93,7 +93,7 @@ let groupsMarkersLayerIn = L.layerGroup()
 
 let contactGeneral =["https://discord.gg/4BUau4AZre","DiscordInviteLink"]
 
-function addMarkersToLayer(g,layer,content) {
+function addMarkersToLayer(g,layer,content,locale) {
     let coordinates
     let text = "<b>"+content["Group"]+"</b><br>"
     for (let field in g) {
@@ -103,7 +103,13 @@ function addMarkersToLayer(g,layer,content) {
         }
         else if (field=="location") {
             let location = g[field][0]
-            let locationString = location.map(x => content[x]).join(", ")
+            let locationString
+            if (locale=="en") {
+                locationString = location.map(x => x).join(", ")
+            }
+            else {
+                locationString = location.map(x => content[x]).join(", ")
+            }
             text += fieldText + locationString + "<br>"
             coordinates = g[field][1]
         }
@@ -123,15 +129,15 @@ function addMarkersToLayer(g,layer,content) {
     marker.addTo(layer).bindPopup(text)
 }
 
-export function addMarkersGroups(map,content) {
+export function addMarkersGroups(map,content,locale) {
     for (let g of groups) {
-        addMarkersToLayer(g,groupsMarkersLayerIn,content)
+        addMarkersToLayer(g,groupsMarkersLayerIn,content,locale)
     }
     for (let gs of Object.values(groupsByCountry)) {
         if (gs.length==1) {
             let g = {...gs[0]}
             g.location[0] = [g.location[0][0]]
-            addMarkersToLayer(g,groupsMarkersLayerOut,content)
+            addMarkersToLayer(g,groupsMarkersLayerOut,content,locale)
         }
         else {
             let locationName = [gs[0].location[0][0]]
@@ -153,7 +159,7 @@ export function addMarkersGroups(map,content) {
                 members: members,
                 contact: contact
             }
-            addMarkersToLayer(gNew,groupsMarkersLayerOut,content)
+            addMarkersToLayer(gNew,groupsMarkersLayerOut,content,locale)
         }
     }
     groupsMarkersLayerOut.addTo(groupsMarkersLayer)
@@ -172,37 +178,5 @@ function onZoomEnd(map) {
         groupsMarkersLayerIn.addTo(groupsMarkersLayer)
     }
 }
-/*
-function reverseGeocode(latitude, longitude) {
-    let url = `https://nominatim.openstreetmap.org/reverse?format=jsonv2&lat=${latitude}&lon=${longitude}`;
 
-    // Create a new XMLHttpRequest object
-    let xhr = new XMLHttpRequest();
   
-    // Set up the AJAX request
-    xhr.open('GET', url, true);
-    
-    // Define the onload function
-    xhr.onload = function() {
-      if (xhr.status === 200) {
-        // Parse the response JSON
-        let response = JSON.parse(xhr.responseText);
-        
-        // Extract the address information from the response
-        let address = response.address;
-        let city = address.city || address.town || address.village || address.hamlet;
-        let country = address.country;
-        let fullAddress = city + ', ' + country;
-        
-        // Do something with the address
-        console.log(fullAddress);
-      }
-    };
-    
-    // Send the AJAX request
-    xhr.send();
-  }
-  
-let latitude = 123.456; // Replace with your latitude
-let longitude = 78.901; // Replace with your longitude
-reverseGeocode(latitude, longitude);*/

Server/app/svelte/public/js/libraries/serverTools.js

@@ -1,17 +1,17 @@
 
 // Get data from server
 export function getData(path,callback) {   
-    var xhr = new XMLHttpRequest();
+    let xhr = new XMLHttpRequest();
-        xhr.overrideMimeType("application/json");
+    xhr.overrideMimeType("application/json")
-    xhr.open('GET', path, true);
+    xhr.open('GET', path, true)
     xhr.onreadystatechange = function () {
-          if (xhr.readyState == 4 && xhr.status == "200") {
+        if (xhr.readyState == 4 && xhr.status == "200") {
             if (callback !== undefined) {
-                callback(xhr.responseText);
+                callback(xhr.responseText)
             }
-          }
+        }
     };
-    xhr.send(null);  
+    xhr.send()  
 }
 
  // Parse JSON from given path into a given variable under a given key
@@ -35,6 +35,7 @@ export function sendData(route,data,callback) {
                     callback(xhr.responseText)
                 }
             } else {
+                console.log("Request gave an error")
                 // Oh no! There has been an error with the request!
             }
             }

Server/app/svelte/public/js/parties.js

@@ -22,7 +22,7 @@ for (let g of parties) {
 
 export let partiesMarkersLayer = L.layerGroup()
 
-export function addMarkersParties(map,content) {
+export function addMarkersParties(map,content,locale) {
     for (let g of parties) {
         let coordinates
         let text = "<b>"+content["Party"]+"</b><br>"
@@ -42,7 +42,13 @@ export function addMarkersParties(map,content) {
             }
             else if (field=="location") {
                 let location = g[field][0]
-                let locationString = location
+                let locationString
+                if (locale=="en") {
+                    locationString = location
+                }
+                else {
+                    locationString = content[location]
+                }
                 text += fieldText + locationString + "<br>"
                 coordinates = g[field][1]
             }

Server/app/svelte/public/locales/en/countries.json

@@ -1,29 +1,3 @@
 {
-    "map-prompt": "Want to appear on our map? Contact us!",
+    "map-prompt": "Want to appear on our map? Contact us!"
-    "Online": "Online",
-    "Denmark": "Denmark",
-    "Estonia": "Estonia",
-    "Greece": "Greece",
-    "Latvia": "Latvia",
-    "Canada": "Canada",
-    "Germany": "Germany",
-    "Copenhagen": "Copenhagen",
-    "Ireland": "Ireland",
-    "USA": "USA",
-    "Bulgaria": "Bulgaria",
-    "Colorado": "Colorado",
-    "Georgia": "Georgia",
-    "Ohio": "Ohio",
-    "Montreal": "Montreal",
-    "Kolding": "Kolding",
-    "KohtlaJarve": "Kohtla-Järve",
-    "Athens": "Athens",
-    "Riga": "Riga",
-    "Halifax": "Halifax",
-    "Wiesbaden": "Wiesbaden",
-    "Florida": "Florida",
-    "Tallinn": "Tallinn",
-    "Varna": "Varna",
-    "Louisville": "Louisville",
-    "Toronto": "Toronto"
 }

Server/app/svelte/public/locales/ru/countries.json

@@ -15,7 +15,7 @@
     "Ohio": "Огайо",
     "Copenhagen": "Копенгаген",
     "Kolding": "Колдинг",
-    "KohtlaJarve": "Кохтла-Ярве",
+    "Kohtla-Järve": "Кохтла-Ярве",
     "Athens": "Афины",
     "Riga": "Рига",
     "Halifax": "Галифакс",

Server/app/svelte/rollup.config.js

@@ -32,7 +32,6 @@ function serve() {
 	};
 }
 
-
 const walkSync = require("walk-sync");
 const paths = walkSync("./src", {globs: ["**/*.svelte"]}).map(x => "src/"+x)
 

Server/app/svelte/src/communes-component.svelte

@@ -17,9 +17,17 @@
     loadLocaleContent(content,"countries",loaded)
     let locale = loadLocaleContent(content,"communes-component",loaded)
 
-    function mapCallbackCommunes(createMap,content) {
+    function mapCallbackCommunes(createMap,content,locale) {
         let map = createMap([22, 0],2)
-        addMarkersCommunes(map,content)
+        addMarkersCommunes(map,content,locale)
+    }
+
+    function getCountry(name) {
+        return locale=="en" ? name : $content[name]
+    }
+
+    function getAddress(group) {
+        return group.location[0].map(x => locale=="en" ? x : $content[x]).join(", ")
     }
 
     onMount(() => { 
@@ -39,11 +47,11 @@
                 <map-component id="map" callback={(createMap) => mapCallbackCommunes(createMap,$content,locale)}></map-component>
                 <p id="add-prompt">{$content["map-prompt"]}</p>
                 {#each Object.entries(communesByCountry) as [name,communes]}
-                    <h4 class="country-name">{$content[name]}</h4>
+                    <h4 class="country-name">{getCountry(name)}</h4>
                     <div class="country-block">
                         {#each communes as commune}
                             <div class="location-info">
-                                <p><b>{$content.location}: </b>{commune.location[0].map(x => $content[x]).join(", ")}</p>
+                                <p><b>{$content.location}: </b>{getAddress(commune)}</p>
                                 <p><b>{$content.status}: </b>{$content[commune.status]}</p>
                                 <p><b>{$content.members}: </b>{commune.members}</p>
                                 <p><b>{$content.contact}: </b><a href={commune.contact[0]} target=;_blank; rel=noreferrer>{$content[commune.contact[1]]}</a></p>

Server/app/svelte/src/cooperatives-component.svelte

@@ -14,12 +14,20 @@
     let loaded = writable(0)
     let content = writable({})
 
-    loadLocaleContent(content,"countries",loaded)
+    let locale = loadLocaleContent(content,"countries",loaded)
-    let locale = loadLocaleContent(content,"cooperatives-component",loaded)
+    loadLocaleContent(content,"cooperatives-component",loaded)
 
     function mapCallbackCoops(createMap,content) {
         let map = createMap([22, 0],2)
-        addMarkersCoops(map,content)
+        addMarkersCoops(map,content,locale)
+    }
+
+    function getCountry(name) {
+        return locale=="en" ? name : $content[name]
+    }
+
+    function getAddress(group) {
+        return group.location[0].map(x => locale=="en" ? x : $content[x]).join(", ")
     }
 
     onMount(() => { 
@@ -38,14 +46,14 @@
                 <map-component id="map" callback={(createMap) => mapCallbackCoops(createMap,$content,locale)}></map-component>
                 <p id="add-prompt">{$content["map-prompt"]}</p>
                 {#each Object.entries(coopsByCountry) as [name,coops]}
-                    <h4 class="country-name">{$content[name]}</h4>
+                    <h4 class="country-name">{getCountry(name)}</h4>
                     <div class="country-block">
                         {#each coops as coop}
                             <div class="location-info">
                                 <div class="img-general-info">
                                     <div>
                                         <p><b>{$content.name}: </b>{coop.name}</p>
-                                        <p><b>{$content.location}: </b>{coop.location[0].map(x => $content[x]).join(", ")}</p>
+                                        <p><b>{$content.location}: </b>{getAddress(coop)}</p>
                                         <p><b>{$content.market}: </b>{$content[coop.market]}</p>
                                         <p><b>{$content.workers}: </b>{coop.workers}</p>
                                         <p><b>{$content.status}: </b>{$content[coop.status]}</p>

Server/app/svelte/src/groups-add-component.svelte

@@ -0,0 +1,248 @@
+<svelte:options tag="groups-add-component" />
+
+<script>
+    // Import statements
+    import { onMount } from 'svelte'
+    import { writable } from 'svelte/store';
+    import { groupsByCountry, addMarkersGroups } from '/js/groups.js'
+    import { loadLocaleContent, getData, sendData } from "/js/libraries/serverTools.js"
+    
+    // Import components
+    import "/js/components/map-component.js" 
+    
+    // Main code
+    let loaded = writable(0)
+    let content = writable({})
+
+    let addressInput
+    let contactInput
+    let addressVec
+    let userPinLat = 0
+    let userPinLng = 0
+    let userPin = createPin(0,0)
+    userPin.setOpacity(0)
+
+    let locale = loadLocaleContent(content,"groups-component",loaded)
+    loadLocaleContent(content,"countries",loaded)
+
+    function createPin(lat,lng) {
+        let markerIcon = new L.Icon({
+            iconUrl: '/img/common/markers/marker-black.png',
+            shadowUrl: 'https://cdnjs.cloudflare.com/ajax/libs/leaflet/0.7.7/images/marker-shadow.png',
+            iconSize: [25, 41],
+            iconAnchor: [12, 41],
+            popupAnchor: [1, -34],
+            shadowSize: [41, 41]
+        })
+        return L.marker([lat,lng], {icon: markerIcon})
+    }
+
+    function updatePin(marker,lat,lng) {
+        let newLatLng = L.latLng(lat, lng); // Replace with the desired coordinates
+        marker.setLatLng(newLatLng)
+    }
+
+    function reverseGeocode(latitude, longitude) {
+        let url = `https://nominatim.openstreetmap.org/reverse?lat=${latitude}&lon=${longitude}&format=jsonv2`;
+        
+        let callback = (response) => {
+            // Parse the response JSON
+            response = JSON.parse(response)
+            // Extract the address information from the response
+            let address = response.address
+            let city = address.city || address.town || address.village || address.hamlet
+            let state = address.state
+            let country = address.country
+            let fullAddress = country
+            if (state!=undefined) {
+                fullAddress += ", " + state
+            }
+            else {
+                state = ""
+            }
+            if (city!=undefined) {
+                fullAddress += ", " + city
+            }
+            else {
+                city = ""
+            }
+            addressInput.value = fullAddress
+            addressVec = [country,state,city]
+        }
+        getData(url,callback)
+    }
+
+    function mapCallbackGroups(createMap,content) {
+        let map = createMap([22, 0],2)
+        addMarkersGroups(map,content)
+
+        userPin.addTo(map)
+        map.on('click', function(event) {
+            let lat = event.latlng.lat;
+            let lng = event.latlng.lng;
+            userPinLat = lat
+            userPinLng = lng
+            updatePin(userPin,lat,lng)
+            userPin.setOpacity(1)
+            reverseGeocode(lat, lng)
+        })
+    }
+
+    function submitLocation() {
+        if (addressVec!=undefined) {
+            let data = [...addressVec,userPinLat,userPinLng,contactInput.value]
+            let url = "/" + locale + "/groups-add-post/"
+            console.log(data)
+            sendData(url,data)
+
+        }
+        
+    }
+    
+    onMount(() => { 
+
+    })
+</script>
+
+{#key $loaded}
+    {#if $loaded==2}
+        <div id="container">
+            <!--<img src="img/crowd.png" id="crowd" alt="crowd">-->
+            <div id="text-container">
+                <h1>Add a Group</h1>
+                <img id="groups-img" src="/img/common/groups.svg" alt="groups">
+                <p class="description">If there are no groups in your town with whom you can organize then</p>
+                <ol>
+                    <li>click on the map to show us where you are located,</li>
+                    <li>add a way to contact you or leave blank for a pin to point to our discord and</li>
+                    <li>press "Submit" to add yourself to our map</li>
+                </ol>
+                <label for="address-input">Location: </label><input bind:this={addressInput} id="address-input" type="text" readonly><br>
+                <label for="contact-input">Contact: </label><input bind:this={contactInput} id="contact-input" type="text">
+                <button id="submit-button" on:click={submitLocation}>Submit</button>
+                <map-component id="map" callback={(createMap) => mapCallbackGroups(createMap,$content)}></map-component>
+            </div>
+        </div>
+    {/if}
+{/key}
+
+<style>
+    @import '/css/common.css';
+
+    ol li {
+        margin-left: 3rem;
+    }
+
+    label {
+        display: inline-block;
+        font-family: var(--serif,serif);
+        font-size: 1.15rem;
+        line-height: 160%;
+        color: #222222;
+        width: 5.5rem;
+    }
+
+    input {
+        font-size: 1.15rem;
+        font-family: var(--serif,serif);
+        height: 2.5rem;
+    }
+
+    #address-input {
+        margin-top: 2rem;
+        margin-bottom: 1rem;
+        width: min(30rem,calc(100% - 10rem));
+    }
+
+    #contact-input {
+        width: min(20rem,calc(100% - 10rem));
+    }
+
+    .description {
+        margin-bottom: 1rem;
+    }
+
+    #submit-button {
+        display: block;
+        margin-top: 2rem;
+        margin-bottom: 2rem;
+        padding: 1rem 2rem;
+        font-size: 1.4rem;
+        font-family: var(--sans-serif,sans-serif);
+        border: 0rem solid black;
+        border-radius: 0.5rem;
+        background: #cb1816;
+        color: white;
+    }
+
+    #add-prompt {
+        margin-bottom: 2rem;
+    }
+
+    #groups-img {
+        position: absolute;
+        width: 14rem;
+        left: 50%;
+        transform: translate(-50%);
+        z-index: 0;
+        opacity: 0.2;
+    }
+
+    #text-container>:nth-child(3) {
+        margin-top: 8rem;
+    }
+
+    .country-name {
+        margin-bottom: 0.5rem;
+    }
+
+    .country-block {
+        margin-bottom: 2rem;
+    }
+
+    .location-info {
+        margin-bottom: 0.75rem;
+    }
+
+    .location-info p {
+        margin-bottom: 0;
+    }
+
+    a {
+        color: #DD1C1A;
+    }
+
+    #map {
+        --height: 30rem;
+        --width: 100%;
+        --margin-bottom: 0.5rem;
+    }
+
+    #text-container {
+        position: relative;
+        max-width: calc(100vw - 4rem);
+        margin: auto;
+    }
+
+    h1 {
+        margin-bottom: 1rem;
+        font-size: 2.2rem;
+        text-align: center;
+    }
+
+    h3 {
+        margin-bottom: 1rem;
+    }
+
+    #container {
+        margin: auto;
+        max-width: 800px;
+        margin-top: 1rem;
+        margin-bottom: 4rem;
+    }
+
+    #container p {
+        text-align: justify;
+    }
+
+</style>

Server/app/svelte/src/groups-component.svelte

@@ -5,7 +5,7 @@
     import { onMount } from 'svelte'
     import { writable } from 'svelte/store';
     import { groupsByCountry, addMarkersGroups } from '/js/groups.js'
-    import { loadLocaleContent} from "/js/libraries/serverTools.js"
+    import { loadLocaleContent, getData, sendData } from "/js/libraries/serverTools.js"
     
     // Import components
     import "/js/components/map-component.js" 
@@ -14,16 +14,24 @@
     let loaded = writable(0)
     let content = writable({})
 
-    loadLocaleContent(content,"groups-component",loaded)
+    let locale = loadLocaleContent(content,"groups-component",loaded)
     loadLocaleContent(content,"countries",loaded)
 
-    function mapCallbackGroups(createMap,content) {
+    function mapCallbackGroups(createMap,content,locale) {
         let map = createMap([22, 0],2)
-        addMarkersGroups(map,content)
+        addMarkersGroups(map,content,locale)
+    }
+
+    function getCountry(name) {
+        return locale=="en" ? name : $content[name]
+    }
+
+    function getAddress(group) {
+        return group.location[0].map(x => locale=="en" ? x : $content[x]).join(", ")
     }
     
     onMount(() => { 
-        //    {console.log(loaded)}
+
     })
 </script>
 
@@ -36,14 +44,14 @@
                 <img id="groups-img" src="/img/common/groups.svg" alt="groups">
                 <p class="description">{$content.p1}</p>
                 <h3>{$content.subheading1}</h3>
-                <map-component id="map" callback={(createMap) => mapCallbackGroups(createMap,$content)}></map-component>
+                <map-component id="map" callback={(createMap) => mapCallbackGroups(createMap,$content,locale)}></map-component>
                 <p id="add-prompt">{$content["map-prompt"]}</p>
                 {#each Object.entries(groupsByCountry) as [name,groups]}
-                    <h4 class="country-name">{$content[name]}</h4>
+                    <h4 class="country-name">{getCountry(name)}</h4>
                     <div class="country-block">
                         {#each groups as group}
                             <div class="location-info">
-                                <p><b>{$content.location}: </b>{group.location[0].map(x => $content[x]).join(", ")}</p>
+                                <p><b>{$content.location}: </b>{getAddress(group)}</p>
                                 <p><b>{$content.members}: </b>{group.members}</p>
                                 <p><b>{$content.contact}: </b><a href={group.contact[0]} target=;_blank; rel=noreferrer>{$content[group.contact[1]]}</a></p>
                             </div>

Server/app/svelte/src/join-us-component.svelte

@@ -24,12 +24,12 @@
     loadLocaleContent(content,"countries",loaded)
     let locale = loadLocaleContent(content,"join-us-component",loaded)
 
-    function mapCallback(createMap,content) {
+    function mapCallback(createMap,content,locale) {
         let map = createMap([22, 0],2)
-        addMarkersGroups(map,content)
+        addMarkersGroups(map,content,locale)
-        addMarkersCommunes(map,content)
+        addMarkersCommunes(map,content,locale)
-        addMarkersCoops(map,content)
+        addMarkersCoops(map,content,locale)
-        addMarkersParties(map,content)
+        addMarkersParties(map,content,locale)
 
         let overlayMaps = {
             "Groups": groupsMarkersLayer,
@@ -77,7 +77,7 @@
                     <p>{$content.nearYou}</p>
                 </div>
                 <p>{$content.noneNear} <a href="https://chat.whatsapp.com/BhnmUNljUxJ2AjeHUwyTKh" target="_blank" rel=noreferrer>{$content.WhatsAppGroup}</a> {$content.or} <a href="https://discord.gg/Qk8KUk787z" target="_blank" rel=noreferrer>{$content.DiscordServer}</a>{$content.helpStart}</p>
-                <map-component id="map" callback={(createMap) => mapCallback(createMap,$content)}></map-component>
+                <map-component id="map" callback={(createMap) => mapCallback(createMap,$content,locale)}></map-component>
             </div>
         </div>
     {/if}

Server/app/svelte/src/landing-component.svelte

@@ -36,12 +36,12 @@
     let locale = loadLocaleContent(content,"landing-component",loaded,changeWidth)
     changeWidth(locale)
 
-    function mapCallback(createMap,content) {
+    function mapCallback(createMap,content,locale) {
         let map = createMap([22, 0],2)
-        addMarkersGroups(map,content)
+        addMarkersGroups(map,content,locale)
-        addMarkersCommunes(map,content)
+        addMarkersCommunes(map,content,locale)
-        addMarkersCoops(map,content)
+        addMarkersCoops(map,content,locale)
-        addMarkersParties(map,content)
+        addMarkersParties(map,content,locale)
 
         let overlayMaps = {}
         overlayMaps[content.groups] = groupsMarkersLayer
@@ -107,7 +107,7 @@
                 </div>
                 -->
                 <h1 id="find-us">{$content.findUs}</h1>
-                <map-component id="map" callback={(createMap) => mapCallback(createMap,$content)} colors={["#23AC20","#CA2437","#217BC9","#FFD326"]}></map-component>
+                <map-component id="map" callback={(createMap) => mapCallback(createMap,$content,locale)} colors={["#23AC20","#CA2437","#217BC9","#FFD326"]}></map-component>
                 <h1>{$content.whatNow}</h1>
                 <div id="action-container">
                     <a class="link-button" href={"/" + locale + "/join-us"}>{$content.joinUs}</a>

Server/app/svelte/src/parties-component.svelte

@@ -15,11 +15,19 @@
     let content = writable({})
 
     loadLocaleContent(content,"countries",loaded)
-    loadLocaleContent(content,"parties-component",loaded)
+    let locale = loadLocaleContent(content,"parties-component",loaded)
 
-    function mapCallbackParties(createMap,content) {
+    function mapCallbackParties(createMap,content,locale) {
         let map = createMap([22, 0],2)
-        addMarkersParties(map,content)
+        addMarkersParties(map,content,locale)
+    }
+
+    function getCountry(name) {
+        return locale=="en" ? name : $content[name]
+    }
+
+    function getAddress(group) {
+        return locale=="en" ? group.location : $content[group.location]
     }
 
     onMount(() => { 
@@ -36,10 +44,10 @@
                 <img id="party-img" src="/img/common/parties.svg" alt="party">
                 <p class="description">{$content.p1}</p>
                 <h3>{$content.subheading1}</h3>
-                <map-component id="map" callback={(createMap) => mapCallbackParties(createMap,$content)}></map-component>
+                <map-component id="map" callback={(createMap) => mapCallbackParties(createMap,$content,locale)}></map-component>
                 <p id="add-prompt">{$content["map-prompt"]}</p>
                 {#each Object.entries(partiesByCountry) as [name,parties]}
-                    <h4 class="country-name">{$content[name]}</h4>
+                    <h4 class="country-name">{getCountry(name)}</h4>
                     <div class="country-block">
                         {#each parties as party}
                         <div class="location-info">
@@ -51,7 +59,7 @@
                                 </picture>
                                 <div>
                                     <p><b>{$content.name}: </b>{party.name}</p>
-                                    <p><b>{$content.location}: </b>{$content[party.location[0]]}</p>
+                                    <p><b>{$content.location}: </b>{getAddress(party)}</p>
                                     <p><b>{$content.link}: </b><a href={party.link} target=;_blank; rel=noreferrer>{party.link}</a></p>
                                 </div>
                             </div>

Server/app/svelte/src/partners-component.svelte

@@ -15,7 +15,15 @@
     let content = writable({})
 
     loadLocaleContent(content,"countries",loaded)
-    loadLocaleContent(content,"partners-component",loaded)
+    let locale = loadLocaleContent(content,"partners-component",loaded)
+
+    function getCountry(name) {
+        return locale=="en" ? name : $content[name]
+    }
+
+    function getAddress(group) {
+        return group.location[0].map(x => locale=="en" ? x : $content[x]).join(", ")
+    }
 
     onMount(() => { 
 
@@ -32,7 +40,7 @@
                 <p>{$content.p1}</p>
                 <h3>{$content.subheading1}</h3>
                 {#each Object.entries(partnersByCountry) as [name,partners]}
-                    <h4 class="country-name">{$content[name]}</h4>
+                    <h4 class="country-name">{getCountry(name)}</h4>
                     <div class="country-block">
                         {#each partners as partner}
                         <div class="location-info">
@@ -45,7 +53,7 @@
                                 <div>
                                     <p><b>{$content.name}: </b>{partner.name}</p>
                                     <p><b>{$content.type}: </b>{$content[partner.type]}</p>
-                                    <p><b>{$content.location}: </b>{$content[partner.location[0][0]] + (partner.location[0][1]=="" ? "" : ", " +  $content[partner.location[0][1]])}</p>
+                                    <p><b>{$content.location}: </b>{getAddress(partner)}</p>
                                     <p><b>{$content.link}: </b><a href={partner.link} target=;_blank; rel=noreferrer>{partner.link}</a></p>
                                 </div>
                             </div>

Server/db/migrations/2022026611846565_create_table_groups.jl

@@ -0,0 +1,24 @@
+module CreateTableGroups
+
+import SearchLight.Migrations: create_table, column, primary_key, add_index, drop_table
+
+function up()
+    create_table(:groups) do
+        [
+            primary_key()
+            column(:country, :string)
+            column(:state, :string)
+            column(:town, :string)
+            column(:contact, :string)
+            column(:latitude, :float)
+            column(:longitude, :float)
+            column(:members, :int)
+        ]
+    end
+end
+
+function down()
+    drop_table(:groups)
+end
+
+end

Server/lib/DatabaseSupport.jl

@@ -1,6 +1,6 @@
 
 module DatabaseSupport
-#=
+
 using SearchLight, SearchLightPostgreSQL, LibPQ
 using DataFrames
 
@@ -133,5 +133,5 @@ function add_foreign_key(table,name,table2,name2)
     ADD CONSTRAINT fk_$(table)_$(table2)_$(name) FOREIGN KEY ($name) REFERENCES $table2 ($name2);"""
     SearchLight.query(query)
 end
-=#
+
 end

Server/public/css/common.css

@@ -310,7 +310,7 @@ input[type="text"],input[type="email"],input[type="password"],input[type="number
     border-color: black;
     border: black solid 0.063rem;
     padding-left: 0.5rem;
-    font: 1.3rem var(--serif, serif);
+    font: 1.15rem var(--serif, serif);
 }
 
 input[type="text"] {

Server/public/js/communes.js

@@ -39,7 +39,7 @@ for (let c of communes) {
 
 export let communesMarkersLayer = L.layerGroup()
 
-export function addMarkersCommunes(map,content) {
+export function addMarkersCommunes(map,content,locale) {
     for (let g of communes) {
         let coordinates
         let text = "<b>"+content["Commune"]+"</b><br>"
@@ -50,7 +50,14 @@ export function addMarkersCommunes(map,content) {
             }
             else if (field=="location") {
                 let location = g[field][0]
-                let locationString = location.map(x => content[x]).join(", ")
+                let locationString
+                if (locale=="en") {
+                    locationString = location.map(x => x).join(", ")
+                }
+                else {
+                    locationString = location.map(x => content[x]).join(", ")
+                }
+
                 text += fieldText + locationString + "<br>"
                 coordinates = g[field][1]
             }

Server/public/js/components/cookies-dialog.js

@@ -1 +1,99 @@
-import{S as e,i as s,a as t,b as o,s as i,f as a,n as r,h as n,d as c,o as d}from"./index-4348483d.js";function p(e){let s;return{c(){s=a("div"),s.innerHTML="<div><p>We use cookies to improve your experience, personalise your content and analyse site usage. By clicking “OK”, you agree to the use of cookies.</p></div>",this.c=r,n(s,"id","wrapper")},m(e,t){o(e,s,t)},p:r,i:r,o:r,d(e){e&&c(s)}}}function u(e){return d((()=>{})),[]}class h extends e{constructor(e){super(),this.shadowRoot.innerHTML="<style>@import '/css/common.css';#wrapper{display:none;position:relative;height:5rem;width:100%;background:white;box-shadow:0 0 0.314rem rgb(187, 187, 187);;}</style>",s(this,{target:this.shadowRoot,props:t(this.attributes),customElement:!0},u,p,i,{},null),e&&e.target&&o(e.target,this,e.anchor)}}customElements.define("cookies-dialog",h);export{h as default};
+
+(function(l, r) { if (!l || l.getElementById('livereloadscript')) return; r = l.createElement('script'); r.async = 1; r.src = '//' + (self.location.host || 'localhost').split(':')[0] + ':35729/livereload.js?snipver=1'; r.id = 'livereloadscript'; l.getElementsByTagName('head')[0].appendChild(r) })(self.document);
+import { S as SvelteElement, i as init, a as attribute_to_object, b as insert_dev, s as safe_not_equal, d as dispatch_dev, v as validate_slots, o as onMount, k as element, n as noop, m as add_location, p as attr_dev, u as append_dev, h as detach_dev } from './index-d19aafba.js';
+
+/* src\components\cookies-dialog.svelte generated by Svelte v3.52.0 */
+const file = "src\\components\\cookies-dialog.svelte";
+
+function create_fragment(ctx) {
+	let div1;
+	let div0;
+	let p;
+
+	const block = {
+		c: function create() {
+			div1 = element("div");
+			div0 = element("div");
+			p = element("p");
+			p.textContent = "We use cookies to improve your experience, personalise your content and analyse site usage. By clicking “OK”, you agree to the use of cookies.";
+			this.c = noop;
+			add_location(p, file, 19, 8, 248);
+			add_location(div0, file, 18, 4, 233);
+			attr_dev(div1, "id", "wrapper");
+			add_location(div1, file, 17, 0, 209);
+		},
+		l: function claim(nodes) {
+			throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option");
+		},
+		m: function mount(target, anchor) {
+			insert_dev(target, div1, anchor);
+			append_dev(div1, div0);
+			append_dev(div0, p);
+		},
+		p: noop,
+		i: noop,
+		o: noop,
+		d: function destroy(detaching) {
+			if (detaching) detach_dev(div1);
+		}
+	};
+
+	dispatch_dev("SvelteRegisterBlock", {
+		block,
+		id: create_fragment.name,
+		type: "component",
+		source: "",
+		ctx
+	});
+
+	return block;
+}
+
+function instance($$self, $$props, $$invalidate) {
+	let { $$slots: slots = {}, $$scope } = $$props;
+	validate_slots('cookies-dialog', slots, []);
+
+	onMount(() => {
+		
+	});
+
+	const writable_props = [];
+
+	Object.keys($$props).forEach(key => {
+		if (!~writable_props.indexOf(key) && key.slice(0, 2) !== '$$' && key !== 'slot') console.warn(`<cookies-dialog> was created with unknown prop '${key}'`);
+	});
+
+	$$self.$capture_state = () => ({ onMount });
+	return [];
+}
+
+class Cookies_dialog extends SvelteElement {
+	constructor(options) {
+		super();
+		this.shadowRoot.innerHTML = `<style>@import '/css/common.css';#wrapper{display:none;position:relative;height:5rem;width:100%;background:white;box-shadow:0 0 0.314rem rgb(187, 187, 187);;}</style>`;
+
+		init(
+			this,
+			{
+				target: this.shadowRoot,
+				props: attribute_to_object(this.attributes),
+				customElement: true
+			},
+			instance,
+			create_fragment,
+			safe_not_equal,
+			{},
+			null
+		);
+
+		if (options) {
+			if (options.target) {
+				insert_dev(options.target, this, options.anchor);
+			}
+		}
+	}
+}
+
+customElements.define("cookies-dialog", Cookies_dialog);
+
+export { Cookies_dialog as default };

Server/public/js/components/footer-component.js

@@ -1 +1,347 @@
-import{S as t,i as e,a as o,b as r,s as a,e as i,n,d as s,c as m,f as c,t as f,g as d,h as l,v as g,l as h,q as p,m as u}from"./index-4348483d.js";import{w as b}from"./index-71440b21.js";import{loadLocaleContent as w}from"../../../../../../../../../js/libraries/serverTools.js";function v(t){let e,o,a,i,n,m,b,w,v,k,y,x,L,j,z,U,_,C,T,B,H,M,R=t[1].contactUs+"",A=t[1].inviteLink+"",D=t[1].inviteLink+"";return{c(){e=c("footer"),o=c("div"),a=c("div"),i=c("div"),n=c("h2"),m=f(R),b=d(),w=c("p"),v=f("Discord: "),k=c("a"),y=f(A),x=d(),L=c("p"),j=f("WhatsApp: "),z=c("a"),U=f(D),_=d(),C=c("button"),C.innerHTML='<svg xmlns="http://www.w3.org/2000/svg" width="42.545" height="72.601" viewBox="0 0 42.545 72.601"><g id="Group_268" data-name="Group 268" transform="translate(-6.177 -2.399)"><rect id="Rectangle_146" data-name="Rectangle 146" width="11" height="51" rx="5.5" transform="translate(22 24)" fill="#cb1816"></rect><path id="Path_1145" data-name="Path 1145" d="M23.814,4.021a5,5,0,0,1,7.372,0l16.134,17.6c2.94,3.207,1.046,10.4-3.686,8.379S28.02,14.081,28.391,13.524,16.544,27.976,11.366,30,4.741,24.828,7.68,21.621Z" fill="#DD1C1A"></path></g></svg>',T=d(),B=c("p"),B.innerHTML='Licensed under a Creative Commons <a href="https://creativecommons.org/licenses/by/4.0/legalcode " target="_blank" rel="noreferrer">CC BY 4.0 license</a>',l(k,"href","https://discord.gg/Qk8KUk787z"),l(k,"target","_blank"),l(k,"rel","noreferrer"),g(k,"margin-left","1.8rem"),l(z,"href","https://chat.whatsapp.com/BhnmUNljUxJ2AjeHUwyTKh"),l(z,"target","_blank"),l(z,"rel","noreferrer"),g(z,"margin-left","0.5rem"),l(i,"id","contact-us-container"),l(a,"id","footer-grid-content-container"),l(a,"class","logged"),l(C,"id","footer-up"),l(C,"aria-label","go up"),l(B,"id","footer-copyright"),l(o,"id","footer-content-container")},m(s,c){r(s,e,c),h(e,o),h(o,a),h(a,i),h(i,n),h(n,m),h(i,b),h(i,w),h(w,v),h(w,k),h(k,y),h(i,x),h(i,L),h(L,j),h(L,z),h(z,U),h(o,_),h(o,C),h(o,T),h(o,B),H||(M=p(C,"click",t[4]),H=!0)},p(t,e){2&e&&R!==(R=t[1].contactUs+"")&&u(m,R),2&e&&A!==(A=t[1].inviteLink+"")&&u(y,A),2&e&&D!==(D=t[1].inviteLink+"")&&u(U,D)},d(t){t&&s(e),H=!1,M()}}}function k(t){let e,o=2==t[0]&&v(t);return{c(){o&&o.c(),e=i()},m(t,a){o&&o.m(t,a),r(t,e,a)},p(t,r){2==t[0]?o?o.p(t,r):(o=v(t),o.c(),o.m(e.parentNode,e)):o&&(o.d(1),o=null)},d(t){o&&o.d(t),t&&s(e)}}}function y(t){let e,o=t[0],m=k(t);return{c(){m.c(),e=i(),this.c=n},m(t,o){m.m(t,o),r(t,e,o)},p(t,[r]){1&r&&a(o,o=t[0])?(m.d(1),m=k(t),m.c(),m.m(e.parentNode,e)):m.p(t,r)},i:n,o:n,d(t){t&&s(e),m.d(t)}}}function x(t,e,o){let r,a,i=b(0);m(t,i,(t=>o(0,r=t)));let n=b({});m(t,n,(t=>o(1,a=t))),w(n,"countries",i),w(n,"footer-component",i);return[r,a,i,n,()=>{location.href="#"}]}class L extends t{constructor(t){super(),this.shadowRoot.innerHTML="<style>@import '/css/common.css';footer{position:relative;bottom:0;width:100%;height:auto;background:#5B6970;border-top:#cb1816 solid 0.5rem}footer p,footer a{font-family:var(--sans-serif)}#footer-content-container{position:relative;margin:auto;padding-top:2rem;max-width:116rem;width:97vw}#footer-grid-content-container{display:grid;margin-left:2rem;margin-right:2rem;margin-bottom:1rem}.logged{grid-template-columns:auto auto 2rem}footer h2{color:#ffffff;font-size:1.3rem;margin-bottom:0.5rem}#footer-copyright{position:relative;margin:auto;width:100%;bottom:0rem;height:3rem;top:0rem;margin-bottom:0;font-size:1rem;text-align:center}#footer-copyright *{font-size:1rem}footer a{font-size:1.1rem;color:#ffffff}footer p{display:block;font-size:1.1rem;color:#d8d8d8;font-family:var(--sans-serif,sans-serif);margin-bottom:0.5rem}#contact-us-container{width:16rem}#footer-up{position:absolute;width:4.8rem;height:4.8rem;border-radius:3.4rem;top:4rem;right:2rem;background:#ffffff}#footer-up svg{width:40%;height:auto}@media only screen and (max-width: 1170px){.logged{grid-template-rows:auto auto auto;grid-template-columns:auto;row-gap:2rem}#footer-copyright{height:1rem;top:-2rem}}</style>",e(this,{target:this.shadowRoot,props:o(this.attributes),customElement:!0},x,y,a,{},null),t&&t.target&&r(t.target,this,t.anchor)}}customElements.define("footer-component",L);export{L as default};
+
+(function(l, r) { if (!l || l.getElementById('livereloadscript')) return; r = l.createElement('script'); r.async = 1; r.src = '//' + (self.location.host || 'localhost').split(':')[0] + ':35729/livereload.js?snipver=1'; r.id = 'livereloadscript'; l.getElementsByTagName('head')[0].appendChild(r) })(self.document);
+import { S as SvelteElement, i as init, a as attribute_to_object, b as insert_dev, s as safe_not_equal, d as dispatch_dev, v as validate_slots, c as validate_store, e as component_subscribe, f as empty, n as noop, h as detach_dev, k as element, t as text, l as space, G as svg_element, m as add_location, p as attr_dev, D as set_style, u as append_dev, y as listen_dev, w as set_data_dev } from './index-d19aafba.js';
+import { w as writable } from './index-4664ced0.js';
+import { loadLocaleContent } from '../../../../../../../../../js/libraries/serverTools.js';
+
+/* src\footer\footer-component.svelte generated by Svelte v3.52.0 */
+const file = "src\\footer\\footer-component.svelte";
+
+// (21:4) {#if $loaded==2}
+function create_if_block(ctx) {
+	let footer;
+	let div2;
+	let div1;
+	let div0;
+	let h2;
+	let t0_value = /*$content*/ ctx[1].contactUs + "";
+	let t0;
+	let t1;
+	let p0;
+	let t2;
+	let a0;
+	let t3_value = /*$content*/ ctx[1].inviteLink + "";
+	let t3;
+	let t4;
+	let p1;
+	let t5;
+	let a1;
+	let t6_value = /*$content*/ ctx[1].inviteLink + "";
+	let t6;
+	let t7;
+	let button;
+	let svg;
+	let g;
+	let rect;
+	let path;
+	let t8;
+	let p2;
+	let t9;
+	let a2;
+	let mounted;
+	let dispose;
+
+	const block = {
+		c: function create() {
+			footer = element("footer");
+			div2 = element("div");
+			div1 = element("div");
+			div0 = element("div");
+			h2 = element("h2");
+			t0 = text(t0_value);
+			t1 = space();
+			p0 = element("p");
+			t2 = text("Discord: ");
+			a0 = element("a");
+			t3 = text(t3_value);
+			t4 = space();
+			p1 = element("p");
+			t5 = text("WhatsApp: ");
+			a1 = element("a");
+			t6 = text(t6_value);
+			t7 = space();
+			button = element("button");
+			svg = svg_element("svg");
+			g = svg_element("g");
+			rect = svg_element("rect");
+			path = svg_element("path");
+			t8 = space();
+			p2 = element("p");
+			t9 = text("Licensed under a Creative Commons ");
+			a2 = element("a");
+			a2.textContent = "CC BY 4.0 license";
+			add_location(h2, file, 25, 24, 692);
+			attr_dev(a0, "href", "https://discord.gg/Qk8KUk787z");
+			attr_dev(a0, "target", "_blank");
+			attr_dev(a0, "rel", "noreferrer");
+			set_style(a0, "margin-left", "1.8rem");
+			add_location(a0, file, 27, 36, 858);
+			add_location(p0, file, 27, 24, 846);
+			attr_dev(a1, "href", "https://chat.whatsapp.com/BhnmUNljUxJ2AjeHUwyTKh");
+			attr_dev(a1, "target", "_blank");
+			attr_dev(a1, "rel", "noreferrer");
+			set_style(a1, "margin-left", "0.5rem");
+			add_location(a1, file, 28, 37, 1026);
+			add_location(p1, file, 28, 24, 1013);
+			attr_dev(div0, "id", "contact-us-container");
+			add_location(div0, file, 24, 20, 635);
+			attr_dev(div1, "id", "footer-grid-content-container");
+			attr_dev(div1, "class", "logged");
+			add_location(div1, file, 23, 16, 558);
+			attr_dev(rect, "id", "Rectangle_146");
+			attr_dev(rect, "data-name", "Rectangle 146");
+			attr_dev(rect, "width", "11");
+			attr_dev(rect, "height", "51");
+			attr_dev(rect, "rx", "5.5");
+			attr_dev(rect, "transform", "translate(22 24)");
+			attr_dev(rect, "fill", "#cb1816");
+			add_location(rect, file, 34, 24, 1573);
+			attr_dev(path, "id", "Path_1145");
+			attr_dev(path, "data-name", "Path 1145");
+			attr_dev(path, "d", "M23.814,4.021a5,5,0,0,1,7.372,0l16.134,17.6c2.94,3.207,1.046,10.4-3.686,8.379S28.02,14.081,28.391,13.524,16.544,27.976,11.366,30,4.741,24.828,7.68,21.621Z");
+			attr_dev(path, "fill", "#DD1C1A");
+			add_location(path, file, 35, 24, 1727);
+			attr_dev(g, "id", "Group_268");
+			attr_dev(g, "data-name", "Group 268");
+			attr_dev(g, "transform", "translate(-6.177 -2.399)");
+			add_location(g, file, 33, 24, 1470);
+			attr_dev(svg, "xmlns", "http://www.w3.org/2000/svg");
+			attr_dev(svg, "width", "42.545");
+			attr_dev(svg, "height", "72.601");
+			attr_dev(svg, "viewBox", "0 0 42.545 72.601");
+			add_location(svg, file, 32, 20, 1345);
+			attr_dev(button, "id", "footer-up");
+			attr_dev(button, "aria-label", "go up");
+			add_location(button, file, 31, 16, 1244);
+			attr_dev(a2, "href", "https://creativecommons.org/licenses/by/4.0/legalcode ");
+			attr_dev(a2, "target", "_blank");
+			attr_dev(a2, "rel", "noreferrer");
+			add_location(a2, file, 39, 75, 2137);
+			attr_dev(p2, "id", "footer-copyright");
+			add_location(p2, file, 39, 16, 2078);
+			attr_dev(div2, "id", "footer-content-container");
+			add_location(div2, file, 22, 12, 505);
+			add_location(footer, file, 21, 8, 483);
+		},
+		m: function mount(target, anchor) {
+			insert_dev(target, footer, anchor);
+			append_dev(footer, div2);
+			append_dev(div2, div1);
+			append_dev(div1, div0);
+			append_dev(div0, h2);
+			append_dev(h2, t0);
+			append_dev(div0, t1);
+			append_dev(div0, p0);
+			append_dev(p0, t2);
+			append_dev(p0, a0);
+			append_dev(a0, t3);
+			append_dev(div0, t4);
+			append_dev(div0, p1);
+			append_dev(p1, t5);
+			append_dev(p1, a1);
+			append_dev(a1, t6);
+			append_dev(div2, t7);
+			append_dev(div2, button);
+			append_dev(button, svg);
+			append_dev(svg, g);
+			append_dev(g, rect);
+			append_dev(g, path);
+			append_dev(div2, t8);
+			append_dev(div2, p2);
+			append_dev(p2, t9);
+			append_dev(p2, a2);
+
+			if (!mounted) {
+				dispose = listen_dev(button, "click", /*click_handler*/ ctx[4], false, false, false);
+				mounted = true;
+			}
+		},
+		p: function update(ctx, dirty) {
+			if (dirty & /*$content*/ 2 && t0_value !== (t0_value = /*$content*/ ctx[1].contactUs + "")) set_data_dev(t0, t0_value);
+			if (dirty & /*$content*/ 2 && t3_value !== (t3_value = /*$content*/ ctx[1].inviteLink + "")) set_data_dev(t3, t3_value);
+			if (dirty & /*$content*/ 2 && t6_value !== (t6_value = /*$content*/ ctx[1].inviteLink + "")) set_data_dev(t6, t6_value);
+		},
+		d: function destroy(detaching) {
+			if (detaching) detach_dev(footer);
+			mounted = false;
+			dispose();
+		}
+	};
+
+	dispatch_dev("SvelteRegisterBlock", {
+		block,
+		id: create_if_block.name,
+		type: "if",
+		source: "(21:4) {#if $loaded==2}",
+		ctx
+	});
+
+	return block;
+}
+
+// (20:0) {#key $loaded}
+function create_key_block(ctx) {
+	let if_block_anchor;
+	let if_block = /*$loaded*/ ctx[0] == 2 && create_if_block(ctx);
+
+	const block = {
+		c: function create() {
+			if (if_block) if_block.c();
+			if_block_anchor = empty();
+		},
+		m: function mount(target, anchor) {
+			if (if_block) if_block.m(target, anchor);
+			insert_dev(target, if_block_anchor, anchor);
+		},
+		p: function update(ctx, dirty) {
+			if (/*$loaded*/ ctx[0] == 2) {
+				if (if_block) {
+					if_block.p(ctx, dirty);
+				} else {
+					if_block = create_if_block(ctx);
+					if_block.c();
+					if_block.m(if_block_anchor.parentNode, if_block_anchor);
+				}
+			} else if (if_block) {
+				if_block.d(1);
+				if_block = null;
+			}
+		},
+		d: function destroy(detaching) {
+			if (if_block) if_block.d(detaching);
+			if (detaching) detach_dev(if_block_anchor);
+		}
+	};
+
+	dispatch_dev("SvelteRegisterBlock", {
+		block,
+		id: create_key_block.name,
+		type: "key",
+		source: "(20:0) {#key $loaded}",
+		ctx
+	});
+
+	return block;
+}
+
+function create_fragment(ctx) {
+	let previous_key = /*$loaded*/ ctx[0];
+	let key_block_anchor;
+	let key_block = create_key_block(ctx);
+
+	const block = {
+		c: function create() {
+			key_block.c();
+			key_block_anchor = empty();
+			this.c = noop;
+		},
+		l: function claim(nodes) {
+			throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option");
+		},
+		m: function mount(target, anchor) {
+			key_block.m(target, anchor);
+			insert_dev(target, key_block_anchor, anchor);
+		},
+		p: function update(ctx, [dirty]) {
+			if (dirty & /*$loaded*/ 1 && safe_not_equal(previous_key, previous_key = /*$loaded*/ ctx[0])) {
+				key_block.d(1);
+				key_block = create_key_block(ctx);
+				key_block.c();
+				key_block.m(key_block_anchor.parentNode, key_block_anchor);
+			} else {
+				key_block.p(ctx, dirty);
+			}
+		},
+		i: noop,
+		o: noop,
+		d: function destroy(detaching) {
+			if (detaching) detach_dev(key_block_anchor);
+			key_block.d(detaching);
+		}
+	};
+
+	dispatch_dev("SvelteRegisterBlock", {
+		block,
+		id: create_fragment.name,
+		type: "component",
+		source: "",
+		ctx
+	});
+
+	return block;
+}
+
+function instance($$self, $$props, $$invalidate) {
+	let $loaded;
+	let $content;
+	let { $$slots: slots = {}, $$scope } = $$props;
+	validate_slots('footer-component', slots, []);
+	let loaded = writable(0);
+	validate_store(loaded, 'loaded');
+	component_subscribe($$self, loaded, value => $$invalidate(0, $loaded = value));
+	let content = writable({});
+	validate_store(content, 'content');
+	component_subscribe($$self, content, value => $$invalidate(1, $content = value));
+	loadLocaleContent(content, "countries", loaded);
+	loadLocaleContent(content, "footer-component", loaded);
+	const writable_props = [];
+
+	Object.keys($$props).forEach(key => {
+		if (!~writable_props.indexOf(key) && key.slice(0, 2) !== '$$' && key !== 'slot') console.warn(`<footer-component> was created with unknown prop '${key}'`);
+	});
+
+	const click_handler = () => {
+		location.href = '#';
+	};
+
+	$$self.$capture_state = () => ({
+		writable,
+		loadLocaleContent,
+		loaded,
+		content,
+		$loaded,
+		$content
+	});
+
+	$$self.$inject_state = $$props => {
+		if ('loaded' in $$props) $$invalidate(2, loaded = $$props.loaded);
+		if ('content' in $$props) $$invalidate(3, content = $$props.content);
+	};
+
+	if ($$props && "$$inject" in $$props) {
+		$$self.$inject_state($$props.$$inject);
+	}
+
+	return [$loaded, $content, loaded, content, click_handler];
+}
+
+class Footer_component extends SvelteElement {
+	constructor(options) {
+		super();
+		this.shadowRoot.innerHTML = `<style>@import '/css/common.css';footer{position:relative;bottom:0;width:100%;height:auto;background:#5B6970;border-top:#cb1816 solid 0.5rem}footer p,footer a{font-family:var(--sans-serif)}#footer-content-container{position:relative;margin:auto;padding-top:2rem;max-width:116rem;width:97vw}#footer-grid-content-container{display:grid;margin-left:2rem;margin-right:2rem;margin-bottom:1rem}.logged{grid-template-columns:auto auto 2rem}footer h2{color:#ffffff;font-size:1.3rem;margin-bottom:0.5rem}#footer-copyright{position:relative;margin:auto;width:100%;bottom:0rem;height:3rem;top:0rem;margin-bottom:0;font-size:1rem;text-align:center}#footer-copyright *{font-size:1rem}footer a{font-size:1.1rem;color:#ffffff}footer p{display:block;font-size:1.1rem;color:#d8d8d8;font-family:var(--sans-serif,sans-serif);margin-bottom:0.5rem}#contact-us-container{width:16rem}#footer-up{position:absolute;width:4.8rem;height:4.8rem;border-radius:3.4rem;top:4rem;right:2rem;background:#ffffff}#footer-up svg{width:40%;height:auto}@media only screen and (max-width: 1170px){.logged{grid-template-rows:auto auto auto;grid-template-columns:auto;row-gap:2rem}#footer-copyright{height:1rem;top:-2rem}}</style>`;
+
+		init(
+			this,
+			{
+				target: this.shadowRoot,
+				props: attribute_to_object(this.attributes),
+				customElement: true
+			},
+			instance,
+			create_fragment,
+			safe_not_equal,
+			{},
+			null
+		);
+
+		if (options) {
+			if (options.target) {
+				insert_dev(options.target, this, options.anchor);
+			}
+		}
+	}
+}
+
+customElements.define("footer-component", Footer_component);
+
+export { Footer_component as default };

Server/public/js/components/groups-add-component.js

@@ -0,0 +1,476 @@
+
+(function(l, r) { if (!l || l.getElementById('livereloadscript')) return; r = l.createElement('script'); r.async = 1; r.src = '//' + (self.location.host || 'localhost').split(':')[0] + ':35729/livereload.js?snipver=1'; r.id = 'livereloadscript'; l.getElementsByTagName('head')[0].appendChild(r) })(self.document);
+import { S as SvelteElement, i as init, a as attribute_to_object, b as insert_dev, s as safe_not_equal, d as dispatch_dev, v as validate_slots, c as validate_store, e as component_subscribe, o as onMount, g as globals, f as empty, n as noop, h as detach_dev, C as binding_callbacks, k as element, l as space, m as add_location, p as attr_dev, q as src_url_equal, r as set_custom_element_data, u as append_dev, y as listen_dev } from './index-d19aafba.js';
+import { w as writable } from './index-4664ced0.js';
+import { groupsByCountry, addMarkersGroups } from '../../../../../../../../../js/groups.js';
+import { loadLocaleContent, getData, sendData } from '../../../../../../../../../js/libraries/serverTools.js';
+import '../../../../../../../../../js/components/map-component.js';
+
+/* src\groups-add-component.svelte generated by Svelte v3.52.0 */
+
+const { console: console_1 } = globals;
+
+const file = "src\\groups-add-component.svelte";
+
+// (108:4) {#if $loaded==2}
+function create_if_block(ctx) {
+	let div1;
+	let div0;
+	let h1;
+	let t1;
+	let img;
+	let img_src_value;
+	let t2;
+	let p;
+	let t4;
+	let ol;
+	let li0;
+	let t6;
+	let li1;
+	let t8;
+	let li2;
+	let t10;
+	let label0;
+	let input0;
+	let br;
+	let t12;
+	let label1;
+	let input1;
+	let t14;
+	let button;
+	let t16;
+	let map_component;
+	let map_component_callback_value;
+	let mounted;
+	let dispose;
+
+	const block = {
+		c: function create() {
+			div1 = element("div");
+			div0 = element("div");
+			h1 = element("h1");
+			h1.textContent = "Add a Group";
+			t1 = space();
+			img = element("img");
+			t2 = space();
+			p = element("p");
+			p.textContent = "If there are no groups in your town with whom you can organize then";
+			t4 = space();
+			ol = element("ol");
+			li0 = element("li");
+			li0.textContent = "click on the map to show us where you are located,";
+			t6 = space();
+			li1 = element("li");
+			li1.textContent = "add a way to contact you or leave blank for a pin to point to our discord and";
+			t8 = space();
+			li2 = element("li");
+			li2.textContent = "press \"Submit\" to add yourself to our map";
+			t10 = space();
+			label0 = element("label");
+			label0.textContent = "Location: ";
+			input0 = element("input");
+			br = element("br");
+			t12 = space();
+			label1 = element("label");
+			label1.textContent = "Contact: ";
+			input1 = element("input");
+			t14 = space();
+			button = element("button");
+			button.textContent = "Submit";
+			t16 = space();
+			map_component = element("map-component");
+			add_location(h1, file, 111, 16, 3533);
+			attr_dev(img, "id", "groups-img");
+			if (!src_url_equal(img.src, img_src_value = "/img/common/groups.svg")) attr_dev(img, "src", img_src_value);
+			attr_dev(img, "alt", "groups");
+			add_location(img, file, 112, 16, 3571);
+			attr_dev(p, "class", "description");
+			add_location(p, file, 113, 16, 3652);
+			add_location(li0, file, 115, 20, 3790);
+			add_location(li1, file, 116, 20, 3871);
+			add_location(li2, file, 117, 20, 3979);
+			add_location(ol, file, 114, 16, 3764);
+			attr_dev(label0, "for", "address-input");
+			add_location(label0, file, 119, 16, 4070);
+			attr_dev(input0, "id", "address-input");
+			attr_dev(input0, "type", "text");
+			input0.readOnly = true;
+			add_location(input0, file, 119, 61, 4115);
+			add_location(br, file, 119, 133, 4187);
+			attr_dev(label1, "for", "contact-input");
+			add_location(label1, file, 120, 16, 4209);
+			attr_dev(input1, "id", "contact-input");
+			attr_dev(input1, "type", "text");
+			add_location(input1, file, 120, 60, 4253);
+			attr_dev(button, "id", "submit-button");
+			add_location(button, file, 121, 16, 4334);
+			set_custom_element_data(map_component, "id", "map");
+			set_custom_element_data(map_component, "callback", map_component_callback_value = /*func*/ ctx[10]);
+			add_location(map_component, file, 122, 16, 4420);
+			attr_dev(div0, "id", "text-container");
+			add_location(div0, file, 110, 12, 3490);
+			attr_dev(div1, "id", "container");
+			add_location(div1, file, 108, 8, 3387);
+		},
+		m: function mount(target, anchor) {
+			insert_dev(target, div1, anchor);
+			append_dev(div1, div0);
+			append_dev(div0, h1);
+			append_dev(div0, t1);
+			append_dev(div0, img);
+			append_dev(div0, t2);
+			append_dev(div0, p);
+			append_dev(div0, t4);
+			append_dev(div0, ol);
+			append_dev(ol, li0);
+			append_dev(ol, t6);
+			append_dev(ol, li1);
+			append_dev(ol, t8);
+			append_dev(ol, li2);
+			append_dev(div0, t10);
+			append_dev(div0, label0);
+			append_dev(div0, input0);
+			/*input0_binding*/ ctx[8](input0);
+			append_dev(div0, br);
+			append_dev(div0, t12);
+			append_dev(div0, label1);
+			append_dev(div0, input1);
+			/*input1_binding*/ ctx[9](input1);
+			append_dev(div0, t14);
+			append_dev(div0, button);
+			append_dev(div0, t16);
+			append_dev(div0, map_component);
+
+			if (!mounted) {
+				dispose = listen_dev(button, "click", /*submitLocation*/ ctx[7], false, false, false);
+				mounted = true;
+			}
+		},
+		p: function update(ctx, dirty) {
+			if (dirty & /*$content*/ 8 && map_component_callback_value !== (map_component_callback_value = /*func*/ ctx[10])) {
+				set_custom_element_data(map_component, "callback", map_component_callback_value);
+			}
+		},
+		d: function destroy(detaching) {
+			if (detaching) detach_dev(div1);
+			/*input0_binding*/ ctx[8](null);
+			/*input1_binding*/ ctx[9](null);
+			mounted = false;
+			dispose();
+		}
+	};
+
+	dispatch_dev("SvelteRegisterBlock", {
+		block,
+		id: create_if_block.name,
+		type: "if",
+		source: "(108:4) {#if $loaded==2}",
+		ctx
+	});
+
+	return block;
+}
+
+// (107:0) {#key $loaded}
+function create_key_block(ctx) {
+	let if_block_anchor;
+	let if_block = /*$loaded*/ ctx[2] == 2 && create_if_block(ctx);
+
+	const block = {
+		c: function create() {
+			if (if_block) if_block.c();
+			if_block_anchor = empty();
+		},
+		m: function mount(target, anchor) {
+			if (if_block) if_block.m(target, anchor);
+			insert_dev(target, if_block_anchor, anchor);
+		},
+		p: function update(ctx, dirty) {
+			if (/*$loaded*/ ctx[2] == 2) {
+				if (if_block) {
+					if_block.p(ctx, dirty);
+				} else {
+					if_block = create_if_block(ctx);
+					if_block.c();
+					if_block.m(if_block_anchor.parentNode, if_block_anchor);
+				}
+			} else if (if_block) {
+				if_block.d(1);
+				if_block = null;
+			}
+		},
+		d: function destroy(detaching) {
+			if (if_block) if_block.d(detaching);
+			if (detaching) detach_dev(if_block_anchor);
+		}
+	};
+
+	dispatch_dev("SvelteRegisterBlock", {
+		block,
+		id: create_key_block.name,
+		type: "key",
+		source: "(107:0) {#key $loaded}",
+		ctx
+	});
+
+	return block;
+}
+
+function create_fragment(ctx) {
+	let previous_key = /*$loaded*/ ctx[2];
+	let key_block_anchor;
+	let key_block = create_key_block(ctx);
+
+	const block = {
+		c: function create() {
+			key_block.c();
+			key_block_anchor = empty();
+			this.c = noop;
+		},
+		l: function claim(nodes) {
+			throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option");
+		},
+		m: function mount(target, anchor) {
+			key_block.m(target, anchor);
+			insert_dev(target, key_block_anchor, anchor);
+		},
+		p: function update(ctx, [dirty]) {
+			if (dirty & /*$loaded*/ 4 && safe_not_equal(previous_key, previous_key = /*$loaded*/ ctx[2])) {
+				key_block.d(1);
+				key_block = create_key_block(ctx);
+				key_block.c();
+				key_block.m(key_block_anchor.parentNode, key_block_anchor);
+			} else {
+				key_block.p(ctx, dirty);
+			}
+		},
+		i: noop,
+		o: noop,
+		d: function destroy(detaching) {
+			if (detaching) detach_dev(key_block_anchor);
+			key_block.d(detaching);
+		}
+	};
+
+	dispatch_dev("SvelteRegisterBlock", {
+		block,
+		id: create_fragment.name,
+		type: "component",
+		source: "",
+		ctx
+	});
+
+	return block;
+}
+
+function createPin(lat, lng) {
+	let markerIcon = new L.Icon({
+			iconUrl: '/img/common/markers/marker-black.png',
+			shadowUrl: 'https://cdnjs.cloudflare.com/ajax/libs/leaflet/0.7.7/images/marker-shadow.png',
+			iconSize: [25, 41],
+			iconAnchor: [12, 41],
+			popupAnchor: [1, -34],
+			shadowSize: [41, 41]
+		});
+
+	return L.marker([lat, lng], { icon: markerIcon });
+}
+
+function updatePin(marker, lat, lng) {
+	let newLatLng = L.latLng(lat, lng); // Replace with the desired coordinates
+	marker.setLatLng(newLatLng);
+}
+
+function instance($$self, $$props, $$invalidate) {
+	let $loaded;
+	let $content;
+	let { $$slots: slots = {}, $$scope } = $$props;
+	validate_slots('groups-add-component', slots, []);
+	let loaded = writable(0);
+	validate_store(loaded, 'loaded');
+	component_subscribe($$self, loaded, value => $$invalidate(2, $loaded = value));
+	let content = writable({});
+	validate_store(content, 'content');
+	component_subscribe($$self, content, value => $$invalidate(3, $content = value));
+	let addressInput;
+	let contactInput;
+	let addressVec;
+	let userPinLat = 0;
+	let userPinLng = 0;
+	let userPin = createPin(0, 0);
+	userPin.setOpacity(0);
+	let locale = loadLocaleContent(content, "groups-component", loaded);
+	loadLocaleContent(content, "countries", loaded);
+
+	function reverseGeocode(latitude, longitude) {
+		let url = `https://nominatim.openstreetmap.org/reverse?lat=${latitude}&lon=${longitude}&format=jsonv2`;
+
+		let callback = response => {
+			// Parse the response JSON
+			response = JSON.parse(response);
+
+			// Extract the address information from the response
+			let address = response.address;
+
+			let city = address.city || address.town || address.village || address.hamlet;
+			let state = address.state;
+			let country = address.country;
+			let fullAddress = country;
+
+			if (state != undefined) {
+				fullAddress += ", " + state;
+			} else {
+				state = "";
+			}
+
+			if (city != undefined) {
+				fullAddress += ", " + city;
+			} else {
+				city = "";
+			}
+
+			$$invalidate(0, addressInput.value = fullAddress, addressInput);
+			addressVec = [country, state, city];
+		};
+
+		getData(url, callback);
+	}
+
+	function mapCallbackGroups(createMap, content) {
+		let map = createMap([22, 0], 2);
+		addMarkersGroups(map, content);
+		userPin.addTo(map);
+
+		map.on('click', function (event) {
+			let lat = event.latlng.lat;
+			let lng = event.latlng.lng;
+			userPinLat = lat;
+			userPinLng = lng;
+			updatePin(userPin, lat, lng);
+			userPin.setOpacity(1);
+			reverseGeocode(lat, lng);
+		});
+	}
+
+	function submitLocation() {
+		if (addressVec != undefined) {
+			let data = [...addressVec, userPinLat, userPinLng, contactInput.value];
+			let url = "/" + locale + "/groups-add-post/";
+			console.log(data);
+			sendData(url, data);
+		}
+	}
+
+	onMount(() => {
+		
+	});
+
+	const writable_props = [];
+
+	Object.keys($$props).forEach(key => {
+		if (!~writable_props.indexOf(key) && key.slice(0, 2) !== '$$' && key !== 'slot') console_1.warn(`<groups-add-component> was created with unknown prop '${key}'`);
+	});
+
+	function input0_binding($$value) {
+		binding_callbacks[$$value ? 'unshift' : 'push'](() => {
+			addressInput = $$value;
+			$$invalidate(0, addressInput);
+		});
+	}
+
+	function input1_binding($$value) {
+		binding_callbacks[$$value ? 'unshift' : 'push'](() => {
+			contactInput = $$value;
+			$$invalidate(1, contactInput);
+		});
+	}
+
+	const func = createMap => mapCallbackGroups(createMap, $content);
+
+	$$self.$capture_state = () => ({
+		onMount,
+		writable,
+		groupsByCountry,
+		addMarkersGroups,
+		loadLocaleContent,
+		getData,
+		sendData,
+		loaded,
+		content,
+		addressInput,
+		contactInput,
+		addressVec,
+		userPinLat,
+		userPinLng,
+		userPin,
+		locale,
+		createPin,
+		updatePin,
+		reverseGeocode,
+		mapCallbackGroups,
+		submitLocation,
+		$loaded,
+		$content
+	});
+
+	$$self.$inject_state = $$props => {
+		if ('loaded' in $$props) $$invalidate(4, loaded = $$props.loaded);
+		if ('content' in $$props) $$invalidate(5, content = $$props.content);
+		if ('addressInput' in $$props) $$invalidate(0, addressInput = $$props.addressInput);
+		if ('contactInput' in $$props) $$invalidate(1, contactInput = $$props.contactInput);
+		if ('addressVec' in $$props) addressVec = $$props.addressVec;
+		if ('userPinLat' in $$props) userPinLat = $$props.userPinLat;
+		if ('userPinLng' in $$props) userPinLng = $$props.userPinLng;
+		if ('userPin' in $$props) userPin = $$props.userPin;
+		if ('locale' in $$props) locale = $$props.locale;
+	};
+
+	if ($$props && "$$inject" in $$props) {
+		$$self.$inject_state($$props.$$inject);
+	}
+
+	return [
+		addressInput,
+		contactInput,
+		$loaded,
+		$content,
+		loaded,
+		content,
+		mapCallbackGroups,
+		submitLocation,
+		input0_binding,
+		input1_binding,
+		func
+	];
+}
+
+class Groups_add_component extends SvelteElement {
+	constructor(options) {
+		super();
+		this.shadowRoot.innerHTML = `<style>@import '/css/common.css';ol li{margin-left:3rem}label{display:inline-block;font-family:var(--serif,serif);font-size:1.15rem;line-height:160%;color:#222222;width:5.5rem}input{font-size:1.15rem;font-family:var(--serif,serif);height:2.5rem}#address-input{margin-top:2rem;margin-bottom:1rem;width:min(30rem,calc(100% - 10rem))}#contact-input{width:min(20rem,calc(100% - 10rem))}.description{margin-bottom:1rem}#submit-button{display:block;margin-top:2rem;margin-bottom:2rem;padding:1rem 2rem;font-size:1.4rem;font-family:var(--sans-serif,sans-serif);border:0rem solid black;border-radius:0.5rem;background:#cb1816;color:white}#groups-img{position:absolute;width:14rem;left:50%;transform:translate(-50%);z-index:0;opacity:0.2}#text-container>:nth-child(3){margin-top:8rem}#map{--height:30rem;--width:100%;--margin-bottom:0.5rem}#text-container{position:relative;max-width:calc(100vw - 4rem);margin:auto}h1{margin-bottom:1rem;font-size:2.2rem;text-align:center}#container{margin:auto;max-width:800px;margin-top:1rem;margin-bottom:4rem}#container p{text-align:justify}</style>`;
+
+		init(
+			this,
+			{
+				target: this.shadowRoot,
+				props: attribute_to_object(this.attributes),
+				customElement: true
+			},
+			instance,
+			create_fragment,
+			safe_not_equal,
+			{},
+			null
+		);
+
+		if (options) {
+			if (options.target) {
+				insert_dev(options.target, this, options.anchor);
+			}
+		}
+	}
+}
+
+customElements.define("groups-add-component", Groups_add_component);
+
+export { Groups_add_component as default };

Server/public/js/components/groups-component.js

@@ -1 +1,576 @@
-import{S as t,i as o,a as n,b as e,s as r,e as a,n as i,d as m,c as s,o as c,f as l,t as p,g,h as u,j as d,k as h,l as f,m as b,p as j}from"./index-4348483d.js";import{w as x}from"./index-71440b21.js";import{addMarkersGroups as v,groupsByCountry as w}from"../../../../../../../../../js/groups.js";import{loadLocaleContent as y}from"../../../../../../../../../js/libraries/serverTools.js";import"../../../../../../../../../js/components/map-component.js";function k(t,o,n){const e=t.slice();return e[7]=o[n][0],e[8]=o[n][1],e}function z(t,o,n){const e=t.slice();return e[11]=o[n],e}function D(t){let o,n,r,a,i,s,c,x,v,y,z,D,E,O,R,T,A,C,H,L,M=t[1].groups+"",S=t[1].p1+"",_=t[1].subheading1+"",q=t[1]["map-prompt"]+"",B=Object.entries(w),F=[];for(let o=0;o<B.length;o+=1)F[o]=N(k(t,B,o));return{c(){o=l("div"),n=l("div"),r=l("h1"),a=p(M),i=g(),s=l("img"),x=g(),v=l("p"),y=p(S),z=g(),D=l("h3"),E=p(_),O=g(),R=l("map-component"),A=g(),C=l("p"),H=p(q),L=g();for(let t=0;t<F.length;t+=1)F[t].c();u(s,"id","groups-img"),d(s.src,c="/img/common/groups.svg")||u(s,"src","/img/common/groups.svg"),u(s,"alt","groups"),u(v,"class","description"),h(R,"id","map"),h(R,"callback",T=t[5]),u(C,"id","add-prompt"),u(n,"id","text-container"),u(o,"id","container")},m(t,m){e(t,o,m),f(o,n),f(n,r),f(r,a),f(n,i),f(n,s),f(n,x),f(n,v),f(v,y),f(n,z),f(n,D),f(D,E),f(n,O),f(n,R),f(n,A),f(n,C),f(C,H),f(n,L);for(let t=0;t<F.length;t+=1)F[t].m(n,null)},p(t,o){if(2&o&&M!==(M=t[1].groups+"")&&b(a,M),2&o&&S!==(S=t[1].p1+"")&&b(y,S),2&o&&_!==(_=t[1].subheading1+"")&&b(E,_),2&o&&T!==(T=t[5])&&h(R,"callback",T),2&o&&q!==(q=t[1]["map-prompt"]+"")&&b(H,q),2&o){let e;for(B=Object.entries(w),e=0;e<B.length;e+=1){const r=k(t,B,e);F[e]?F[e].p(r,o):(F[e]=N(r),F[e].c(),F[e].m(n,null))}for(;e<F.length;e+=1)F[e].d(1);F.length=B.length}},d(t){t&&m(o),j(F,t)}}}function E(t){let o,n,r,a,i,s,c,d,h,j,x,v,w,y,k,z,D,E,N,O=t[1].location+"",R=t[11].location[0].map(t[6]).join(", ")+"",T=t[1].members+"",A=t[11].members+"",C=t[1].contact+"",H=t[1][t[11].contact[1]]+"";return{c(){o=l("div"),n=l("p"),r=l("b"),a=p(O),i=p(": "),s=p(R),c=g(),d=l("p"),h=l("b"),j=p(T),x=p(": "),v=p(A),w=g(),y=l("p"),k=l("b"),z=p(C),D=p(": "),E=l("a"),N=p(H),u(E,"href",t[11].contact[0]),u(E,"target",";_blank;"),u(E,"rel","noreferrer"),u(o,"class","location-info")},m(t,m){e(t,o,m),f(o,n),f(n,r),f(r,a),f(r,i),f(n,s),f(o,c),f(o,d),f(d,h),f(h,j),f(h,x),f(d,v),f(o,w),f(o,y),f(y,k),f(k,z),f(k,D),f(y,E),f(E,N)},p(t,o){2&o&&O!==(O=t[1].location+"")&&b(a,O),2&o&&R!==(R=t[11].location[0].map(t[6]).join(", ")+"")&&b(s,R),2&o&&T!==(T=t[1].members+"")&&b(j,T),2&o&&C!==(C=t[1].contact+"")&&b(z,C),2&o&&H!==(H=t[1][t[11].contact[1]]+"")&&b(N,H)},d(t){t&&m(o)}}}function N(t){let o,n,r,a,i,s=t[1][t[7]]+"",c=t[8],d=[];for(let o=0;o<c.length;o+=1)d[o]=E(z(t,c,o));return{c(){o=l("h4"),n=p(s),r=g(),a=l("div");for(let t=0;t<d.length;t+=1)d[t].c();i=g(),u(o,"class","country-name"),u(a,"class","country-block")},m(t,m){e(t,o,m),f(o,n),e(t,r,m),e(t,a,m);for(let t=0;t<d.length;t+=1)d[t].m(a,null);f(a,i)},p(t,o){if(2&o&&s!==(s=t[1][t[7]]+"")&&b(n,s),2&o){let n;for(c=t[8],n=0;n<c.length;n+=1){const e=z(t,c,n);d[n]?d[n].p(e,o):(d[n]=E(e),d[n].c(),d[n].m(a,i))}for(;n<d.length;n+=1)d[n].d(1);d.length=c.length}},d(t){t&&m(o),t&&m(r),t&&m(a),j(d,t)}}}function O(t){let o,n=2==t[0]&&D(t);return{c(){n&&n.c(),o=a()},m(t,r){n&&n.m(t,r),e(t,o,r)},p(t,e){2==t[0]?n?n.p(t,e):(n=D(t),n.c(),n.m(o.parentNode,o)):n&&(n.d(1),n=null)},d(t){n&&n.d(t),t&&m(o)}}}function R(t){let o,n=t[0],s=O(t);return{c(){s.c(),o=a(),this.c=i},m(t,n){s.m(t,n),e(t,o,n)},p(t,[e]){1&e&&r(n,n=t[0])?(s.d(1),s=O(t),s.c(),s.m(o.parentNode,o)):s.p(t,e)},i:i,o:i,d(t){t&&m(o),s.d(t)}}}function T(t,o,n){let e,r,a=x(0);s(t,a,(t=>n(0,e=t)));let i=x({});function m(t,o){let n=t([22,0],2);v(n,o)}s(t,i,(t=>n(1,r=t))),y(i,"groups-component",a),y(i,"countries",a),c((()=>{}));return[e,r,a,i,m,t=>m(t,r),t=>r[t]]}class A extends t{constructor(t){super(),this.shadowRoot.innerHTML="<style>@import '/css/common.css';.description{margin-bottom:1rem}#add-prompt{margin-bottom:2rem}#groups-img{position:absolute;width:14rem;left:50%;transform:translate(-50%);z-index:0;opacity:0.2}#text-container>:nth-child(3){margin-top:8rem}.country-name{margin-bottom:0.5rem}.country-block{margin-bottom:2rem}.location-info{margin-bottom:0.75rem}.location-info p{margin-bottom:0}a{color:#DD1C1A}#map{--height:30rem;--width:100%;--margin-bottom:0.5rem}#text-container{position:relative;max-width:calc(100vw - 4rem);margin:auto}h1{margin-bottom:1rem;font-size:2.2rem;text-align:center}h3{margin-bottom:1rem}#container{margin:auto;max-width:800px;margin-top:1rem;margin-bottom:4rem}#container p{text-align:justify}</style>",o(this,{target:this.shadowRoot,props:n(this.attributes),customElement:!0},T,R,r,{},null),t&&t.target&&e(t.target,this,t.anchor)}}customElements.define("groups-component",A);export{A as default};
+
+(function(l, r) { if (!l || l.getElementById('livereloadscript')) return; r = l.createElement('script'); r.async = 1; r.src = '//' + (self.location.host || 'localhost').split(':')[0] + ':35729/livereload.js?snipver=1'; r.id = 'livereloadscript'; l.getElementsByTagName('head')[0].appendChild(r) })(self.document);
+import { S as SvelteElement, i as init, a as attribute_to_object, b as insert_dev, s as safe_not_equal, d as dispatch_dev, v as validate_slots, c as validate_store, e as component_subscribe, o as onMount, g as globals, f as empty, n as noop, h as detach_dev, j as validate_each_argument, k as element, t as text, l as space, m as add_location, p as attr_dev, q as src_url_equal, r as set_custom_element_data, u as append_dev, w as set_data_dev, x as destroy_each } from './index-d19aafba.js';
+import { w as writable } from './index-4664ced0.js';
+import { groupsByCountry, addMarkersGroups } from '../../../../../../../../../js/groups.js';
+import { loadLocaleContent, getData, sendData } from '../../../../../../../../../js/libraries/serverTools.js';
+import '../../../../../../../../../js/components/map-component.js';
+
+/* src\groups-component.svelte generated by Svelte v3.52.0 */
+
+const { Object: Object_1 } = globals;
+
+const file = "src\\groups-component.svelte";
+
+function get_each_context(ctx, list, i) {
+	const child_ctx = ctx.slice();
+	child_ctx[9] = list[i][0];
+	child_ctx[10] = list[i][1];
+	return child_ctx;
+}
+
+function get_each_context_1(ctx, list, i) {
+	const child_ctx = ctx.slice();
+	child_ctx[13] = list[i];
+	return child_ctx;
+}
+
+// (39:4) {#if $loaded==2}
+function create_if_block(ctx) {
+	let div1;
+	let div0;
+	let h1;
+	let t0_value = /*$content*/ ctx[0].groups + "";
+	let t0;
+	let t1;
+	let img;
+	let img_src_value;
+	let t2;
+	let p0;
+	let t3_value = /*$content*/ ctx[0].p1 + "";
+	let t3;
+	let t4;
+	let h3;
+	let t5_value = /*$content*/ ctx[0].subheading1 + "";
+	let t5;
+	let t6;
+	let map_component;
+	let map_component_callback_value;
+	let t7;
+	let p1;
+	let t8_value = /*$content*/ ctx[0]["map-prompt"] + "";
+	let t8;
+	let t9;
+	let each_value = Object.entries(groupsByCountry);
+	validate_each_argument(each_value);
+	let each_blocks = [];
+
+	for (let i = 0; i < each_value.length; i += 1) {
+		each_blocks[i] = create_each_block(get_each_context(ctx, each_value, i));
+	}
+
+	const block = {
+		c: function create() {
+			div1 = element("div");
+			div0 = element("div");
+			h1 = element("h1");
+			t0 = text(t0_value);
+			t1 = space();
+			img = element("img");
+			t2 = space();
+			p0 = element("p");
+			t3 = text(t3_value);
+			t4 = space();
+			h3 = element("h3");
+			t5 = text(t5_value);
+			t6 = space();
+			map_component = element("map-component");
+			t7 = space();
+			p1 = element("p");
+			t8 = text(t8_value);
+			t9 = space();
+
+			for (let i = 0; i < each_blocks.length; i += 1) {
+				each_blocks[i].c();
+			}
+
+			add_location(h1, file, 42, 16, 1236);
+			attr_dev(img, "id", "groups-img");
+			if (!src_url_equal(img.src, img_src_value = "/img/common/groups.svg")) attr_dev(img, "src", img_src_value);
+			attr_dev(img, "alt", "groups");
+			add_location(img, file, 43, 16, 1280);
+			attr_dev(p0, "class", "description");
+			add_location(p0, file, 44, 16, 1361);
+			add_location(h3, file, 45, 16, 1419);
+			set_custom_element_data(map_component, "id", "map");
+			set_custom_element_data(map_component, "callback", map_component_callback_value = /*func*/ ctx[8]);
+			add_location(map_component, file, 46, 16, 1468);
+			attr_dev(p1, "id", "add-prompt");
+			add_location(p1, file, 47, 16, 1597);
+			attr_dev(div0, "id", "text-container");
+			add_location(div0, file, 41, 12, 1193);
+			attr_dev(div1, "id", "container");
+			add_location(div1, file, 39, 8, 1090);
+		},
+		m: function mount(target, anchor) {
+			insert_dev(target, div1, anchor);
+			append_dev(div1, div0);
+			append_dev(div0, h1);
+			append_dev(h1, t0);
+			append_dev(div0, t1);
+			append_dev(div0, img);
+			append_dev(div0, t2);
+			append_dev(div0, p0);
+			append_dev(p0, t3);
+			append_dev(div0, t4);
+			append_dev(div0, h3);
+			append_dev(h3, t5);
+			append_dev(div0, t6);
+			append_dev(div0, map_component);
+			append_dev(div0, t7);
+			append_dev(div0, p1);
+			append_dev(p1, t8);
+			append_dev(div0, t9);
+
+			for (let i = 0; i < each_blocks.length; i += 1) {
+				each_blocks[i].m(div0, null);
+			}
+		},
+		p: function update(ctx, dirty) {
+			if (dirty & /*$content*/ 1 && t0_value !== (t0_value = /*$content*/ ctx[0].groups + "")) set_data_dev(t0, t0_value);
+			if (dirty & /*$content*/ 1 && t3_value !== (t3_value = /*$content*/ ctx[0].p1 + "")) set_data_dev(t3, t3_value);
+			if (dirty & /*$content*/ 1 && t5_value !== (t5_value = /*$content*/ ctx[0].subheading1 + "")) set_data_dev(t5, t5_value);
+
+			if (dirty & /*$content*/ 1 && map_component_callback_value !== (map_component_callback_value = /*func*/ ctx[8])) {
+				set_custom_element_data(map_component, "callback", map_component_callback_value);
+			}
+
+			if (dirty & /*$content*/ 1 && t8_value !== (t8_value = /*$content*/ ctx[0]["map-prompt"] + "")) set_data_dev(t8, t8_value);
+
+			if (dirty & /*Object, groupsByCountry, $content, getAddress, getCountry*/ 193) {
+				each_value = Object.entries(groupsByCountry);
+				validate_each_argument(each_value);
+				let i;
+
+				for (i = 0; i < each_value.length; i += 1) {
+					const child_ctx = get_each_context(ctx, each_value, i);
+
+					if (each_blocks[i]) {
+						each_blocks[i].p(child_ctx, dirty);
+					} else {
+						each_blocks[i] = create_each_block(child_ctx);
+						each_blocks[i].c();
+						each_blocks[i].m(div0, null);
+					}
+				}
+
+				for (; i < each_blocks.length; i += 1) {
+					each_blocks[i].d(1);
+				}
+
+				each_blocks.length = each_value.length;
+			}
+		},
+		d: function destroy(detaching) {
+			if (detaching) detach_dev(div1);
+			destroy_each(each_blocks, detaching);
+		}
+	};
+
+	dispatch_dev("SvelteRegisterBlock", {
+		block,
+		id: create_if_block.name,
+		type: "if",
+		source: "(39:4) {#if $loaded==2}",
+		ctx
+	});
+
+	return block;
+}
+
+// (52:24) {#each groups as group}
+function create_each_block_1(ctx) {
+	let div;
+	let p0;
+	let b0;
+	let t0_value = /*$content*/ ctx[0].location + "";
+	let t0;
+	let t1;
+	let t2_value = /*getAddress*/ ctx[7](/*group*/ ctx[13]) + "";
+	let t2;
+	let t3;
+	let p1;
+	let b1;
+	let t4_value = /*$content*/ ctx[0].members + "";
+	let t4;
+	let t5;
+	let t6_value = /*group*/ ctx[13].members + "";
+	let t6;
+	let t7;
+	let p2;
+	let b2;
+	let t8_value = /*$content*/ ctx[0].contact + "";
+	let t8;
+	let t9;
+	let a;
+	let t10_value = /*$content*/ ctx[0][/*group*/ ctx[13].contact[1]] + "";
+	let t10;
+
+	const block = {
+		c: function create() {
+			div = element("div");
+			p0 = element("p");
+			b0 = element("b");
+			t0 = text(t0_value);
+			t1 = text(": ");
+			t2 = text(t2_value);
+			t3 = space();
+			p1 = element("p");
+			b1 = element("b");
+			t4 = text(t4_value);
+			t5 = text(": ");
+			t6 = text(t6_value);
+			t7 = space();
+			p2 = element("p");
+			b2 = element("b");
+			t8 = text(t8_value);
+			t9 = text(": ");
+			a = element("a");
+			t10 = text(t10_value);
+			add_location(b0, file, 53, 35, 1980);
+			add_location(p0, file, 53, 32, 1977);
+			add_location(b1, file, 54, 35, 2068);
+			add_location(p1, file, 54, 32, 2065);
+			add_location(b2, file, 55, 35, 2151);
+			attr_dev(a, "href", /*group*/ ctx[13].contact[0]);
+			attr_dev(a, "target", ";_blank;");
+			attr_dev(a, "rel", "noreferrer");
+			add_location(a, file, 55, 62, 2178);
+			add_location(p2, file, 55, 32, 2148);
+			attr_dev(div, "class", "location-info");
+			add_location(div, file, 52, 28, 1916);
+		},
+		m: function mount(target, anchor) {
+			insert_dev(target, div, anchor);
+			append_dev(div, p0);
+			append_dev(p0, b0);
+			append_dev(b0, t0);
+			append_dev(b0, t1);
+			append_dev(p0, t2);
+			append_dev(div, t3);
+			append_dev(div, p1);
+			append_dev(p1, b1);
+			append_dev(b1, t4);
+			append_dev(b1, t5);
+			append_dev(p1, t6);
+			append_dev(div, t7);
+			append_dev(div, p2);
+			append_dev(p2, b2);
+			append_dev(b2, t8);
+			append_dev(b2, t9);
+			append_dev(p2, a);
+			append_dev(a, t10);
+		},
+		p: function update(ctx, dirty) {
+			if (dirty & /*$content*/ 1 && t0_value !== (t0_value = /*$content*/ ctx[0].location + "")) set_data_dev(t0, t0_value);
+			if (dirty & /*$content*/ 1 && t4_value !== (t4_value = /*$content*/ ctx[0].members + "")) set_data_dev(t4, t4_value);
+			if (dirty & /*$content*/ 1 && t8_value !== (t8_value = /*$content*/ ctx[0].contact + "")) set_data_dev(t8, t8_value);
+			if (dirty & /*$content*/ 1 && t10_value !== (t10_value = /*$content*/ ctx[0][/*group*/ ctx[13].contact[1]] + "")) set_data_dev(t10, t10_value);
+		},
+		d: function destroy(detaching) {
+			if (detaching) detach_dev(div);
+		}
+	};
+
+	dispatch_dev("SvelteRegisterBlock", {
+		block,
+		id: create_each_block_1.name,
+		type: "each",
+		source: "(52:24) {#each groups as group}",
+		ctx
+	});
+
+	return block;
+}
+
+// (49:16) {#each Object.entries(groupsByCountry) as [name,groups]}
+function create_each_block(ctx) {
+	let h4;
+	let t0_value = /*getCountry*/ ctx[6](/*name*/ ctx[9]) + "";
+	let t0;
+	let t1;
+	let div;
+	let t2;
+	let each_value_1 = /*groups*/ ctx[10];
+	validate_each_argument(each_value_1);
+	let each_blocks = [];
+
+	for (let i = 0; i < each_value_1.length; i += 1) {
+		each_blocks[i] = create_each_block_1(get_each_context_1(ctx, each_value_1, i));
+	}
+
+	const block = {
+		c: function create() {
+			h4 = element("h4");
+			t0 = text(t0_value);
+			t1 = space();
+			div = element("div");
+
+			for (let i = 0; i < each_blocks.length; i += 1) {
+				each_blocks[i].c();
+			}
+
+			t2 = space();
+			attr_dev(h4, "class", "country-name");
+			add_location(h4, file, 49, 20, 1740);
+			attr_dev(div, "class", "country-block");
+			add_location(div, file, 50, 20, 1810);
+		},
+		m: function mount(target, anchor) {
+			insert_dev(target, h4, anchor);
+			append_dev(h4, t0);
+			insert_dev(target, t1, anchor);
+			insert_dev(target, div, anchor);
+
+			for (let i = 0; i < each_blocks.length; i += 1) {
+				each_blocks[i].m(div, null);
+			}
+
+			append_dev(div, t2);
+		},
+		p: function update(ctx, dirty) {
+			if (dirty & /*Object, groupsByCountry, $content, getAddress*/ 129) {
+				each_value_1 = /*groups*/ ctx[10];
+				validate_each_argument(each_value_1);
+				let i;
+
+				for (i = 0; i < each_value_1.length; i += 1) {
+					const child_ctx = get_each_context_1(ctx, each_value_1, i);
+
+					if (each_blocks[i]) {
+						each_blocks[i].p(child_ctx, dirty);
+					} else {
+						each_blocks[i] = create_each_block_1(child_ctx);
+						each_blocks[i].c();
+						each_blocks[i].m(div, t2);
+					}
+				}
+
+				for (; i < each_blocks.length; i += 1) {
+					each_blocks[i].d(1);
+				}
+
+				each_blocks.length = each_value_1.length;
+			}
+		},
+		d: function destroy(detaching) {
+			if (detaching) detach_dev(h4);
+			if (detaching) detach_dev(t1);
+			if (detaching) detach_dev(div);
+			destroy_each(each_blocks, detaching);
+		}
+	};
+
+	dispatch_dev("SvelteRegisterBlock", {
+		block,
+		id: create_each_block.name,
+		type: "each",
+		source: "(49:16) {#each Object.entries(groupsByCountry) as [name,groups]}",
+		ctx
+	});
+
+	return block;
+}
+
+// (38:0) {#key $loaded}
+function create_key_block(ctx) {
+	let if_block_anchor;
+	let if_block = /*$loaded*/ ctx[1] == 2 && create_if_block(ctx);
+
+	const block = {
+		c: function create() {
+			if (if_block) if_block.c();
+			if_block_anchor = empty();
+		},
+		m: function mount(target, anchor) {
+			if (if_block) if_block.m(target, anchor);
+			insert_dev(target, if_block_anchor, anchor);
+		},
+		p: function update(ctx, dirty) {
+			if (/*$loaded*/ ctx[1] == 2) {
+				if (if_block) {
+					if_block.p(ctx, dirty);
+				} else {
+					if_block = create_if_block(ctx);
+					if_block.c();
+					if_block.m(if_block_anchor.parentNode, if_block_anchor);
+				}
+			} else if (if_block) {
+				if_block.d(1);
+				if_block = null;
+			}
+		},
+		d: function destroy(detaching) {
+			if (if_block) if_block.d(detaching);
+			if (detaching) detach_dev(if_block_anchor);
+		}
+	};
+
+	dispatch_dev("SvelteRegisterBlock", {
+		block,
+		id: create_key_block.name,
+		type: "key",
+		source: "(38:0) {#key $loaded}",
+		ctx
+	});
+
+	return block;
+}
+
+function create_fragment(ctx) {
+	let previous_key = /*$loaded*/ ctx[1];
+	let key_block_anchor;
+	let key_block = create_key_block(ctx);
+
+	const block = {
+		c: function create() {
+			key_block.c();
+			key_block_anchor = empty();
+			this.c = noop;
+		},
+		l: function claim(nodes) {
+			throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option");
+		},
+		m: function mount(target, anchor) {
+			key_block.m(target, anchor);
+			insert_dev(target, key_block_anchor, anchor);
+		},
+		p: function update(ctx, [dirty]) {
+			if (dirty & /*$loaded*/ 2 && safe_not_equal(previous_key, previous_key = /*$loaded*/ ctx[1])) {
+				key_block.d(1);
+				key_block = create_key_block(ctx);
+				key_block.c();
+				key_block.m(key_block_anchor.parentNode, key_block_anchor);
+			} else {
+				key_block.p(ctx, dirty);
+			}
+		},
+		i: noop,
+		o: noop,
+		d: function destroy(detaching) {
+			if (detaching) detach_dev(key_block_anchor);
+			key_block.d(detaching);
+		}
+	};
+
+	dispatch_dev("SvelteRegisterBlock", {
+		block,
+		id: create_fragment.name,
+		type: "component",
+		source: "",
+		ctx
+	});
+
+	return block;
+}
+
+function instance($$self, $$props, $$invalidate) {
+	let $content;
+	let $loaded;
+	let { $$slots: slots = {}, $$scope } = $$props;
+	validate_slots('groups-component', slots, []);
+	let loaded = writable(0);
+	validate_store(loaded, 'loaded');
+	component_subscribe($$self, loaded, value => $$invalidate(1, $loaded = value));
+	let content = writable({});
+	validate_store(content, 'content');
+	component_subscribe($$self, content, value => $$invalidate(0, $content = value));
+	let locale = loadLocaleContent(content, "groups-component", loaded);
+	loadLocaleContent(content, "countries", loaded);
+
+	function mapCallbackGroups(createMap, content, locale) {
+		let map = createMap([22, 0], 2);
+		addMarkersGroups(map, content, locale);
+	}
+
+	function getCountry(name) {
+		return locale == "en" ? name : $content[name];
+	}
+
+	function getAddress(group) {
+		return group.location[0].map(x => locale == "en" ? x : $content[x]).join(", ");
+	}
+
+	onMount(() => {
+		
+	});
+
+	const writable_props = [];
+
+	Object_1.keys($$props).forEach(key => {
+		if (!~writable_props.indexOf(key) && key.slice(0, 2) !== '$$' && key !== 'slot') console.warn(`<groups-component> was created with unknown prop '${key}'`);
+	});
+
+	const func = createMap => mapCallbackGroups(createMap, $content, locale);
+
+	$$self.$capture_state = () => ({
+		onMount,
+		writable,
+		groupsByCountry,
+		addMarkersGroups,
+		loadLocaleContent,
+		getData,
+		sendData,
+		loaded,
+		content,
+		locale,
+		mapCallbackGroups,
+		getCountry,
+		getAddress,
+		$content,
+		$loaded
+	});
+
+	$$self.$inject_state = $$props => {
+		if ('loaded' in $$props) $$invalidate(2, loaded = $$props.loaded);
+		if ('content' in $$props) $$invalidate(3, content = $$props.content);
+		if ('locale' in $$props) $$invalidate(4, locale = $$props.locale);
+	};
+
+	if ($$props && "$$inject" in $$props) {
+		$$self.$inject_state($$props.$$inject);
+	}
+
+	return [
+		$content,
+		$loaded,
+		loaded,
+		content,
+		locale,
+		mapCallbackGroups,
+		getCountry,
+		getAddress,
+		func
+	];
+}
+
+class Groups_component extends SvelteElement {
+	constructor(options) {
+		super();
+		this.shadowRoot.innerHTML = `<style>@import '/css/common.css';.description{margin-bottom:1rem}#add-prompt{margin-bottom:2rem}#groups-img{position:absolute;width:14rem;left:50%;transform:translate(-50%);z-index:0;opacity:0.2}#text-container>:nth-child(3){margin-top:8rem}.country-name{margin-bottom:0.5rem}.country-block{margin-bottom:2rem}.location-info{margin-bottom:0.75rem}.location-info p{margin-bottom:0}a{color:#DD1C1A}#map{--height:30rem;--width:100%;--margin-bottom:0.5rem}#text-container{position:relative;max-width:calc(100vw - 4rem);margin:auto}h1{margin-bottom:1rem;font-size:2.2rem;text-align:center}h3{margin-bottom:1rem}#container{margin:auto;max-width:800px;margin-top:1rem;margin-bottom:4rem}#container p{text-align:justify}</style>`;
+
+		init(
+			this,
+			{
+				target: this.shadowRoot,
+				props: attribute_to_object(this.attributes),
+				customElement: true
+			},
+			instance,
+			create_fragment,
+			safe_not_equal,
+			{},
+			null
+		);
+
+		if (options) {
+			if (options.target) {
+				insert_dev(options.target, this, options.anchor);
+			}
+		}
+	}
+}
+
+customElements.define("groups-component", Groups_component);
+
+export { Groups_component as default };

Server/public/js/components/legend-component.js

@@ -1 +1,362 @@
-import{S as t,i as e,a as s,b as o,u as n,s as r,f as i,n as a,h as l,d as c,p,o as u,g as h,t as d,v as m,l as f,q as g,m as y,w as $}from"./index-4348483d.js";import{pullLegendData as b}from"../../../../../../../../../js/predict/charts.js";function w(t,e,s){const o=t.slice();return o[10]=e[s],o[11]=e,o[12]=s,o}function x(t){let e,s,n,r,a,p,u,$,b=t[10].name+"",w=t[12];const x=()=>t[6](e,w),k=()=>t[6](null,w);function v(){return t[7](t[12])}return{c(){e=i("button"),s=i("div"),n=h(),r=i("span"),a=d(b),p=h(),l(s,"class","marker"),m(s,"background-color",t[10].color)},m(t,i){o(t,e,i),f(e,s),f(e,n),f(e,r),f(r,a),f(e,p),x(),u||($=g(e,"click",v),u=!0)},p(e,o){t=e,1&o&&m(s,"background-color",t[10].color),1&o&&b!==(b=t[10].name+"")&&y(a,b),w!==t[12]&&(k(),w=t[12],x())},d(t){t&&c(e),k(),u=!1,$()}}}function k(t){let e,s=t[0],n=[];for(let e=0;e<s.length;e+=1)n[e]=x(w(t,s,e));return{c(){e=i("div");for(let t=0;t<n.length;t+=1)n[t].c();this.c=a,l(e,"class","legend")},m(t,s){o(t,e,s);for(let t=0;t<n.length;t+=1)n[t].m(e,null)},p(t,[o]){if(7&o){let r;for(s=t[0],r=0;r<s.length;r+=1){const i=w(t,s,r);n[r]?n[r].p(i,o):(n[r]=x(i),n[r].c(),n[r].m(e,null))}for(;r<n.length;r+=1)n[r].d(1);n.length=s.length}},i:a,o:a,d(t){t&&c(e),p(n,t)}}}function v(t,e,s){let o,{option:n=null}=e,{chart:r=null}=e,{data:i={}}=e,a=[],l=[];function c(){if(null==n||null==n||null==r||null==r)setTimeout(c,100);else{s(0,a=b(a,n));for(let t of a)s(3,i[t.name]=!0,i);o=Object.keys(i)}}function p(t){s(3,i[o[t]]=!i[o[t]],i);let e=[],a=n.series.map((t=>t._id)),c=a[t];for(let t=0;t<a.length;t++)a[t]==c&&e.push(t);for(let t of e){let o=n.series[t];o.tooltip.show?(o.lineStyle.opacity=0,o.itemStyle.opacity=0,o.tooltip.show=!1,s(1,l[e[0]].style.opacity=.5,l)):(o.lineStyle.opacity=1,o.itemStyle.opacity=1,o.tooltip.show=!0,s(1,l[e[0]].style.opacity=1,l))}r.setOption(n)}u((()=>{c()}));return t.$$set=t=>{"option"in t&&s(4,n=t.option),"chart"in t&&s(5,r=t.chart),"data"in t&&s(3,i=t.data)},[a,l,p,i,n,r,function(t,e){$[t?"unshift":"push"]((()=>{l[e]=t,s(1,l)}))},t=>p(t)]}class j extends t{constructor(t){super(),this.shadowRoot.innerHTML="<style>@import '/css/common.css';@import '/css/test-basic.css';button{cursor:pointer}.legend{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:center;gap:1rem}.legend *{font-family:var(--sans-serif)}.marker{position:relative;display:inline-block;margin-right:0.5rem;top:0.1rem;width:1rem;height:1rem;border-radius:1rem}</style>",e(this,{target:this.shadowRoot,props:s(this.attributes),customElement:!0},v,k,r,{option:4,chart:5,data:3},null),t&&(t.target&&o(t.target,this,t.anchor),t.props&&(this.$set(t.props),n()))}static get observedAttributes(){return["option","chart","data"]}get option(){return this.$$.ctx[4]}set option(t){this.$$set({option:t}),n()}get chart(){return this.$$.ctx[5]}set chart(t){this.$$set({chart:t}),n()}get data(){return this.$$.ctx[3]}set data(t){this.$$set({data:t}),n()}}customElements.define("legend-component",j);export{j as default};
+
+(function(l, r) { if (!l || l.getElementById('livereloadscript')) return; r = l.createElement('script'); r.async = 1; r.src = '//' + (self.location.host || 'localhost').split(':')[0] + ':35729/livereload.js?snipver=1'; r.id = 'livereloadscript'; l.getElementsByTagName('head')[0].appendChild(r) })(self.document);
+import { S as SvelteElement, i as init, a as attribute_to_object, b as insert_dev, B as flush, s as safe_not_equal, j as validate_each_argument, d as dispatch_dev, v as validate_slots, o as onMount, g as globals, k as element, n as noop, p as attr_dev, m as add_location, h as detach_dev, x as destroy_each, C as binding_callbacks, l as space, t as text, D as set_style, u as append_dev, y as listen_dev, w as set_data_dev } from './index-d19aafba.js';
+import { pullLegendData } from '../../../../../../../../../js/predict/charts.js';
+
+/* src\components\legend-component.svelte generated by Svelte v3.52.0 */
+
+const { Object: Object_1 } = globals;
+const file = "src\\components\\legend-component.svelte";
+
+function get_each_context(ctx, list, i) {
+	const child_ctx = ctx.slice();
+	child_ctx[10] = list[i];
+	child_ctx[11] = list;
+	child_ctx[12] = i;
+	return child_ctx;
+}
+
+// (69:4) {#each legendData as item, i}
+function create_each_block(ctx) {
+	let button;
+	let div;
+	let t0;
+	let span;
+	let t1_value = /*item*/ ctx[10].name + "";
+	let t1;
+	let t2;
+	let i = /*i*/ ctx[12];
+	let mounted;
+	let dispose;
+	const assign_button = () => /*button_binding*/ ctx[6](button, i);
+	const unassign_button = () => /*button_binding*/ ctx[6](null, i);
+
+	function click_handler() {
+		return /*click_handler*/ ctx[7](/*i*/ ctx[12]);
+	}
+
+	const block = {
+		c: function create() {
+			button = element("button");
+			div = element("div");
+			t0 = space();
+			span = element("span");
+			t1 = text(t1_value);
+			t2 = space();
+			attr_dev(div, "class", "marker");
+			set_style(div, "background-color", /*item*/ ctx[10].color);
+			add_location(div, file, 70, 12, 1892);
+			add_location(span, file, 71, 12, 1971);
+			add_location(button, file, 69, 8, 1814);
+		},
+		m: function mount(target, anchor) {
+			insert_dev(target, button, anchor);
+			append_dev(button, div);
+			append_dev(button, t0);
+			append_dev(button, span);
+			append_dev(span, t1);
+			append_dev(button, t2);
+			assign_button();
+
+			if (!mounted) {
+				dispose = listen_dev(button, "click", click_handler, false, false, false);
+				mounted = true;
+			}
+		},
+		p: function update(new_ctx, dirty) {
+			ctx = new_ctx;
+
+			if (dirty & /*legendData*/ 1) {
+				set_style(div, "background-color", /*item*/ ctx[10].color);
+			}
+
+			if (dirty & /*legendData*/ 1 && t1_value !== (t1_value = /*item*/ ctx[10].name + "")) set_data_dev(t1, t1_value);
+
+			if (i !== /*i*/ ctx[12]) {
+				unassign_button();
+				i = /*i*/ ctx[12];
+				assign_button();
+			}
+		},
+		d: function destroy(detaching) {
+			if (detaching) detach_dev(button);
+			unassign_button();
+			mounted = false;
+			dispose();
+		}
+	};
+
+	dispatch_dev("SvelteRegisterBlock", {
+		block,
+		id: create_each_block.name,
+		type: "each",
+		source: "(69:4) {#each legendData as item, i}",
+		ctx
+	});
+
+	return block;
+}
+
+function create_fragment(ctx) {
+	let div;
+	let each_value = /*legendData*/ ctx[0];
+	validate_each_argument(each_value);
+	let each_blocks = [];
+
+	for (let i = 0; i < each_value.length; i += 1) {
+		each_blocks[i] = create_each_block(get_each_context(ctx, each_value, i));
+	}
+
+	const block = {
+		c: function create() {
+			div = element("div");
+
+			for (let i = 0; i < each_blocks.length; i += 1) {
+				each_blocks[i].c();
+			}
+
+			this.c = noop;
+			attr_dev(div, "class", "legend");
+			add_location(div, file, 67, 0, 1749);
+		},
+		l: function claim(nodes) {
+			throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option");
+		},
+		m: function mount(target, anchor) {
+			insert_dev(target, div, anchor);
+
+			for (let i = 0; i < each_blocks.length; i += 1) {
+				each_blocks[i].m(div, null);
+			}
+		},
+		p: function update(ctx, [dirty]) {
+			if (dirty & /*buttons, toggleSeries, legendData*/ 7) {
+				each_value = /*legendData*/ ctx[0];
+				validate_each_argument(each_value);
+				let i;
+
+				for (i = 0; i < each_value.length; i += 1) {
+					const child_ctx = get_each_context(ctx, each_value, i);
+
+					if (each_blocks[i]) {
+						each_blocks[i].p(child_ctx, dirty);
+					} else {
+						each_blocks[i] = create_each_block(child_ctx);
+						each_blocks[i].c();
+						each_blocks[i].m(div, null);
+					}
+				}
+
+				for (; i < each_blocks.length; i += 1) {
+					each_blocks[i].d(1);
+				}
+
+				each_blocks.length = each_value.length;
+			}
+		},
+		i: noop,
+		o: noop,
+		d: function destroy(detaching) {
+			if (detaching) detach_dev(div);
+			destroy_each(each_blocks, detaching);
+		}
+	};
+
+	dispatch_dev("SvelteRegisterBlock", {
+		block,
+		id: create_fragment.name,
+		type: "component",
+		source: "",
+		ctx
+	});
+
+	return block;
+}
+
+function instance($$self, $$props, $$invalidate) {
+	let { $$slots: slots = {}, $$scope } = $$props;
+	validate_slots('legend-component', slots, []);
+	let { option = null } = $$props;
+	let { chart = null } = $$props;
+	let { data = {} } = $$props;
+
+	// Main code
+	let legendData = [];
+
+	let buttons = [];
+	let dataKeys;
+
+	function init() {
+		if (option == null || option == undefined || chart == null || chart == undefined) {
+			setTimeout(init, 100);
+		} else {
+			$$invalidate(0, legendData = pullLegendData(legendData, option));
+
+			for (let obj of legendData) {
+				$$invalidate(3, data[obj.name] = true, data);
+			}
+
+			dataKeys = Object.keys(data);
+		}
+	}
+
+	function toggleSeries(i) {
+		$$invalidate(3, data[dataKeys[i]] = !data[dataKeys[i]], data);
+		let inds = [];
+		let ids = option.series.map(x => x._id);
+		let id = ids[i];
+
+		for (let j = 0; j < ids.length; j++) {
+			if (ids[j] == id) {
+				inds.push(j);
+			}
+		}
+
+		for (let i of inds) {
+			let series = option.series[i];
+
+			if (!series.tooltip.show) {
+				series.lineStyle.opacity = 1;
+				series.itemStyle.opacity = 1;
+				series.tooltip.show = true;
+				$$invalidate(1, buttons[inds[0]].style.opacity = 1, buttons);
+			} else {
+				series.lineStyle.opacity = 0;
+				series.itemStyle.opacity = 0;
+				series.tooltip.show = false;
+				$$invalidate(1, buttons[inds[0]].style.opacity = 0.5, buttons);
+			}
+		}
+
+		chart.setOption(option);
+	}
+
+	onMount(() => {
+		init();
+	});
+
+	const writable_props = ['option', 'chart', 'data'];
+
+	Object_1.keys($$props).forEach(key => {
+		if (!~writable_props.indexOf(key) && key.slice(0, 2) !== '$$' && key !== 'slot') console.warn(`<legend-component> was created with unknown prop '${key}'`);
+	});
+
+	function button_binding($$value, i) {
+		binding_callbacks[$$value ? 'unshift' : 'push'](() => {
+			buttons[i] = $$value;
+			$$invalidate(1, buttons);
+		});
+	}
+
+	const click_handler = i => toggleSeries(i);
+
+	$$self.$$set = $$props => {
+		if ('option' in $$props) $$invalidate(4, option = $$props.option);
+		if ('chart' in $$props) $$invalidate(5, chart = $$props.chart);
+		if ('data' in $$props) $$invalidate(3, data = $$props.data);
+	};
+
+	$$self.$capture_state = () => ({
+		onMount,
+		pullLegendData,
+		option,
+		chart,
+		data,
+		legendData,
+		buttons,
+		dataKeys,
+		init,
+		toggleSeries
+	});
+
+	$$self.$inject_state = $$props => {
+		if ('option' in $$props) $$invalidate(4, option = $$props.option);
+		if ('chart' in $$props) $$invalidate(5, chart = $$props.chart);
+		if ('data' in $$props) $$invalidate(3, data = $$props.data);
+		if ('legendData' in $$props) $$invalidate(0, legendData = $$props.legendData);
+		if ('buttons' in $$props) $$invalidate(1, buttons = $$props.buttons);
+		if ('dataKeys' in $$props) dataKeys = $$props.dataKeys;
+	};
+
+	if ($$props && "$$inject" in $$props) {
+		$$self.$inject_state($$props.$$inject);
+	}
+
+	return [
+		legendData,
+		buttons,
+		toggleSeries,
+		data,
+		option,
+		chart,
+		button_binding,
+		click_handler
+	];
+}
+
+class Legend_component extends SvelteElement {
+	constructor(options) {
+		super();
+		this.shadowRoot.innerHTML = `<style>@import '/css/common.css';@import '/css/test-basic.css';button{cursor:pointer}.legend{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:center;gap:1rem}.legend *{font-family:var(--sans-serif)}.marker{position:relative;display:inline-block;margin-right:0.5rem;top:0.1rem;width:1rem;height:1rem;border-radius:1rem}</style>`;
+
+		init(
+			this,
+			{
+				target: this.shadowRoot,
+				props: attribute_to_object(this.attributes),
+				customElement: true
+			},
+			instance,
+			create_fragment,
+			safe_not_equal,
+			{ option: 4, chart: 5, data: 3 },
+			null
+		);
+
+		if (options) {
+			if (options.target) {
+				insert_dev(options.target, this, options.anchor);
+			}
+
+			if (options.props) {
+				this.$set(options.props);
+				flush();
+			}
+		}
+	}
+
+	static get observedAttributes() {
+		return ["option", "chart", "data"];
+	}
+
+	get option() {
+		return this.$$.ctx[4];
+	}
+
+	set option(option) {
+		this.$$set({ option });
+		flush();
+	}
+
+	get chart() {
+		return this.$$.ctx[5];
+	}
+
+	set chart(chart) {
+		this.$$set({ chart });
+		flush();
+	}
+
+	get data() {
+		return this.$$.ctx[3];
+	}
+
+	set data(data) {
+		this.$$set({ data });
+		flush();
+	}
+}
+
+customElements.define("legend-component", Legend_component);
+
+export { Legend_component as default };

Server/public/js/components/loadscreen-component.js

@@ -1 +1,115 @@
-import{S as t,i as s,a as e,b as n,s as o,f as a,n as i,h as d,v as r,d as u,o as c,w as l}from"./index-4348483d.js";function h(t){let s;return{c(){s=a("div"),this.c=i,d(s,"id","loadscreen"),r(s,"width","100%"),r(s,"height","100%"),r(s,"background","white"),r(s,"position","absolute"),r(s,"z-index","100000")},m(e,o){n(e,s,o),t[1](s)},p:i,i:i,o:i,d(e){e&&u(s),t[1](null)}}}function p(t,s,e){let n;return c((()=>{window.addEventListener("load",(function(){e(0,n.parentNode.host.style.display="none",n)}))})),[n,function(t){l[t?"unshift":"push"]((()=>{n=t,e(0,n)}))}]}class f extends t{constructor(t){super(),s(this,{target:this.shadowRoot,props:e(this.attributes),customElement:!0},p,h,o,{},null),t&&t.target&&n(t.target,this,t.anchor)}}customElements.define("loadscreen-component",f);export{f as default};
+
+(function(l, r) { if (!l || l.getElementById('livereloadscript')) return; r = l.createElement('script'); r.async = 1; r.src = '//' + (self.location.host || 'localhost').split(':')[0] + ':35729/livereload.js?snipver=1'; r.id = 'livereloadscript'; l.getElementsByTagName('head')[0].appendChild(r) })(self.document);
+import { S as SvelteElement, i as init, a as attribute_to_object, b as insert_dev, s as safe_not_equal, d as dispatch_dev, v as validate_slots, o as onMount, k as element, n as noop, p as attr_dev, D as set_style, m as add_location, h as detach_dev, C as binding_callbacks } from './index-d19aafba.js';
+
+/* src\components\loadscreen-component.svelte generated by Svelte v3.52.0 */
+const file = "src\\components\\loadscreen-component.svelte";
+
+function create_fragment(ctx) {
+	let div;
+
+	const block = {
+		c: function create() {
+			div = element("div");
+			this.c = noop;
+			attr_dev(div, "id", "loadscreen");
+			set_style(div, "width", "100%");
+			set_style(div, "height", "100%");
+			set_style(div, "background", "white");
+			set_style(div, "position", "absolute");
+			set_style(div, "z-index", "100000");
+			add_location(div, file, 20, 0, 366);
+		},
+		l: function claim(nodes) {
+			throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option");
+		},
+		m: function mount(target, anchor) {
+			insert_dev(target, div, anchor);
+			/*div_binding*/ ctx[1](div);
+		},
+		p: noop,
+		i: noop,
+		o: noop,
+		d: function destroy(detaching) {
+			if (detaching) detach_dev(div);
+			/*div_binding*/ ctx[1](null);
+		}
+	};
+
+	dispatch_dev("SvelteRegisterBlock", {
+		block,
+		id: create_fragment.name,
+		type: "component",
+		source: "",
+		ctx
+	});
+
+	return block;
+}
+
+function instance($$self, $$props, $$invalidate) {
+	let { $$slots: slots = {}, $$scope } = $$props;
+	validate_slots('loadscreen-component', slots, []);
+	let loadscreen;
+
+	onMount(() => {
+		window.addEventListener('load', function () {
+			$$invalidate(0, loadscreen.parentNode.host.style.display = "none", loadscreen);
+		});
+	});
+
+	const writable_props = [];
+
+	Object.keys($$props).forEach(key => {
+		if (!~writable_props.indexOf(key) && key.slice(0, 2) !== '$$' && key !== 'slot') console.warn(`<loadscreen-component> was created with unknown prop '${key}'`);
+	});
+
+	function div_binding($$value) {
+		binding_callbacks[$$value ? 'unshift' : 'push'](() => {
+			loadscreen = $$value;
+			$$invalidate(0, loadscreen);
+		});
+	}
+
+	$$self.$capture_state = () => ({ onMount, loadscreen });
+
+	$$self.$inject_state = $$props => {
+		if ('loadscreen' in $$props) $$invalidate(0, loadscreen = $$props.loadscreen);
+	};
+
+	if ($$props && "$$inject" in $$props) {
+		$$self.$inject_state($$props.$$inject);
+	}
+
+	return [loadscreen, div_binding];
+}
+
+class Loadscreen_component extends SvelteElement {
+	constructor(options) {
+		super();
+
+		init(
+			this,
+			{
+				target: this.shadowRoot,
+				props: attribute_to_object(this.attributes),
+				customElement: true
+			},
+			instance,
+			create_fragment,
+			safe_not_equal,
+			{},
+			null
+		);
+
+		if (options) {
+			if (options.target) {
+				insert_dev(options.target, this, options.anchor);
+			}
+		}
+	}
+}
+
+customElements.define("loadscreen-component", Loadscreen_component);
+
+export { Loadscreen_component as default };

Server/public/js/components/map-component.js

@@ -1 +1,175 @@
-import{S as t,i as e,a as o,b as s,u as a,s as r,f as l,n,h as i,d as c,o as m,w as h}from"./index-4348483d.js";function p(t){let e;return{c(){e=l("div"),this.c=n,i(e,"id","map")},m(o,a){s(o,e,a),t[3](e)},p:n,i:n,o:n,d(o){o&&c(e),t[3](null)}}}function u(t,e,o){let s,{callback:a=null}=e,{colors:r=null}=e;function l(t,e){let o=L.map(s,{center:t,zoom:e});return L.tileLayer("https://tile.openstreetmap.org/{z}/{x}/{y}.png",{attribution:'&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors',minNativeZoom:2,minZoom:2,maxNativeZoom:14,maxZoom:14}).addTo(o),o}return m((()=>{if(a(l),null!=r){let t=s.getElementsByClassName("leaflet-control-layers-overlays")[0].children;for(let e=0;e<t.length;e++)t[e].children[0].children[0].style.accentColor=r[e]}})),t.$$set=t=>{"callback"in t&&o(1,a=t.callback),"colors"in t&&o(2,r=t.colors)},[s,a,r,function(t){h[t?"unshift":"push"]((()=>{s=t,o(0,s)}))}]}class d extends t{constructor(t){super(),this.shadowRoot.innerHTML="<style>@import 'https://unpkg.com/leaflet@1.9.4/dist/leaflet.css';#map{height:var(--height);width:var(--width,100%);margin-top:var(--margin-top,0);margin-bottom:var(--margin-bottom,0)}</style>",e(this,{target:this.shadowRoot,props:o(this.attributes),customElement:!0},u,p,r,{callback:1,colors:2},null),t&&(t.target&&s(t.target,this,t.anchor),t.props&&(this.$set(t.props),a()))}static get observedAttributes(){return["callback","colors"]}get callback(){return this.$$.ctx[1]}set callback(t){this.$$set({callback:t}),a()}get colors(){return this.$$.ctx[2]}set colors(t){this.$$set({colors:t}),a()}}customElements.define("map-component",d);export{d as default};
+
+(function(l, r) { if (!l || l.getElementById('livereloadscript')) return; r = l.createElement('script'); r.async = 1; r.src = '//' + (self.location.host || 'localhost').split(':')[0] + ':35729/livereload.js?snipver=1'; r.id = 'livereloadscript'; l.getElementsByTagName('head')[0].appendChild(r) })(self.document);
+import { S as SvelteElement, i as init, a as attribute_to_object, b as insert_dev, B as flush, s as safe_not_equal, d as dispatch_dev, v as validate_slots, o as onMount, k as element, n as noop, p as attr_dev, m as add_location, h as detach_dev, C as binding_callbacks } from './index-d19aafba.js';
+
+/* src\components\map-component.svelte generated by Svelte v3.52.0 */
+const file = "src\\components\\map-component.svelte";
+
+function create_fragment(ctx) {
+	let div;
+
+	const block = {
+		c: function create() {
+			div = element("div");
+			this.c = noop;
+			attr_dev(div, "id", "map");
+			add_location(div, file, 41, 0, 1151);
+		},
+		l: function claim(nodes) {
+			throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option");
+		},
+		m: function mount(target, anchor) {
+			insert_dev(target, div, anchor);
+			/*div_binding*/ ctx[3](div);
+		},
+		p: noop,
+		i: noop,
+		o: noop,
+		d: function destroy(detaching) {
+			if (detaching) detach_dev(div);
+			/*div_binding*/ ctx[3](null);
+		}
+	};
+
+	dispatch_dev("SvelteRegisterBlock", {
+		block,
+		id: create_fragment.name,
+		type: "component",
+		source: "",
+		ctx
+	});
+
+	return block;
+}
+
+function instance($$self, $$props, $$invalidate) {
+	let { $$slots: slots = {}, $$scope } = $$props;
+	validate_slots('map-component', slots, []);
+	let { callback = null } = $$props;
+	let { colors = null } = $$props;
+
+	// Main code
+	let mapContainer;
+
+	function createMap(center, zoom) {
+		let map = L.map(mapContainer, { center, zoom });
+
+		L.tileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png', {
+			attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors',
+			minNativeZoom: 2,
+			minZoom: 2,
+			maxNativeZoom: 14,
+			maxZoom: 14
+		}).addTo(map);
+
+		return map;
+	}
+
+	onMount(() => {
+		callback(createMap);
+
+		if (colors != null) {
+			let els = mapContainer.getElementsByClassName("leaflet-control-layers-overlays")[0].children;
+
+			for (let i = 0; i < els.length; i++) {
+				els[i].children[0].children[0].style.accentColor = colors[i];
+			}
+		}
+	});
+
+	const writable_props = ['callback', 'colors'];
+
+	Object.keys($$props).forEach(key => {
+		if (!~writable_props.indexOf(key) && key.slice(0, 2) !== '$$' && key !== 'slot') console.warn(`<map-component> was created with unknown prop '${key}'`);
+	});
+
+	function div_binding($$value) {
+		binding_callbacks[$$value ? 'unshift' : 'push'](() => {
+			mapContainer = $$value;
+			$$invalidate(0, mapContainer);
+		});
+	}
+
+	$$self.$$set = $$props => {
+		if ('callback' in $$props) $$invalidate(1, callback = $$props.callback);
+		if ('colors' in $$props) $$invalidate(2, colors = $$props.colors);
+	};
+
+	$$self.$capture_state = () => ({
+		onMount,
+		callback,
+		colors,
+		mapContainer,
+		createMap
+	});
+
+	$$self.$inject_state = $$props => {
+		if ('callback' in $$props) $$invalidate(1, callback = $$props.callback);
+		if ('colors' in $$props) $$invalidate(2, colors = $$props.colors);
+		if ('mapContainer' in $$props) $$invalidate(0, mapContainer = $$props.mapContainer);
+	};
+
+	if ($$props && "$$inject" in $$props) {
+		$$self.$inject_state($$props.$$inject);
+	}
+
+	return [mapContainer, callback, colors, div_binding];
+}
+
+class Map_component extends SvelteElement {
+	constructor(options) {
+		super();
+		this.shadowRoot.innerHTML = `<style>@import 'https://unpkg.com/leaflet@1.9.4/dist/leaflet.css';#map{height:var(--height);width:var(--width,100%);margin-top:var(--margin-top,0);margin-bottom:var(--margin-bottom,0)}</style>`;
+
+		init(
+			this,
+			{
+				target: this.shadowRoot,
+				props: attribute_to_object(this.attributes),
+				customElement: true
+			},
+			instance,
+			create_fragment,
+			safe_not_equal,
+			{ callback: 1, colors: 2 },
+			null
+		);
+
+		if (options) {
+			if (options.target) {
+				insert_dev(options.target, this, options.anchor);
+			}
+
+			if (options.props) {
+				this.$set(options.props);
+				flush();
+			}
+		}
+	}
+
+	static get observedAttributes() {
+		return ["callback", "colors"];
+	}
+
+	get callback() {
+		return this.$$.ctx[1];
+	}
+
+	set callback(callback) {
+		this.$$set({ callback });
+		flush();
+	}
+
+	get colors() {
+		return this.$$.ctx[2];
+	}
+
+	set colors(colors) {
+		this.$$set({ colors });
+		flush();
+	}
+}
+
+customElements.define("map-component", Map_component);
+
+export { Map_component as default };

Server/public/js/components/pane-aligner.js

@@ -1 +1,304 @@
-import{S as i,i as e,a,b as t,s as n,f as r,g as s,n as d,h as o,l,d as m,x as p,o as h,w as g}from"./index-4348483d.js";import{debounce as c}from"../../../../../../../../../js/libraries/miscTools.js";function f(i){let e,a,n,p,h,g,c,f,u,b;return{c(){e=r("div"),a=r("div"),n=r("div"),p=r("div"),p.innerHTML='<slot name="sidebar-left"></slot>',h=s(),g=r("div"),g.innerHTML='<slot name="sidebar-left2"></slot>',c=s(),f=r("div"),f.innerHTML='<slot name="sidebar-right"></slot>',u=s(),b=r("div"),b.innerHTML='<slot name="main" id="main-slot"></slot>',this.c=d,o(p,"id","sidebar-left"),o(p,"class","pane"),o(g,"id","sidebar-left2"),o(g,"class","pane"),o(n,"id","sidebars-left"),o(n,"class","sidebar"),o(f,"id","sidebar-right"),o(f,"class","pane sidebar"),o(b,"id","main-pane"),o(b,"class","pane"),o(a,"class","pane-container"),o(e,"id","root"),o(e,"class","pane-centering")},m(r,s){t(r,e,s),l(e,a),l(a,n),l(n,p),i[5](p),l(n,h),l(n,g),i[6](g),l(a,c),l(a,f),i[7](f),l(a,u),l(a,b),i[8](b),i[9](e)},p:d,i:d,o:d,d(a){a&&m(e),i[5](null),i[6](null),i[7](null),i[8](null),i[9](null)}}}function u(i,e,a){let t,n,r,s,d,o=null!=p("alignerParent")?p("alignerParent").switchView:void 0,l=!1,m=!1,f=!1;function u(){if(null!=t.parentNode){let i=t.parentNode.host.childNodes;if(0==i.length)setTimeout(u,50);else{let e=!1,n=t.parentNode.innerHTML;for(let a of i)"sidebar-left"!=a.slot||l?"sidebar-left2"!=a.slot||m?"sidebar-right"!=a.slot||f||(n=n.replace("#sidebar-right{display:none;","#sidebar-right{"),f=!0,e=!0):(n=n.replace("#sidebar-left2{display:none}",""),m=!0,e=!0):(n=n.replace("#sidebar-left{display:none}",""),l=!0,e=!0);null!=o&&(n=n.replace("1880px",o),e=!0),e&&a(0,t.parentNode.innerHTML=n,t)}}}return window.addEventListener("resize",c(u,100)),h((()=>{u()})),[t,n,r,s,d,function(i){g[i?"unshift":"push"]((()=>{r=i,a(2,r)}))},function(i){g[i?"unshift":"push"]((()=>{s=i,a(3,s)}))},function(i){g[i?"unshift":"push"]((()=>{d=i,a(4,d)}))},function(i){g[i?"unshift":"push"]((()=>{n=i,a(1,n)}))},function(i){g[i?"unshift":"push"]((()=>{t=i,a(0,t)}))}]}class b extends i{constructor(i){super(),this.shadowRoot.innerHTML="<style>@import '/css/common.css';.pane-container{display:block;margin-left:var(--total-margin-left,0rem)}#root{min-height:var(--min-height,auto)}#main-pane{position:relative;padding-left:var(--padding-left,0rem);padding-right:var(--padding-right,0rem);padding-top:var(--padding-top,0rem);padding-bottom:var(--padding-bottom,0rem);text-align:justify;background:var(--background,white);box-shadow:var(--box-shadow,0 0 0.314rem rgb(187, 187, 187));margin:auto;height:min-content;max-width:var(--width-main,66rem);width:var(--width-main,66rem);z-index:1;overflow-x:var(--overflow-x,hidden)}.sidebar{position:absolute}#sidebars-left{display:flex;flex-direction:column;gap:1rem;margin-left:calc(-1*var(--width-left,22.5rem) - 1rem - 4rem);width:calc(var(--width-left,22.5rem) + 4rem)}#sidebar-left,#sidebar-left2{position:relative;background-color:white;padding:2rem 2rem}#sidebar-left{display:none}#sidebar-left2{display:none}#sidebar-right{display:none;margin-left:calc(var(--width-main,66rem) + 1rem);width:var(--width-right,auto);background-color:white;padding:2rem 2rem}@media only screen and (max-width: 1880px){#main-pane{max-width:initial;width:100%;max-width:var(--width-main,66rem);padding-left:var(--padding-left-mobile,1.8rem);padding-right:var(--padding-right-mobile,1.8rem);padding-top:var(--padding-top-mobile,1.8rem);padding-bottom:var(--padding-bottom-mobile,1.8rem)}#sidebars-left,#sidebar-right{position:relative;margin:auto;margin-top:1rem;margin-bottom:1rem;max-width:var(--width-main,66rem);width:100%}.pane-container{width:95%;justify-items:center;grid-auto-flow:row;margin-left:0}}</style>",e(this,{target:this.shadowRoot,props:a(this.attributes),customElement:!0},u,f,n,{},null),i&&i.target&&t(i.target,this,i.anchor)}}customElements.define("pane-aligner",b);export{b as default};
+
+(function(l, r) { if (!l || l.getElementById('livereloadscript')) return; r = l.createElement('script'); r.async = 1; r.src = '//' + (self.location.host || 'localhost').split(':')[0] + ':35729/livereload.js?snipver=1'; r.id = 'livereloadscript'; l.getElementsByTagName('head')[0].appendChild(r) })(self.document);
+import { S as SvelteElement, i as init, a as attribute_to_object, b as insert_dev, s as safe_not_equal, d as dispatch_dev, v as validate_slots, E as getContext, o as onMount, F as setContext, k as element, l as space, n as noop, p as attr_dev, m as add_location, u as append_dev, h as detach_dev, C as binding_callbacks } from './index-d19aafba.js';
+import { debounce } from '../../../../../../../../../js/libraries/miscTools.js';
+
+/* src\components\pane-aligner.svelte generated by Svelte v3.52.0 */
+const file = "src\\components\\pane-aligner.svelte";
+
+function create_fragment(ctx) {
+	let div6;
+	let div5;
+	let div2;
+	let div0;
+	let slot0;
+	let t0;
+	let div1;
+	let slot1;
+	let t1;
+	let div3;
+	let slot2;
+	let t2;
+	let div4;
+	let slot3;
+
+	const block = {
+		c: function create() {
+			div6 = element("div");
+			div5 = element("div");
+			div2 = element("div");
+			div0 = element("div");
+			slot0 = element("slot");
+			t0 = space();
+			div1 = element("div");
+			slot1 = element("slot");
+			t1 = space();
+			div3 = element("div");
+			slot2 = element("slot");
+			t2 = space();
+			div4 = element("div");
+			slot3 = element("slot");
+			this.c = noop;
+			attr_dev(slot0, "name", "sidebar-left");
+			add_location(slot0, file, 74, 16, 2567);
+			attr_dev(div0, "id", "sidebar-left");
+			attr_dev(div0, "class", "pane");
+			add_location(div0, file, 73, 12, 2489);
+			attr_dev(slot1, "name", "sidebar-left2");
+			add_location(slot1, file, 77, 16, 2714);
+			attr_dev(div1, "id", "sidebar-left2");
+			attr_dev(div1, "class", "pane");
+			add_location(div1, file, 76, 12, 2634);
+			attr_dev(div2, "id", "sidebars-left");
+			attr_dev(div2, "class", "sidebar");
+			add_location(div2, file, 72, 8, 2435);
+			attr_dev(slot2, "name", "sidebar-right");
+			add_location(slot2, file, 81, 12, 2879);
+			attr_dev(div3, "id", "sidebar-right");
+			attr_dev(div3, "class", "pane sidebar");
+			add_location(div3, file, 80, 8, 2794);
+			attr_dev(slot3, "name", "main");
+			attr_dev(slot3, "id", "main-slot");
+			add_location(slot3, file, 84, 12, 3007);
+			attr_dev(div4, "id", "main-pane");
+			attr_dev(div4, "class", "pane");
+			add_location(div4, file, 83, 8, 2939);
+			attr_dev(div5, "class", "pane-container");
+			add_location(div5, file, 71, 4, 2397);
+			attr_dev(div6, "id", "root");
+			attr_dev(div6, "class", "pane-centering");
+			add_location(div6, file, 70, 0, 2336);
+		},
+		l: function claim(nodes) {
+			throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option");
+		},
+		m: function mount(target, anchor) {
+			insert_dev(target, div6, anchor);
+			append_dev(div6, div5);
+			append_dev(div5, div2);
+			append_dev(div2, div0);
+			append_dev(div0, slot0);
+			/*div0_binding*/ ctx[5](div0);
+			append_dev(div2, t0);
+			append_dev(div2, div1);
+			append_dev(div1, slot1);
+			/*div1_binding*/ ctx[6](div1);
+			append_dev(div5, t1);
+			append_dev(div5, div3);
+			append_dev(div3, slot2);
+			/*div3_binding*/ ctx[7](div3);
+			append_dev(div5, t2);
+			append_dev(div5, div4);
+			append_dev(div4, slot3);
+			/*div4_binding*/ ctx[8](div4);
+			/*div6_binding*/ ctx[9](div6);
+		},
+		p: noop,
+		i: noop,
+		o: noop,
+		d: function destroy(detaching) {
+			if (detaching) detach_dev(div6);
+			/*div0_binding*/ ctx[5](null);
+			/*div1_binding*/ ctx[6](null);
+			/*div3_binding*/ ctx[7](null);
+			/*div4_binding*/ ctx[8](null);
+			/*div6_binding*/ ctx[9](null);
+		}
+	};
+
+	dispatch_dev("SvelteRegisterBlock", {
+		block,
+		id: create_fragment.name,
+		type: "component",
+		source: "",
+		ctx
+	});
+
+	return block;
+}
+
+function instance($$self, $$props, $$invalidate) {
+	let { $$slots: slots = {}, $$scope } = $$props;
+	validate_slots('pane-aligner', slots, []);
+	let root;
+	let mainPane;
+	let sidebarLeft;
+	let sidebarLeft2;
+	let sidebarRight;
+	let parentProps = getContext("alignerParent");
+
+	let switchView = parentProps != undefined
+	? getContext("alignerParent").switchView
+	: undefined;
+
+	let leftReplaced = false;
+	let left2Replaced = false;
+	let rightReplaced = false;
+	let switchViewReplaced = false;
+
+	function adjustSlotted() {
+		if (root.parentNode != null) {
+			let slotted = root.parentNode.host.childNodes;
+
+			if (slotted.length == 0) {
+				setTimeout(adjustSlotted, 50);
+			} else {
+				let changed = false;
+				let html = root.parentNode.innerHTML;
+
+				for (let item of slotted) {
+					if (item.slot == "sidebar-left" && !leftReplaced) {
+						html = html.replace("#sidebar-left{display:none}", "");
+						leftReplaced = true;
+						changed = true;
+					} else if (item.slot == "sidebar-left2" && !left2Replaced) {
+						html = html.replace("#sidebar-left2{display:none}", "");
+						left2Replaced = true;
+						changed = true;
+					} else if (item.slot == "sidebar-right" && !rightReplaced) {
+						html = html.replace("#sidebar-right{display:none;", "#sidebar-right{");
+						rightReplaced = true;
+						changed = true;
+					}
+				}
+
+				if (switchView != undefined && !switchViewReplaced) {
+					html = html.replace("1880px", switchView);
+					changed = true;
+				}
+
+				if (changed) {
+					$$invalidate(0, root.parentNode.innerHTML = html, root);
+				}
+			}
+		}
+	}
+
+	window.addEventListener("resize", debounce(adjustSlotted, 100));
+
+	onMount(() => {
+		adjustSlotted();
+	});
+
+	const writable_props = [];
+
+	Object.keys($$props).forEach(key => {
+		if (!~writable_props.indexOf(key) && key.slice(0, 2) !== '$$' && key !== 'slot') console.warn(`<pane-aligner> was created with unknown prop '${key}'`);
+	});
+
+	function div0_binding($$value) {
+		binding_callbacks[$$value ? 'unshift' : 'push'](() => {
+			sidebarLeft = $$value;
+			$$invalidate(2, sidebarLeft);
+		});
+	}
+
+	function div1_binding($$value) {
+		binding_callbacks[$$value ? 'unshift' : 'push'](() => {
+			sidebarLeft2 = $$value;
+			$$invalidate(3, sidebarLeft2);
+		});
+	}
+
+	function div3_binding($$value) {
+		binding_callbacks[$$value ? 'unshift' : 'push'](() => {
+			sidebarRight = $$value;
+			$$invalidate(4, sidebarRight);
+		});
+	}
+
+	function div4_binding($$value) {
+		binding_callbacks[$$value ? 'unshift' : 'push'](() => {
+			mainPane = $$value;
+			$$invalidate(1, mainPane);
+		});
+	}
+
+	function div6_binding($$value) {
+		binding_callbacks[$$value ? 'unshift' : 'push'](() => {
+			root = $$value;
+			$$invalidate(0, root);
+		});
+	}
+
+	$$self.$capture_state = () => ({
+		getContext,
+		setContext,
+		onMount,
+		debounce,
+		root,
+		mainPane,
+		sidebarLeft,
+		sidebarLeft2,
+		sidebarRight,
+		parentProps,
+		switchView,
+		leftReplaced,
+		left2Replaced,
+		rightReplaced,
+		switchViewReplaced,
+		adjustSlotted
+	});
+
+	$$self.$inject_state = $$props => {
+		if ('root' in $$props) $$invalidate(0, root = $$props.root);
+		if ('mainPane' in $$props) $$invalidate(1, mainPane = $$props.mainPane);
+		if ('sidebarLeft' in $$props) $$invalidate(2, sidebarLeft = $$props.sidebarLeft);
+		if ('sidebarLeft2' in $$props) $$invalidate(3, sidebarLeft2 = $$props.sidebarLeft2);
+		if ('sidebarRight' in $$props) $$invalidate(4, sidebarRight = $$props.sidebarRight);
+		if ('parentProps' in $$props) parentProps = $$props.parentProps;
+		if ('switchView' in $$props) switchView = $$props.switchView;
+		if ('leftReplaced' in $$props) leftReplaced = $$props.leftReplaced;
+		if ('left2Replaced' in $$props) left2Replaced = $$props.left2Replaced;
+		if ('rightReplaced' in $$props) rightReplaced = $$props.rightReplaced;
+		if ('switchViewReplaced' in $$props) switchViewReplaced = $$props.switchViewReplaced;
+	};
+
+	if ($$props && "$$inject" in $$props) {
+		$$self.$inject_state($$props.$$inject);
+	}
+
+	return [
+		root,
+		mainPane,
+		sidebarLeft,
+		sidebarLeft2,
+		sidebarRight,
+		div0_binding,
+		div1_binding,
+		div3_binding,
+		div4_binding,
+		div6_binding
+	];
+}
+
+class Pane_aligner extends SvelteElement {
+	constructor(options) {
+		super();
+		this.shadowRoot.innerHTML = `<style>@import '/css/common.css';.pane-container{display:block;margin-left:var(--total-margin-left,0rem)}#root{min-height:var(--min-height,auto)}#main-pane{position:relative;padding-left:var(--padding-left,0rem);padding-right:var(--padding-right,0rem);padding-top:var(--padding-top,0rem);padding-bottom:var(--padding-bottom,0rem);text-align:justify;background:var(--background,white);box-shadow:var(--box-shadow,0 0 0.314rem rgb(187, 187, 187));margin:auto;height:min-content;max-width:var(--width-main,66rem);width:var(--width-main,66rem);z-index:1;overflow-x:var(--overflow-x,hidden)}.sidebar{position:absolute}#sidebars-left{display:flex;flex-direction:column;gap:1rem;margin-left:calc(-1*var(--width-left,22.5rem) - 1rem - 4rem);width:calc(var(--width-left,22.5rem) + 4rem)}#sidebar-left,#sidebar-left2{position:relative;background-color:white;padding:2rem 2rem}#sidebar-left{display:none}#sidebar-left2{display:none}#sidebar-right{display:none;margin-left:calc(var(--width-main,66rem) + 1rem);width:var(--width-right,auto);background-color:white;padding:2rem 2rem}@media only screen and (max-width: 1880px){#main-pane{max-width:initial;width:100%;max-width:var(--width-main,66rem);padding-left:var(--padding-left-mobile,1.8rem);padding-right:var(--padding-right-mobile,1.8rem);padding-top:var(--padding-top-mobile,1.8rem);padding-bottom:var(--padding-bottom-mobile,1.8rem)}#sidebars-left,#sidebar-right{position:relative;margin:auto;margin-top:1rem;margin-bottom:1rem;max-width:var(--width-main,66rem);width:100%}.pane-container{width:95%;justify-items:center;grid-auto-flow:row;margin-left:0}}</style>`;
+
+		init(
+			this,
+			{
+				target: this.shadowRoot,
+				props: attribute_to_object(this.attributes),
+				customElement: true
+			},
+			instance,
+			create_fragment,
+			safe_not_equal,
+			{},
+			null
+		);
+
+		if (options) {
+			if (options.target) {
+				insert_dev(options.target, this, options.anchor);
+			}
+		}
+	}
+}
+
+customElements.define("pane-aligner", Pane_aligner);
+
+export { Pane_aligner as default };

Server/public/js/components/switch-component.js

@@ -1 +1,209 @@
-import{S as t,i as e,a as s,b as c,u as i,s as a,f as r,g as o,n as h,h as n,l,q as d,d as u,r as p,o as b}from"./index-4348483d.js";import"../../../../../../../../../js/libraries/miscTools.js";function k(t){let e,s,i,a,b,k;return{c(){e=r("label"),s=r("input"),i=o(),a=r("span"),this.c=h,n(s,"type","checkbox"),n(a,"class","switch-span"),n(e,"class","switch")},m(r,o){c(r,e,o),l(e,s),s.checked=t[0],l(e,i),l(e,a),b||(k=[d(s,"change",t[4]),d(s,"click",t[1])],b=!0)},p(t,[e]){1&e&&(s.checked=t[0])},i:h,o:h,d(t){t&&u(e),b=!1,p(k)}}}function g(t,e,s){let{callback:c=null}=e,{checked:i=!1}=e;const a=()=>{setTimeout((()=>{null!=c?(s(0,i=!i),c()):a()}),100)};return b((()=>{})),t.$$set=t=>{"callback"in t&&s(2,c=t.callback),"checked"in t&&s(0,i=t.checked)},[i,function(){null!=c&&(s(0,i=!i),c())},c,a,function(){i=this.checked,s(0,i)}]}class m extends t{constructor(t){super(),this.shadowRoot.innerHTML="<style>@import '/css/common.css';.switch span{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:#ccc;-webkit-transition:.4s;transition:.4s;border-radius:calc(2* 1.2rem)}.switch span:before{position:absolute;content:\"\";height:calc(var(--height) - 0.5rem);width:calc(var(--height) - 0.5rem);left:calc(0.3rem);bottom:0.25rem;background-color:white;-webkit-transition:.4s;transition:.4s;border-radius:50%}.switch input:checked+.switch-span{background-color:var(--pink)}.switch input:hover+.switch-span{box-shadow:0 0 0 var(--pink)}.switch input:checked+.switch-span:before{-webkit-transform:translateX(calc(var(--width) - var(--height)/2 - 2*0.6rem));-ms-transform:translateX(calc(var(--width) - var(--height)/2 - 2*0.6rem));transform:translateX(calc(var(--width) - var(--height)/2 - 2*0.6rem))}.switch{position:relative;display:inline-block;width:var(--width);height:var(--height)}.switch input{position:absolute;width:var(--width);height:var(--height);opacity:0}</style>",e(this,{target:this.shadowRoot,props:s(this.attributes),customElement:!0},g,k,a,{callback:2,checked:0,toggle:3},null),t&&(t.target&&c(t.target,this,t.anchor),t.props&&(this.$set(t.props),i()))}static get observedAttributes(){return["callback","checked","toggle"]}get callback(){return this.$$.ctx[2]}set callback(t){this.$$set({callback:t}),i()}get checked(){return this.$$.ctx[0]}set checked(t){this.$$set({checked:t}),i()}get toggle(){return this.$$.ctx[3]}}customElements.define("switch-component",m);export{m as default};
+
+(function(l, r) { if (!l || l.getElementById('livereloadscript')) return; r = l.createElement('script'); r.async = 1; r.src = '//' + (self.location.host || 'localhost').split(':')[0] + ':35729/livereload.js?snipver=1'; r.id = 'livereloadscript'; l.getElementsByTagName('head')[0].appendChild(r) })(self.document);
+import { S as SvelteElement, i as init, a as attribute_to_object, b as insert_dev, B as flush, s as safe_not_equal, d as dispatch_dev, v as validate_slots, o as onMount, k as element, l as space, n as noop, p as attr_dev, m as add_location, u as append_dev, y as listen_dev, h as detach_dev, z as run_all } from './index-d19aafba.js';
+import { px2rem, getTextWidth, getCanvasFont } from '../../../../../../../../../js/libraries/miscTools.js';
+
+/* src\components\switch-component.svelte generated by Svelte v3.52.0 */
+const file = "src\\components\\switch-component.svelte";
+
+function create_fragment(ctx) {
+	let label;
+	let input;
+	let t;
+	let span;
+	let mounted;
+	let dispose;
+
+	const block = {
+		c: function create() {
+			label = element("label");
+			input = element("input");
+			t = space();
+			span = element("span");
+			this.c = noop;
+			attr_dev(input, "type", "checkbox");
+			add_location(input, file, 39, 4, 804);
+			attr_dev(span, "class", "switch-span");
+			add_location(span, file, 40, 4, 880);
+			attr_dev(label, "class", "switch");
+			add_location(label, file, 38, 0, 776);
+		},
+		l: function claim(nodes) {
+			throw new Error("options.hydrate only works if the component was compiled with the `hydratable: true` option");
+		},
+		m: function mount(target, anchor) {
+			insert_dev(target, label, anchor);
+			append_dev(label, input);
+			input.checked = /*checked*/ ctx[0];
+			append_dev(label, t);
+			append_dev(label, span);
+
+			if (!mounted) {
+				dispose = [
+					listen_dev(input, "change", /*input_change_handler*/ ctx[4]),
+					listen_dev(input, "click", /*toggleClick*/ ctx[1], false, false, false)
+				];
+
+				mounted = true;
+			}
+		},
+		p: function update(ctx, [dirty]) {
+			if (dirty & /*checked*/ 1) {
+				input.checked = /*checked*/ ctx[0];
+			}
+		},
+		i: noop,
+		o: noop,
+		d: function destroy(detaching) {
+			if (detaching) detach_dev(label);
+			mounted = false;
+			run_all(dispose);
+		}
+	};
+
+	dispatch_dev("SvelteRegisterBlock", {
+		block,
+		id: create_fragment.name,
+		type: "component",
+		source: "",
+		ctx
+	});
+
+	return block;
+}
+
+function instance($$self, $$props, $$invalidate) {
+	let { $$slots: slots = {}, $$scope } = $$props;
+	validate_slots('switch-component', slots, []);
+	let { callback = null } = $$props;
+	let { checked = false } = $$props;
+
+	const toggle = () => {
+		let f = () => {
+			if (callback != null) {
+				$$invalidate(0, checked = !checked);
+				callback();
+			} else {
+				toggle();
+			}
+		};
+
+		setTimeout(f, 100);
+	};
+
+	function toggleClick() {
+		if (callback != null) {
+			$$invalidate(0, checked = !checked);
+			callback();
+		}
+	}
+
+	// Main code
+	onMount(() => {
+		
+	});
+
+	const writable_props = ['callback', 'checked'];
+
+	Object.keys($$props).forEach(key => {
+		if (!~writable_props.indexOf(key) && key.slice(0, 2) !== '$$' && key !== 'slot') console.warn(`<switch-component> was created with unknown prop '${key}'`);
+	});
+
+	function input_change_handler() {
+		checked = this.checked;
+		$$invalidate(0, checked);
+	}
+
+	$$self.$$set = $$props => {
+		if ('callback' in $$props) $$invalidate(2, callback = $$props.callback);
+		if ('checked' in $$props) $$invalidate(0, checked = $$props.checked);
+	};
+
+	$$self.$capture_state = () => ({
+		onMount,
+		px2rem,
+		getTextWidth,
+		getCanvasFont,
+		callback,
+		checked,
+		toggle,
+		toggleClick
+	});
+
+	$$self.$inject_state = $$props => {
+		if ('callback' in $$props) $$invalidate(2, callback = $$props.callback);
+		if ('checked' in $$props) $$invalidate(0, checked = $$props.checked);
+	};
+
+	if ($$props && "$$inject" in $$props) {
+		$$self.$inject_state($$props.$$inject);
+	}
+
+	return [checked, toggleClick, callback, toggle, input_change_handler];
+}
+
+class Switch_component extends SvelteElement {
+	constructor(options) {
+		super();
+		this.shadowRoot.innerHTML = `<style>@import '/css/common.css';.switch span{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:#ccc;-webkit-transition:.4s;transition:.4s;border-radius:calc(2* 1.2rem)}.switch span:before{position:absolute;content:"";height:calc(var(--height) - 0.5rem);width:calc(var(--height) - 0.5rem);left:calc(0.3rem);bottom:0.25rem;background-color:white;-webkit-transition:.4s;transition:.4s;border-radius:50%}.switch input:checked+.switch-span{background-color:var(--pink)}.switch input:hover+.switch-span{box-shadow:0 0 0 var(--pink)}.switch input:checked+.switch-span:before{-webkit-transform:translateX(calc(var(--width) - var(--height)/2 - 2*0.6rem));-ms-transform:translateX(calc(var(--width) - var(--height)/2 - 2*0.6rem));transform:translateX(calc(var(--width) - var(--height)/2 - 2*0.6rem))}.switch{position:relative;display:inline-block;width:var(--width);height:var(--height)}.switch input{position:absolute;width:var(--width);height:var(--height);opacity:0}</style>`;
+
+		init(
+			this,
+			{
+				target: this.shadowRoot,
+				props: attribute_to_object(this.attributes),
+				customElement: true
+			},
+			instance,
+			create_fragment,
+			safe_not_equal,
+			{ callback: 2, checked: 0, toggle: 3 },
+			null
+		);
+
+		if (options) {
+			if (options.target) {
+				insert_dev(options.target, this, options.anchor);
+			}
+
+			if (options.props) {
+				this.$set(options.props);
+				flush();
+			}
+		}
+	}
+
+	static get observedAttributes() {
+		return ["callback", "checked", "toggle"];
+	}
+
+	get callback() {
+		return this.$$.ctx[2];
+	}
+
+	set callback(callback) {
+		this.$$set({ callback });
+		flush();
+	}
+
+	get checked() {
+		return this.$$.ctx[0];
+	}
+
+	set checked(checked) {
+		this.$$set({ checked });
+		flush();
+	}
+
+	get toggle() {
+		return this.$$.ctx[3];
+	}
+
+	set toggle(value) {
+		throw new Error("<switch-component>: Cannot set read-only property 'toggle'");
+	}
+}
+
+customElements.define("switch-component", Switch_component);
+
+export { Switch_component as default };

Server/public/js/coops.js

@@ -2,7 +2,7 @@ export let coops = [
     {
         logo: "chiron_logo",
         name: "Chiron Health",
-        location: [["Estonia","KohtlaJarve"],[59.41038769769602, 27.287802936242034]],
+        location: [["Estonia","Kohtla-Järve"],[59.41038769769602, 27.287802936242034]],
         market:   "wellnessAndHealth",
         workers: 2,
         status: "inDevelopment",
@@ -13,7 +13,7 @@ export let coops = [
     {
         logo: "kuusk_logo",
         name: "Kuusk",
-        location: [["Estonia","KohtlaJarve"],[59.399947051803004, 27.277159931677055]],
+        location: [["Estonia","Kohtla-Järve"],[59.399947051803004, 27.277159931677055]],
         market: "herbalTeas",
         workers: 1,
         status: "inDevelopment",
@@ -36,7 +36,7 @@ for (let g of coops) {
 
 export let coopsMarkersLayer = L.layerGroup()
 
-export function addMarkersCoops(map,content) {
+export function addMarkersCoops(map,content,locale) {
     for (let g of coops) {
         let coordinates
         let text = "<b>"+content["Cooperative"]+"</b><br>"
@@ -56,7 +56,13 @@ export function addMarkersCoops(map,content) {
             }
             else if (field=="location") {
                 let location = g[field][0]
-                let locationString = location.map(x => content[x]).join(", ")
+                let locationString
+                if (locale=="en") {
+                    locationString = location.map(x => x).join(", ")
+                }
+                else {
+                    locationString = location.map(x => content[x]).join(", ")
+                }
                 text += fieldText + locationString + "<br>"
                 coordinates = g[field][1]
             }

Server/public/js/groups.js

@@ -25,7 +25,7 @@ export let groups = [
         contact: ["https://discord.gg/Qk8KUk787z","DiscordInviteLink"]
     },
     {
-        location: [["Estonia","KohtlaJarve"], [59.40629447076191, 27.280605339416322]],
+        location: [["Estonia","Kohtla-Järve"], [59.40629447076191, 27.280605339416322]],
         members: 3,
         contact: ["https://discord.gg/Qk8KUk787z","DiscordInviteLink"]
     },
@@ -93,7 +93,7 @@ let groupsMarkersLayerIn = L.layerGroup()
 
 let contactGeneral =["https://discord.gg/4BUau4AZre","DiscordInviteLink"]
 
-function addMarkersToLayer(g,layer,content) {
+function addMarkersToLayer(g,layer,content,locale) {
     let coordinates
     let text = "<b>"+content["Group"]+"</b><br>"
     for (let field in g) {
@@ -103,7 +103,13 @@ function addMarkersToLayer(g,layer,content) {
         }
         else if (field=="location") {
             let location = g[field][0]
-            let locationString = location.map(x => content[x]).join(", ")
+            let locationString
+            if (locale=="en") {
+                locationString = location.map(x => x).join(", ")
+            }
+            else {
+                locationString = location.map(x => content[x]).join(", ")
+            }
             text += fieldText + locationString + "<br>"
             coordinates = g[field][1]
         }
@@ -123,15 +129,15 @@ function addMarkersToLayer(g,layer,content) {
     marker.addTo(layer).bindPopup(text)
 }
 
-export function addMarkersGroups(map,content) {
+export function addMarkersGroups(map,content,locale) {
     for (let g of groups) {
-        addMarkersToLayer(g,groupsMarkersLayerIn,content)
+        addMarkersToLayer(g,groupsMarkersLayerIn,content,locale)
     }
     for (let gs of Object.values(groupsByCountry)) {
         if (gs.length==1) {
             let g = {...gs[0]}
             g.location[0] = [g.location[0][0]]
-            addMarkersToLayer(g,groupsMarkersLayerOut,content)
+            addMarkersToLayer(g,groupsMarkersLayerOut,content,locale)
         }
         else {
             let locationName = [gs[0].location[0][0]]
@@ -153,7 +159,7 @@ export function addMarkersGroups(map,content) {
                 members: members,
                 contact: contact
             }
-            addMarkersToLayer(gNew,groupsMarkersLayerOut,content)
+            addMarkersToLayer(gNew,groupsMarkersLayerOut,content,locale)
         }
     }
     groupsMarkersLayerOut.addTo(groupsMarkersLayer)
@@ -172,37 +178,5 @@ function onZoomEnd(map) {
         groupsMarkersLayerIn.addTo(groupsMarkersLayer)
     }
 }
-/*
-function reverseGeocode(latitude, longitude) {
-    let url = `https://nominatim.openstreetmap.org/reverse?format=jsonv2&lat=${latitude}&lon=${longitude}`;
 
-    // Create a new XMLHttpRequest object
-    let xhr = new XMLHttpRequest();
   
-    // Set up the AJAX request
-    xhr.open('GET', url, true);
-    
-    // Define the onload function
-    xhr.onload = function() {
-      if (xhr.status === 200) {
-        // Parse the response JSON
-        let response = JSON.parse(xhr.responseText);
-        
-        // Extract the address information from the response
-        let address = response.address;
-        let city = address.city || address.town || address.village || address.hamlet;
-        let country = address.country;
-        let fullAddress = city + ', ' + country;
-        
-        // Do something with the address
-        console.log(fullAddress);
-      }
-    };
-    
-    // Send the AJAX request
-    xhr.send();
-  }
-  
-let latitude = 123.456; // Replace with your latitude
-let longitude = 78.901; // Replace with your longitude
-reverseGeocode(latitude, longitude);*/

Server/public/js/libraries/serverTools.js

@@ -1,17 +1,17 @@
 
 // Get data from server
 export function getData(path,callback) {   
-    var xhr = new XMLHttpRequest();
+    let xhr = new XMLHttpRequest();
-        xhr.overrideMimeType("application/json");
+    xhr.overrideMimeType("application/json")
-    xhr.open('GET', path, true);
+    xhr.open('GET', path, true)
     xhr.onreadystatechange = function () {
-          if (xhr.readyState == 4 && xhr.status == "200") {
+        if (xhr.readyState == 4 && xhr.status == "200") {
             if (callback !== undefined) {
-                callback(xhr.responseText);
+                callback(xhr.responseText)
             }
-          }
+        }
     };
-    xhr.send(null);  
+    xhr.send()  
 }
 
  // Parse JSON from given path into a given variable under a given key
@@ -35,6 +35,7 @@ export function sendData(route,data,callback) {
                     callback(xhr.responseText)
                 }
             } else {
+                console.log("Request gave an error")
                 // Oh no! There has been an error with the request!
             }
             }

Server/public/js/parties.js

@@ -22,7 +22,7 @@ for (let g of parties) {
 
 export let partiesMarkersLayer = L.layerGroup()
 
-export function addMarkersParties(map,content) {
+export function addMarkersParties(map,content,locale) {
     for (let g of parties) {
         let coordinates
         let text = "<b>"+content["Party"]+"</b><br>"
@@ -42,7 +42,13 @@ export function addMarkersParties(map,content) {
             }
             else if (field=="location") {
                 let location = g[field][0]
-                let locationString = location
+                let locationString
+                if (locale=="en") {
+                    locationString = location
+                }
+                else {
+                    locationString = content[location]
+                }
                 text += fieldText + locationString + "<br>"
                 coordinates = g[field][1]
             }

Server/public/locales/en/countries.json

@@ -1,29 +1,3 @@
 {
-    "map-prompt": "Want to appear on our map? Contact us!",
+    "map-prompt": "Want to appear on our map? Contact us!"
-    "Online": "Online",
-    "Denmark": "Denmark",
-    "Estonia": "Estonia",
-    "Greece": "Greece",
-    "Latvia": "Latvia",
-    "Canada": "Canada",
-    "Germany": "Germany",
-    "Copenhagen": "Copenhagen",
-    "Ireland": "Ireland",
-    "USA": "USA",
-    "Bulgaria": "Bulgaria",
-    "Colorado": "Colorado",
-    "Georgia": "Georgia",
-    "Ohio": "Ohio",
-    "Montreal": "Montreal",
-    "Kolding": "Kolding",
-    "KohtlaJarve": "Kohtla-Järve",
-    "Athens": "Athens",
-    "Riga": "Riga",
-    "Halifax": "Halifax",
-    "Wiesbaden": "Wiesbaden",
-    "Florida": "Florida",
-    "Tallinn": "Tallinn",
-    "Varna": "Varna",
-    "Louisville": "Louisville",
-    "Toronto": "Toronto"
 }

Server/public/locales/ru/countries.json

@@ -15,7 +15,7 @@
     "Ohio": "Огайо",
     "Copenhagen": "Копенгаген",
     "Kolding": "Колдинг",
-    "KohtlaJarve": "Кохтла-Ярве",
+    "Kohtla-Järve": "Кохтла-Ярве",
     "Athens": "Афины",
     "Riga": "Рига",
     "Halifax": "Галифакс",

Server/routes.jl

@@ -11,6 +11,10 @@ route("/:locale/join-us/*", BasicController.join_us, named = :join_us)
 
 route("/:locale/groups/*", BasicController.groups, named = :groups)
 
+route("/:locale/groups-add/*", BasicController.groups_add, named = :groups_add)
+
+route("/:locale/groups-add-post/*", BasicController.groups_add_post, method = POST, named = :groups_add_post)
+
 route("/:locale/cooperatives/*", BasicController.cooperatives, named = :cooperatives)
 
 route("/:locale/communes/*", BasicController.communes, named = :communes)