]> git.openstreetmap.org Git - rails.git/commitdiff
Add layer-type switching to use dark tiles
authorMarwin Hochfelsner <50826859+hlfan@users.noreply.github.com>
Sun, 19 Jan 2025 18:30:36 +0000 (19:30 +0100)
committerMarwin Hochfelsner <e12123674@student.tuwien.ac.at>
Sun, 2 Feb 2025 01:51:50 +0000 (02:51 +0100)
app/assets/javascripts/embed.js.erb

index 44bb1fef5dbd7dabfc465a2f46ca34ff3a34ac81..34a8b68bcf8740e880fcb6e7574ce8adc169e75b 100644 (file)
@@ -36,12 +36,14 @@ window.onload = function () {
   map.attributionControl.setPrefix("");
   map.removeControl(map.attributionControl);
 
   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"],
   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
           apiKeyId: entry["apiKeyId"]
         }.compact
       end.to_json
@@ -49,7 +51,7 @@ window.onload = function () {
   const layerId = (args.layer || "").replaceAll(" ", "");
   const layerConfig = layers[layerId] || layers.mapnik;
   const { layer, ...options } = {
   const layerId = (args.layer || "").replaceAll(" ", "");
   const layerConfig = layers[layerId] || layers.mapnik;
   const { layer, ...options } = {
-    layer: layerConfig.layer,
+    layer: layerConfig.darkLayer && isDarkTheme ? layerConfig.darkLayer : layerConfig.layer,
     apikey: apiKeys[layerConfig.apiKeyId],
     ...tileOptions[layerId]
   };
     apikey: apiKeys[layerConfig.apiKeyId],
     ...tileOptions[layerId]
   };