Add layer-type switching to use dark tiles

[rails.git] / app / assets / javascripts / embed.js.erb

diff --git a/app/assets/javascripts/embed.js.erb b/app/assets/javascripts/embed.js.erb
index 44bb1fef5dbd7dabfc465a2f46ca34ff3a34ac81..34a8b68bcf8740e880fcb6e7574ce8adc169e75b 100644 (file)
--- a/app/assets/javascripts/embed.js.erb
+++ b/app/assets/javascripts/embed.js.erb
@@ -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]
   };