Implemented export of config as JSON

settings/settings-UI.html

@@ -351,7 +351,8 @@ python3 /home/pi/Inky-Calendar/modules/inkycal.py.</p>
 
     </form>
     <br>
-    <button class="ts primary button" onClick="generate();">Generate</button>
+    <button class="ts primary button" onClick="generate(false);">Generate</button>
+    <button class="ts secondary button" onClick="generate(true);">Generate (as JSON, experimental)</button>
   <br><br>
   <kbd>Developed by Toby Chui for Inky-Calendar Project, modified by aceisace. Licensed under MIT</kbd>
   <details class="ts accordion">
@@ -398,7 +399,7 @@ inkycal_image_path_body = "{image_path_body}"`;
     }
   });
 
-  function generate(){
+  function generate(json){
     var ical_urls = $("#ical_urls").val().trim();
     if (ical_urls == ""){
       ical_urls = $("#ical_urls").attr("placeholder");
@@ -558,6 +559,9 @@ inkycal_image_path_body = "{image_path_body}"`;
     var image_path_body = $("#image_path").val().trim();
 
     //console.log(ical_urls, rss_urls, update_interval, api_key, location, week_starts_on, calibration_hours, model, language, units, hours, top_section, middle_section, bottom_section);
+    if(json)
+      downloadSettingsAsJson(ical_urls, rss_urls, update_interval, api_key, location, week_starts_on, calibration_hours, model, language, units, hours, top_section, middle_section, bottom_section, image_path, image_path_body)
+    else
       createPythonSetting(ical_urls, rss_urls, update_interval, api_key, location, week_starts_on, calibration_hours, model, language, units, hours, top_section, middle_section, bottom_section, image_path, image_path_body);
   }
   
@@ -597,6 +601,112 @@ inkycal_image_path_body = "{image_path_body}"`;
     document.body.removeChild(a);
   }
 
+  function TrimSingleQuotes(text){
+      return text.replace(/^'+/g,"").replace(/'+$/g,"")
+  }
+
+  function downloadSettingsAsJson(
+    ical_urls,
+    rss_urls,
+    update_interval,
+    api_key,
+    location,
+    week_starts_on,
+    calibration_hours,
+    model,
+    language,
+    units,
+    hours,
+    top_section,
+    middle_section,
+    bottom_section,
+    image_path,
+    image_path_body
+  ) {
+    var result = {
+      "language"          : language,               // "en", "de", "fr", "jp" etc.
+      "units"             : units,               // "metric", "imperial"
+      "hours"             : Number(hours),       // 24, 12
+      "model"             : model,
+      "update_interval"   : Number(update_interval),       // 10, 15, 20, 30, 60
+      "calibration_hours" : calibration_hours.split(",").map(function(x){ return Number(x);}),              // Do not change unless you know what you are doing
+      "panels" : []
+    };
+
+    switch(top_section){
+      case "inkycal_weather":
+        result.panels.push(
+          {
+            "location"  : "top",
+            "type"      : "inkycal_weather",
+            "config"    : {
+                "api_key"  : api_key,     //Your openweathermap API-KEY -> "api-key"
+                "location" : location      //"City name, Country code"
+            }
+          }
+        )
+        break;
+      default:
+        break;
+    }
+
+    switch(middle_section){
+      case "inkycal_agenda":
+      case "inkycal_calendar":
+        result.panels.push(
+          {
+            "location"  : "middle",
+            "type"      : middle_section,
+            "config"    : {
+                "week_starts_on" : week_starts_on,    //"Sunday", "Monday"...
+                "ical_urls"  : ical_urls.split().map(function(x){ return TrimSingleQuotes(x);})
+            }
+          }
+        )
+        break;
+      case "inkycal_image":
+        result.panels.push(
+          {
+            "location"  : "middle",
+            "type"      : middle_section,
+            "config"    : {
+                "image_path"  : TrimSingleQuotes(image_path),
+                "image_path_body" : image_path_body
+            }
+          }
+        )
+        break;
+      default:
+        break;
+    }
+
+    switch(bottom_section){
+      case "inkycal_rss":
+        result.panels.push(
+          {
+            "location"  : "bottom",
+            "type"      : bottom_section,
+            "config"    : {
+                "rss_urls"  : rss_urls.split().map(function(x){ return TrimSingleQuotes(x);})
+            }
+          }
+        )
+        break;
+      default:
+        break;
+    }
+    var config = new Blob([JSON.stringify(result, null, "\t")], {type : "text/json"});
+    var link = document.createElement('link');
+    link.href = window.URL.createObjectURL(config);
+    var a = document.createElement('A');
+    a.href = link.href;
+    a.download = link.href.substr(link.href.lastIndexOf('/') + 1);
+    document.body.appendChild(a);
+    $(a).attr('download','settings.jsonc');
+    a.click();
+    document.body.removeChild(a);
+  }
+  
   </script>
 </body>
 </html>

settings/settings.jsonc

@@ -0,0 +1,91 @@
+{
+    "language"          : "en",                   // "en", "de", "fr", "jp" etc.
+    "units"             : "metric",               // "metric", "imperial"
+    "hours"             : 24,                     // 24, 12
+    "model"             : "epd_7_in_5_v2_colour", // For supported E-paper models, see below
+    "update_interval"   : 60,                     // 10, 15, 20, 30, 60
+    "calibration_hours" : [0,12,18],              // Do not change unlesss you know what you are doing
+
+    //For now three panels can be defined for three unique locations: 'top', 'middle' and 'bottom'
+    "panels" : [
+        {
+            "location"  : "top",
+            "type"      : "inkycal_weather",
+            "config"    : {
+                "api_key"  : "",                  //Your openweathermap API-KEY -> "api-key"
+                "location" : "Stuttgart, DE"      //"City name, Country code"
+            }
+        },
+        {
+            "location"  : "middle",
+            "type"      : "inkycal_calendar",     // "inkycal_calendar" and "inkycal_agenda" have the same parameters, but are displayed differently
+            "config"    : {
+                "week_starts_on" : "Monday",      //"Sunday", "Monday"...
+                "ical_urls" : [
+                    "https://calendar.google.com/calendar/ical/en.usa%23holiday%40group.v.calendar.google.com/public/basic.ics",
+                    "https://www.calendarlabs.com/ical-calendar/ics/101/Netherlands_Holidays.ics"
+                ]
+            }
+        },
+        {
+            "location" : "bottom",
+            "type"     : "inkycal_rss",
+            "config"   : {
+                "rss_feeds" : [
+                    "http://feeds.bbci.co.uk/news/world/rss.xml#",
+                    "https://github.com/aceisace/Inky-Calendar/releases.atom"
+                ]
+            }
+        },
+        {
+            "location" : "middle",
+            "type"     : "inkycal_image",
+            "config"   : {
+                /*
+                The url or file path to obtain the image from.
+                The following parameters within accolades ({}) will be substituted:
+                - model
+                - width
+                - height
+
+                Samples
+                The inkycal logo:
+                inkycal_image_path = 'https://github.com/aceisace/Inky-Calendar/raw/master/Gallery/Inky-Calendar-logo.png'
+                
+                A dynamic image with a demo-calendar
+                inkycal_image_path = 'https://inkycal.robertsirre.nl/panel/test/{model}/image?width={width}&height={height}'
+                
+                Dynamic image with configurable calendars (see https://inkycal.robertsirre.nl/ and parameter inkycal_image_path_body)
+                inkycal_image_path = 'https://inkycal.robertsirre.nl/panel/calendar/{model}?width={width}&height={height}'
+
+                inkycal_image_path  ='/home/pi/Inky-Calendar/images/canvas.png'
+                */
+                "image_path" : "https://github.com/aceisace/Inky-Calendar/raw/master/Gallery/Inky-Calendar-logo.png",
+
+                /*
+                Optional: inkycal_image_path_body
+                Allows obtaining complexer configure images.
+                When `inkycal_image_path` starts with `http` and `inkycal_image_path_body` is specified, the image is obtained using POST instead of GET.
+                NOTE: structure of the body depends on the web-based image service
+                */
+
+                // inkycal_image_path_body = [
+                //   'https://calendar.google.com/calendar/ical/en.usa%23holiday%40group.v.calendar.google.com/public/basic.ics',
+                //   'https://www.calendarlabs.com/ical-calendar/ics/101/Netherlands_Holidays.ics'
+                // ]
+            }
+        }
+    ]
+}
+
+/*
+Supported E-Paper models"""
+epd_7_in_5_v2_colour # 7.5" high-res black-white-red/yellow
+epd_7_in_5_v2        # 7.5" high-res black-white
+epd_7_in_5_colour    # 7.5" black-white-red/yellow
+epd_7_in_5           # 7.5" black-white
+epd_5_in_83_colour   # 5.83" black-white-red/yellow
+epd_5_in_83          # 5.83" black-white
+epd_4_in_2_colour    # 4.2" black-white-red/yellow
+epd_4_in_2           # 4.2" black-white
+*/