Skip to content
GitLab
Projects
Groups
Snippets
/
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Sign in
Toggle navigation
Menu
Open sidebar
co2ampel
ampel-firmware
Commits
71c2cc97
Commit
71c2cc97
authored
Feb 17, 2022
by
Eric Duminil
Browse files
Done
parent
a68f5b32
Pipeline
#5854
passed with stage
in 2 minutes and 24 seconds
Changes
1
Pipelines
1
Hide whitespace changes
Inline
Side-by-side
ampel-firmware/web_server.cpp
View file @
71c2cc97
...
...
@@ -29,7 +29,6 @@ namespace web_server {
void
handleWebServerCSV
();
void
definePages
()
{
//TODO: Remove all "\n" to save some space
header_template
=
PSTR
(
"<!doctype html><html lang=en>"
"<head>"
...
...
@@ -115,51 +114,51 @@ namespace web_server {
script_template
=
PSTR
(
"<a href='https://transfer.hft-stuttgart.de/gitlab/co2ampel/ampel-firmware' target='_blank'>Source code</a>
\n
"
"<a href='https://transfer.hft-stuttgart.de/gitlab/co2ampel/ampel-documentation' target='_blank'>Documentation</a>
\n
"
"<script>
\n
"
"document.body.style.cursor = 'default';
\n
"
"fetch('%s',{credentials:'include'})
\n
"
".then(response=>response.text())
\n
"
".then(csvText=>csvToTable(csvText))
\n
"
".then(htmlTable=>addLogTableToPage(htmlTable))
\n
"
".then(_=>Plotly.newPlot('graph',data,layout,{displaylogo:false}))
\n
"
".catch(e=>console.error(e));
\n
"
"xs=[];
\n
"
"data=[{x:xs,y:[],type:'scatter',name:'CO<sub>2</sub>',line:{color:'#2ca02c'}},
\n
"
"{x:xs,y:[],type:'scatter',name:'Temperature',yaxis:'y2',line:{color:'#ff7f0e',dash:'dot'}},
\n
"
"{x:xs,y:[],type:'scatter',name:'Humidity',yaxis:'y3',line:{color:'#1f77b4',dash:'dot'}}];
\n
"
"layout={height:600,title:'%s',legend:{xanchor:'right',x:0.2,y:1.0},
\n
"
"xaxis:{domain:[0.0,0.85]},yaxis:{ticksuffix:'ppm',range:[0,2000],dtick:200},
\n
"
"yaxis2:{overlaying:'y',side:'right',ticksuffix:'°C',position:0.9,anchor:'free',range:[0,30],dtick:3},
\n
"
"yaxis3:{overlaying:'y',side:'right',ticksuffix:'%%',position:0.95,anchor:'free',range:[0,100],dtick:10}
\n
"
"};
\n
"
"function csvToTable(csvText)
{
\n
"
"csvText=csvText.trim();
\n
"
"lines=csvText.split('
\\
n');
\n
"
"table=document.createElement('table');
\n
"
"table.className='pure-table-striped';
\n
"
"n=lines.length;
\n
"
"lines.forEach((line,i)=>{
\n
"
"fields=line.split(';');
\n
"
"<a href='https://transfer.hft-stuttgart.de/gitlab/co2ampel/ampel-firmware' target='_blank'>Source code</a>"
"<a href='https://transfer.hft-stuttgart.de/gitlab/co2ampel/ampel-documentation' target='_blank'>Documentation</a>"
"<script>"
"document.body.style.cursor = 'default';"
"fetch('%s',{credentials:'include'})"
".then(response=>response.text())"
".then(csvText=>csvToTable(csvText))"
".then(htmlTable=>addLogTableToPage(htmlTable))"
".then(_=>Plotly.newPlot('graph',data,layout,{displaylogo:false}))"
".catch(e=>console.error(e));"
"xs=[];"
"data=[{x:xs,y:[],type:'scatter',name:'CO<sub>2</sub>',line:{color:'#2ca02c'}},"
"{x:xs,y:[],type:'scatter',name:'Temperature',yaxis:'y2',line:{color:'#ff7f0e',dash:'dot'}},"
"{x:xs,y:[],type:'scatter',name:'Humidity',yaxis:'y3',line:{color:'#1f77b4',dash:'dot'}}];"
"layout={height:600,title:'%s',legend:{xanchor:'right',x:0.2,y:1.0},"
"xaxis:{domain:[0.0,0.85]},yaxis:{ticksuffix:'ppm',range:[0,2000],dtick:200},"
"yaxis2:{overlaying:'y',side:'right',ticksuffix:'°C',position:0.9,anchor:'free',range:[0,30],dtick:3},"
"yaxis3:{overlaying:'y',side:'right',ticksuffix:'%%',position:0.95,anchor:'free',range:[0,100],dtick:10}"
"};"
"function csvToTable(csvText)
{
"
"csvText=csvText.trim();"
"lines=csvText.split('
\\
n');"
"table=document.createElement('table');"
"table.className='pure-table-striped';"
"n=lines.length;"
"lines.forEach((line,i)=>{"
"fields=line.split(';');"
//Don't display points without time
"if (!fields[0].includes('1970-')){"
"xs.push(fields[0]);
\n
"
"data[0]['y'].push(fields[1]);
\n
"
"data[1]['y'].push(fields[2]);
\n
"
"data[2]['y'].push(fields[3]);
\n
"
"xs.push(fields[0]);"
"data[0]['y'].push(fields[1]);"
"data[1]['y'].push(fields[2]);"
"data[2]['y'].push(fields[3]);"
"};"
"if(i>4 && i<n-12){if(i==5){fields=['...','...','...','...']}else{return;}}
\n
"
"row=document.createElement('tr');
\n
"
"fields.forEach((field,index)=>{
\n
"
"cell=document.createElement(i<2?'th':'td');
\n
"
"cell.appendChild(document.createTextNode(field));
\n
"
"row.appendChild(cell);});
\n
"
"table.appendChild(row);});
\n
"
"return table;}
\n
"
"function addLogTableToPage(table){document.getElementById('log').appendChild(table);}
\n
"
"</script>
\n
"
"</body>
\n
"
"if(i>4 && i<n-12){if(i==5){fields=['...','...','...','...']}else{return;}}"
"row=document.createElement('tr');"
"fields.forEach((field,index)=>{"
"cell=document.createElement(i<2?'th':'td');"
"cell.appendChild(document.createTextNode(field));"
"row.appendChild(cell);});"
"table.appendChild(row);});"
"return table;}"
"function addLogTableToPage(table){document.getElementById('log').appendChild(table);}"
"</script>"
"</body>"
"</html>"
);
// Web-server
...
...
@@ -195,7 +194,7 @@ namespace web_server {
//NOTE: Splitting in multiple parts in order to use less RAM. Higher than 2000 apparently crashes the ESP8266
char
content
[
2000
];
// Current size (with Lorawan):
//
INFO - Header size : 182
5
- Body size : 2005 - Script size : 194
7
// INFO - Header size : 182
6
- Body size : 2005 - Script size : 19
0
4
//FIXME: Body too long with Lorawan! Split in 4 parts?
snprintf_P
(
content
,
sizeof
(
content
),
header_template
,
sensor
::
co2
,
config
::
ampel_name
(),
wifi
::
local_ip
,
...
...
Write
Preview
Supports
Markdown
0%
Try again
or
attach a new file
.
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment