//= require leaflet.locatecontrol/src/L.Control.Locate
$(document).ready(function () {
+ var defaultHomeZoom = 12;
+ var map, marker, deleted_lat, deleted_lon;
+
if ($("#map").length) {
- var map = L.map("map", {
+ map = L.map("map", {
attributionControl: false,
zoomControl: false
}).addLayer(new L.OSM.Mapnik());
.addClass("control-button");
if (OSM.home) {
- map.setView([OSM.home.lat, OSM.home.lon], 12);
+ map.setView([OSM.home.lat, OSM.home.lon], defaultHomeZoom);
} else {
map.setView([0, 0], 0);
}
if ($("#map").hasClass("set_location")) {
- var marker = L.marker([0, 0], { icon: OSM.getUserIcon() });
+ marker = L.marker([0, 0], {
+ icon: OSM.getUserIcon(),
+ keyboard: false,
+ interactive: false
+ });
if (OSM.home) {
marker.setLatLng([OSM.home.lat, OSM.home.lon]);
}
map.on("click", function (e) {
- if ($("#updatehome").is(":checked")) {
- var zoom = map.getZoom(),
- precision = OSM.zoomPrecision(zoom),
- location = e.latlng.wrap();
+ if (!$("#updatehome").is(":checked")) return;
+
+ var zoom = map.getZoom(),
+ precision = OSM.zoomPrecision(zoom),
+ location = e.latlng.wrap();
+
+ $("#home_lat").val(location.lat.toFixed(precision));
+ $("#home_lon").val(location.lng.toFixed(precision));
+
+ deleted_lat = null;
+ deleted_lon = null;
+ respondToHomeUpdate();
+ }).on("moveend", function () {
+ var lat = $("#home_lat").val().trim(),
+ lon = $("#home_lon").val().trim(),
+ location;
+
+ try {
+ if (lat && lon) {
+ location = L.latLng(lat, lon);
+ }
+ } catch (error) {
+ // keep location undefined
+ }
- $("#home_message").hide();
- $("#home_lat").val(location.lat.toFixed(precision));
- $("#home_lon").val(location.lng.toFixed(precision));
+ $("#home_show").prop("disabled", !location || isCloseEnoughToMapCenter(location));
+ });
- marker.setLatLng(e.latlng);
- marker.addTo(map);
- }
+ $("#home_lat, #home_lon").on("input", function () {
+ deleted_lat = null;
+ deleted_lon = null;
+ respondToHomeUpdate();
+ });
+
+ $("#home_show").click(function () {
+ var lat = $("#home_lat").val(),
+ lon = $("#home_lon").val();
+
+ map.setView([lat, lon], defaultHomeZoom);
+ });
+
+ $("#home_delete").click(function () {
+ var lat = $("#home_lat").val(),
+ lon = $("#home_lon").val();
+
+ $("#home_lat, #home_lon").val("");
+ deleted_lat = lat;
+ deleted_lon = lon;
+ respondToHomeUpdate();
+ $("#home_undelete").trigger("focus");
+ });
+
+ $("#home_undelete").click(function () {
+ $("#home_lat").val(deleted_lat);
+ $("#home_lon").val(deleted_lon);
+ deleted_lat = null;
+ deleted_lon = null;
+ respondToHomeUpdate();
+ $("#home_delete").trigger("focus");
});
} else {
$("[data-user]").each(function () {
}
}
+ function respondToHomeUpdate() {
+ var lat = $("#home_lat").val().trim(),
+ lon = $("#home_lon").val().trim(),
+ location;
+
+ try {
+ if (lat && lon) {
+ location = L.latLng(lat, lon);
+ }
+ $("#home_lat, #home_lon").removeClass("is-invalid");
+ } catch (error) {
+ if (lat && isNaN(lat)) $("#home_lat").addClass("is-invalid");
+ if (lon && isNaN(lon)) $("#home_lon").addClass("is-invalid");
+ }
+
+ $("#home_message").toggleClass("invisible", Boolean(location));
+ $("#home_show").prop("hidden", !location);
+ $("#home_delete").prop("hidden", !location);
+ $("#home_undelete").prop("hidden", !(!location && deleted_lat && deleted_lon));
+ if (location) {
+ marker.setLatLng([lat, lon]);
+ marker.addTo(map);
+ map.panTo([lat, lon]);
+ } else {
+ marker.removeFrom(map);
+ }
+ }
+
+ function isCloseEnoughToMapCenter(location) {
+ var inputPt = map.latLngToContainerPoint(location),
+ centerPt = map.latLngToContainerPoint(map.getCenter());
+
+ return centerPt.distanceTo(inputPt) < 10;
+ }
+
function updateAuthUID() {
var provider = $("select#user_auth_provider").val();
<fieldset>
<legend><%= t ".home location" -%></legend>
- <p id="home_message" class="text-muted"<% if current_user.home_lat and current_user.home_lon %> hidden<% end %>><%= t ".no home location" %></p>
+ <p id="home_message" class="text-muted m-0<% if current_user.has_home? %> invisible<% end %>"><%= t ".no home location" %></p>
<div class="row">
<%= f.text_field :home_lat, :wrapper_class => "col-sm-4", :id => "home_lat" %>
<%= f.text_field :home_lon, :wrapper_class => "col-sm-4", :id => "home_lon" %>
+ <div class="col-sm-4 pt-2 align-self-end">
+ <button type="button" id="home_show" class="btn btn-outline-primary"<% unless current_user.has_home? %> hidden<% end %> disabled><%= t ".show" %></button>
+ <button type="button" id="home_delete" class="btn btn-outline-primary"<% unless current_user.has_home? %> hidden<% end %>><%= t ".delete" %></button>
+ <button type="button" id="home_undelete" class="btn btn-outline-primary" hidden><%= t ".undelete" %></button>
+ </div>
</div>
<div class="form-check">
- <input class="form-check-input" type="checkbox" name="updatehome" value="1" <% unless current_user.home_lat and current_user.home_lon %> checked="checked" <% end %> id="updatehome" />
+ <input class="form-check-input" type="checkbox" name="updatehome" value="1" <% unless current_user.has_home? %> checked <% end %> id="updatehome" />
<label class="form-check-label" for="updatehome"><%= t ".update home location on click" %></label>
</div>
<%= tag.div "", :id => "map", :class => "content_map set_location border border-grey rounded" %>