Try your search with a different keyword or use * as a wildcard.
@model CheckoutPickupPointsModel
@using System.Text
@if (!Model.PickupInStoreOnly && Model.PickupPoints.Any())
{
<div class="section pickup-in-store">
<div class="selector">
<input asp-for="PickupInStore" onclick="togglePickupInStore(this)" />
<label asp-for="PickupInStore">@T("Checkout.PickupPoints")</label>
</div>
<div class="description">
@T("Checkout.PickupPoints.Description")
</div>
<script asp-location="Footer">
$(function() {
togglePickupInStore($("#@Html.IdFor(model => model.PickupInStore)")[0]);
$(document).on('checkout_toggle_pickup_in_store', function (e) {
if (e.checked)
$('.method-list').hide();
else
$('.method-list').show();
});
});
function togglePickupInStore(pickupInStore) {
if (pickupInStore.checked) {
$('#pickup-points-form').show();
$('.method-list').hide();
} else {
$('#pickup-points-form').hide();
$('.method-list').show();
}
$(document).trigger({ type: "checkout_toggle_pickup_in_store", checked: pickupInStore.checked });
}
</script>
</div>
}
<div class="section pickup-points" id="pickup-points-form">
@if (Model.PickupPoints.Any())
{
if (Model.PickupInStoreOnly)
{
<input asp-for="PickupInStore" type="hidden" />
}
<div class="select-pickup-point">
@if (Model.PickupPoints.Count == 1)
{
var point = Model.PickupPoints.First();
<input name="pickup-points-id" id="pickup-points-id" type="hidden" value="@($"{point.Id}___{point.ProviderSystemName}")" />
<ul>
<li class="single-pickup-point name">@point.Name</li>
<li class="single-pickup-point address">@($"{point.AddressLine}")</li>
@if (!string.IsNullOrEmpty(point.PickupFee))
{
<li class="single-pickup-point fee">@point.PickupFee</li>
}
</ul>
}
else
{
<label for="pickup-points-select">@T("Checkout.PickupPoints.SelectPickupPoint")</label>
<select name="pickup-points-id" id="pickup-points-select" class="address-select" title="">
@foreach (var point in Model.PickupPoints)
{
var addressLine = new StringBuilder();
var parameters = new List<string>();
if (!string.IsNullOrEmpty(point.Name))
{
parameters.Add(point.Name);
}
if (!string.IsNullOrEmpty(point.Address))
{
parameters.Add(point.Address);
}
if (!string.IsNullOrEmpty(point.City))
{
parameters.Add(point.City);
}
if (!string.IsNullOrEmpty(point.County))
{
parameters.Add(point.County);
}
if (!string.IsNullOrEmpty(point.StateName))
{
parameters.Add(point.StateName);
}
if (!string.IsNullOrEmpty(point.CountryName))
{
parameters.Add(point.CountryName);
}
if (!string.IsNullOrEmpty(point.PickupFee))
{
parameters.Add(point.PickupFee);
}
addressLine.AppendJoin(", ", parameters);
<option selected="@point.IsPreSelected" value="@($"{point.Id}___{point.ProviderSystemName}")">@(addressLine)</option>
}
</select>
}
</div>
@await Component.InvokeAsync(typeof(WidgetViewComponent), new { widgetZone = PublicWidgetZones.CheckoutPickUpPointsAfter, additionalData = Model })
if (Model.DisplayPickupPointsOnMap)
{
var src = $"https://maps.googleapis.com/maps/api/js{(string.IsNullOrEmpty(Model.GoogleMapsApiKey) ? string.Empty : $"?key={Model.GoogleMapsApiKey}")}";
<div class="pickup-points-map" id="map">
<script asp-location="Footer">
var markers = new Map();
var googleMap = null;
$(function() {
$.getScript("@src", function( data, textStatus, jqxhr ) {
google.maps.visualRefresh = true;
googleMap = new google.maps.Map(document.getElementById("map"), {
zoom: 15,
mapTypeId: google.maps.MapTypeId.ROADMAP
});
var geocoder = new google.maps.Geocoder();
var infowindow = new google.maps.InfoWindow();
@for (var i = 0; i < Model.PickupPoints.Count; i++)
{
var point = Model.PickupPoints[i];
var value = $"{point.Id}___{point.ProviderSystemName}";
var pickupPointInfo = Html.Raw($@"<div class='pickup-point-info'><ul><li><strong>{point.Name}</strong></li><li>{point.OpeningHours}</li><li>{point.PickupFee}</li></ul></div>");
if (point.Latitude != null && point.Longitude != null)
{
var latitude = point.Latitude.Value.ToString(CultureInfo.InvariantCulture);
var longitude = point.Longitude.Value.ToString(CultureInfo.InvariantCulture);
<text>
(function() {
var marker = new google.maps.Marker({
map: googleMap,
title: "@point.Name",
position: new google.maps.LatLng(@latitude, @longitude),
icon: "https://maps.google.com/mapfiles/ms/icons/blue-dot.png"
});
markers.set("@value", marker);
google.maps.event.addListener(marker, 'click', function () {
$('#pickup-points-select').val("@value");
googleMap.setCenter(this.getPosition());
infowindow.setContent("@pickupPointInfo");
infowindow.open(googleMap, marker);
});
@if (i == 0) {
<text>googleMap.setCenter(marker.getPosition());</text>
}
}());
</text>
}
else
{
var address = $"{point.Address} {point.City} {point.ZipPostalCode} {point.CountryName}";
<text>
var interval_@(i) = setInterval( function () {
geocoder.geocode({ 'address': "@address" }, function(results, status) {
if (status === google.maps.GeocoderStatus.OK) {
var marker = new google.maps.Marker({
map: googleMap,
title: "@point.Name",
position: results[0].geometry.location,
icon: "https://maps.google.com/mapfiles/ms/icons/blue-dot.png"
});
markers.set("@value", marker);
google.maps.event.addListener(marker, 'click', function () {
$('#pickup-points-select').val("@value");
googleMap.setCenter(this.getPosition());
infowindow.setContent("@pickupPointInfo");
infowindow.open(googleMap, marker);
});
@if (i == 0) {
<text>googleMap.setCenter(marker.getPosition());</text>
}
clearInterval(interval_@i);
}
})
}, 250);
</text>
}
}
$('#pickup-points-select').on('change', function() {
new google.maps.event.trigger(markers.get(this.value), 'click');
});
$("#@Html.IdFor(model => model.PickupInStore)").on('change', function() {
if ($('#@Html.IdFor(model => model.PickupInStore)').is(':checked')) {
var center = googleMap.getCenter();
google.maps.event.trigger(googleMap, 'resize');
googleMap.setCenter(center);
}
})
})
})
</script>
</div>
}
}
<div class="message-error">
<ul>
@foreach (var warning in Model.Warnings)
{
<li>@warning</li>
}
</ul>
</div>
</div>