From 96bcd088035feb1910eb646b82058a17ef195809 Mon Sep 17 00:00:00 2001 From: Robert Foster Date: Mon, 16 Dec 2024 00:23:30 +1100 Subject: [PATCH] More map fixes --- .../Our.Umbraco.GMaps.Core.csproj | 2 +- Our.Umbraco.GMaps/Our.Umbraco.GMaps.csproj | 2 +- .../wwwroot/js/maps.controller.js | 37 ++++++++++--------- 3 files changed, 22 insertions(+), 19 deletions(-) diff --git a/Our.Umbraco.GMaps.Core/Our.Umbraco.GMaps.Core.csproj b/Our.Umbraco.GMaps.Core/Our.Umbraco.GMaps.Core.csproj index 2b93e05..26c1128 100644 --- a/Our.Umbraco.GMaps.Core/Our.Umbraco.GMaps.Core.csproj +++ b/Our.Umbraco.GMaps.Core/Our.Umbraco.GMaps.Core.csproj @@ -3,7 +3,7 @@ net6.0;net7.0;net8.0 True - 3.0.4 + 3.0.5 Arnold Visser Arnold Visser Basic Google Maps with autocomplete property editor for Umbraco 8+. This package contains the Core DLL only. diff --git a/Our.Umbraco.GMaps/Our.Umbraco.GMaps.csproj b/Our.Umbraco.GMaps/Our.Umbraco.GMaps.csproj index db5de69..fbe77bc 100644 --- a/Our.Umbraco.GMaps/Our.Umbraco.GMaps.csproj +++ b/Our.Umbraco.GMaps/Our.Umbraco.GMaps.csproj @@ -7,7 +7,7 @@ false true - 3.0.4 + 3.0.5 Arnold Visser Arnold Visser Basic Google Maps with autocomplete property editor for Umbraco 8+ diff --git a/Our.Umbraco.GMaps/wwwroot/js/maps.controller.js b/Our.Umbraco.GMaps/wwwroot/js/maps.controller.js index 00c3032..8e0a77c 100644 --- a/Our.Umbraco.GMaps/wwwroot/js/maps.controller.js +++ b/Our.Umbraco.GMaps/wwwroot/js/maps.controller.js @@ -52,10 +52,8 @@ angular.module('umbraco').controller('GMapsMapsController', ['$scope', '$element function clearLocation() { actClearLocation.isDisabled = true if (vm.marker) { - vm.marker.setVisible(true) vm.map.setCenter(vm.defaultLocation) - vm.marker.setPosition(vm.defaultLocation) - vm.marker.setVisible(true) + vm.marker.vm.position = vm.defaultLocation } clearData() } @@ -68,9 +66,7 @@ angular.module('umbraco').controller('GMapsMapsController', ['$scope', '$element $scope.mapCenter = vm.defaultLocation } if (vm.marker) { - vm.marker.setVisible(true) vm.map.setCenter($scope.mapCenter) - vm.marker.setVisible(true) } saveData() actResetCenter.isDisabled = true @@ -98,6 +94,14 @@ angular.module('umbraco').controller('GMapsMapsController', ['$scope', '$element } } + function encodeMapCoordinates(coordinates) { + return new google.maps.LatLng(parseFloat(coordinates.lat), parseFloat(coordinates.lng)) + } + + function getPinCoordinates(coordinates) { + return new google.maps.LatLng(coordinates.lat(), coordinates.lng()) + } + // Geocode based on coordinates function geocodePosition (coordinates, callback) { $scope.showLoader = true @@ -190,7 +194,7 @@ angular.module('umbraco').controller('GMapsMapsController', ['$scope', '$element const composedAddress = getAddressObject(address.address_components) $scope.address = { ...composedAddress, ...{ full_address: address.formatted_address } } } - $scope.address.coordinates = { lat: coordinates.lat(), lng: coordinates.lng() } + $scope.address.coordinates = { lat: coordinates.lat, lng: coordinates.lng } if ($scope.address.full_address) { $scope.searchedValue = $scope.address.full_address @@ -241,8 +245,8 @@ angular.module('umbraco').controller('GMapsMapsController', ['$scope', '$element actResetCenter.isDisabled = false } - var latLng = new google.maps.LatLng(parseFloat(coordinates.lat), parseFloat(coordinates.lng)) - var latLngMapCenter = new google.maps.LatLng(parseFloat(mapCenterCoordinates.lat), parseFloat(mapCenterCoordinates.lng)) + var latLng = encodeMapCoordinates(coordinates) + var latLngMapCenter = encodeMapCoordinates(mapCenterCoordinates) var mapTypeId = vm.mapType || google.maps.MapTypeId.ROADMAP @@ -286,11 +290,12 @@ angular.module('umbraco').controller('GMapsMapsController', ['$scope', '$element position: latLng, title: 'Marker', map: vm.map, + gmpDraggable: true, draggable: true }) google.maps.event.addListener(vm.marker, 'dragend', function () { - geocodePosition(vm.marker.getPosition(), function () { + geocodePosition(vm.marker.position, function () { $scope.$apply(function () { $scope.showLoader = false }) @@ -299,8 +304,8 @@ angular.module('umbraco').controller('GMapsMapsController', ['$scope', '$element google.maps.event.addListener(vm.map, 'click', function (event) { var clickedMapLocation = event.latLng - vm.marker.setPosition(clickedMapLocation) - geocodePosition(clickedMapLocation, function () { + vm.marker.position = getPinCoordinates(clickedMapLocation) + geocodePosition(vm.marker.position, function () { $scope.$apply(function () { $scope.showLoader = false }) @@ -330,7 +335,6 @@ angular.module('umbraco').controller('GMapsMapsController', ['$scope', '$element autocomplete.addListener('place_changed', function () { - vm.marker.setVisible(false) var place = autocomplete.getPlace() if (!place.geometry) { // User entered the name of a Place that was not suggested and pressed the Enter key, or the Place Details request failed. @@ -339,8 +343,7 @@ angular.module('umbraco').controller('GMapsMapsController', ['$scope', '$element $scope.address.coordinates = coordTest // Set the map center as well. $scope.mapCenter = coordTest - vm.marker.setPosition($scope.address.coordinates) - vm.marker.setVisible(true) + vm.marker.position = $scope.address.coordinates vm.map.setCenter($scope.address.coordinates) actResetCenter.isDisabled = true } else { @@ -356,9 +359,9 @@ angular.module('umbraco').controller('GMapsMapsController', ['$scope', '$element vm.map.setCenter(place.geometry.location) vm.map.setZoom(vm.zoomLevel) } - vm.marker.setPosition(place.geometry.location) - vm.marker.setVisible(true) - updateMarkerAddress(place, place.geometry.location) + vm.map.map = vm.map + vm.marker.position = getPinCoordinates(place.geometry.location) + updateMarkerAddress(place, vm.marker.position) } }) }