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

Compare commits

base: klaute:e7f0564ff0747ef0bcddca058f9eb7d4481b2f43
Branches Tags
klaute:main
klaute:develop
..
compare: klaute:90b6b36f26ccbcdd561dba3bbf311d3a99f6b87a
Branches Tags
klaute:develop
klaute:main

No commits in common. "e7f0564ff0747ef0bcddca058f9eb7d4481b2f43" and "90b6b36f26ccbcdd561dba3bbf311d3a99f6b87a" have entirely different histories.
e7f0564ff0 ... 90b6b36f26

10 changed files with 60 additions and 259 deletions
Show stats Expand all files Collapse all files

BIN
firmware/20230508_firmware.spiffs.bin → firmware/20230507_firmware.spiffs.bin
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2 MiB

After

Width:  |  Height:  |  Size: 2 MiB

108
firmware/data/bottom.js
View file

@ -190,7 +190,7 @@ break;
} }
} }
if (lowerIndex === -1 || upperIndex === -1) { if (lowerIndex === -1 || upperIndex === -1) {
console.log("Warning: Current time not found in time array and not between two elements in time array. Fixing it..."); console.log("Error: Current time not found in time array and not between two elements in time array. Fixing it...");
lowerIndex = 0; lowerIndex = 0;
upperIndex = 1; upperIndex = 1;
var tmp1 = time[0].split(':'); var tmp1 = time[0].split(':');
@ -336,7 +336,6 @@ button.classList.remove("error");
button.classList.add("pure-button-primary"); button.classList.add("pure-button-primary");
button.innerHTML = "OFF"; button.innerHTML = "OFF";
}, 2000); }, 2000);
showToast('Error while sending data to server.', 'error');
console.log('Error while sending data to server.'); console.log('Error while sending data to server.');
} }
} }
@ -377,7 +376,6 @@ button.classList.remove("error");
button.classList.add("pure-button-primary"); button.classList.add("pure-button-primary");
button.innerHTML = "ON"; button.innerHTML = "ON";
}, 2000); }, 2000);
showToast('Error while sending data to server.', 'error');
console.log('Error while sending data to server.'); console.log('Error while sending data to server.');
} }
} }
@ -407,11 +405,18 @@ tr.appendChild(tdHour);
var tdMinute = createSelectCell(59, 0, 1); var tdMinute = createSelectCell(59, 0, 1);
tdMinute.id = "minute" + i; tdMinute.id = "minute" + i;
tr.appendChild(tdMinute); tr.appendChild(tdMinute);
for (var j = 1; j <=4; j++) var tdCh1 = createSelectCell(100, 0, 1);
{ tdCh1.id = "ch1_" + i;
var tdCh = createSlider("ch" + j + "_" + i, 100, 0, 1); tr.appendChild(tdCh1);
tr.appendChild(tdCh); var tdCh2 = createSelectCell(100, 0, 1);
} tdCh2.id = "ch2_" + i;
tr.appendChild(tdCh2);
var tdCh3 = createSelectCell(100, 0, 1);
tdCh3.id = "ch3_" + i;
tr.appendChild(tdCh3);
var tdCh4 = createSelectCell(100, 0, 1);
tdCh4.id = "ch4_" + i;
tr.appendChild(tdCh4);
table.appendChild(tr); table.appendChild(tr);
} }
var container = document.getElementById("table-container"); var container = document.getElementById("table-container");
@ -419,36 +424,6 @@ container.innerHTML = "";
container.classList.add("pure-form"); container.classList.add("pure-form");
container.appendChild(table); container.appendChild(table);
} }
function createSlider(id, max, value, step) {
var input = document.createElement("input");
input.type = "range";
input.min = 0;
input.max = max;
input.step = step;
input.value = value;
input.classList.add("pure-slider-range");
if (id.startsWith("ch1_")) {
input.style.backgroundColor = "blue";
} else if (id.startsWith("ch2_")) {
input.style.backgroundColor = "orange";
} else if (id.startsWith("ch3_")) {
input.style.backgroundColor = "green";
} else if (id.startsWith("ch4_")) {
input.style.backgroundColor = "red";
}
div = document.createElement("div");
div.appendChild(input);
var span = document.createElement("span");
span.innerHTML = "&nbsp;" + value + " %";
div.appendChild(span);
input.oninput = function() {
span.innerHTML = "&nbsp;" + this.value + " %";
};
var td = document.createElement("td");
td.id = id;
td.appendChild(div);
return td;
}
function createSelectCell(max, value, step) { function createSelectCell(max, value, step) {
var select = document.createElement("select"); var select = document.createElement("select");
for (var i = 0; i <= max; i += step) { for (var i = 0; i <= max; i += step) {
@ -471,14 +446,10 @@ for (var i = 0; i < tcdata.length; i++) {
var row = document.getElementById("hour" + (i+1)).parentNode; var row = document.getElementById("hour" + (i+1)).parentNode;
row.cells[0].childNodes[0].value = tcdata[i].hour; row.cells[0].childNodes[0].value = tcdata[i].hour;
row.cells[1].childNodes[0].value = tcdata[i].min; row.cells[1].childNodes[0].value = tcdata[i].min;
row.cells[2].childNodes[0].childNodes[0].value = parseInt(Math.round(tcdata[i].ch1 * 100 / 255)); row.cells[2].childNodes[0].value = parseInt(Math.round(tcdata[i].ch1 * 100 / 255));
row.cells[2].childNodes[0].childNodes[1].innerHTML = "&nbsp;" + row.cells[2].childNodes[0].childNodes[0].value + " %"; row.cells[3].childNodes[0].value = parseInt(Math.round(tcdata[i].ch2 * 100 / 255));
row.cells[3].childNodes[0].childNodes[0].value = parseInt(Math.round(tcdata[i].ch2 * 100 / 255)); row.cells[4].childNodes[0].value = parseInt(Math.round(tcdata[i].ch3 * 100 / 255));
row.cells[3].childNodes[0].childNodes[1].innerHTML = "&nbsp;" + row.cells[3].childNodes[0].childNodes[0].value + " %"; row.cells[5].childNodes[0].value = parseInt(Math.round(tcdata[i].ch4 * 100 / 255));
row.cells[4].childNodes[0].childNodes[0].value = parseInt(Math.round(tcdata[i].ch3 * 100 / 255));
row.cells[4].childNodes[0].childNodes[1].innerHTML = "&nbsp;" + row.cells[4].childNodes[0].childNodes[0].value + " %";
row.cells[5].childNodes[0].childNodes[0].value = parseInt(Math.round(tcdata[i].ch4 * 100 / 255));
row.cells[5].childNodes[0].childNodes[1].innerHTML = "&nbsp;" + row.cells[5].childNodes[0].childNodes[0].value + " %";
} }
loadTCGraphData(); loadTCGraphData();
}); });
@ -486,42 +457,22 @@ loadTCGraphData();
function createJsonFromTable() { function createJsonFromTable() {
var tableRows = document.querySelectorAll("table tr"); var tableRows = document.querySelectorAll("table tr");
var tcdata = []; var tcdata = [];
var timeArr = [];
for (var i = 1; i <= 10; i++) { for (var i = 1; i <= 10; i++) {
var row = document.getElementById("hour" + i).parentNode; var row = document.getElementById("hour" + i).parentNode;
var hour = parseInt(row.cells[0].childNodes[0].value); var hour = parseInt(row.cells[0].childNodes[0].value);
var min = parseInt(row.cells[1].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 ch1 = Math.round(parseInt(row.cells[2].childNodes[0].childNodes[0].value) * 2.55); var ch2 = Math.round(parseInt(row.cells[3].childNodes[0].value) * 2.55);
var ch2 = Math.round(parseInt(row.cells[3].childNodes[0].childNodes[0].value) * 2.55); var ch3 = Math.round(parseInt(row.cells[4].childNodes[0].value) * 2.55);
var ch3 = Math.round(parseInt(row.cells[4].childNodes[0].childNodes[0].value) * 2.55); var ch4 = Math.round(parseInt(row.cells[5].childNodes[0].value) * 2.55);
var ch4 = Math.round(parseInt(row.cells[5].childNodes[0].childNodes[0].value) * 2.55);
tcdata.push({hour: hour, min: min, ch1: ch1, ch2: ch2, ch3: ch3, ch4: ch4}); 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 currentTime = {hour: new Date().getHours(), min: new Date().getMinutes()};
var jsonData = {tcdata: tcdata, currenttime: currentTime}; var jsonData = {tcdata: tcdata, currenttime: currentTime};
return JSON.stringify(jsonData); return JSON.stringify(jsonData);
} }
function sendDataToServer() { function sendDataToServer() {
var jsonData = createJsonFromTable(); 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 urlEncodedData = encodeURIComponent(jsonData);
var url = 'http://{{IP_ADDRESS}}/tc_data_blocks_store?data=' + urlEncodedData; var url = 'http://{{IP_ADDRESS}}/tc_data_blocks_store?data=' + urlEncodedData;
var xhr = new XMLHttpRequest(); var xhr = new XMLHttpRequest();
@ -548,7 +499,6 @@ button.classList.remove("error");
button.classList.add("pure-button-primary"); button.classList.add("pure-button-primary");
button.innerHTML = "save"; button.innerHTML = "save";
}, 2000); }, 2000);
showToast('Error while sending timing control data to server.', 'error');
console.log('Error while sending data to server.'); console.log('Error while sending data to server.');
} }
} }
@ -556,19 +506,3 @@ console.log('Error while sending data to server.');
xhr.send(); xhr.send();
loadTCGraphData(); 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);
}
}

2
firmware/data/index_template_top.html
View file

@ -15,7 +15,6 @@
<body> <body>
<fieldset> <fieldset>
<h3>{{LIGHT_NAME}}</h3> <h3>{{LIGHT_NAME}}</h3>
<div class="toast"></div>
<div class="pure-form pure-form-aligned"> <div class="pure-form pure-form-aligned">
<div class="pure-controls"> <div class="pure-controls">
<a href="/update" class="pure-button">update</a> <a href="/update" class="pure-button">update</a>
@ -45,6 +44,7 @@
<br> <br>
<script src="http://{{IP_ADDRESS}}/js_top"> <script src="http://{{IP_ADDRESS}}/js_top">
</script> </script>
<br>
<table border=0> <table border=0>
<tr> <tr>
<td class="top-align"> <td class="top-align">

20
firmware/data/style.css
View file

@ -43,24 +43,4 @@ background-color: #333;
} }
.top-align { .top-align {
vertical-align: top; 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,7 +26,6 @@ button.classList.remove("error");
button.classList.add("pure-button-primary"); button.classList.add("pure-button-primary");
button.innerHTML = "ON"; button.innerHTML = "ON";
}, 2000); }, 2000);
showToast('Error while sending data to server.', 'error');
console.log('Error while sending data to server.'); console.log('Error while sending data to server.');
} }
} }
@ -64,7 +63,6 @@ button.classList.remove("error");
button.classList.add("pure-button-primary"); button.classList.add("pure-button-primary");
button.innerHTML = "OFF"; button.innerHTML = "OFF";
}, 2000); }, 2000);
showToast('Error while sending data to server.', 'error');
console.log('Error while sending data to server.'); console.log('Error while sending data to server.');
} }
} }
@ -86,7 +84,6 @@ if (!response.ok) {
throw new Error(`HTTP error! status: ${response.status}`); throw new Error(`HTTP error! status: ${response.status}`);
} }
}).catch(error => { }).catch(error => {
showToast(`Error sending slider value to ${url}: ${error}`, 'error');
console.error(`Error sending slider value to ${url}: ${error}`); console.error(`Error sending slider value to ${url}: ${error}`);
}); });
}, 500); }, 500);

161
firmware/html/bottom.js
View file

@ -225,7 +225,7 @@ function loadTCGraphData() {
//console.log('lowerIndex=' + lowerIndex); //console.log('lowerIndex=' + lowerIndex);
//console.log('upperIndex=' + upperIndex); //console.log('upperIndex=' + upperIndex);
if (lowerIndex === -1 || upperIndex === -1) { if (lowerIndex === -1 || upperIndex === -1) {
console.log("Warning: Current time not found in time array and not between two elements in time array. Fixing it..."); console.log("Error: Current time not found in time array and not between two elements in time array. Fixing it...");
lowerIndex = 0; lowerIndex = 0;
upperIndex = 1; upperIndex = 1;
var tmp1 = time[0].split(':'); var tmp1 = time[0].split(':');
@ -389,7 +389,6 @@ links.forEach(function(link) {
button.classList.add("pure-button-primary"); button.classList.add("pure-button-primary");
button.innerHTML = "OFF"; button.innerHTML = "OFF";
}, 2000); }, 2000);
showToast('Error while sending data to server.', 'error');
console.log('Error while sending data to server.'); console.log('Error while sending data to server.');
} }
} }
@ -438,7 +437,6 @@ links.forEach(function(link) {
button.classList.add("pure-button-primary"); button.classList.add("pure-button-primary");
button.innerHTML = "ON"; button.innerHTML = "ON";
}, 2000); }, 2000);
showToast('Error while sending data to server.', 'error');
console.log('Error while sending data to server.'); console.log('Error while sending data to server.');
} }
} }
@ -483,12 +481,25 @@ function createTable() {
tdMinute.id = "minute" + i; tdMinute.id = "minute" + i;
tr.appendChild(tdMinute); tr.appendChild(tdMinute);
for (var j = 1; j <=4; j++) // ch1
{ var tdCh1 = createSelectCell(100, 0, 1);
// chj_i tdCh1.id = "ch1_" + i;
var tdCh = createSlider("ch" + j + "_" + i, 100, 0, 1); tr.appendChild(tdCh1);
tr.appendChild(tdCh);
} // ch2
var tdCh2 = createSelectCell(100, 0, 1);
tdCh2.id = "ch2_" + i;
tr.appendChild(tdCh2);
// ch3
var tdCh3 = createSelectCell(100, 0, 1);
tdCh3.id = "ch3_" + i;
tr.appendChild(tdCh3);
// ch4
var tdCh4 = createSelectCell(100, 0, 1);
tdCh4.id = "ch4_" + i;
tr.appendChild(tdCh4);
table.appendChild(tr); table.appendChild(tr);
} }
@ -498,49 +509,7 @@ function createTable() {
container.classList.add("pure-form"); container.classList.add("pure-form");
container.appendChild(table); container.appendChild(table);
} }
function createSlider(id, max, value, step) {
// Create a new input element of type range
var input = document.createElement("input");
input.type = "range";
input.min = 0;
input.max = max;
input.step = step;
input.value = value;
input.classList.add("pure-slider-range");
// Change the color of the slider based on the id
if (id.startsWith("ch1_")) {
input.style.backgroundColor = "blue";
} else if (id.startsWith("ch2_")) {
input.style.backgroundColor = "orange";
} else if (id.startsWith("ch3_")) {
input.style.backgroundColor = "green";
} else if (id.startsWith("ch4_")) {
input.style.backgroundColor = "red";
}
div = document.createElement("div");
div.appendChild(input);
// Create a new span element to contain the value of the slider
var span = document.createElement("span");
span.innerHTML = "&nbsp;" + value + " %";
div.appendChild(span);
// Update the span element when the value of the slider changes
input.oninput = function() {
span.innerHTML = "&nbsp;" + this.value + " %";
};
// Create a new td element to contain the div element
var td = document.createElement("td");
td.id = id;
td.appendChild(div);
// Return the td element
return td;
}
function createSelectCell(max, value, step) { function createSelectCell(max, value, step) {
// Erstelle ein neues select-Element // Erstelle ein neues select-Element
var select = document.createElement("select"); var select = document.createElement("select");
@ -563,7 +532,7 @@ function createSelectCell(max, value, step) {
// Gib die Zelle zurück // Gib die Zelle zurück
return row; return row;
} }
function fillTableFromJson() { function fillTableFromJson() {
// Lade JSON-Daten // Lade JSON-Daten
fetch('http://{{IP_ADDRESS}}/tc_data_blocks_read') fetch('http://{{IP_ADDRESS}}/tc_data_blocks_read')
@ -575,18 +544,10 @@ function fillTableFromJson() {
var row = document.getElementById("hour" + (i+1)).parentNode; var row = document.getElementById("hour" + (i+1)).parentNode;
row.cells[0].childNodes[0].value = tcdata[i].hour; row.cells[0].childNodes[0].value = tcdata[i].hour;
row.cells[1].childNodes[0].value = tcdata[i].min; row.cells[1].childNodes[0].value = tcdata[i].min;
row.cells[2].childNodes[0].value = parseInt(Math.round(tcdata[i].ch1 * 100 / 255));
row.cells[2].childNodes[0].childNodes[0].value = parseInt(Math.round(tcdata[i].ch1 * 100 / 255)); row.cells[3].childNodes[0].value = parseInt(Math.round(tcdata[i].ch2 * 100 / 255));
row.cells[2].childNodes[0].childNodes[1].innerHTML = "&nbsp;" + row.cells[2].childNodes[0].childNodes[0].value + " %"; row.cells[4].childNodes[0].value = parseInt(Math.round(tcdata[i].ch3 * 100 / 255));
row.cells[5].childNodes[0].value = parseInt(Math.round(tcdata[i].ch4 * 100 / 255));
row.cells[3].childNodes[0].childNodes[0].value = parseInt(Math.round(tcdata[i].ch2 * 100 / 255));
row.cells[3].childNodes[0].childNodes[1].innerHTML = "&nbsp;" + row.cells[3].childNodes[0].childNodes[0].value + " %";
row.cells[4].childNodes[0].childNodes[0].value = parseInt(Math.round(tcdata[i].ch3 * 100 / 255));
row.cells[4].childNodes[0].childNodes[1].innerHTML = "&nbsp;" + row.cells[4].childNodes[0].childNodes[0].value + " %";
row.cells[5].childNodes[0].childNodes[0].value = parseInt(Math.round(tcdata[i].ch4 * 100 / 255));
row.cells[5].childNodes[0].childNodes[1].innerHTML = "&nbsp;" + row.cells[5].childNodes[0].childNodes[0].value + " %";
} }
loadTCGraphData(); loadTCGraphData();
@ -596,51 +557,26 @@ function fillTableFromJson() {
function createJsonFromTable() { function createJsonFromTable() {
var tableRows = document.querySelectorAll("table tr"); var tableRows = document.querySelectorAll("table tr");
var tcdata = []; var tcdata = [];
// Speichert die Zeitangaben (hour, minute) in einem Array
var timeArr = [];
for (var i = 1; i <= 10; i++) { for (var i = 1; i <= 10; i++) {
var row = document.getElementById("hour" + i).parentNode;
var hour = parseInt(row.cells[0].childNodes[0].value); var row = document.getElementById("hour" + i).parentNode;
var min = parseInt(row.cells[1].childNodes[0].value); var hour = parseInt(row.cells[0].childNodes[0].value);
timeArr.push(hour * 60 + min); // Speichert die Zeitangaben als Minuten seit Mitternacht var min = parseInt(row.cells[1].childNodes[0].value);
var ch1 = Math.round(parseInt(row.cells[2].childNodes[0].childNodes[0].value) * 2.55); var ch1 = Math.round(parseInt(row.cells[2].childNodes[0].value) * 2.55);
var ch2 = Math.round(parseInt(row.cells[3].childNodes[0].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].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].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});
tcdata.push({hour: hour, min: min, ch1: ch1, ch2: ch2, ch3: ch3, ch4: ch4});
} }
// Ü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]) {
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 currentTime = {hour: new Date().getHours(), min: new Date().getMinutes()};
var jsonData = {tcdata: tcdata, currenttime: currentTime}; var jsonData = {tcdata: tcdata, currenttime: currentTime};
//console.log("jsonData = " + JSON.stringify(jsonData)); //console.log("jsonData = " + JSON.stringify(jsonData));
return JSON.stringify(jsonData); return JSON.stringify(jsonData);
} }
function sendDataToServer() { function sendDataToServer() {
var jsonData = createJsonFromTable(); 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 urlEncodedData = encodeURIComponent(jsonData);
var url = 'http://{{IP_ADDRESS}}/tc_data_blocks_store?data=' + urlEncodedData; var url = 'http://{{IP_ADDRESS}}/tc_data_blocks_store?data=' + urlEncodedData;
var xhr = new XMLHttpRequest(); var xhr = new XMLHttpRequest();
@ -667,7 +603,6 @@ function sendDataToServer() {
button.classList.add("pure-button-primary"); button.classList.add("pure-button-primary");
button.innerHTML = "save"; button.innerHTML = "save";
}, 2000); }, 2000);
showToast('Error while sending timing control data to server.', 'error');
console.log('Error while sending data to server.'); console.log('Error while sending data to server.');
} }
} }
@ -675,25 +610,3 @@ function sendDataToServer() {
xhr.send(); xhr.send();
loadTCGraphData(); // update the tc data graph 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);
}
}

2
firmware/html/index_template_top.html
View file

@ -15,7 +15,6 @@
<body> <body>
<fieldset> <fieldset>
<h3>{{LIGHT_NAME}}</h3> <h3>{{LIGHT_NAME}}</h3>
<div class="toast"></div>
<div class="pure-form pure-form-aligned"> <div class="pure-form pure-form-aligned">
<div class="pure-controls"> <div class="pure-controls">
<a href="/update" class="pure-button">update</a> <a href="/update" class="pure-button">update</a>
@ -45,6 +44,7 @@
<br> <br>
<script src="http://{{IP_ADDRESS}}/js_top"> <script src="http://{{IP_ADDRESS}}/js_top">
</script> </script>
<br>
<table border=0> <table border=0>
<tr> <tr>
<td class="top-align"> <td class="top-align">

20
firmware/html/style.css
View file

@ -43,24 +43,4 @@ background-color: #333;
} }
.top-align { .top-align {
vertical-align: top; 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,7 +27,6 @@ links.forEach(function(link) {
button.classList.add("pure-button-primary"); button.classList.add("pure-button-primary");
button.innerHTML = "ON"; button.innerHTML = "ON";
}, 2000); }, 2000);
showToast('Error while sending data to server.', 'error');
console.log('Error while sending data to server.'); console.log('Error while sending data to server.');
} }
} }
@ -68,7 +67,6 @@ links.forEach(function(link) {
button.classList.add("pure-button-primary"); button.classList.add("pure-button-primary");
button.innerHTML = "OFF"; button.innerHTML = "OFF";
}, 2000); }, 2000);
showToast('Error while sending data to server.', 'error');
console.log('Error while sending data to server.'); console.log('Error while sending data to server.');
} }
} }
@ -94,7 +92,6 @@ function sendSliderValue(x) {
} }
//console.log(`Sent slider value ${value} to ${url}`); //console.log(`Sent slider value ${value} to ${url}`);
}).catch(error => { }).catch(error => {
showToast(`Error sending slider value to ${url}: ${error}`, 'error');
console.error(`Error sending slider value to ${url}: ${error}`); console.error(`Error sending slider value to ${url}: ${error}`);
}); });
}, 500); }, 500);

BIN
pic/schematics.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 439 KiB

After

Width:  |  Height:  |  Size: 458 KiB