X-Git-Url: https://git.openstreetmap.org./rails.git/blobdiff_plain/eebe1f1d3ed885e94725c07d24e0483f603f03da..d31fc7c2f5c0f43b9e65479e3f1690bdd0c2fb4a:/app/assets/javascripts/leaflet.share.js diff --git a/app/assets/javascripts/leaflet.share.js b/app/assets/javascripts/leaflet.share.js index 548be3fcc..b53524f25 100644 --- a/app/assets/javascripts/leaflet.share.js +++ b/app/assets/javascripts/leaflet.share.js @@ -1,11 +1,16 @@ L.OSM.share = function (options) { - var control = L.control(options); + var control = L.control(options), + marker = L.marker([0, 0], {draggable: true}), + locationFilter = new L.LocationFilter({ + enableButton: false, + adjustButton: false + }); control.onAdd = function (map) { var $container = $('
') + .attr('class', 'deemphasize') + .text(I18n.t('javascripts.share.paste_html')) + .appendTo($linkSection)); + + // Image + + var $imageSection = $('
') + .attr('class', 'deemphasize') + .html(I18n.t('javascripts.share.image_size') + ' x ') + .appendTo($form); + + $('') + .attr('type', 'submit') + .attr('value', I18n.t('javascripts.share.download')) + .appendTo($form); + + locationFilter + .on('change', update) + .addTo(map); + + marker.on('dragend', movedMarker); + map.on('move', movedMap); map.on('moveend layeradd layerremove', update); + options.sidebar.addPane($ui); + + $ui + .on('hide', hidden); + + function hidden() { + map.removeLayer(marker); + map.options.scrollWheelZoom = map.options.doubleClickZoom = true; + locationFilter.disable(); + update(); + } + function toggle(e) { e.stopPropagation(); e.preventDefault(); - var controlContainer = $('.leaflet-control-container .leaflet-top.leaflet-right'); + $('#mapnik_scale').val(getScale()); + marker.setLatLng(map.getCenter()); + + update(); + options.sidebar.togglePane($ui, button); + } + + function toggleMarker() { + if ($(this).is(':checked')) { + marker.setLatLng(map.getCenter()); + map.addLayer(marker); + map.options.scrollWheelZoom = map.options.doubleClickZoom = 'center'; + } else { + map.removeLayer(marker); + map.options.scrollWheelZoom = map.options.doubleClickZoom = true; + } + update(); + } - if ($ui.is(':visible')) { - $(control.options.uiPane).hide(); - controlContainer.css({paddingRight: '0'}); + function toggleFilter() { + if ($(this).is(':checked')) { + locationFilter.setBounds(map.getBounds().pad(-0.2)); + locationFilter.enable(); } else { - $(control.options.uiPane).show(); - controlContainer.css({paddingRight: '200px'}); + locationFilter.disable(); } + update(); + } + + function movedMap() { + marker.setLatLng(map.getCenter()); + update(); + } + + function movedMarker() { + if (map.hasLayer(marker)) { + map.off('move', movedMap); + map.on('moveend', updateOnce); + map.panTo(marker.getLatLng()); + } + } + + function updateOnce() { + map.off('moveend', updateOnce); + map.on('move', movedMap); + update(); } function update() { - var center = map.getCenter().wrap(); - var layers = getMapLayers(map); - $input.val(options.getUrl(map)); + var bounds = map.getBounds(); + + $('#link_marker') + .prop('checked', map.hasLayer(marker)); + + $('#image_filter') + .prop('checked', locationFilter.isEnabled()); + + // Link / Embed + + $('#short_input').val(map.getShortUrl(marker)); + $('#long_input').val(map.getUrl(marker)); + $('#short_link').attr('href', map.getShortUrl(marker)); + $('#long_link').attr('href', map.getUrl(marker)); + + var params = { + bbox: bounds.toBBoxString(), + layer: map.getMapBaseLayerId() + }; + + if (map.hasLayer(marker)) { + var latLng = marker.getLatLng().wrap(); + params.marker = latLng.lat + ',' + latLng.lng; + } + + $('#embed_html').val( + '' + + '