From 6aa94a787ce221a7c808e5085bc48b8ce82c3069 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Sen=C3=A9n=20Rodero=20Rodr=C3=ADguez?= Date: Tue, 28 Jul 2020 09:58:30 +0200 Subject: [PATCH] Use map location form latitude, longitude and zoom when valid When using an editable map is better to load marker latitude, longitude and map zoom from form fields so we can show the marker at latest position defined by user when the page was restored from browser history. To reproduce this behavior: 0. Undo this commit 1. Go to new proposal page 2. Place the proposal map marker 3. Go away to any other page 4. Restore new proposal page from browser history. At this point you should not see the recently placed marker. The same thing happens when editing a proposal. --- app/assets/javascripts/map.js | 29 +++++++++++++++++++---- spec/shared/system/mappable.rb | 42 ++++++++++++++++++++++++++++++++++ 2 files changed, 67 insertions(+), 4 deletions(-) diff --git a/app/assets/javascripts/map.js b/app/assets/javascripts/map.js index 9d864d585..0dc8d15d3 100644 --- a/app/assets/javascripts/map.js +++ b/app/assets/javascripts/map.js @@ -20,18 +20,36 @@ App.Map.maps = []; }, initializeMap: function(element) { - var addMarkerInvestments, clearFormfields, createMarker, editable, getPopupContent, latitudeInputSelector, longitudeInputSelector, map, mapAttribution, mapCenterLatLng, mapCenterLatitude, mapCenterLongitude, mapTilesProvider, marker, markerIcon, markerLatitude, markerLongitude, moveOrPlaceMarker, openMarkerPopup, removeMarker, removeMarkerSelector, updateFormfields, zoom, zoomInputSelector; + var addMarkerInvestments, clearFormfields, createMarker, editable, formCoordinates, getPopupContent, + latitudeInputSelector, longitudeInputSelector, map, mapAttribution, mapCenterLatLng, + mapCenterLatitude, mapCenterLongitude, mapTilesProvider, marker, markerIcon, markerLatitude, + markerLongitude, moveOrPlaceMarker, openMarkerPopup, removeMarker, removeMarkerSelector, + updateFormfields, zoom, zoomInputSelector; App.Map.cleanInvestmentCoordinates(element); mapCenterLatitude = $(element).data("map-center-latitude"); mapCenterLongitude = $(element).data("map-center-longitude"); - markerLatitude = $(element).data("marker-latitude"); - markerLongitude = $(element).data("marker-longitude"); - zoom = $(element).data("map-zoom"); mapTilesProvider = $(element).data("map-tiles-provider"); mapAttribution = $(element).data("map-tiles-provider-attribution"); latitudeInputSelector = $(element).data("latitude-input-selector"); longitudeInputSelector = $(element).data("longitude-input-selector"); zoomInputSelector = $(element).data("zoom-input-selector"); + formCoordinates = { + lat: $(latitudeInputSelector).val(), + long: $(longitudeInputSelector).val(), + zoom: $(zoomInputSelector).val() + }; + if (App.Map.validCoordinates(formCoordinates)) { + markerLatitude = formCoordinates.lat; + markerLongitude = formCoordinates.long; + } else { + markerLatitude = $(element).data("marker-latitude"); + markerLongitude = $(element).data("marker-longitude"); + } + if (App.Map.validZoom(formCoordinates.zoom)) { + zoom = formCoordinates.zoom; + } else { + zoom = $(element).data("map-zoom"); + } removeMarkerSelector = $(element).data("marker-remove-selector"); addMarkerInvestments = $(element).data("marker-investments-coordinates"); editable = $(element).data("marker-editable"); @@ -134,6 +152,9 @@ $(element).attr("data-marker-investments-coordinates", clean_markers); } }, + validZoom: function(zoom) { + return App.Map.isNumeric(zoom); + }, validCoordinates: function(coordinates) { return App.Map.isNumeric(coordinates.lat) && App.Map.isNumeric(coordinates.long); }, diff --git a/spec/shared/system/mappable.rb b/spec/shared/system/mappable.rb index 455e5876e..8d1df1aab 100644 --- a/spec/shared/system/mappable.rb +++ b/spec/shared/system/mappable.rb @@ -100,6 +100,40 @@ shared_examples "mappable" do |mappable_factory_name, mappable_association_name, expect(page).to have_css(".leaflet-map-pane", count: 1) end end + + scenario "keeps marker and zoom defined by the user", :js do + do_login_for user + visit send(mappable_new_path, arguments) + + within ".map_location" do + expect(page).not_to have_css(".map-icon") + end + expect(page.execute_script("return App.Map.maps[0].getZoom();")).to eq(10) + + map_zoom_in + find("#new_map_location").click + + within ".map_location" do + expect(page).to have_css(".map-icon") + end + + if management + click_link "Select user" + + expect(page).to have_content "User management" + else + click_link "Help" + + expect(page).to have_content "CONSUL is a platform for citizen participation" + end + + go_back + + within ".map_location" do + expect(page).to have_css(".map-icon") + expect(page.execute_script("return App.Map.maps[0].getZoom();")).to eq(11) + end + end end scenario "Skip map", :js do @@ -293,3 +327,11 @@ def set_arguments(arguments, mappable, mappable_path_arguments) arguments.merge!("#{argument_name}": mappable.send(path_to_value)) end end + +def map_zoom_in + initial_zoom = page.execute_script("return App.Map.maps[0].getZoom();") + find(".leaflet-control-zoom-in").click + until page.execute_script("return App.Map.maps[0].getZoom() === #{initial_zoom + 1};") do + sleep 0.01 + end +end