iicd/Inkycal
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge pull request #80 from Atrejoe/feature/config_as_json

Browse Source 
Updated settings-UI (Image panel, JSON export)
This commit is contained in:
Ace 2020-02-16 17:55:07 +01:00 committed by GitHub
commit ade04c4ca0
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 284 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

203
settings/settings-UI.html
View File

@ -35,7 +35,7 @@ body{
<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>
<div class="field">
<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>
@ -78,7 +78,6 @@ body{
<input id="api_key" type="text" placeholder="">
</div>
<div class="field">
<label>Location (for weather data)</label>
<details class="ts accordion">
@ -273,7 +272,7 @@ body{
<div class="field">
<label>What should be displayed in the middle (main) section?</label>
<div class="ts checkboxes">
<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>
@ -282,11 +281,52 @@ body{
<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>
<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">
@ -305,13 +345,14 @@ body{
<div class="content">
<p>Instructions<br>
Insert your peesonal 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:
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>
<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">
@ -333,9 +374,32 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
<br>
<script>
var template = 'ical_urls = [{ical_urls}]\nrss_feeds = [{rss_urls}]\nupdate_interval = "{update_interval}"\napi_key = "{api_key}"\nlocation = "{location}"\nweek_starts_on = "{week_starts_on}"\ncalibration_hours = [{calibration_hours}]\nmodel = "{model}"\nlanguage = "{language}"\nunits = "{units}"\nhours = "{hours}"\ntop_section = "{top_section}"\nmiddle_section = "{middle_section}"\nbottom_section = "{bottom_section}"';
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}"
middle_section = "{middle_section}"
bottom_section = "{bottom_section}"
inkycal_image_path = "{image_path}"
inkycal_image_path_body = "{image_path_body}"`;
function generate(){
$('#cb_middle_section').change(function(){
if($('#Image').prop("checked")) {
$('#Image_Config').show();
} else {
$('#Image_Config').hide();
}
});
function generate(json){
var ical_urls = $("#ical_urls").val().trim();
if (ical_urls == ""){
ical_urls = $("#ical_urls").attr("placeholder");
@ -475,6 +539,9 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
if ($('#Agenda').is(':checked')){
middle_section = "inkycal_agenda";
}
if ($('#Image').is(':checked')){
middle_section = "inkycal_image";
}
if ($('#middle_blank').is(':checked')){
middle_section = "";
}
@ -484,9 +551,18 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
bottom_section = "";
}
var image_path = $("#image_path").val().trim();
if (image_path == ""){
image_path = $("#image_path").attr("placeholder");
}
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);
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);
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);
}
function rk(content,key,value){
@ -494,7 +570,7 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
return content.split("{" + key + "}").join(value);
}
function createPythonSetting(a,b,c,d,e,f,g,h,i,j,k,l,m,n){
function createPythonSetting(a,b,c,d,e,f,g,h,i,j,k,l,m,n, image_path, image_path_body){
var box = template;
box = rk(box,"ical_urls",a);
box = rk(box,"rss_urls",b);
@ -510,7 +586,8 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
box = rk(box,"top_section",l);
box = rk(box,"middle_section",m);
box = rk(box,"bottom_section",n);
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');
@ -523,6 +600,112 @@ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLI
a.click();
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>

91
settings/settings.jsonc Normal file
View File

@ -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
*/