From 703990a5bbdcdb782ef85983b960253aecc3e163 Mon Sep 17 00:00:00 2001 From: Anton Khorev Date: Thu, 21 Nov 2024 20:58:47 +0300 Subject: [PATCH] Move map layer ids/codes/keys to layer definition data --- app/assets/javascripts/leaflet.map.js | 189 ++++++++++++++------------ 1 file changed, 102 insertions(+), 87 deletions(-) diff --git a/app/assets/javascripts/leaflet.map.js b/app/assets/javascripts/leaflet.map.js index fe4b139d14..d053a81ce4 100644 --- a/app/assets/javascripts/leaflet.map.js +++ b/app/assets/javascripts/leaflet.map.js @@ -15,109 +15,125 @@ L.OSM.Map = L.Map.extend({ initialize: function (id, options) { L.Map.prototype.initialize.call(this, id, options); - const layerCredits = { - mapnik: { - id: "make_a_donation", - href: "https://supporting.openstreetmap.org", - donate: true + const layerDefinitions = [ + { + leafletOsmId: "Mapnik", + code: "M", + keyId: "mapnik", + nameId: "standard", + credit: { + id: "make_a_donation", + href: "https://supporting.openstreetmap.org", + donate: true + } + }, + { + leafletOsmId: "CyclOSM", + code: "Y", + keyId: "cyclosm", + nameId: "cyclosm", + credit: { + id: "cyclosm_credit", + children: { + cyclosm_link: { + id: "cyclosm_name", + href: "https://www.cyclosm.org" + }, + osm_france_link: { + id: "osm_france", + href: "https://openstreetmap.fr/" + } + } + } }, - cyclosm: { - id: "cyclosm_credit", - children: { - cyclosm_link: { - id: "cyclosm_name", - href: "https://www.cyclosm.org" - }, - osm_france_link: { - id: "osm_france", - href: "https://openstreetmap.fr/" + { + leafletOsmId: "CycleMap", + code: "C", + keyId: "cyclemap", + nameId: "cycle_map", + apiKeyId: "THUNDERFOREST_KEY", + credit: { + id: "thunderforest_credit", + children: { + thunderforest_link: { + id: "andy_allan", + href: "https://www.thunderforest.com/" + } } } }, - thunderforest: { - id: "thunderforest_credit", - children: { - thunderforest_link: { - id: "andy_allan", - href: "https://www.thunderforest.com/" + { + leafletOsmId: "TransportMap", + code: "T", + keyId: "transportmap", + nameId: "transport_map", + apiKeyId: "THUNDERFOREST_KEY", + credit: { + id: "thunderforest_credit", + children: { + thunderforest_link: { + id: "andy_allan", + href: "https://www.thunderforest.com/" + } } } }, - tracestrack: { - id: "tracestrack_credit", - children: { - tracestrack_link: { - id: "tracestrack", - href: "https://www.tracestrack.com/" + { + leafletOsmId: "TracestrackTopo", + code: "P", + keyId: "tracestracktopo", + nameId: "tracestracktop_topo", + apiKeyId: "TRACESTRACK_KEY", + credit: { + id: "tracestrack_credit", + children: { + tracestrack_link: { + id: "tracestrack", + href: "https://www.tracestrack.com/" + } } } }, - hotosm: { - id: "hotosm_credit", - children: { - hotosm_link: { - id: "hotosm_name", - href: "https://www.hotosm.org/" - }, - osm_france_link: { - id: "osm_france", - href: "https://openstreetmap.fr/" + { + leafletOsmId: "HOT", + code: "H", + keyId: "hot", + nameId: "hot", + credit: { + id: "hotosm_credit", + children: { + hotosm_link: { + id: "hotosm_name", + href: "https://www.hotosm.org/" + }, + osm_france_link: { + id: "osm_france", + href: "https://openstreetmap.fr/" + } } } } - }; + ]; this.baseLayers = []; - this.baseLayers.push(new L.OSM.Mapnik({ - attribution: makeAttribution("mapnik"), - code: "M", - keyid: "mapnik", - name: I18n.t("javascripts.map.base.standard") - })); - - this.baseLayers.push(new L.OSM.CyclOSM({ - attribution: makeAttribution("cyclosm"), - code: "Y", - keyid: "cyclosm", - name: I18n.t("javascripts.map.base.cyclosm") - })); - - if (OSM.THUNDERFOREST_KEY) { - this.baseLayers.push(new L.OSM.CycleMap({ - attribution: makeAttribution("thunderforest"), - apikey: OSM.THUNDERFOREST_KEY, - code: "C", - keyid: "cyclemap", - name: I18n.t("javascripts.map.base.cycle_map") - })); + for (const layerDefinition of layerDefinitions) { + if (layerDefinition.apiKeyId && !OSM[layerDefinition.apiKeyId]) continue; - this.baseLayers.push(new L.OSM.TransportMap({ - attribution: makeAttribution("thunderforest"), - apikey: OSM.THUNDERFOREST_KEY, - code: "T", - keyid: "transportmap", - name: I18n.t("javascripts.map.base.transport_map") - })); - } + const layerOptions = { + attribution: makeAttribution(layerDefinition.credit), + code: layerDefinition.code, + keyid: layerDefinition.keyId, + name: I18n.t(`javascripts.map.base.${layerDefinition.nameId}`) + }; + if (layerDefinition.apiKeyId) { + layerOptions.apikey = OSM[layerDefinition.apiKeyId]; + } - if (OSM.TRACESTRACK_KEY) { - this.baseLayers.push(new L.OSM.TracestrackTopo({ - attribution: makeAttribution("tracestrack"), - apikey: OSM.TRACESTRACK_KEY, - code: "P", - keyid: "tracestracktopo", - name: I18n.t("javascripts.map.base.tracestracktop_topo") - })); + const layer = new L.OSM[layerDefinition.leafletOsmId](layerOptions); + this.baseLayers.push(layer); } - this.baseLayers.push(new L.OSM.HOT({ - attribution: makeAttribution("hotosm"), - code: "H", - keyid: "hot", - name: I18n.t("javascripts.map.base.hot") - })); - this.noteLayer = new L.FeatureGroup(); this.noteLayer.options = { code: "N" }; @@ -135,8 +151,7 @@ L.OSM.Map = L.Map.extend({ } }); - function makeAttribution(id) { - const layerCredit = layerCredits[id]; + function makeAttribution(credit) { let attribution = ""; attribution += I18n.t("javascripts.map.copyright_text", { @@ -146,8 +161,8 @@ L.OSM.Map = L.Map.extend({ }).prop("outerHTML") }); - attribution += layerCredit.donate ? " ♥ " : ". "; - attribution += makeCredit(layerCredit); + attribution += credit.donate ? " ♥ " : ". "; + attribution += makeCredit(credit); attribution += ". "; attribution += $("", {