klaute/lumini_p30_control
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Added a toast message to the webinterface.

Browse source
This commit is contained in:
Kai Lauterbach 2023-05-08 09:46:25 +02:00
parent b95c73cfb5
commit 25c2e8622f
8 changed files with 116 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

41
firmware/data/bottom.js
View file

@ -190,7 +190,7 @@ break;
}
}
if (lowerIndex === -1 || upperIndex === -1) {
console.log("Error: Current time not found in time array and not between two elements in time array. Fixing it...");
console.log("Warning: Current time not found in time array and not between two elements in time array. Fixing it...");
lowerIndex = 0;
upperIndex = 1;
var tmp1 = time[0].split(':');
@ -336,6 +336,7 @@ button.classList.remove("error");
button.classList.add("pure-button-primary");
button.innerHTML = "OFF";
}, 2000);
showToast('Error while sending data to server.', 'error');
console.log('Error while sending data to server.');
}
}
@ -376,6 +377,7 @@ button.classList.remove("error");
button.classList.add("pure-button-primary");
button.innerHTML = "ON";
}, 2000);
showToast('Error while sending data to server.', 'error');
console.log('Error while sending data to server.');
}
}
@ -457,22 +459,42 @@ loadTCGraphData();
function createJsonFromTable() {
var tableRows = document.querySelectorAll("table tr");
var tcdata = [];
var timeArr = [];
for (var i = 1; i <= 10; i++) {
var row = document.getElementById("hour" + i).parentNode;
var hour = parseInt(row.cells[0].childNodes[0].value);
var min = parseInt(row.cells[1].childNodes[0].value);
timeArr.push(hour * 60 + min);
var ch1 = Math.round(parseInt(row.cells[2].childNodes[0].value) * 2.55);
var ch2 = Math.round(parseInt(row.cells[3].childNodes[0].value) * 2.55);
var ch3 = Math.round(parseInt(row.cells[4].childNodes[0].value) * 2.55);
var ch4 = Math.round(parseInt(row.cells[5].childNodes[0].value) * 2.55);
tcdata.push({hour: hour, min: min, ch1: ch1, ch2: ch2, ch3: ch3, ch4: ch4});
}
for (var i = 0; i < timeArr.length - 1; i++) {
if (timeArr[i] >= timeArr[i + 1]) {
showToast('Error while verifying timing control data. The timestamps are not incrementing.', 'error');
return null;
}
}
var currentTime = {hour: new Date().getHours(), min: new Date().getMinutes()};
var jsonData = {tcdata: tcdata, currenttime: currentTime};
return JSON.stringify(jsonData);
}
function sendDataToServer() {
var jsonData = createJsonFromTable();
if (!jsonData) {
button.classList.remove("pure-button-primary");
button.classList.add("error");
button.innerHTML = "Error!";
setTimeout(function () {
button.classList.remove("error");
button.classList.add("pure-button-primary");
button.innerHTML = "save";
}, 2000);
console.log('Error while generating timing control data.');
return;
}
var urlEncodedData = encodeURIComponent(jsonData);
var url = 'http://{{IP_ADDRESS}}/tc_data_blocks_store?data=' + urlEncodedData;
var xhr = new XMLHttpRequest();
@ -499,6 +521,7 @@ button.classList.remove("error");
button.classList.add("pure-button-primary");
button.innerHTML = "save";
}, 2000);
showToast('Error while sending timing control data to server.', 'error');
console.log('Error while sending data to server.');
}
}
@ -506,3 +529,19 @@ console.log('Error while sending data to server.');
xhr.send();
loadTCGraphData();
}
function showToast(message, type) {
const toast = document.querySelector('.toast');
if (toast) {
toast.textContent = message;
toast.classList.remove('success', 'error');
if (type === 'success') {
toast.classList.add('success');
} else if (type === 'error') {
toast.classList.add('error');
}
toast.style.opacity = 1;
setTimeout(() => {
toast.style.opacity = 0;
}, 5000);
}
}

1
firmware/data/index_template_top.html
View file

@ -15,6 +15,7 @@
<body>
<fieldset>
<h3>{{LIGHT_NAME}}</h3>
<div class="toast"></div>
<div class="pure-form pure-form-aligned">
<div class="pure-controls">
<a href="/update" class="pure-button">update</a>

20
firmware/data/style.css
View file

@ -43,4 +43,24 @@ background-color: #333;
}
.top-align {
vertical-align: top;
}
.toast {
position: fixed;
bottom: 10px;
left: 50%;
transform: translateX(-50%);
padding: 10px;
border-radius: 5px;
color: #fff;
font-size: 16px;
font-weight: bold;
text-align: center;
opacity: 0;
transition: opacity 0.5s ease-in-out;
}
.toast.success {
background-color: #4CAF50;
}
.toast.error {
background-color: #f44336;
}

3
firmware/data/top.js
View file

@ -26,6 +26,7 @@ button.classList.remove("error");
button.classList.add("pure-button-primary");
button.innerHTML = "ON";
}, 2000);
showToast('Error while sending data to server.', 'error');
console.log('Error while sending data to server.');
}
}
@ -63,6 +64,7 @@ button.classList.remove("error");
button.classList.add("pure-button-primary");
button.innerHTML = "OFF";
}, 2000);
showToast('Error while sending data to server.', 'error');
console.log('Error while sending data to server.');
}
}
@ -84,6 +86,7 @@ if (!response.ok) {
throw new Error(`HTTP error! status: ${response.status}`);
}
}).catch(error => {
showToast(`Error sending slider value to ${url}: ${error}`, 'error');
console.error(`Error sending slider value to ${url}: ${error}`);
});
}, 500);

31
firmware/html/bottom.js
View file

@ -225,7 +225,7 @@ function loadTCGraphData() {
//console.log('lowerIndex=' + lowerIndex);
//console.log('upperIndex=' + upperIndex);
if (lowerIndex === -1 || upperIndex === -1) {
console.log("Error: Current time not found in time array and not between two elements in time array. Fixing it...");
console.log("Warning: Current time not found in time array and not between two elements in time array. Fixing it...");
lowerIndex = 0;
upperIndex = 1;
var tmp1 = time[0].split(':');
@ -389,6 +389,7 @@ links.forEach(function(link) {
button.classList.add("pure-button-primary");
button.innerHTML = "OFF";
}, 2000);
showToast('Error while sending data to server.', 'error');
console.log('Error while sending data to server.');
}
}
@ -437,6 +438,7 @@ links.forEach(function(link) {
button.classList.add("pure-button-primary");
button.innerHTML = "ON";
}, 2000);
showToast('Error while sending data to server.', 'error');
console.log('Error while sending data to server.');
}
}
@ -575,7 +577,7 @@ function createJsonFromTable() {
// Überprüft, ob die Zeitangaben von datensatz i=0 bis i=9 aufsteigend sind
for (var i = 0; i < timeArr.length - 1; i++) {
if (timeArr[i] >= timeArr[i + 1]) {
console.log("Fehler: Zeitangaben sind nicht aufsteigend.");
showToast('Error while verifying timing control data. The timestamps are not incrementing.', 'error');
return null;
}
}
@ -598,7 +600,7 @@ function sendDataToServer() {
button.classList.add("pure-button-primary");
button.innerHTML = "save";
}, 2000);
console.log('Error while sending data to server.');
console.log('Error while generating timing control data.');
return;
}
@ -628,6 +630,7 @@ function sendDataToServer() {
button.classList.add("pure-button-primary");
button.innerHTML = "save";
}, 2000);
showToast('Error while sending timing control data to server.', 'error');
console.log('Error while sending data to server.');
}
}
@ -635,3 +638,25 @@ function sendDataToServer() {
xhr.send();
loadTCGraphData(); // update the tc data graph
}
function showToast(message, type) {
const toast = document.querySelector('.toast');
if (toast) {
toast.textContent = message;
toast.classList.remove('success', 'error');
if (type === 'success') {
toast.classList.add('success');
} else if (type === 'error') {
toast.classList.add('error');
}
toast.style.opacity = 1;
setTimeout(() => {
toast.style.opacity = 0;
}, 5000);
}
}

1
firmware/html/index_template_top.html
View file

@ -15,6 +15,7 @@
<body>
<fieldset>
<h3>{{LIGHT_NAME}}</h3>
<div class="toast"></div>
<div class="pure-form pure-form-aligned">
<div class="pure-controls">
<a href="/update" class="pure-button">update</a>

20
firmware/html/style.css
View file

@ -43,4 +43,24 @@ background-color: #333;
}
.top-align {
vertical-align: top;
}
.toast {
position: fixed;
bottom: 10px;
left: 50%;
transform: translateX(-50%);
padding: 10px;
border-radius: 5px;
color: #fff;
font-size: 16px;
font-weight: bold;
text-align: center;
opacity: 0;
transition: opacity 0.5s ease-in-out;
}
.toast.success {
background-color: #4CAF50;
}
.toast.error {
background-color: #f44336;
}

3
firmware/html/top.js
View file

@ -27,6 +27,7 @@ links.forEach(function(link) {
button.classList.add("pure-button-primary");
button.innerHTML = "ON";
}, 2000);
showToast('Error while sending data to server.', 'error');
console.log('Error while sending data to server.');
}
}
@ -67,6 +68,7 @@ links.forEach(function(link) {
button.classList.add("pure-button-primary");
button.innerHTML = "OFF";
}, 2000);
showToast('Error while sending data to server.', 'error');
console.log('Error while sending data to server.');
}
}
@ -92,6 +94,7 @@ function sendSliderValue(x) {
}
//console.log(`Sent slider value ${value} to ${url}`);
}).catch(error => {
showToast(`Error sending slider value to ${url}: ${error}`, 'error');
console.error(`Error sending slider value to ${url}: ${error}`);
});
}, 500);