Skip to content

Commit e3db01c

Browse files
CelliesProjectsCelliesProjects
committed
Fixed background not properly mapped.
A lot of formatting.
1 parent 477a22a commit e3db01c

File tree

1 file changed

+67
-79
lines changed

1 file changed

+67
-79
lines changed

‎logs.htm‎

Lines changed: 67 additions & 79 deletions
Original file line numberDiff line numberDiff line change
@@ -11,12 +11,12 @@
1111
}
1212
.blink{
1313
color:red;
14-
text-decoration: blink;
15-
-webkit-animation-name: blinker;
16-
-webkit-animation-duration: 0.6s;
17-
-webkit-animation-iteration-count:infinite;
18-
-webkit-animation-timing-function:ease-in-out;
19-
-webkit-animation-direction: alternate;
14+
text-decoration: blink;
15+
-webkit-animation-name: blinker;
16+
-webkit-animation-duration: 0.6s;
17+
-webkit-animation-iteration-count:infinite;
18+
-webkit-animation-timing-function:ease-in-out;
19+
-webkit-animation-direction: alternate;
2020
}
2121
html, body{
2222
margin:0 auto;
@@ -71,98 +71,86 @@
7171
background-color:yellow;
7272
cursor:pointer;
7373
}
74-
.controlBox{
75-
margin: 10px;
76-
background-color: antiquewhite;
77-
font-size: initial;
78-
overflow:hidden;
79-
display:none;
80-
}
8174
</style>
8275
<script src="https://code.jquery.com/jquery-3.2.1.js"></script>
8376
<body>
8477
<p id="linkBar"><a class="systemLink" href="/">HOME</a></p>
8578
<h1 id="hostName">ESP8266-temp-server</h1>
8679
<div id="graphContainer">
8780
<canvas class="" id="editorCanvas" width="800px" height="400px"></canvas>
88-
<div id="fileList" class=" controlBox"></div>
81+
<div id="fileList"></div>
8982
</div>
9083
<script>
91-
//const hostName = 'http://192.168.0.182'; //debug/develop
92-
const hostName = '';
93-
84+
const hostName = 'http://192.168.0.182'; //debug/develop
85+
//const hostName = '';
9486
$( document ).ready( function() {
95-
editorCanvas.width = editorCanvas.width;
96-
if ( hostName ) $('#hostName').append( '<p class="blink">!!!!!debug enabled!!!!!</p>');
97-
$.get( hostName + '/files', function( data )
87+
editorCanvas.width = editorCanvas.width;
88+
if ( hostName ) $('#hostName').append( '<p class="blink">!!!!!debug enabled!!!!!</p>');
89+
$.get( hostName + '/files', function( data )
90+
{
91+
var fileArray = data.split('\n');
92+
fileArray.sort();
93+
for ( f = 0; f < fileArray.length; f++ )
94+
if ( fileArray[f].endsWith( '.log' ) ) $('#fileList').append( '<div class="logFile">'+ fileArray[f].substring( 1, 11 ) + "</div>" );
95+
if ( !$('.logFile').length )
96+
$('#loaderBox').html( "NO LOGS FOUND" );
97+
else
9898
{
99-
var fileArray = data.split('\n');
100-
fileArray.sort();
101-
for ( f = 0; f < fileArray.length; f++ )
102-
{
103-
if ( fileArray[f].endsWith( '.log' ) ) $('#fileList').append( '<div class="logFile">'+ fileArray[f].substring( 1, 11 ) + "</div>" );
104-
}
105-
if ( !$('.logFile').length )
106-
$('#loaderBox').html( "NO LOGS FOUND" );
107-
else
108-
{
109-
$('#loaderBox').hide();
110-
$('#editorCanvas, #sideBox, .controlBox').show();
111-
$('.logFile').last().click();
112-
}
113-
});
99+
$('#loaderBox').hide();
100+
$('#editorCanvas, #sideBox, .controlBox').show();
101+
$('.logFile').last().click();
102+
}
103+
});
114104
});
115-
116105
$('#fileList').on('click','.logFile',function()
117106
{
118-
var url = hostName + "/" + $(this).text() + ".log";
119-
var timeVal=[];
120-
var tempVal=[];
121-
var maxTemp, minTemp;
122-
$.get( url, function( data )
107+
var url = hostName + "/" + $(this).text() + ".log";
108+
var timeVal=[];
109+
var tempVal=[];
110+
var maxTemp, minTemp;
111+
$.get( url, function( data )
112+
{
113+
var measurements = data.split('\n');
114+
measurements.forEach( function( item, index )
123115
{
124-
var measurements = data.split('\n');
125-
measurements.forEach( function( item, index )
126-
{
127-
if (item)
128-
{
129-
var temp = item.split(',');
130-
if ( temp[0] && temp[1] && temp[1].length < 8 )
131-
{
132-
var date = new Date( parseInt(temp[0]) * 1000 );
133-
var secondsToday = date.getHours() * 3600;
134-
secondsToday += date.getMinutes() * 60;
135-
secondsToday += date.getSeconds();
136-
timeVal.push(secondsToday);
137-
tempVal.push(parseFloat(temp[1]));
138-
}
139-
}
140-
});
141-
maxTemp = Math.max.apply(null,tempVal) + 1;
142-
minTemp = Math.min.apply(null,tempVal) - 1;
143-
//console.log("min:"+minTemp + " max:"+maxTemp)
144-
if ( isNaN(minTemp) || isNaN(maxTemp) )
116+
if (item)
117+
{
118+
var temp = item.split(',');
119+
if ( temp[0] && temp[1] && temp[1].length < 8 )
145120
{
146-
const ctx = editorCanvas.getContext( "2d" );
147-
ctx.clearRect(0, 0, editorCanvas.width, editorCanvas.height);
148-
return;
121+
var date = new Date( parseInt(temp[0]) * 1000 );
122+
var secondsToday = date.getHours() * 3600;
123+
secondsToday += date.getMinutes() * 60;
124+
secondsToday += date.getSeconds();
125+
timeVal.push(secondsToday);
126+
tempVal.push(parseFloat(temp[1]));
149127
}
150-
drawBackground( minTemp, maxTemp);
151-
//draw the actual values
152-
var ctx = editorCanvas.getContext( "2d" );
153-
ctx.strokeStyle = 'rgba( 255, 0, 0, 1)';
154-
ctx.setLineDash([]);
155-
ctx.beginPath();
156-
timeVal.forEach( function( item, index )
157-
{
158-
var x = map( item, 0, 86400, 0, editorCanvas.width );
159-
var y = map( tempVal[index], minTemp, maxTemp, editorCanvas.height, 0 );
160-
ctx.lineTo( x, y );
161-
});
162-
ctx.stroke();
128+
}
129+
});
130+
maxTemp = Math.trunc( Math.max.apply(null,tempVal) + 2 );
131+
minTemp = Math.trunc( Math.min.apply(null,tempVal) - 2 );
132+
//console.log("min:"+minTemp + " max:"+maxTemp)
133+
if ( isNaN(minTemp) || isNaN(maxTemp) )
134+
{
135+
const ctx = editorCanvas.getContext( "2d" );
136+
ctx.clearRect(0, 0, editorCanvas.width, editorCanvas.height);
137+
return;
138+
}
139+
drawBackground( minTemp, maxTemp);
140+
//draw the actual values
141+
var ctx = editorCanvas.getContext( "2d" );
142+
ctx.strokeStyle = 'rgba( 255, 0, 0, 1)';
143+
ctx.setLineDash([]);
144+
ctx.beginPath();
145+
timeVal.forEach( function( item, index )
146+
{
147+
var x = map( item, 0, 86400, 0, editorCanvas.width );
148+
var y = map( tempVal[index], minTemp, maxTemp, editorCanvas.height, 0 );
149+
ctx.lineTo( x, y );
163150
});
151+
ctx.stroke();
152+
});
164153
});
165-
166154
function drawBackground(minTemp,maxTemp )
167155
{
168156
const opacity = 0.3;

0 commit comments

Comments
 (0)