' ).attr ({
id : alopeyk.wcshm.public.fn.addPrefix ( alopeyk.wcshm.public.vars.maps.destinationLocatorInputWrapperId ),
class : alopeyk.wcshm.public.fn.addPrefix ( alopeyk.wcshm.public.vars.maps.destinationLocatorInputWrapperClass ),
}),
autoCompleteList = $j( '
' ).attr ({
id : alopeyk.wcshm.public.fn.addPrefix ( alopeyk.wcshm.public.vars.maps.destinationLocatorAutocompleteResultsClass ),
class : alopeyk.wcshm.public.fn.addPrefix ( alopeyk.wcshm.public.vars.maps.destinationLocatorAutocompleteResultsClass ),
}),
mapContainer = $j( '
' ).attr ({
class : alopeyk.wcshm.public.fn.addPrefix ( alopeyk.wcshm.public.vars.maps.mapContainerClass ),
}),
destinationLocatorCta = $j( '
' ).attr ({
type : 'button',
class : alopeyk.wcshm.public.fn.addPrefix ( alopeyk.wcshm.public.vars.maps.destinationLocatorCtaClass ),
}),
markerImage = $j( '
![]()
' ).attr ({
src : mapMarkerImageUrl,
class : alopeyk.wcshm.public.fn.addPrefix ( alopeyk.wcshm.public.vars.maps.mapMarkerIconClass ),
});
destinationAutocompleteInputWrapper
.insertAfter ( destinationAddressInput )
.append ( destinationAutocompleteInput )
.append ( autoCompleteList );
mapCanvas.insertAfter( destinationAutocompleteInputWrapper );
mapContainer.insertAfter( mapCanvas );
mapContainer
.append( mapCanvas )
.append( destinationAutocompleteInputWrapper )
.append( destinationLocatorCta )
.prepend( markerImage );
L.cedarmaps.accessToken = alopeyk.wcshm.public.vars.common.info.alopeyk.wcshm.map.api_key;
var mapOptions = {
zoom : alopeyk.wcshm.public.vars.maps.defaultZoom,
maxZoom : alopeyk.wcshm.public.vars.maps.maxZoom,
center : [
destinationLatInput.val().length ? parseFloat( destinationLatInput.val() ) : alopeyk.wcshm.public.vars.maps.defaultCenter.lat,
destinationLngInput.val().length ? parseFloat( destinationLngInput.val() ) : alopeyk.wcshm.public.vars.maps.defaultCenter.lng,
],
zoomControl : false,
gestureHandling : true,
gestureHandlingText: {
touch: alopeyk.wcshm.public.fn.translate ( 'Use two fingers to move the map' ),
scroll: alopeyk.wcshm.public.fn.translate ( 'Use ctrl + scroll to zoom the map' ),
scrollMac: alopeyk.wcshm.public.fn.translate ( 'Use ⌘ + scroll to zoom the map' ),
}
},
map = L.cedarmaps.map ( mapCanvas.get ( 0 ), alopeyk.wcshm.public.vars.maps.cedarMapTilesSource.replace ( '{{TOKEN}}', L.cedarmaps.accessToken ), mapOptions ),
setActiveAutocompleteItem = function ( index ) {
var results = autoCompleteList.children(),
activeIndex = index == results.length ? 0 : ( index < 0 ? results.length - 1 : index ),
activeClass = alopeyk.wcshm.public.vars.common.activeClass;
results.removeClass ( activeClass ).eq ( activeIndex ).addClass ( activeClass );
},
fetchAddressFromLocation = function () {
if ( alopeyk.wcshm.public.vars.maps.fetchAddressConnection ) {
alopeyk.wcshm.public.vars.maps.fetchAddressConnection.abort();
}
destinationAutocompleteInputWrapper.addClass ( alopeyk.wcshm.public.vars.common.loadingClass );
alopeyk.wcshm.public.vars.maps.fetchAddressConnection = $j.post ( alopeyk.wcshm.public.vars.common.info.ajaxOptions.url, {
nonce : alopeyk.wcshm.public.vars.common.info.ajaxOptions.nonce,
action : alopeyk.wcshm.public.vars.common.info.alopeyk.wcshm.id,
request : 'get_address',
authenticate : true,
ask_cedar : true,
lat : map.getCenter().lat,
lng : map.getCenter().lng,
}, function ( response ) {
if ( response ) {
autoCompleteList.empty();
destinationCityInput.val ( response.success && response.data.city ? response.data.city : '' );
destinationAutocompleteInput.val ( response.data.address );
var address = response.success ? response.data.address : '';
destinationAddressInput.val ( address ).trigger ( 'change' );
shippingAddress1Input.val ( address );
shippingAddress2Input.val ( '' );
if ( shipToDifferentAddressInput.length && ! shipToDifferentAddressInput.prop ( 'checked' ) ) {
if ( billingAddress1Input.length )
billingAddress1Input.val ( address );
if ( billingAddress2Input.length )
billingAddress2Input.val ( '' );
}
}
}).always ( function () {
destinationAutocompleteInputWrapper.removeClass ( alopeyk.wcshm.public.vars.common.loadingClass );
});
},
saveData = function ( update ) {
if ( alopeyk.wcshm.public.vars.updateShipingMethod ) {
alopeyk.wcshm.public.vars.updateShipingMethod.abort();
}
destinationAddressInput.parents ( 'form' )
.find ( 'button, input[type="button"], input[type="submit"]' )
.filter ( function () {
return ! $j( this ).is ( ':disabled' );
})
.prop ( 'disabled', true )
.data ( 'alopeyk-disable', true );
alopeyk.wcshm.public.vars.updateShipingMethod = $j.post ( alopeyk.wcshm.public.vars.common.info.ajaxOptions.url, {
nonce : alopeyk.wcshm.public.vars.common.info.ajaxOptions.nonce,
action : alopeyk.wcshm.public.vars.common.info.alopeyk.wcshm.id,
request : 'set_session',
authenticate : true,
lat : map.getCenter().lat,
lng : map.getCenter().lng,
city : destinationCityInput.val(),
address : destinationAddressInput.val(),
number : destinationNumberInput.val(),
unit : destinationUnitInput.val(),
payment_method : $j( paymentMethodInputSelector + ':checked' ).val(),
}, function ( response ) {
if ( response && response.success && update ) {
$j( 'body' ).trigger ( 'update_checkout' );
}
destinationAddressInput.parents ( 'form' )
.find ( 'button, input[type="button"], input[type="submit"]' )
.filter ( function () {
return $j( this ).data ( 'alopeyk-disable' );
})
.prop ( 'disabled', false );
});
},
paymentMethodInputSelector = alopeyk.wcshm.public.vars.common.paymentMethodInput;
L.control.zoom ({
position : 'bottomright'
})
.addTo ( map );
alopeyk.wcshm.public.vars.common.destinationMap = {
mapObject : map
};
if ( alopeyk.wcshm.public.vars.common.info.woocommerce.checkout ) {
$j( document ).on ( 'change', paymentMethodInputSelector + ', #' + destinationAddressInput.attr ( 'id' ) , function () {
saveData ( true );
});
$j.merge ( destinationNumberInput, destinationUnitInput ).on ( 'change paste keyup input propertychange', function () {
if ( alopeyk.wcshm.public.vars.maps.addressDetailKeyupTimeout ) {
clearTimeout( alopeyk.wcshm.public.vars.maps.addressDetailKeyupTimeout );
}
alopeyk.wcshm.public.vars.maps.addressDetailKeyupTimeout = setTimeout ( function () {
saveData ( false );
}, alopeyk.wcshm.public.vars.maps.autoCompleteKeyupDelay );
});
}
map.on ( 'move', function () {
destinationLatInput.val ( map.getCenter().lat );
destinationLngInput.val ( map.getCenter().lng );
});
map.on ( 'dragend', function () {
fetchAddressFromLocation();
});
$j.merge ( destinationLatInput, destinationLngInput ).on ( 'change paste keyup input propertychange', function () {
if ( alopeyk.wcshm.public.vars.maps.latitudeValue != destinationLatInput.val() || alopeyk.wcshm.public.vars.maps.longitudeValue != destinationLngInput.val() ) {
alopeyk.wcshm.public.vars.maps.latitudeValue = destinationLatInput.val();
alopeyk.wcshm.public.vars.maps.longitudeValue = destinationLngInput.val();
if ( alopeyk.wcshm.public.vars.maps.positionKeyupTimeout ) {
clearTimeout( alopeyk.wcshm.public.vars.maps.positionKeyupTimeout );
}
alopeyk.wcshm.public.vars.maps.positionKeyupTimeout = setTimeout ( function () {
var location = { lat : parseFloat ( destinationLatInput.val() ), lng : parseFloat ( destinationLngInput.val() ) };
map.setView ( location );
fetchAddressFromLocation();
}, alopeyk.wcshm.public.vars.maps.positionKeyupDelay );
}
});
shipToDifferentAddressInput.on ( 'change', function () {
var checked = $j( this ).prop ( 'checked' ),
display = checked ? '' : 'none';
billingAddress1Input.parent().css ( 'display', display );
billingAddress2Input.parent().css ( 'display', display );
if ( ! checked ) {
billingAddress1Input.val ( shippingAddress1Input.val() );
billingAddress2Input.val ( shippingAddress2Input.val() );
}
}).trigger ( 'change' );
destinationAutocompleteInput.on ({
'keydown' : function ( e ) {
var activeItem = autoCompleteList.children ( '.' + alopeyk.wcshm.public.vars.common.activeClass ),
activeIndex = activeItem.length ? activeItem.index() : -1;
switch ( e.which ) {
case 13:
e.preventDefault();
if ( activeItem ) {
activeItem.trigger ( 'click' );
}
break;
case 27:
destinationAutocompleteInput.blur();
break;
case 38:
e.preventDefault();
setActiveAutocompleteItem( activeIndex - 1 );
break;
case 40:
e.preventDefault();
setActiveAutocompleteItem( activeIndex + 1 );
break;
}
},
'change paste keyup input propertychange' : function ( e ) {
if ( alopeyk.wcshm.public.vars.maps.autocompleteInputValue != destinationAutocompleteInput.val() ) {
autoCompleteList.empty();
alopeyk.wcshm.public.vars.maps.autocompleteInputValue = destinationAutocompleteInput.val();
if ( alopeyk.wcshm.public.vars.maps.autocompleteKeyupTimeout ) {
clearTimeout( alopeyk.wcshm.public.vars.maps.autocompleteKeyupTimeout );
}
alopeyk.wcshm.public.vars.maps.autocompleteKeyupTimeout = setTimeout ( function () {
if ( alopeyk.wcshm.public.vars.maps.autocompleteConnection ) {
alopeyk.wcshm.public.vars.maps.autocompleteConnection.abort();
}
destinationAutocompleteInputWrapper.addClass ( alopeyk.wcshm.public.vars.common.loadingClass );
alopeyk.wcshm.public.vars.maps.autocompleteConnection = $j.post ( alopeyk.wcshm.public.vars.common.info.ajaxOptions.url, {
nonce : alopeyk.wcshm.public.vars.common.info.ajaxOptions.nonce,
action : alopeyk.wcshm.public.vars.common.info.alopeyk.wcshm.id,
request : 'suggest_address',
authenticate : true,
input : destinationAutocompleteInput.val(),
lat : map.getCenter().lat,
lng : map.getCenter().lng,
}, function ( response ) {
if ( response && response.success && response.data.length ) {
destinationAutocompleteInput.focus();
for ( var i = 0; i < response.data.length; i++ ) {
var itemLat = parseFloat( response.data[i].lat ),
itemLng = parseFloat( response.data[i].lng ),
itemLocation = { lat : itemLat, lng : itemLng },
itemAddress = response.data[i].address,
itemCity = response.data[i].city,
resultItem = $j( '
' )
.addClass( alopeyk.wcshm.public.fn.addPrefix ( alopeyk.wcshm.public.vars.maps.destinationLocatorAutocompleteResultClass ) )
.attr ( 'title', itemAddress )
.data ({
city : itemCity,
address : itemAddress,
location : itemLocation
})
.text ( itemAddress )
.on ({
'click' : function () {
var city = $j( this ).data ( 'city' ),
address = $j( this ).data ( 'address' ),
location = $j( this ).data ( 'location' );
destinationAutocompleteInput.blur();
destinationAutocompleteInput.val ( address );
destinationAddressInput.val ( address );
destinationCityInput.val ( city );
map.setView ( location );
map.setZoom ( alopeyk.wcshm.public.vars.maps.defaultZoom );
destinationLatInput.val ( location.lat );
destinationLngInput.val ( location.lng );
alopeyk.wcshm.public.vars.maps.autocompleteInputValue = address;
shippingAddress1Input.val ( address );
shippingAddress2Input.val ( '' );
if ( shipToDifferentAddressInput.length && ! shipToDifferentAddressInput.prop ( 'checked' ) ) {
if ( billingAddress1Input.length )
billingAddress1Input.val ( address );
if ( billingAddress2Input.length )
billingAddress2Input.val ( '' );
}
fetchAddressFromLocation();
},
'hover' : function () {
setActiveAutocompleteItem ( $j( this ).index() );
}
});
autoCompleteList.append ( resultItem );
}
}
}).always ( function () {
destinationAutocompleteInputWrapper.removeClass ( alopeyk.wcshm.public.vars.common.loadingClass );
});
}, alopeyk.wcshm.public.vars.maps.autoCompleteKeyupDelay );
}
}
});
destinationLocatorCta.on ( 'click', function () {
alopeyk.wcshm.public.fn.setCurrentGeolocation ( true );
});
alopeyk.wcshm.public.fn.setCurrentGeolocation();
};
if ( editAddressButton.length && editAddressButton.is ( ':visible' ) ) {
editAddressButton.on ( 'click', function () {
initialize();
});
} else {
initialize();
}
},
init : function () {
},
};
/*=========================================
= Calling Functions =
=========================================*/
/**
*
* Registered Events
*
**/
$j( document ).on ({
'ready' : function ( e ) {
alopeyk.wcshm.public.fn.init();
}
});
$j( window ).on ({
'load' : function ( e ) {
alopeyk.wcshm.public.fn.initMaps();
},
});
})( jQuery );