X-Git-Url: https://git.openstreetmap.org./rails.git/blobdiff_plain/31d27da6bc667825df754438985a56f4b593df80..7e7ede890e8e948236d3dbc48e24aca00cd01f62:/app/assets/javascripts/leaflet.map.js?ds=sidebyside diff --git a/app/assets/javascripts/leaflet.map.js b/app/assets/javascripts/leaflet.map.js index b2d4abcb7..02ed318ac 100644 --- a/app/assets/javascripts/leaflet.map.js +++ b/app/assets/javascripts/leaflet.map.js @@ -15,61 +15,31 @@ L.OSM.Map = L.Map.extend({ initialize: function (id, options) { L.Map.prototype.initialize.call(this, id, options); - var copyright = I18n.t("javascripts.map.copyright", { copyright_url: "/copyright" }); - var donate = I18n.t("javascripts.map.donate_link_text", { donate_url: "https://donate.openstreetmap.org" }); - var terms = I18n.t("javascripts.map.terms", { terms_url: "https://wiki.osmfoundation.org/wiki/Terms_of_Use" }); - var cyclosm = I18n.t("javascripts.map.cyclosm", { cyclosm_url: "https://www.cyclosm.org", osmfrance_url: "https://openstreetmap.fr/" }); - var thunderforest = I18n.t("javascripts.map.thunderforest", { thunderforest_url: "https://www.thunderforest.com/" }); - var memomaps = I18n.t("javascripts.map.opnvkarte", { memomaps_url: "https://memomaps.de/" }); - var hotosm = I18n.t("javascripts.map.hotosm", { hotosm_url: "https://www.hotosm.org/", osmfrance_url: "https://openstreetmap.fr/" }); - this.baseLayers = []; - this.baseLayers.push(new L.OSM.Mapnik({ - attribution: copyright + " ♥ " + donate + ". " + terms, - code: "M", - keyid: "mapnik", - name: I18n.t("javascripts.map.base.standard") - })); - - this.baseLayers.push(new L.OSM.CyclOSM({ - attribution: copyright + ". " + cyclosm + ". " + terms, - code: "Y", - keyid: "cyclosm", - name: I18n.t("javascripts.map.base.cyclosm") - })); - - if (OSM.THUNDERFOREST_KEY) { - this.baseLayers.push(new L.OSM.CycleMap({ - attribution: copyright + ". " + thunderforest + ". " + terms, - apikey: OSM.THUNDERFOREST_KEY, - code: "C", - keyid: "cyclemap", - name: I18n.t("javascripts.map.base.cycle_map") - })); - - this.baseLayers.push(new L.OSM.TransportMap({ - attribution: copyright + ". " + thunderforest + ". " + terms, - apikey: OSM.THUNDERFOREST_KEY, - code: "T", - keyid: "transportmap", - name: I18n.t("javascripts.map.base.transport_map") - })); - } - - this.baseLayers.push(new L.OSM.OPNVKarte({ - attribution: copyright + ". " + memomaps + ". " + terms, - code: "O", - keyid: "opnvkarte", - name: I18n.t("javascripts.map.base.opnvkarte") - })); + for (const layerDefinition of OSM.LAYER_DEFINITIONS) { + if (layerDefinition.apiKeyId && !OSM[layerDefinition.apiKeyId]) continue; + + let layerConstructor = L.OSM.TileLayer; + const layerOptions = {}; + + for (const [property, value] of Object.entries(layerDefinition)) { + if (property === "credit") { + layerOptions.attribution = makeAttribution(value); + } else if (property === "nameId") { + layerOptions.name = I18n.t(`javascripts.map.base.${value}`); + } else if (property === "apiKeyId") { + layerOptions.apikey = OSM[value]; + } else if (property === "leafletOsmId") { + layerConstructor = L.OSM[value]; + } else { + layerOptions[property] = value; + } + } - this.baseLayers.push(new L.OSM.HOT({ - attribution: copyright + ". " + hotosm + ". " + terms, - code: "H", - keyid: "hot", - name: I18n.t("javascripts.map.base.hot") - })); + const layer = new layerConstructor(layerOptions); + this.baseLayers.push(layer); + } this.noteLayer = new L.FeatureGroup(); this.noteLayer.options = { code: "N" }; @@ -79,8 +49,7 @@ L.OSM.Map = L.Map.extend({ this.gpsLayer = new L.OSM.GPS({ pane: "overlayPane", - code: "G", - name: I18n.t("javascripts.map.base.gps") + code: "G" }); this.on("layeradd", function (event) { @@ -88,6 +57,50 @@ L.OSM.Map = L.Map.extend({ this.setMaxZoom(event.layer.options.maxZoom); } }); + + function makeAttribution(credit) { + let attribution = ""; + + attribution += I18n.t("javascripts.map.copyright_text", { + copyright_link: $("", { + href: "/copyright", + text: I18n.t("javascripts.map.openstreetmap_contributors") + }).prop("outerHTML") + }); + + attribution += credit.donate ? " ♥ " : ". "; + attribution += makeCredit(credit); + attribution += ". "; + + attribution += $("", { + href: "https://wiki.osmfoundation.org/wiki/Terms_of_Use", + text: I18n.t("javascripts.map.website_and_api_terms") + }).prop("outerHTML"); + + return attribution; + } + + function makeCredit(credit) { + const children = {}; + for (const childId in credit.children) { + children[childId] = makeCredit(credit.children[childId]); + } + const text = I18n.t(`javascripts.map.${credit.id}`, children); + if (credit.href) { + const link = $("", { + href: credit.href, + text: text + }); + if (credit.donate) { + link.addClass("donate-attr"); + } else { + link.attr("target", "_blank"); + } + return link.prop("outerHTML"); + } else { + return text; + } + } }, updateLayers: function (layerParam) { @@ -119,7 +132,7 @@ L.OSM.Map = L.Map.extend({ getMapBaseLayerId: function () { var baseLayerId; this.eachLayer(function (layer) { - if (layer.options && layer.options.keyid) baseLayerId = layer.options.keyid; + if (layer.options && layer.options.layerId) baseLayerId = layer.options.layerId; }); return baseLayerId; }, @@ -261,11 +274,13 @@ L.OSM.Map = L.Map.extend({ L.circleMarker(object.latLng, haloStyle).addTo(this._objectLayer); - L.marker(object.latLng, { - icon: object.icon, - opacity: 1, - interactive: true - }).addTo(this._objectLayer); + if (object.icon) { + L.marker(object.latLng, { + icon: object.icon, + opacity: 1, + interactive: true + }).addTo(this._objectLayer); + } if (callback) callback(this._objectLayer.getBounds()); } else { // element or changeset handled by L.OSM.DataLayer