1 @inherits Dynamicweb.Rendering.ViewModelTemplate<Dynamicweb.Frontend.ParagraphViewModel>
2 @using Dynamicweb.Frontend
3
4 <div>
5 @if (Model.Item.TryGetGeolocation("DefaultMapCenter", out var defaultMapCenter)) {
6 if (Pageview.AreaSettings.TryGetString("Google_APIKey", out string apiKey)) {
7 var locationList = Model.Item.GetUserGroup("UserGroup")?.GetUsers(0, 1000);
8 string jsonLocationList = System.Net.WebUtility.HtmlEncode(
9 System.Text.Json.JsonSerializer.Serialize(locationList)
10 );
11
12 string regionCode = "DK";
13 if (Model.Item.TryGetString("RegionCode", out string region))
14 {
15 regionCode = region;
16 }
17
18 <swift-locations-map
19 class="grid position-relative"
20 api-key="@apiKey"
21 locations="@jsonLocationList"
22 default-lat="@defaultMapCenter.Latitude"
23 default-lng="@defaultMapCenter.Longitude"
24 initial-zoom-level="@Model.Item.GetInt32("InitialZoomLevel")"
25 region-code="@regionCode"
26 map-style='@ReadFile(Model?.Item?.GetString("MapStyle"))'
27 no-locations-found-label="@Translate("No options available in the selected area")"
28 map-icon-url="/Files/Images/Icons/location-dot.svg">
29
30 <div class="g-col-12 g-col-lg-8 h-100">
31 @if (Model.Item.TryGetString("Title", out string title))
32 {
33 @title
34 }
35 </div>
36
37 <div class="g-col-12 g-col-lg-4">
38 <form data-swift-locationsearch>
39 <div class="hstack position-relative">
40 <span class="position-absolute icon-2 px-3">
41 <span class="htmx-indicator spinner-border spinner-border-sm" aria-hidden="true"></span>
42 <span class="icon-2" data-swift-indicator-origin>@ReadFile("/Files/Images/Icons/magnifying-glass.svg")</span>
43 </span>
44 <input type="text" class="form-control rounded-pill bg-body py-2 ps-5 pe-5" oninput="this.nextElementSibling.hidden = !this.value.trim()" name="FilterText" placeholder="@Translate("Enter city, state or zip")">
45 <button type="button"
46 onclick="var f = this.closest('form').querySelector('input'); f.value = ''; f.focus(); f.closest('form').submit();"
47 class="btn position-absolute end-0 icon-2 reset-search"
48 hidden
49 aria-label="@Translate("Clear search field")">
50 @ReadFile("/Files/Images/Icons/xmark.svg")
51 </button>
52 </div>
53 </form>
54 </div>
55
56 <div class="g-col-12">
57 <div class="map" data-swift-locations-map></div>
58 </div>
59 </swift-locations-map>
60
61 <template data-swift-template="info-window">
62 <div>
63 <h6 class="mb-0">@Translate("Address")</h6>
64 <div class="fs-7" data-swift-location="Address"></div>
65 <div class="fs-7">
66 <span data-swift-location="Zip"></span>
67 <span data-swift-location="City"></span>
68 </div>
69 <div class="mt-3">
70 <a href="#" class="hstack gap-2" target="_blank" rel="noopener noreferrer" data-swift-location="DirectionsUrl" title="@Translate("Get directions")" aria-label="@Translate("Get directions")">
71 <span class="icon-1">@ReadFile("/Files/Images/Icons/arrow-turn-right.svg")</span>
72 <span>@Translate("Directions")</span>
73 </a>
74 </div>
75 </div>
76 </template>
77 }
78 else
79 {
80 <div class="alert alert-info" role="alert">
81 @Translate("Google maps API key is missing")
82 </div>
83 }
84 } else {
85 <div class="alert alert-info" role="alert">
86 @Translate("The map is not properly configured")
87 </div>
88 }
89 </div>
90