Inkycal/settings-UI.html

790 lines
30 KiB
HTML
Raw Normal View History

<!DOCTYPE html>
<html lang="en">
<head>
<title>Settings-File Generator</title>
<script
src="https://code.jquery.com/jquery-3.3.1.min.js"
integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/tocas-ui/2.3.3/tocas.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/tocas-ui/2.3.3/tocas.js"></script>
<style>
body{
background-color:#eaeaea;
}
</style>
</head>
<body>
<br><br>
<div class="ts container">
<div class="ts segment">
<div class="ts header">
Setting Generator
<div class="sub header"><a href="https://github.com/aceisace/Inky-Calendar">For Inky-Calendar Project of Ace-Innovation Laboratory (by aceisace)</a><br>
2019-12-18 22:26:30 +01:00
<img src="https://github.com/aceisace/Inky-Calendar/blob/master/Gallery/Inky-Calendar-logo.png?raw=true" width="800" alt="Inky-Calendar-logo">
<div>
</div>
<ins>If no value is filled in for any of the row, the default value will be used.</ins>
</div>
</div>
</div>
<form class="ts form">
<div class="field">
<label>iCalendar URLs in the following format: 'URL 1', 'URL 2', 'URL 3'</label>
<input id="ical_urls" type="text" placeholder="'https://calendar.google.com/calendar/ical/en.usa%23holiday%40group.v.calendar.google.com/public/basic.ics'">
</div>
2020-02-15 22:54:59 +01:00
<div class="field">
<label>RSS-Feed URL/s in the following format: 'URL 1', 'URL 2', 'URL 3'</label>
<input id="rss_urls" type="text" placeholder="'http://feeds.bbci.co.uk/news/world/rss.xml#'">
</div>
<div class="field">
<label>How often should the display be refreshed?</label>
<div class="ts checkboxes">
2020-01-18 16:02:49 +01:00
<div class="ts radio checkbox">
<input id="update_10_mins" type="radio" name="aa">
<label for="update_10_mins">every 10 minutes. Not recommended for 3-colour E-Papers.</label>
</div>
<div class="ts radio checkbox">
<input id="update_15_mins" type="radio" name="aa">
<label for="update_15_mins">every 15 minutes</label>
</div>
<div class="ts radio checkbox">
<input id="update_20_mins" type="radio" name="aa">
<label for="update_20_mins">every 20 minutes</label>
</div>
<div class="ts radio checkbox">
<input id="update_30_mins" type="radio" name="aa">
<label for="update_30_mins">every 30 minutes</label>
</div>
<div class="ts radio checkbox">
<input id="update_60_mins" type="radio" name="aa" checked>
<label for="update_60_mins">every 60 minutes</label>
</div>
</div>
</div>
<div class="field">
<label>Openweathermap API Key</label>
<details class="ts accordion">
<summary>
<i class="dropdown icon"></i> Info
</summary>
<div class="content">
<p> Please insert your own Openweathermap API-key to fetch the latest weather info. To find out how to create your own key, please click here: <a href="https://github.com/aceisace/Inky-Calendar/wiki/Openweathermap-API">Creating an openweathermap api-key</a>. If you don't add an api-key, the top section will not show any weather info</p></div>
</details>
<input id="api_key" type="text" placeholder="">
</div>
<div class="field">
<label>Location (for weather data)</label>
<details class="ts accordion">
<summary>
<i class="dropdown icon"></i> Info
</summary>
<div class="content">
<p>Location refers to the closest weather station from your place. It isn't necessarily the place you live in. To find this location, type your city name in the search box on <a href="https://openweathermap.org/">openweathermap</a>. The output should be in the following format: City Name, Country ISO-Code. Not sure what your ISO code is? Check here: <a href="https://countrycode.org/">(find iso-code)</a></p></div>
</details>
<input id="location" type="text" placeholder="Stuttgart, DE">
</div>
<div class="field">
<label>On which day does the week start on in your country?</label>
<div class="ts checkboxes">
<div class="ts radio checkbox">
<input id="week_monday" type="radio" name="hr" checked>
<label for="week_monday">Monday</label>
</div>
<div class="ts radio checkbox">
<input id="week_sunday" type="radio" name="hr">
<label for="week_sunday">Sunday</label>
</div>
</div>
</div>
<div class="field">
<label>At which hours (in 24 hour-format) should the display be calibrated? Leave blank if you're not sure.</label>
<details class="ts accordion">
<summary>
<i class="dropdown icon"></i> Info
</summary>
<div class="content">
<p>Calibration refers to the process of flushing the display with a single colour to prevent 'ghosting' (an effect specific to E-Paper displays where the remnants of the previous image can be seen on the current one). It takes several minutes to finish the calibration(around 10 mins for the 2-colour displays and around 20 mins for the 3-colour displays) so please choose hours where you are less likely to need the display. It is recommended to calibrate at least thrice a day.</p></div>
</details>
<input id="calibration_hours" type="text" placeholder="0,12,18">
</div>
<div class="field">
2020-01-18 16:02:49 +01:00
<label>Which E-Paper model are you using?</label>
<div class="ts checkboxes">
<div class="ts radio checkbox">
2020-01-18 16:02:49 +01:00
<input id="epd_7_in_5_v2_colour" type="radio" name="dp" checked>
<label for="epd_7_in_5_v2_colour">7.5" v2 (800x400px) colour</label>
</div>
<div class="ts radio checkbox">
<input id="epd_7_in_5_v2" type="radio" name="dp">
<label for="epd_7_in_5_v2">7.5" v2 (800x400px) black-white</label>
</div>
<div class="ts radio checkbox">
<input id="epd_7_in_5_colour" type="radio" name="dp">
<label for="epd_7_in_5_colour">7.5" v1 (600x384px) colour</label>
</div>
<div class="ts radio checkbox">
<input id="epd_7_in_5" type="radio" name="dp">
<label for="epd_7_in_5">7.5" v1 (600x384px) black-white</label>
</div>
<div class="ts radio checkbox">
<input id="epd_5_in_83_colour" type="radio" name="dp">
<label for="epd_5_in_83_colour">5.83" colour</label>
</div>
<div class="ts radio checkbox">
<input id="epd_5_in_83" type="radio" name="dp">
<label for="epd_5_in_83">5.83" black-white</label>
</div>
<div class="ts radio checkbox">
<input id="epd_4_in_2_colour" type="radio" name="dp">
<label for="epd_4_in_2_colour">4.2" colour</label>
</div>
<div class="ts radio checkbox">
2020-01-18 16:02:49 +01:00
<input id="epd_4_in_2" type="radio" name="dp">
<label for="epd_4_in_2">4.2" black-white</label>
</div>
</div>
</div>
<div class="field">
<label>Which language should be used in the software?</label>
<div class="ts checkboxes">
<div class="ts radio checkbox">
<input id="language_en" type="radio" name="la" checked>
<label for="language_en">English</label>
</div>
<div class="ts radio checkbox">
<input id="language_de" type="radio" name="la">
<label for="language_de">German</label>
</div>
<div class="ts radio checkbox">
<input id="language_ru" type="radio" name="la">
<label for="language_ru">Russian</label>
</div>
<div class="ts radio checkbox">
<input id="language_it" type="radio" name="la">
<label for="language_it">Italian</label>
</div>
<div class="ts radio checkbox">
<input id="language_es" type="radio" name="la">
<label for="language_es">Spanish</label>
</div>
<div class="ts radio checkbox">
<input id="language_fr" type="radio" name="la">
<label for="language_fr">French</label>
</div>
<div class="ts radio checkbox">
<input id="language_el" type="radio" name="la">
<label for="language_el">Greek</label>
</div>
<div class="ts radio checkbox">
<input id="language_sv" type="radio" name="la">
<label for="language_sv">Swedish</label>
</div>
<div class="ts radio checkbox">
<input id="language_nl" type="radio" name="la">
<label for="language_nl">Dutch</label>
</div>
<div class="ts radio checkbox">
<input id="language_pl" type="radio" name="la">
<label for="language_pl">Polish</label>
</div>
<div class="ts radio checkbox">
<input id="language_ua" type="radio" name="la">
<label for="language_ua">Ukrainian</label>
</div>
<div class="ts radio checkbox">
<input id="language_nb" type="radio" name="la">
<label for="language_nb">Norwegian</label>
</div>
<div class="ts radio checkbox">
<input id="language_vi" type="radio" name="la">
<label for="language_vi">Vietnamese</label>
</div>
<div class="ts radio checkbox">
<input id="language_zh_tw" type="radio" name="la">
<label for="language_zh_tw">Chinese-Taiwanese</label>
</div>
<div class="ts radio checkbox">
<input id="language_zh" type="radio" name="la">
<label for="language_zh">Chinese</label>
</div>
<div class="ts radio checkbox">
<input id="language_ja" type="radio" name="la">
<label for="language_ja">Japanese</label>
</div>
<div class="ts radio checkbox">
<input id="language_ko" type="radio" name="la">
<label for="language_ko">Korean</label>
</div>
</div>
</div>
<div class="field">
<label>Which units are used in your country?</label>
<div class="ts checkboxes">
<div class="ts radio checkbox">
<input id="metric" type="radio" name="un" checked>
<label for="metric">Metric</label>
</div>
<div class="ts radio checkbox">
<input id="imperial" type="radio" name="un">
<label for="imperial">Imperial</label>
</div>
</div>
</div>
<div class="field">
<label>Which hour-format do you prefer?</label>
<div class="ts checkboxes">
<div class="ts radio checkbox">
<input id="24_hours" type="radio" name="tf" checked>
<label for="24_hours">24-hour format</label>
</div>
<div class="ts radio checkbox">
<input id="12_hours" type="radio" name="tf">
<label for="12_hours">12-hour format</label>
</div>
</div>
</div>
<div class="field">
<label>What should be displayed in the top section?</label>
2020-05-17 21:32:50 +02:00
<div class="ts checkboxes" id="cb_top_section">
<div class="ts radio checkbox">
<input id="Weather" type="radio" name="ts" checked>
<label for="Weather">Weather</label>
</div>
<div class="ts radio checkbox">
<input id="top_blank" type="radio" name="ts">
<label for="top_blank">Nothing</label>
</div>
</div>
</div>
2020-05-17 21:32:50 +02:00
<div class="field" id="pnl_top_height">
<label>Height of the top section</label>
<details class="ts accordion">
<summary>
<i class="dropdown icon"></i> Info
</summary>
<div class="content">
<p>Section height is calculated relative to other sections. With this approach you can choose pixel-perfect, relative or percentage panel heights.</p></div>
</details>
<input id="top_height" type="number" min="1" max="10000" placeholder="10">
</div>
<div class="field">
<label>What should be displayed in the middle (main) section?</label>
<div class="ts checkboxes" id="cb_middle_section">
<div class="ts radio checkbox">
<input id="Calendar" type="radio" name="ms" checked>
<label for="Calendar">A monthly Calendar</label>
</div>
<div class="ts radio checkbox">
<input id="Agenda" type="radio" name="ms">
<label for="Agenda">Agenda of upcoming events</label>
</div>
<div class="ts radio checkbox">
<input id="Image" type="radio" name="ms">
<label for="Image">An image</label>
</div>
<div class="ts radio checkbox">
<input id="middle_blank" type="radio" name="ms">
<label for="middle_blank">Nothing</label>
</div>
</div>
</div>
2020-05-17 21:32:50 +02:00
<div class="field" id="pnl_middle_height">
<label>Height of the middle section</label>
<details class="ts accordion">
<summary>
<i class="dropdown icon"></i> Info
</summary>
<div class="content">
<p>Section height is calculated relative to other sections. With this approach you can choose pixel-perfect, relative or percentage panel heights.</p></div>
</details>
<input id="middle_height" type="number" min="1" max="10000" placeholder="65">
</div>
<div class="field" id="Image_Config" style="display:none;">
<div class="field">
<label>What is the URl or path of the image?</label>
<details class="ts accordion">
<summary>
<i class="dropdown icon"></i> Info
</summary>
<div class="content">
The following parameters will be substituted:
<ul>
<li><code>{model}</code> - substituted by the E-Paper model name.</li>
<li><code>{width}</code> - substituted by the panel width.</li>
<li><code>{height}</code> - substituted by the panel width.</li>
</ul>
</div>
</details>
<input id="image_path" type="text" placeholder="https://github.com/aceisace/Inky-Calendar/blob/master/Gallery/Inky-Calendar-logo.png?raw=true"/>
</div>
<div class="field">
<label>Do you want to send extra data while obtaining the image?</label>
<details class="ts accordion">
<summary>
<i class="dropdown icon"></i> Info
</summary>
<div class="content">
<p>Optional data. When specified, this data is sent as Json to the image url using POST.
<br/>This is useful for some dynamically generated images.
</p>
</div>
</details>
<textarea id="image_path_body" type="text" rows="4" placeholder='[
"https://calendar.google.com/calendar/ical/en.usa%23holiday%40group.v.calendar.google.com/public/basic.ics"
]'></textarea>
</div>
</div>
<div class="field">
<label>What should be displayed in the bottom section?</label>
2020-05-17 21:32:50 +02:00
<div class="ts checkboxes" id="cb_bottom_section">
<div class="ts radio checkbox">
<input id="RSS" type="radio" name="bs" checked>
<label for="RSS">RSS-feeds</label>
</div>
<div class="ts radio checkbox">
<input id="bottom_blank" type="radio" name="bs">
<label for="bottom_blank">Nothing</label>
</div>
</div>
</div>
2020-05-17 21:32:50 +02:00
<div class="field" id="pnl_bottom_height">
<label>Height of the bottom section</label>
<details class="ts accordion">
<summary>
<i class="dropdown icon"></i> Info
</summary>
<div class="content">
<p>Section height is calculated relative to other sections. With this approach you can choose pixel-perfect, relative or percentage panel heights.</p></div>
</details>
<input id="bottom_height" type="number" min="1" max="10000" placeholder="25">
</div>
<div class="content">
<p>Instructions<br>
2020-02-15 22:54:59 +01:00
Insert your personal details and preferences and click on 'Generate'. Copy the downloaded file to the Raspberry Pi and place it in: '/home/pi/Inky-Calendar/settings/' (inside the settings folder within the Inky-Calendar folder. Lastly, reboot the Raspberry Pi to apply the changes. You can also manually run the software with:
python3 /home/pi/Inky-Calendar/modules/inkycal.py.</p>
</div>
</form>
<br>
2020-02-15 22:54:49 +01:00
<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">
<summary>
<i class="dropdown icon"></i> MIT License
</summary>
<div class="content">
<p>Copyright 2019 Toby Chui <br>
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.</p>
</div>
</details>
</div>
<br>
<br>
<script>
var template = `ical_urls = [{ical_urls}]
rss_feeds = [{rss_urls}]
update_interval = "{update_interval}"
api_key = "{api_key}"
location = "{location}"
week_starts_on = "{week_starts_on}"
calibration_hours = [{calibration_hours}]
model = "{model}"
language = "{language}"
units = "{units}"
hours = "{hours}"
top_section = "{top_section}"
2020-05-17 21:32:50 +02:00
top_section_height = {top_section_height}
middle_section = "{middle_section}"
2020-05-17 21:32:50 +02:00
middle_section_height = {middle_section_height}
bottom_section = "{bottom_section}"
2020-05-17 21:32:50 +02:00
bottom_section_height = {bottom_section_height}
inkycal_image_path = "{image_path}"
inkycal_image_path_body = "{image_path_body}"`;
2020-05-17 21:32:50 +02:00
$('#cb_top_section').change(function(){
if($('#top_blank').prop("checked")) {
$('#pnl_top_height').hide();
} else {
$('#pnl_top_height').show();
}
});
$('#cb_middle_section').change(function(){
if($('#Image').prop("checked")) {
$('#Image_Config').show();
} else {
$('#Image_Config').hide();
}
2020-05-17 21:32:50 +02:00
if($('#middle_blank').prop("checked")) {
$('#pnl_middle_height').hide();
} else {
$('#pnl_middle_height').show();
}
});
$('#cb_bottom_section').change(function(){
if($('#bottom_blank').prop("checked")) {
$('#pnl_bottom_height').hide();
} else {
$('#pnl_bottom_height').show();
}
});
2020-02-15 22:54:49 +01:00
function generate(json){
var ical_urls = $("#ical_urls").val().trim();
if (ical_urls == ""){
ical_urls = $("#ical_urls").attr("placeholder");
}
var rss_urls = $("#rss_urls").val().trim();
if (rss_urls == ""){
rss_urls = $("#rss_urls").attr("placeholder");
}
var update_interval = "60";
2020-01-18 16:02:49 +01:00
if ($('#update_10_mins').is(':checked')){
update_interval = "10";
}
if ($('#update_15_mins').is(':checked')){
update_interval = "15";
}
if ($('#update_20_mins').is(':checked')){
update_interval = "20";
}
if ($('#update_30_mins').is(':checked')){
update_interval = "30";
}
if ($('#update_60_mins').is(':checked')){
update_interval = "60";
}
var api_key = $("#api_key").val().trim();
if (api_key == ""){
api_key = "";
}
var location = $("#location").val().trim();
if (location == ""){
location = $("#location").attr("placeholder");
}
var week_starts_on = "Monday";
if ($('#week_sunday').is(':checked')){
week_starts_on = "Sunday";
}
var calibration_hours = $("#calibration_hours").val().trim();
if (calibration_hours == ""){
calibration_hours = $("#calibration_hours").attr("placeholder");
}
2020-01-18 16:02:49 +01:00
var model = "epd_7_in_5_v2_colour";
if ($('#epd_7_in_5_v2').is(':checked')){
model = "epd_7_in_5_v2";
}
if ($('#epd_7_in_5_colour').is(':checked')){
model = "epd_7_in_5_colour";
}
if ($('#epd_7_in_5').is(':checked')){
model = "epd_7_in_5";
}
if ($('#epd_5_in_83_colour').is(':checked')){
model = "epd_5_in_83_colour";
}
if ($('#epd_5_in_83').is(':checked')){
model = "epd_5_in_83";
}
if ($('#epd_4_in_2_colour').is(':checked')){
model = "epd_4_in_2_colour";
}
if ($('#epd_4_in_2').is(':checked')){
model = "epd_4_in_2";
}
var language = "en";
if ($('#language_de').is(':checked')){
language = "de";
}
if ($('#language_ru').is(':checked')){
language = "ru";
}
if ($('#language_it').is(':checked')){
language = "it";
}
if ($('#language_es').is(':checked')){
language = "es";
}
if ($('#language_fr').is(':checked')){
language = "fr";
}
if ($('#language_el').is(':checked')){
language = "el";
}
if ($('#language_sv').is(':checked')){
language = "sv";
}
if ($('#language_nl').is(':checked')){
language = "nl";
}
if ($('#language_pl').is(':checked')){
language = "pl";
}
if ($('#language_ua').is(':checked')){
language = "ua";
}
if ($('#language_nb').is(':checked')){
language = "nb";
}
if ($('#language_vi').is(':checked')){
language = "vi";
}
if ($('#language_zh_tw').is(':checked')){
language = "zh_tw";
}
if ($('#language_zh').is(':checked')){
language = "zh";
}
if ($('#language_ja').is(':checked')){
language = "ja";
}
if ($('#language_ko').is(':checked')){
language = "ko";
}
var units = "metric";
if ($('#imperial').is(':checked')){
units = "imperial";
}
var hours = "24";
if ($('#12_hours').is(':checked')){
hours = "12";
}
2020-01-18 16:02:49 +01:00
var top_section = "inkycal_weather";
if ($('#top_blank').is(':checked')){
top_section = "";
}
2020-01-18 16:02:49 +01:00
var middle_section = "inkycal_calendar";
if ($('#Agenda').is(':checked')){
2020-01-18 16:02:49 +01:00
middle_section = "inkycal_agenda";
}
if ($('#Image').is(':checked')){
middle_section = "inkycal_image";
}
if ($('#middle_blank').is(':checked')){
middle_section = "";
}
2020-01-18 16:02:49 +01:00
var bottom_section = "inkycal_rss";
if ($('#bottom_blank').is(':checked')){
bottom_section = "";
}
2020-05-17 21:32:50 +02:00
top_section_height = $("#top_height").val().trim()
top_section_height = top_section_height=="" ? null : Number(top_section_height)
middle_section_height = $("#middle_height").val().trim()
middle_section_height = middle_section_height=="" ? null : Number(middle_section_height)
bottom_section_height = $("#bottom_height").val().trim()
bottom_section_height = bottom_section_height=="" ? null : Number(bottom_section_height)
var image_path = $("#image_path").val().trim();
if (image_path == ""){
image_path = $("#image_path").attr("placeholder");
}
var image_path_body = $("#image_path").val().trim();
2020-01-18 16:02:49 +01:00
//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);
2020-02-15 22:54:49 +01:00
if(json)
2020-05-17 21:32:50 +02:00
downloadSettingsAsJson(ical_urls, rss_urls, update_interval, api_key, location, week_starts_on, calibration_hours, model, language, units, hours, top_section, top_section_height, middle_section, middle_section_height, bottom_section, bottom_section_height, image_path, image_path_body)
2020-02-15 22:54:49 +01:00
else
2020-05-17 21:32:50 +02:00
createPythonSetting(ical_urls, rss_urls, update_interval, api_key, location, week_starts_on, calibration_hours, model, language, units, hours, top_section, top_section_height, middle_section, middle_section_height, bottom_section, bottom_section_height, image_path, image_path_body);
}
function rk(content,key,value){
//Use to replace key-value pair in template string
return content.split("{" + key + "}").join(value);
}
2020-05-17 21:32:50 +02:00
function createPythonSetting(a,b,c,d,e,f,g,h,i,j,k,l, top_section_height,m, bottom_section_height, n, bottom_section_height, image_path, image_path_body){
var box = template;
box = rk(box,"ical_urls",a);
box = rk(box,"rss_urls",b);
box = rk(box,"update_interval",c);
box = rk(box,"api_key",d);
box = rk(box,"location",e);
box = rk(box,"week_starts_on",f);
box = rk(box,"calibration_hours",g);
2020-01-18 16:02:49 +01:00
box = rk(box,"model",h);
box = rk(box,"language",i);
box = rk(box,"units",j);
box = rk(box,"hours",k);
box = rk(box,"top_section",l);
2020-05-17 21:32:50 +02:00
box = rk(box,"top_section_height",top_section_height===null?"None":top_section_height);
box = rk(box,"middle_section",m);
2020-05-17 21:32:50 +02:00
box = rk(box,"middle_section_height",middle_section_height===null?"None":middle_section_height);
box = rk(box,"bottom_section",n);
2020-05-17 21:32:50 +02:00
box = rk(box,"bottom_section_height",bottom_section_height===null?"None":bottom_section_height);
box = rk(box,"image_path",image_path);
box = rk(box,"image_path_body",image_path_body);
var config = new Blob([box], {type : "text/plain"});
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.py');
a.click();
document.body.removeChild(a);
}
2020-02-15 22:54:49 +01:00
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,
2020-05-17 21:32:50 +02:00
top_section_height,
2020-02-15 22:54:49 +01:00
middle_section,
2020-05-17 21:32:50 +02:00
middle_section_height,
2020-02-15 22:54:49 +01:00
bottom_section,
2020-05-17 21:32:50 +02:00
bottom_section_height,
2020-02-15 22:54:49 +01:00
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",
2020-05-17 21:32:50 +02:00
"height" : top_section_height,
2020-02-15 22:54:49 +01:00
"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,
2020-05-17 21:32:50 +02:00
"height" : middle_section_height,
2020-02-15 22:54:49 +01:00
"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,
2020-05-17 21:32:50 +02:00
"height" : middle_section_height,
2020-02-15 22:54:49 +01:00
"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,
2020-05-17 21:32:50 +02:00
"height" : bottom_section_height,
2020-02-15 22:54:49 +01:00
"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>