mirror of
https://github.com/rvdbreemen/OTGW-firmware
synced 2024-11-16 04:33:49 +01:00
working otmonitor ui
Need visual cleanup, but it works
This commit is contained in:
parent
37ec99be30
commit
758a05616f
157
data/index.js
157
data/index.js
@ -1,9 +1,9 @@
|
||||
/*
|
||||
***************************************************************************
|
||||
** Program : index.js, part of ESP_ticker
|
||||
** Program : index.js, part of OTGW-firmware project
|
||||
** Version : v0.5.1
|
||||
**
|
||||
** Copyright (c) 2020 Willem Aandewiel
|
||||
** Copyright (c) 2021 Robert van den Breemen
|
||||
**
|
||||
** TERMS OF USE: MIT License. See bottom of file.
|
||||
***************************************************************************
|
||||
@ -20,48 +20,68 @@
|
||||
window.location.reload(true);
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
var tid = 0;
|
||||
|
||||
//============================================================================
|
||||
function bootsTrapMain() {
|
||||
console.log("bootsTrapMain()");
|
||||
document.getElementById('saveMsg').addEventListener('click',function()
|
||||
{saveMessages();});
|
||||
|
||||
document.getElementById('M_FSexplorer').addEventListener('click',function()
|
||||
{ console.log("newTab: goFSexplorer");
|
||||
location.href = "/FSexplorer";
|
||||
});
|
||||
document.getElementById('D_FSexplorer').addEventListener('click',function()
|
||||
{ console.log("newTab: goFSexplorer");
|
||||
location.href = "/FSexplorer";
|
||||
});
|
||||
document.getElementById('S_FSexplorer').addEventListener('click',function()
|
||||
{ console.log("newTab: goFSexplorer");
|
||||
location.href = "/FSexplorer";
|
||||
});
|
||||
document.getElementById('back').addEventListener('click',function()
|
||||
document.getElementById('D_back').addEventListener('click',function()
|
||||
{ console.log("newTab: goBack");
|
||||
location.href = "/";
|
||||
location.href = "/";
|
||||
});
|
||||
document.getElementById('Settings').addEventListener('click',function()
|
||||
{settingsPage();});
|
||||
document.getElementById('saveSettings').addEventListener('click',function()
|
||||
{saveSettings();});
|
||||
document.getElementById('S_back').addEventListener('click',function()
|
||||
{ console.log("newTab: goBack");
|
||||
location.href = "/";
|
||||
});
|
||||
document.getElementById('S_saveSettings').addEventListener('click',function(){saveSettings();});
|
||||
document.getElementById('tabDeviceInfo').addEventListener('click',function(){deviceinfoPage();});
|
||||
document.getElementById('tabSettings').addEventListener('click',function(){settingsPage();});
|
||||
needReload = false;
|
||||
refreshDevTime();
|
||||
refreshDevInfo();
|
||||
refreshOTmonitor();
|
||||
tid = setInterval(function(){refreshOTmonitor();refreshDevTime(); }, 1000); //delay is in milliseconds
|
||||
|
||||
document.getElementById("displayMainPage").style.display = "block";
|
||||
document.getElementById("displaySettingsPage").style.display = "none";
|
||||
document.getElementById("displayDeviceInfo").style.display = "none";
|
||||
|
||||
} // bootsTrapMain()
|
||||
|
||||
function deviceinfoPage()
|
||||
{
|
||||
clearInterval(tid);
|
||||
document.getElementById("displayMainPage").style.display = "none";
|
||||
document.getElementById("displaySettingsPage").style.display = "none";
|
||||
var deviceinfoPage = document.getElementById("deviceinfoPage");
|
||||
refreshDeviceInfo();
|
||||
document.getElementById("displayDeviceInfo").style.display = "block";
|
||||
|
||||
} // settingsPage()
|
||||
|
||||
function settingsPage()
|
||||
{
|
||||
clearInterval(tid);
|
||||
document.getElementById("displayMainPage").style.display = "none";
|
||||
|
||||
document.getElementById("displayDeviceInfo").style.display = "none";
|
||||
var settingsPage = document.getElementById("settingsPage");
|
||||
refreshSettings();
|
||||
document.getElementById("displaySettingsPage").style.display = "block";
|
||||
|
||||
} // settingsPage()
|
||||
|
||||
|
||||
//============================================================================
|
||||
function refreshDevTime()
|
||||
@ -96,7 +116,7 @@
|
||||
fetch(APIGW+"v0/devinfo")
|
||||
.then(response => response.json())
|
||||
.then(json => {
|
||||
//console.log("parsed .., data is ["+ JSON.stringify(json)+"]");
|
||||
console.log("parsed .., data is ["+ JSON.stringify(json)+"]");
|
||||
data = json.devinfo;
|
||||
for( let i in data )
|
||||
{
|
||||
@ -127,26 +147,23 @@
|
||||
{
|
||||
console.log("refreshOTmonitor() ..");
|
||||
|
||||
}
|
||||
|
||||
function refreshMessages()
|
||||
{
|
||||
console.log("refreshMessages() ..");
|
||||
data = {};
|
||||
fetch(APIGW+"v1/otgw/otmonitor")
|
||||
fetch(APIGW+"v1/otgw/otmonitor") //api/v1/otgw/otmonitor
|
||||
.then(response => response.json())
|
||||
.then(json => {
|
||||
console.log("then(json => ..)");
|
||||
msg = json.messages;
|
||||
for( let i in msg )
|
||||
//console.log("parsed .., data is ["+ JSON.stringify(json)+"]");
|
||||
data = json.otmonitor;
|
||||
for( let i in data )
|
||||
{
|
||||
console.log("["+msg[i].name+"]=>["+msg[i].value+"]");
|
||||
var otmonitor = document.getElementById('mainPage');
|
||||
if( ( document.getElementById("otmon_"+msg[i].name)) == null )
|
||||
document.getElementById("waiting").innerHTML = "";
|
||||
//console.log("["+data[i].name+"]=>["+data[i].value+"]");
|
||||
var mainPage = document.getElementById('mainPage');
|
||||
if( ( document.getElementById("otmon_"+data[i].name)) == null )
|
||||
{ // if element does not exists yet, then build page
|
||||
var rowDiv = document.createElement("div");
|
||||
rowDiv.setAttribute("class", "msgDiv");
|
||||
rowDiv.setAttribute("id", "msgR_"+msg[i].name);
|
||||
rowDiv.setAttribute("class", "settingDiv");
|
||||
rowDiv.setAttribute("id", "otmon_"+data[i].name);
|
||||
rowDiv.setAttribute("style", "text-align: right;");
|
||||
rowDiv.style.marginLeft = "10px";
|
||||
rowDiv.style.marginRight = "10px";
|
||||
@ -158,25 +175,25 @@
|
||||
fldDiv.setAttribute("style", "margin-right: 10px;");
|
||||
fldDiv.style.width = "30px";
|
||||
fldDiv.style.float = 'left';
|
||||
fldDiv.textContent = msg[i].name;
|
||||
fldDiv.setAttribute("id", "otmon_"+msg[i].name);
|
||||
fldDiv.textContent = translateToHuman(data[i].name);
|
||||
fldDiv.setAttribute("id", "otmon_"+data[i].name);
|
||||
rowDiv.appendChild(fldDiv);
|
||||
//--- input ---
|
||||
var valDiv = document.createElement("div");
|
||||
valDiv.setAttribute("style", "text-align: left;");
|
||||
fldDiv.style.width = "30px";
|
||||
fldDiv.style.float = 'left';
|
||||
valDiv.textContent = msg[i].value;
|
||||
valDiv.setAttribute("style", "background: white");
|
||||
valDiv.textContent = data[i].value;
|
||||
valDiv.setAttribute("style", "background: lightblue");
|
||||
rowDiv.appendChild(valDiv);
|
||||
otmonitor.appendChild(rowDiv);
|
||||
mainPage.appendChild(rowDiv);
|
||||
}
|
||||
else
|
||||
{ //if the element exists, then update the value
|
||||
document.getElementById("otmon_"+msg[i].name).value = data[i].value;
|
||||
document.getElementById("otmon_"+data[i].name).value = data[i].value;
|
||||
}
|
||||
}
|
||||
// document.getElementById("waiting").innerHTML = "";
|
||||
|
||||
})
|
||||
.catch(function(error) {
|
||||
var p = document.createElement('p');
|
||||
@ -185,9 +202,66 @@
|
||||
);
|
||||
});
|
||||
|
||||
} // refreshMessages()
|
||||
} // refreshOTmonitor()
|
||||
|
||||
|
||||
function refreshDeviceInfo()
|
||||
{
|
||||
console.log("refreshDeviceInfo() ..");
|
||||
|
||||
data = {};
|
||||
fetch(APIGW+"v0/devinfo")
|
||||
.then(response => response.json())
|
||||
.then(json => {
|
||||
console.log("then(json => ..)");
|
||||
console.log("parsed .., data is ["+ JSON.stringify(json)+"]");
|
||||
data = json.devinfo;
|
||||
for( let i in data )
|
||||
{
|
||||
console.log("["+data[i].name+"]=>["+data[i].value+"]");
|
||||
var deviceinfoPage = document.getElementById('deviceinfoPage');
|
||||
if( ( document.getElementById("devinfo_"+data[i].name)) == null )
|
||||
{ // if element does not exists yet, then build page
|
||||
var rowDiv = document.createElement("div");
|
||||
rowDiv.setAttribute("class", "settingDiv");
|
||||
rowDiv.setAttribute("id", "devinfo_"+data[i].name);
|
||||
rowDiv.setAttribute("style", "text-align: right;");
|
||||
rowDiv.style.marginLeft = "10px";
|
||||
rowDiv.style.marginRight = "10px";
|
||||
rowDiv.style.width = "850px";
|
||||
rowDiv.style.border = "thick solid lightblue";
|
||||
rowDiv.style.background = "lightblue";
|
||||
//--- field Name ---
|
||||
var fldDiv = document.createElement("div");
|
||||
fldDiv.setAttribute("style", "margin-right: 10px;");
|
||||
fldDiv.style.width = "30px";
|
||||
fldDiv.style.float = 'left';
|
||||
fldDiv.textContent = translateToHuman(data[i].name);
|
||||
rowDiv.appendChild(fldDiv);
|
||||
//--- input ---
|
||||
var valDiv = document.createElement("div");
|
||||
valDiv.setAttribute("style", "text-align: left;");
|
||||
fldDiv.style.width = "30px";
|
||||
fldDiv.style.float = 'left';
|
||||
valDiv.textContent = data[i].value;
|
||||
valDiv.setAttribute("style", "background: lightblue");
|
||||
rowDiv.appendChild(valDiv);
|
||||
deviceinfoPage.appendChild(rowDiv);
|
||||
}
|
||||
else
|
||||
{ //if the element exists, then update the value
|
||||
document.getElementById("devinfo_"+data[i].name).value = data[i].value;
|
||||
}
|
||||
}
|
||||
})
|
||||
.catch(function(error) {
|
||||
var p = document.createElement('p');
|
||||
p.appendChild(
|
||||
document.createTextNode('Error: ' + error.message)
|
||||
);
|
||||
});
|
||||
|
||||
} // refreshDeviceInfo()
|
||||
|
||||
//============================================================================
|
||||
function refreshSettings()
|
||||
{
|
||||
@ -197,6 +271,7 @@
|
||||
.then(response => response.json())
|
||||
.then(json => {
|
||||
console.log("then(json => ..)");
|
||||
console.log("parsed .., data is ["+ JSON.stringify(json)+"]");
|
||||
data = json.settings;
|
||||
for( let i in data )
|
||||
{
|
||||
@ -332,12 +407,10 @@
|
||||
//do something to each div like
|
||||
var msgId = mRow[i].getAttribute("id");
|
||||
var field = msgId;
|
||||
//console.log("msgId["+msgId+", msgNr["+field+"]");
|
||||
console.log("msgId["+msgId+", msgNr["+field+"]");
|
||||
value = document.getElementById(msgId).value;
|
||||
//console.log("==> name["+field+"], value["+value+"]");
|
||||
|
||||
console.log("==> name["+field+"], value["+value+"]");
|
||||
changes = false;
|
||||
|
||||
if (getBackGround(field) == "lightgray")
|
||||
{
|
||||
setBackGround(field, "white");
|
||||
@ -349,7 +422,6 @@
|
||||
sendPostSetting(field, value);
|
||||
}
|
||||
}
|
||||
|
||||
} // saveSettings()
|
||||
|
||||
|
||||
@ -498,6 +570,7 @@
|
||||
,[ "outsidetemperature", "Outside Temperature"]
|
||||
,[ "roomtemperatature", "Room Temperature"]
|
||||
,[ "roomsetpoint", "Room Temperature Setpoint"]
|
||||
,[ "remoteroomsetpoint", "Remote Room Temperature Setpoint"]
|
||||
,[ "relmodlvl", "Relative Modulation Level"]
|
||||
,[ "maxrelmodlvl", "Max. Rel. Modulation Level"]
|
||||
,[ "chwaterpressure", "Central Heating Water Pressure"]
|
||||
|
147
restAPI.ino
147
restAPI.ino
@ -47,90 +47,93 @@ void processAPI()
|
||||
Debugln(" ");
|
||||
}
|
||||
|
||||
if (words[1] != "api")
|
||||
{
|
||||
sendApiNotFound(URI);
|
||||
return;
|
||||
}
|
||||
|
||||
if (words[2] == "v1")
|
||||
{ //v1 API calls
|
||||
if (words[3] == "otgw"){
|
||||
if (words[4] == "otmonitor") {
|
||||
// GET /api/v1/otgw/otmonitor
|
||||
// Response: see json response
|
||||
sendOTmonitor();
|
||||
} else if (words[4] == "id"){
|
||||
if (words[1] == "api"){
|
||||
|
||||
if (words[2] == "v1")
|
||||
{ //v1 API calls
|
||||
if (words[3] == "otgw"){
|
||||
if (words[4] == "otmonitor") {
|
||||
// GET /api/v1/otgw/otmonitor
|
||||
// Response: see json response
|
||||
sendOTmonitor();
|
||||
} else if (words[4] == "id"){
|
||||
//what the heck should I do?
|
||||
// /api/v1/otgw/id/{msgid} msgid = OpenTherm Message Id (0-127)
|
||||
// Response: label, value, unit
|
||||
// {
|
||||
// "label": "Tr",
|
||||
// "value": "0.00",
|
||||
// "unit": "°C"
|
||||
// }
|
||||
sendOTGWvalue(words[5].toInt());
|
||||
} else if (words[4] == "label"){
|
||||
//what the heck should I do?
|
||||
// /api/v1/otgw/label/{msglabel} = OpenTherm Label (matching string)
|
||||
// Response: label, value, unit
|
||||
// {
|
||||
// "label": "Tr",
|
||||
// "value": "0.00",
|
||||
// "unit": "°C"
|
||||
// }
|
||||
sendOTGWlabel(CSTR(words[5]));
|
||||
} else if (words[4] == "command"){
|
||||
if (httpServer.method() == HTTP_PUT || httpServer.method() == HTTP_POST)
|
||||
{
|
||||
/* how to post a command to OTGW
|
||||
** POST or PUT = /api/v1/otgw/command/{command} = Any command you want
|
||||
** Response: 200 OK
|
||||
** @@Todo: Check if command was executed correctly.
|
||||
*/
|
||||
//Send a command to OTGW
|
||||
sendOTGW(CSTR(words[5]), words[5].length());
|
||||
httpServer.send(200, "text/plain", "OK");
|
||||
}
|
||||
}
|
||||
else sendApiNotFound(URI);
|
||||
}
|
||||
else sendApiNotFound(URI);
|
||||
}
|
||||
else if (words[2] == "v0")
|
||||
{ //v0 API calls
|
||||
if (words[3] == "otgw"){
|
||||
//what the heck should I do?
|
||||
// /api/v1/otgw/id/{msgid} msgid = OpenTherm Message Id (0-127)
|
||||
// /api/v0/otgw/{msgid} msgid = OpenTherm Message Id
|
||||
// Response: label, value, unit
|
||||
// {
|
||||
// "label": "Tr",
|
||||
// "value": "0.00",
|
||||
// "unit": "°C"
|
||||
// }
|
||||
sendOTGWvalue(words[5].toInt());
|
||||
} else if (words[4] == "label"){
|
||||
//what the heck should I do?
|
||||
// /api/v1/otgw/label/{msglabel} = OpenTherm Label (matching string)
|
||||
// Response: label, value, unit
|
||||
// {
|
||||
// "label": "Tr",
|
||||
// "value": "0.00",
|
||||
// "unit": "°C"
|
||||
// }
|
||||
sendOTGWlabel(CSTR(words[5]));
|
||||
} else if (words[4] == "command"){
|
||||
sendOTGWvalue(words[4].toInt());
|
||||
}
|
||||
else if (words[3] == "devinfo")
|
||||
{
|
||||
sendDeviceInfo();
|
||||
}
|
||||
else if (words[3] == "devtime")
|
||||
{
|
||||
sendDeviceTime();
|
||||
}
|
||||
else if (words[3] == "settings")
|
||||
{
|
||||
if (httpServer.method() == HTTP_PUT || httpServer.method() == HTTP_POST)
|
||||
{
|
||||
/* how to post a command to OTGW
|
||||
** POST or PUT = /api/v1/otgw/command/{command} = Any command you want
|
||||
** Response: 200 OK
|
||||
** @@Todo: Check if command was executed correctly.
|
||||
*/
|
||||
//Send a command to OTGW
|
||||
sendOTGW(CSTR(words[5]), words[5].length());
|
||||
httpServer.send(200, "text/plain", "OK");
|
||||
postSettings();
|
||||
}
|
||||
else
|
||||
{
|
||||
sendDeviceSettings();
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
else if (words[2] == "v0")
|
||||
{ //v0 API calls
|
||||
if (words[3] == "otgw"){
|
||||
//what the heck should I do?
|
||||
// /api/v0/otgw/{msgid} msgid = OpenTherm Message Id
|
||||
// Response: label, value, unit
|
||||
// {
|
||||
// "label": "Tr",
|
||||
// "value": "0.00",
|
||||
// "unit": "°C"
|
||||
// }
|
||||
sendOTGWvalue(words[4].toInt());
|
||||
}
|
||||
else if (words[3] == "devinfo")
|
||||
{
|
||||
sendDeviceInfo();
|
||||
}
|
||||
else if (words[3] == "devtime")
|
||||
{
|
||||
sendDeviceTime();
|
||||
}
|
||||
else if (words[3] == "settings")
|
||||
{
|
||||
if (httpServer.method() == HTTP_PUT || httpServer.method() == HTTP_POST)
|
||||
{
|
||||
postSettings();
|
||||
}
|
||||
else
|
||||
{
|
||||
sendDeviceSettings();
|
||||
}
|
||||
}
|
||||
else sendApiNotFound(URI);
|
||||
} else sendApiNotFound(URI);
|
||||
else sendApiNotFound(URI);
|
||||
} else sendApiNotFound(URI);
|
||||
}
|
||||
else
|
||||
{
|
||||
sendApiNotFound(URI);
|
||||
}
|
||||
|
||||
|
||||
} // processAPI()
|
||||
|
||||
|
||||
|
@ -24,30 +24,36 @@ R"(
|
||||
<div id="displayMainPage" style="display:none">
|
||||
<div class="nav-container">
|
||||
<div class='nav-left'>
|
||||
<a id='saveMsg' class='nav-item tabButton' style="background: lightblue;">save</a>
|
||||
<a id='M_FSexplorer' class='nav-img'>
|
||||
<img src='/FSexplorer.png' alt='FSexplorer'></a>
|
||||
<a id='Settings' class='nav-img'>
|
||||
<img src='/settings.png' alt='Settings'></a>
|
||||
<a id='tabDeviceInfo' class='nav-item tabButton' style="background: lightblue;">Device Info</a>
|
||||
<a id='M_FSexplorer' class='nav-img'> <img src='/FSexplorer.png' alt='FSexplorer'></a>
|
||||
<a id='tabSettings' class='nav-img'> <img src='/settings.png' alt='Settings'></a>
|
||||
</div>
|
||||
</div>
|
||||
<br/>
|
||||
<div id="mainPage">
|
||||
<div id="waiting">Not implemented yet. <br><br>Wait! Retrieving local messages...</div>
|
||||
<div id="waiting">Wait for it...</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="displaySettingsPage" style="display:none">
|
||||
<div id="displayDeviceInfo" style="display:none">
|
||||
<div class="nav-container">
|
||||
<div class='nav-left'>
|
||||
<a id='back' class='nav-item tabButton' style="background: lightblue;">Terug</a>
|
||||
<a id='saveSettings' class='nav-item tabButton' style="background: lightblue;">save</a>
|
||||
<a id='S_FSexplorer' class='nav-img'>
|
||||
<img src='/FSexplorer.png' alt='FSexplorer'></a>
|
||||
<a id='D_back' class='nav-item tabButton' style="background: lightblue;">Back</a>
|
||||
<a id='D_FSexplorer' class='nav-img'> <img src='/FSexplorer.png' alt='FSexplorer'></a>
|
||||
</div>
|
||||
</div>
|
||||
<br/>
|
||||
<div id="settingsPage"></div>
|
||||
<div id="deviceinfoPage"></div>
|
||||
</div>
|
||||
<div id="displaySettingsPage" style="display:none">
|
||||
<div class="nav-container">
|
||||
<div class='nav-left'>
|
||||
<a id='S_back' class='nav-item tabButton' style="background: lightblue;">Back</a>
|
||||
<a id='S_saveSettings' class='nav-item tabButton' style="background: lightblue;">Save</a>
|
||||
<a id='S_FSexplorer' class='nav-img'> <img src='/FSexplorer.png' alt='FSexplorer'></a>
|
||||
</div>
|
||||
</div>
|
||||
<br/>
|
||||
<div id="settingsPage">Loading...</div>
|
||||
</div>
|
||||
|
||||
<!-- KEEP THIS --->
|
||||
|
14
version.h
14
version.h
@ -2,13 +2,13 @@
|
||||
#define _VERSION_MAJOR 0
|
||||
#define _VERSION_MINOR 5
|
||||
#define _VERSION_PATCH 1
|
||||
#define _VERSION_BUILD 369
|
||||
#define _VERSION_BUILD 381
|
||||
//#define _VERSION_PRERELEASE beta //uncomment to define prerelease labels: alpha - beta - rc
|
||||
#define _VERSION_DATE "07-01-2021"
|
||||
#define _VERSION_TIME "19:17:29"
|
||||
#define _VERSION_DATE "10-01-2021"
|
||||
#define _VERSION_TIME "01:36:09"
|
||||
#define _SEMVER_CORE "0.5.1"
|
||||
#define _SEMVER_BUILD "0.5.1+369"
|
||||
#define _SEMVER_FULL "0.5.1+369"
|
||||
#define _SEMVER_NOBUILD "0.5.1 (07-01-2021)"
|
||||
#define _VERSION "0.5.1+369 (07-01-2021)"
|
||||
#define _SEMVER_BUILD "0.5.1+381"
|
||||
#define _SEMVER_FULL "0.5.1+381"
|
||||
#define _SEMVER_NOBUILD "0.5.1 (10-01-2021)"
|
||||
#define _VERSION "0.5.1+381 (10-01-2021)"
|
||||
//The version information is created automatically, more information here: https://github.com/rvdbreemen/autoinc-semver
|
||||
|
Loading…
Reference in New Issue
Block a user