From 6ecfab90271916c806c91aff51b9e395529fcf4a Mon Sep 17 00:00:00 2001 From: Marwin Hochfelsner <50826859+hlfan@users.noreply.github.com> Date: Sun, 16 Mar 2025 01:20:41 +0100 Subject: [PATCH] Put api keys directly in js layer definitions Co-authored-by: Anton Khorev --- app/assets/javascripts/embed.js.erb | 28 ++++----------------------- app/assets/javascripts/leaflet.map.js | 4 ---- app/assets/javascripts/osm.js.erb | 4 +--- config/layers.yml | 6 +++--- lib/map_layers.rb | 19 ++++++++++++++++++ 5 files changed, 27 insertions(+), 34 deletions(-) create mode 100644 lib/map_layers.rb diff --git a/app/assets/javascripts/embed.js.erb b/app/assets/javascripts/embed.js.erb index 7596e89a4..a3d26ff7d 100644 --- a/app/assets/javascripts/embed.js.erb +++ b/app/assets/javascripts/embed.js.erb @@ -18,7 +18,7 @@ I18n.fallbacks = true; window.onload = function () { const args = Object.fromEntries(new URLSearchParams(location.search)); - const tileOptions = { + const options = { mapnik: { <% if Settings.key?(:tile_cdn_url) %> url: <%= Settings.tile_cdn_url.to_json %> @@ -26,36 +26,16 @@ window.onload = function () { } }; - const apiKeys = { -<% if Settings.key?(:thunderforest_key) %> - THUNDERFOREST_KEY: <%= Settings.thunderforest_key.to_json %> -<% end %> - }; - const map = L.map("map"); map.attributionControl.setPrefix(""); map.removeControl(map.attributionControl); const isDarkTheme = args.theme === "dark" || (args.theme !== "light" && window.matchMedia("(prefers-color-scheme: dark)").matches); - const layers = <%= - YAML.load_file(Rails.root.join("config/layers.yml")) - .select { |entry| entry["canEmbed"] } - .each_with_object({}) do |entry, obj| - obj[entry["layerId"]] = { - layer: entry["leafletOsmId"], - darkLayer: entry["leafletOsmDarkId"], - apiKeyId: entry["apiKeyId"] - }.compact - end.to_json - %>; + const layers = <%= MapLayers::embed_definitions("config/layers.yml").to_json %>; const layerId = (args.layer || "").replaceAll(" ", ""); const layerConfig = layers[layerId] || layers.mapnik; - const { layer, ...options } = { - layer: layerConfig.darkLayer && isDarkTheme ? layerConfig.darkLayer : layerConfig.layer, - apikey: apiKeys[layerConfig.apiKeyId], - ...tileOptions[layerId] - }; - new L.OSM[layer](options).addTo(map); + const layer = (isDarkTheme && layerConfig.leafletOsmDarkId) || layerConfig.leafletOsmId; + new L.OSM[layer]({ apikey: layerConfig.apikey, ...options[layerId] }).addTo(map); if (args.marker) { L.marker(args.marker.split(","), { icon: L.icon({ diff --git a/app/assets/javascripts/leaflet.map.js b/app/assets/javascripts/leaflet.map.js index c81f92e72..c63c4a281 100644 --- a/app/assets/javascripts/leaflet.map.js +++ b/app/assets/javascripts/leaflet.map.js @@ -16,8 +16,6 @@ L.OSM.Map = L.Map.extend({ this.baseLayers = []; for (const layerDefinition of OSM.LAYER_DEFINITIONS) { - if (layerDefinition.apiKeyId && !OSM[layerDefinition.apiKeyId]) continue; - let layerConstructor = L.OSM.TileLayer; const layerOptions = {}; @@ -26,8 +24,6 @@ L.OSM.Map = L.Map.extend({ 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 if (property === "leafletOsmDarkId" && OSM.isDarkMap() && L.OSM[value]) { diff --git a/app/assets/javascripts/osm.js.erb b/app/assets/javascripts/osm.js.erb index a40ae6eb8..0315da99c 100644 --- a/app/assets/javascripts/osm.js.erb +++ b/app/assets/javascripts/osm.js.erb @@ -19,8 +19,6 @@ OSM = { graphhopper_url fossgis_osrm_url fossgis_valhalla_url - thunderforest_key - tracestrack_key ] .each_with_object({}) do |key, hash| hash[key.to_s.upcase] = Settings.send(key) if Settings.respond_to?(key) @@ -29,7 +27,7 @@ OSM = { DEFAULT_LOCALE: <%= I18n.default_locale.to_json %>, - LAYER_DEFINITIONS: <%= YAML.load_file(Rails.root.join("config/layers.yml")).to_json %>, + LAYER_DEFINITIONS: <%= MapLayers::full_definitions("config/layers.yml").to_json %>, LAYERS_WITH_MAP_KEY: <%= YAML.load_file(Rails.root.join("config/key.yml")).keys.to_json %>, MARKER_GREEN: <%= image_path("marker-green.png").to_json %>, diff --git a/config/layers.yml b/config/layers.yml index 30cf29d29..c6c687aa7 100644 --- a/config/layers.yml +++ b/config/layers.yml @@ -28,7 +28,7 @@ code: "C" layerId: "cyclemap" nameId: "cycle_map" - apiKeyId: "THUNDERFOREST_KEY" + apiKeyId: "thunderforest_key" canEmbed: true canDownloadImage: true credit: @@ -43,7 +43,7 @@ code: "T" layerId: "transportmap" nameId: "transport_map" - apiKeyId: "THUNDERFOREST_KEY" + apiKeyId: "thunderforest_key" canEmbed: true canDownloadImage: true credit: @@ -57,7 +57,7 @@ code: "P" layerId: "tracestracktopo" nameId: "tracestracktop_topo" - apiKeyId: "TRACESTRACK_KEY" + apiKeyId: "tracestrack_key" credit: id: "tracestrack_credit" children: diff --git a/lib/map_layers.rb b/lib/map_layers.rb new file mode 100644 index 000000000..8a1bdea79 --- /dev/null +++ b/lib/map_layers.rb @@ -0,0 +1,19 @@ +module MapLayers + def self.full_definitions(layers_filename) + YAML.load_file(Rails.root.join(layers_filename)) + .reject { |layer| layer["apiKeyId"] && !Settings[layer["apiKeyId"]] } + .map do |layer| + if layer["apiKeyId"] + layer["apikey"] = Settings[layer["apiKeyId"]] + layer.delete "apiKeyId" + end + layer + end + end + + def self.embed_definitions(layers_filename) + full_definitions(layers_filename) + .select { |entry| entry["canEmbed"] } + .to_h { |entry| [entry["layerId"], entry.slice("leafletOsmId", "leafletOsmDarkId", "apikey").compact] } + end +end -- 2.39.5