Skip to content

Commit 3fc7588

Browse files
CelliesProjectsCelliesProjects
committed
Fixed logs.
1 parent f584c6e commit 3fc7588

File tree

2 files changed

+534
-424
lines changed

2 files changed

+534
-424
lines changed

‎logs.htm

+46-27
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@
2121
html, body{
2222
margin:0 auto;
2323
text-align:center;
24-
//width:1024px;
24+
width:1024px;
2525
font-variant: small-caps;
2626
font-size:20px;
2727
font-family: monospace;
@@ -46,68 +46,70 @@
4646
#linkBar{
4747
background-color:aqua;
4848
}
49-
#title {
49+
#dateBar {
5050
text-transform: uppercase;
5151
}
5252
#graphContainer{
53-
width:1024px;
54-
margin:auto;
5553
}
5654
#editorCanvas{
55+
width:800px;
5756
background-color:darkgreen;
5857
border:solid 1px black;
5958
display:inline-block;
6059
float:left;
61-
margin:0;
6260
}
6361

6462
#fileList{
6563
overflow-y:auto;
66-
margin:10px;
6764
height:400px;
6865
border:solid 1px black;
66+
width:220px;
6967
}
7068
.logFile:hover{
71-
background-color:yellow;
7269
cursor:pointer;
7370
}
7471
</style>
7572
<script src="https://code.jquery.com/jquery-3.2.1.js"></script>
7673
<body>
77-
<p id="linkBar"><a class="systemLink" href="/">HOME</a></p>
78-
<h1 id="title">ESP8266-temp-server</h1>
74+
<div id="linkBar"><a class="systemLink" href="/">HOME</a></div>
75+
<h1 id="dateBar">ESP8266-temp-server</h1>
7976
<div id="graphContainer">
8077
<canvas class="" id="editorCanvas" width="800px" height="400px"></canvas>
8178
<div id="fileList"></div>
8279
</div>
80+
<div id="minMax"><p id="minimum">loading</p><p id="maximum">loading</p></div>
8381
<script>
84-
//const hostName = 'http://192.168.0.182'; //debug/develop
82+
//const hostName = 'http://192.168.0.100'; //debug/develop
8583
const hostName = '';
8684
$( document ).ready( function() {
8785
editorCanvas.width = editorCanvas.width;
88-
if ( hostName ) $('#title').append( '<p class="blink">!!!!!debug enabled!!!!!</p>');
86+
if ( hostName ) $('#dateBar').html( '<p class="blink">'+hostName+'</p>');
8987
$.get( hostName + '/files', function( data )
9088
{
9189
var fileArray = data.split('\n');
9290
fileArray.sort();
9391
for ( f = 0; f < fileArray.length; f++ )
9492
if ( fileArray[f].endsWith( '.log' ) ) $('#fileList').append( '<div class="logFile">'+ fileArray[f].substring( 1, 11 ) + "</div>" );
9593
if ( !$('.logFile').length )
96-
$('#loaderBox').html( "NO LOGS FOUND" );
94+
$('#graphContainer').html( "NO LOGS FOUND" );
9795
else
9896
{
99-
$('#loaderBox').hide();
100-
$('#editorCanvas, #sideBox, .controlBox').show();
10197
$('.logFile').last().click();
10298
}
10399
});
104100
});
105101
$('#fileList').on('click','.logFile',function()
106102
{
103+
var currentClicked = this;
104+
$('.logFile').css('background-color','white').css('color','black');
105+
$('#dateBar').html('LOADING '+$(this).text());
106+
$(currentClicked).css('color','grey').css('background-color','yellow');
107107
var url = hostName + "/" + $(this).text() + ".log";
108108
var timeVal=[];
109109
var tempVal=[];
110-
var maxTemp, minTemp;
110+
var maxGridTemp,minGridTemp,maxMeasurement,minMeasurement;
111+
$('#minimum, #maximum').html('&nbsp;');
112+
$('#minimum').text('LOADING '+$(this).text());
111113
$.get( url, function( data )
112114
{
113115
var measurements = data.split('\n');
@@ -127,31 +129,48 @@ <h1 id="title">ESP8266-temp-server</h1>
127129
}
128130
}
129131
});
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) )
132+
minMeasurement = Math.min.apply(null,tempVal)
133+
maxMeasurement = Math.max.apply(null,tempVal)
134+
$('#minimum').html("Minimum: "+minMeasurement+"&deg; -> ");
135+
$('#maximum').html("Maximum: "+maxMeasurement+"&deg; -> ");
136+
minGridTemp = Math.trunc(minMeasurement-1);
137+
maxGridTemp = Math.trunc(maxMeasurement+2);
138+
if(isNaN(minMeasurement)||isNaN(maxMeasurement))
134139
{
135140
const ctx = editorCanvas.getContext( "2d" );
136141
ctx.clearRect(0, 0, editorCanvas.width, editorCanvas.height);
137142
return;
138143
}
139-
drawBackground( minTemp, maxTemp);
140-
//draw the actual values
141-
var ctx = editorCanvas.getContext( "2d" );
144+
drawBackground( minGridTemp, maxGridTemp);
145+
var ctx = editorCanvas.getContext( "2d" ); /* draw the actual values */
142146
ctx.strokeStyle = 'rgba( 255, 0, 0, 1)';
143147
ctx.setLineDash([]);
144148
ctx.beginPath();
149+
var minSet = false;
150+
var maxSet = false;
145151
timeVal.forEach( function( item, index )
146152
{
147153
var x = map( item, 0, 86400, 0, editorCanvas.width );
148-
var y = map( tempVal[index], minTemp, maxTemp, editorCanvas.height, 0 );
154+
var y = map( tempVal[index], minGridTemp, maxGridTemp, editorCanvas.height, 0 );
155+
if ( tempVal[index] == minMeasurement&&!minSet)
156+
{
157+
$('#minimum').html($('#minimum').html()+" "+new Date(1000*item).toISOString().substr(11, 8));
158+
minSet = true;
159+
}
160+
if ( tempVal[index] == maxMeasurement&&!maxSet)
161+
{
162+
$('#maximum').html($('#maximum').html()+" "+new Date(1000*item).toISOString().substr(11, 8));
163+
maxSet = true;
164+
}
149165
ctx.lineTo( x, y );
150166
});
151167
ctx.stroke();
168+
$('.logFile').css('color','black');
169+
$(currentClicked).css('background-color','yellow').css('color','black');
170+
$('#dateBar').html($(currentClicked).text());
152171
});
153172
});
154-
function drawBackground(minTemp,maxTemp )
173+
function drawBackground(minGridTemp,maxGridTemp )
155174
{
156175
const opacity = 0.3;
157176
const lineDash = [ 2, 2 ];
@@ -178,12 +197,12 @@ <h1 id="title">ESP8266-temp-server</h1>
178197
ctx.stroke();
179198
ctx.beginPath();
180199
ctx.strokeStyle = 'rgba( 255,255,255, '+ opacity+ ')';
181-
for ( templine = minTemp; templine <= maxTemp; templine++ )
200+
for ( templine = minGridTemp; templine <= maxGridTemp; templine++ )
182201
{
183-
var y = map( templine, minTemp, maxTemp, editorCanvas.height, 0 );
202+
var y = map( templine, minGridTemp, maxGridTemp, editorCanvas.height, 0 );
184203
ctx.moveTo( 0, y );
185204
ctx.lineTo( editorCanvas.width, y );
186-
var tempstr = parseInt( map( y, 0, editorCanvas.height, maxTemp, minTemp ) );
205+
var tempstr = parseInt( map( y, 0, editorCanvas.height, maxGridTemp, minGridTemp ) );
187206
tempstr += "°";
188207
ctx.setLineDash([]);
189208
ctx.textBaseline="middle";

0 commit comments

Comments
 (0)