From aa5f2b6ac6da91ac0f7baf5fb3ad6c29c2acb5bd Mon Sep 17 00:00:00 2001 From: Anton Khorev Date: Thu, 1 May 2025 08:11:49 +0300 Subject: [PATCH] Move dashboard-specific javascript to dashboard.js Stops attempting to use OSM.HomeLocationNameGeocoder on dashboard pages. --- app/assets/javascripts/dashboard.js | 33 +++++++ app/assets/javascripts/user.js | 134 +++++++++++++--------------- app/views/dashboards/show.html.erb | 2 +- app/views/profiles/edit.html.erb | 2 +- test/system/dashboard_test.rb | 21 +++++ 5 files changed, 118 insertions(+), 74 deletions(-) create mode 100644 app/assets/javascripts/dashboard.js diff --git a/app/assets/javascripts/dashboard.js b/app/assets/javascripts/dashboard.js new file mode 100644 index 000000000..7719cac38 --- /dev/null +++ b/app/assets/javascripts/dashboard.js @@ -0,0 +1,33 @@ +//= require leaflet.locate + +$(function () { + const defaultHomeZoom = 12; + let map; + + if ($("#map").length) { + map = L.map("map", { + attributionControl: false, + zoomControl: false + }).addLayer(new L.OSM.Mapnik()); + + const position = $("html").attr("dir") === "rtl" ? "topleft" : "topright"; + + L.OSM.zoom({ position }).addTo(map); + + L.OSM.locate({ position }).addTo(map); + + if (OSM.home) { + map.setView([OSM.home.lat, OSM.home.lon], defaultHomeZoom); + } else { + map.setView([0, 0], 0); + } + + $("[data-user]").each(function () { + const user = $(this).data("user"); + if (user.lon && user.lat) { + L.marker([user.lat, user.lon], { icon: OSM.getMarker({ icon: user.icon }) }).addTo(map) + .bindPopup(user.description, { minWidth: 200 }); + } + }); + } +}); diff --git a/app/assets/javascripts/user.js b/app/assets/javascripts/user.js index 028bf2074..7d2dc23d0 100644 --- a/app/assets/javascripts/user.js +++ b/app/assets/javascripts/user.js @@ -33,95 +33,85 @@ $(function () { map.setView([0, 0], 0); } - if ($("#map").hasClass("set_location")) { - marker = L.marker([0, 0], { - icon: OSM.getMarker({}), - keyboard: false, - interactive: false - }); - - if (OSM.home) { - marker.setLatLng([OSM.home.lat, OSM.home.lon]); - marker.addTo(map); - } + marker = L.marker([0, 0], { + icon: OSM.getMarker({}), + keyboard: false, + interactive: false + }); - map.on("click", function (e) { - if (!$("#updatehome").is(":checked")) return; + if (OSM.home) { + marker.setLatLng([OSM.home.lat, OSM.home.lon]); + marker.addTo(map); + } - const [lat, lon] = OSM.cropLocation(e.latlng, map.getZoom()); + map.on("click", function (e) { + if (!$("#updatehome").is(":checked")) return; - $("#home_lat").val(lat); - $("#home_lon").val(lon); + const [lat, lon] = OSM.cropLocation(e.latlng, map.getZoom()); - clearDeletedText(); - respondToHomeLatLonUpdate(); - }).on("moveend", function () { - const lat = $("#home_lat").val().trim(), - lon = $("#home_lon").val().trim(); - let location; + $("#home_lat").val(lat); + $("#home_lon").val(lon); - try { - if (lat && lon) { - location = L.latLng(lat, lon); - } - } catch (error) { - // keep location undefined + clearDeletedText(); + respondToHomeLatLonUpdate(); + }).on("moveend", function () { + const lat = $("#home_lat").val().trim(), + lon = $("#home_lon").val().trim(); + let location; + + try { + if (lat && lon) { + location = L.latLng(lat, lon); } + } catch (error) { + // keep location undefined + } - $("#home_show").prop("disabled", !location || isCloseEnoughToMapCenter(location)); - }); + $("#home_show").prop("disabled", !location || isCloseEnoughToMapCenter(location)); + }); - $("#home_lat, #home_lon").on("input", function () { - clearDeletedText(); - respondToHomeLatLonUpdate(); - }); + $("#home_lat, #home_lon").on("input", function () { + clearDeletedText(); + respondToHomeLatLonUpdate(); + }); - $("#home_location_name").on("input", function () { - homeLocationNameGeocoder.autofill = false; - clearDeletedText(); + $("#home_location_name").on("input", function () { + homeLocationNameGeocoder.autofill = false; + clearDeletedText(); - respondToHomeLatLonUpdate(false); - }); + respondToHomeLatLonUpdate(false); + }); - $("#home_show").click(function () { - const lat = $("#home_lat").val(), - lon = $("#home_lon").val(); + $("#home_show").click(function () { + const lat = $("#home_lat").val(), + lon = $("#home_lon").val(); - map.setView([lat, lon], defaultHomeZoom); - }); + map.setView([lat, lon], defaultHomeZoom); + }); - $("#home_delete").click(function () { - const lat = $("#home_lat").val(), - lon = $("#home_lon").val(), - locationName = $("#home_location_name").val(); + $("#home_delete").click(function () { + const lat = $("#home_lat").val(), + lon = $("#home_lon").val(), + locationName = $("#home_location_name").val(); - $("#home_lat, #home_lon, #home_location_name").val(""); - deleted_lat = lat; - deleted_lon = lon; - deleted_home_name = locationName; + $("#home_lat, #home_lon, #home_location_name").val(""); + deleted_lat = lat; + deleted_lon = lon; + deleted_home_name = locationName; - respondToHomeLatLonUpdate(false); - $("#home_undelete").trigger("focus"); - }); + respondToHomeLatLonUpdate(false); + $("#home_undelete").trigger("focus"); + }); - $("#home_undelete").click(function () { - $("#home_lat").val(deleted_lat); - $("#home_lon").val(deleted_lon); - $("#home_location_name").val(deleted_home_name); - clearDeletedText(); + $("#home_undelete").click(function () { + $("#home_lat").val(deleted_lat); + $("#home_lon").val(deleted_lon); + $("#home_location_name").val(deleted_home_name); + clearDeletedText(); - respondToHomeLatLonUpdate(false); - $("#home_delete").trigger("focus"); - }); - } else { - $("[data-user]").each(function () { - const user = $(this).data("user"); - if (user.lon && user.lat) { - L.marker([user.lat, user.lon], { icon: OSM.getMarker({ icon: user.icon }) }).addTo(map) - .bindPopup(user.description, { minWidth: 200 }); - } - }); - } + respondToHomeLatLonUpdate(false); + $("#home_delete").trigger("focus"); + }); } function respondToHomeLatLonUpdate(updateLocationName = true) { diff --git a/app/views/dashboards/show.html.erb b/app/views/dashboards/show.html.erb index 78ff0560f..fe748e1a3 100644 --- a/app/views/dashboards/show.html.erb +++ b/app/views/dashboards/show.html.erb @@ -10,7 +10,7 @@ <% else %> <% content_for :head do %> - <%= javascript_include_tag "user" %> + <%= javascript_include_tag "dashboard" %> <% end %> <% user_data = { :lon => current_user.home_lon, diff --git a/app/views/profiles/edit.html.erb b/app/views/profiles/edit.html.erb index a7dd437e5..57e5acda7 100644 --- a/app/views/profiles/edit.html.erb +++ b/app/views/profiles/edit.html.erb @@ -57,7 +57,7 @@ checked <% end %> id="updatehome" /> - <%= tag.div "", :id => "map", :class => "content_map set_location border border-secondary-subtle rounded z-0" %> + <%= tag.div "", :id => "map", :class => "content_map border border-secondary-subtle rounded z-0" %> <%= f.primary t(".save") %> diff --git a/test/system/dashboard_test.rb b/test/system/dashboard_test.rb index 34c348d84..9df3e208c 100644 --- a/test/system/dashboard_test.rb +++ b/test/system/dashboard_test.rb @@ -49,4 +49,25 @@ class DashboardSystemTest < ApplicationSystemTestCase assert_link "Unfollow", :below => followings_heading, :above => others_nearby_heading end end + + test "show map with home marker if home location is set" do + user = create(:user, :display_name => "Fred Tester", :home_lon => 1.1, :home_lat => 1.1) + sign_in_as(user) + + visit dashboard_path + + within "#map" do + assert_no_text "Your location" + assert_no_link "Fred Tester" + + find("img.leaflet-marker-icon").click + + assert_text "Your location" + assert_link "Fred Tester" + + click_on "Fred Tester" + end + + assert_current_path user_path(user) + end end -- 2.39.5