cst1/openstreetmap-website
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Move endpoints code to its own module

Browse source
This commit is contained in:
Anton Khorev 2024-08-10 06:19:32 +03:00
parent 567a9e5b23
commit 415f497d89
2 changed files with 87 additions and 87 deletions
Download patch file Download diff file Expand all files Collapse all files

84
app/assets/javascripts/index/directions-endpoint.js Normal file
View file

@ -0,0 +1,84 @@
OSM.DirectionsEndpoint = function Endpoint(map, input, iconUrl, dragCallback, geocodeCallback) {
var endpoint = {};
endpoint.marker = L.marker([0, 0], {
icon: L.icon({
iconUrl: iconUrl,
iconSize: [25, 41],
iconAnchor: [12, 41],
popupAnchor: [1, -34],
shadowUrl: OSM.MARKER_SHADOW,
shadowSize: [41, 41]
}),
draggable: true,
autoPan: true
});
endpoint.marker.on("drag dragend", function (e) {
endpoint.setLatLng(e.target.getLatLng());
dragCallback(e.type === "drag");
});
input.on("keydown", function () {
input.removeClass("is-invalid");
});
input.on("change", function (e) {
// make text the same in both text boxes
var value = e.target.value;
endpoint.setValue(value);
});
endpoint.setValue = function (value, latlng) {
endpoint.value = value;
delete endpoint.latlng;
input.removeClass("is-invalid");
input.val(value);
if (latlng) {
endpoint.setLatLng(latlng);
} else {
endpoint.getGeocode();
}
};
endpoint.getGeocode = function () {
// if no one has entered a value yet, then we can't geocode, so don't
// even try.
if (!endpoint.value) {
return;
}
endpoint.awaitingGeocode = true;
var viewbox = map.getBounds().toBBoxString(); // <sw lon>,<sw lat>,<ne lon>,<ne lat>
$.getJSON(OSM.NOMINATIM_URL + "search?q=" + encodeURIComponent(endpoint.value) + "&format=json&viewbox=" + viewbox, function (json) {
endpoint.awaitingGeocode = false;
endpoint.hasGeocode = true;
if (json.length === 0) {
input.addClass("is-invalid");
alert(I18n.t("javascripts.directions.errors.no_place", { place: endpoint.value }));
return;
}
endpoint.setLatLng(L.latLng(json[0]));
input.val(json[0].display_name);
geocodeCallback();
});
};
endpoint.setLatLng = function (ll) {
var precision = OSM.zoomPrecision(map.getZoom());
input.val(ll.lat.toFixed(precision) + ", " + ll.lng.toFixed(precision));
endpoint.hasGeocode = true;
endpoint.latlng = ll;
endpoint.marker
.setLatLng(ll)
.addTo(map);
};
return endpoint;
};

90
app/assets/javascripts/index/directions.js
View file

@ -1,3 +1,4 @@
//= require ./directions-endpoint
//= require_self
//= require_tree ./directions
//= require qs/dist/qs
@ -32,8 +33,8 @@ OSM.Directions = function (map) {
};
var endpoints = [
Endpoint($("input[name='route_from']"), OSM.MARKER_GREEN, endpointDragCallback, endpointGeocodeCallback),
Endpoint($("input[name='route_to']"), OSM.MARKER_RED, endpointDragCallback, endpointGeocodeCallback)
OSM.DirectionsEndpoint(map, $("input[name='route_from']"), OSM.MARKER_GREEN, endpointDragCallback, endpointGeocodeCallback),
OSM.DirectionsEndpoint(map, $("input[name='route_to']"), OSM.MARKER_RED, endpointDragCallback, endpointGeocodeCallback)
];
var expiry = new Date();
@ -53,91 +54,6 @@ OSM.Directions = function (map) {
select.append("<option value='" + i + "'>" + I18n.t("javascripts.directions.engines." + engine.id) + "</option>");
});
function Endpoint(input, iconUrl, dragCallback, geocodeCallback) {
var endpoint = {};
endpoint.marker = L.marker([0, 0], {
icon: L.icon({
iconUrl: iconUrl,
iconSize: [25, 41],
iconAnchor: [12, 41],
popupAnchor: [1, -34],
shadowUrl: OSM.MARKER_SHADOW,
shadowSize: [41, 41]
}),
draggable: true,
autoPan: true
});
endpoint.marker.on("drag dragend", function (e) {
endpoint.setLatLng(e.target.getLatLng());
dragCallback(e.type === "drag");
});
input.on("keydown", function () {
input.removeClass("is-invalid");
});
input.on("change", function (e) {
// make text the same in both text boxes
var value = e.target.value;
endpoint.setValue(value);
});
endpoint.setValue = function (value, latlng) {
endpoint.value = value;
delete endpoint.latlng;
input.removeClass("is-invalid");
input.val(value);
if (latlng) {
endpoint.setLatLng(latlng);
} else {
endpoint.getGeocode();
}
};
endpoint.getGeocode = function () {
// if no one has entered a value yet, then we can't geocode, so don't
// even try.
if (!endpoint.value) {
return;
}
endpoint.awaitingGeocode = true;
var viewbox = map.getBounds().toBBoxString(); // <sw lon>,<sw lat>,<ne lon>,<ne lat>
$.getJSON(OSM.NOMINATIM_URL + "search?q=" + encodeURIComponent(endpoint.value) + "&format=json&viewbox=" + viewbox, function (json) {
endpoint.awaitingGeocode = false;
endpoint.hasGeocode = true;
if (json.length === 0) {
input.addClass("is-invalid");
alert(I18n.t("javascripts.directions.errors.no_place", { place: endpoint.value }));
return;
}
endpoint.setLatLng(L.latLng(json[0]));
input.val(json[0].display_name);
geocodeCallback();
});
};
endpoint.setLatLng = function (ll) {
var precision = OSM.zoomPrecision(map.getZoom());
input.val(ll.lat.toFixed(precision) + ", " + ll.lng.toFixed(precision));
endpoint.hasGeocode = true;
endpoint.latlng = ll;
endpoint.marker
.setLatLng(ll)
.addTo(map);
};
return endpoint;
}
$(".directions_form .reverse_directions").on("click", function () {
var coordFrom = endpoints[0].latlng,
coordTo = endpoints[1].latlng,