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

Improve context menu initialisation to avoid namespace pollution

Browse source
This commit is contained in:
Tom Hughes 2017-02-12 14:59:28 +00:00
parent 043d29fd7e
commit 430978fab7
2 changed files with 84 additions and 76 deletions
Download patch file Download diff file Expand all files Collapse all files

35
app/assets/javascripts/index.js
View file

@ -77,42 +77,11 @@ $(document).ready(function () {
var params = OSM.mapParams();
// TODO internationalisation of the context menu strings
var map = new L.OSM.Map("map", {
zoomControl: false,
layerControl: false,
contextmenu: true,
contextmenuWidth: 140,
contextmenuItems: [{
text: 'Directions from here',
callback: function(e){ context_directionsfrom(e, map); }
}, {
text: 'Directions to here',
callback: function(e){ context_directionsto(e, map); }
}, '-', {
text: 'Add a note here',
callback: function(e){ context_addnote(e, map); }
}, {
text: 'Show address',
callback: function(e){ context_describe(e, map); }
}, {
text: 'Query features',
callback: function(e){ context_queryhere(e, map); }
}, {
text: 'Centre map here',
callback: function(e){ context_centrehere(e, map); }
}]
});
$(document).on('mousedown', function(e){
if(e.shiftKey){
map.contextmenu.disable(); // on firefox, shift disables our contextmenu. we explicitly do this for all browsers.
}else{
map.contextmenu.enable();
// we also decide whether to disable some options that only like high zoom
map.contextmenu.setDisabled(3, map.getZoom() < 12);
map.contextmenu.setDisabled(5, map.getZoom() < 14);
}
contextmenuWidth: 140
});
map.attributionControl.setPrefix('');
@ -182,6 +151,8 @@ $(document).ready(function () {
L.control.scale()
.addTo(map);
OSM.initializeContextMenu(map);
if (OSM.STATUS !== 'api_offline' && OSM.STATUS !== 'database_offline') {
OSM.initializeNotes(map);
if (params.layers.indexOf(map.noteLayer.options.code) >= 0) {

125
app/assets/javascripts/index/contextmenu.js
View file

@ -1,46 +1,83 @@
var context_describe = function(e, map){
var precision = OSM.zoomPrecision(map.getZoom()),
latlng = e.latlng.wrap(),
lat = latlng.lat.toFixed(precision),
lng = latlng.lng.toFixed(precision);
OSM.router.route("/search?query=" + encodeURIComponent(lat + "," + lng));
};
var context_directionsfrom = function(e, map){
var precision = OSM.zoomPrecision(map.getZoom()),
latlng = e.latlng.wrap(),
lat = latlng.lat.toFixed(precision),
lng = latlng.lng.toFixed(precision);
OSM.router.route("/directions?" + querystring.stringify({
route: lat + ',' + lng + ';' + $('#route_to').val()
}));
};
var context_directionsto = function(e, map){
var precision = OSM.zoomPrecision(map.getZoom()),
latlng = e.latlng.wrap(),
lat = latlng.lat.toFixed(precision),
lng = latlng.lng.toFixed(precision);
OSM.router.route("/directions?" + querystring.stringify({
route: $('#route_from').val() + ';' + lat + ',' + lng
}));
};
var context_addnote = function(e, map){
// I'd like this, instead of panning, to pass a query parameter about where to place the marker
map.panTo(e.latlng.wrap(), {animate: false});
OSM.router.route('/note/new');
};
var context_centrehere = function(e, map){
map.panTo(e.latlng);
};
var context_queryhere = function(e, map) {
var precision = OSM.zoomPrecision(map.getZoom()),
latlng = e.latlng.wrap(),
lat = latlng.lat.toFixed(precision),
lng = latlng.lng.toFixed(precision);
OSM.router.route("/query?lat=" + lat + "&lon=" + lng);
OSM.initializeContextMenu = function (map) {
map.contextmenu.addItem({
text: "Directions from here",
callback: function directionsFromHere(e) {
var precision = OSM.zoomPrecision(map.getZoom()),
latlng = e.latlng.wrap(),
lat = latlng.lat.toFixed(precision),
lng = latlng.lng.toFixed(precision);
OSM.router.route("/directions?" + querystring.stringify({
route: lat + "," + lng + ";" + $("#route_to").val()
}));
}
});
map.contextmenu.addItem({
text: "Directions to here",
callback: function directionsToHere(e) {
var precision = OSM.zoomPrecision(map.getZoom()),
latlng = e.latlng.wrap(),
lat = latlng.lat.toFixed(precision),
lng = latlng.lng.toFixed(precision);
OSM.router.route("/directions?" + querystring.stringify({
route: $("#route_from").val() + ";" + lat + "," + lng
}));
}
});
map.contextmenu.addItem({
text: "Add a note here",
callback: function addNoteHere(e) {
// I'd like this, instead of panning, to pass a query parameter about where to place the marker
map.panTo(e.latlng.wrap(), {animate: false});
OSM.router.route("/note/new");
}
});
map.contextmenu.addItem({
text: "Show address",
callback: function describeLocation(e) {
var precision = OSM.zoomPrecision(map.getZoom()),
latlng = e.latlng.wrap(),
lat = latlng.lat.toFixed(precision),
lng = latlng.lng.toFixed(precision);
OSM.router.route("/search?query=" + encodeURIComponent(lat + "," + lng));
}
});
map.contextmenu.addItem({
text: "Query features",
callback: function queryFeatures(e) {
var precision = OSM.zoomPrecision(map.getZoom()),
latlng = e.latlng.wrap(),
lat = latlng.lat.toFixed(precision),
lng = latlng.lng.toFixed(precision);
OSM.router.route("/query?lat=" + lat + "&lon=" + lng);
}
});
map.contextmenu.addItem({
text: "Centre map here",
callback: function centreMap(e) {
map.panTo(e.latlng);
}
});
map.on("mousedown", function (e) {
if (e.shiftKey) map.contextmenu.disable();
}).on("mouseup", function () {
map.contextmenu.enable();
});
var updateMenu = function updateMenu () {
map.contextmenu.setDisabled(2, map.getZoom() < 12);
map.contextmenu.setDisabled(4, map.getZoom() < 14);
};
map.on("zoomend", updateMenu);
updateMenu();
};