Initial Working Copy
This commit is contained in:
commit
0731843a82
357 changed files with 120880 additions and 0 deletions
357
html/sensor_pages/comms_cab.php
Normal file
357
html/sensor_pages/comms_cab.php
Normal file
|
|
@ -0,0 +1,357 @@
|
|||
|
||||
<html>
|
||||
<head>
|
||||
|
||||
|
||||
<meta charset="utf-8" />
|
||||
<link rel="apple-touch-icon" sizes="76x76" href="../mat-dashboard/assets/img/apple-icon.png">
|
||||
<link rel="icon" type="image/png" href="../mat-dashboard/assets/img/favicon.png">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
|
||||
<title>
|
||||
Sensor Stats
|
||||
</title>
|
||||
<meta content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0, shrink-to-fit=no' name='viewport' />
|
||||
<!-- Fonts and icons -->
|
||||
<link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Slab:400,700|Material+Icons" />
|
||||
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/latest/css/font-awesome.min.css">
|
||||
<!-- CSS Files -->
|
||||
<link href="../mat-dashboard/assets/css/material-dashboard.css?v=2.1.1" rel="stylesheet" />
|
||||
|
||||
|
||||
<!--<title>Bazza's Space</title>-->
|
||||
<!--<link href="css/bootstrap.css" rel="stylesheet" />-->
|
||||
|
||||
<!--https://getbootstrap.com/docs/4.3/utilities/shadows/-->
|
||||
</head>
|
||||
<body>
|
||||
<span style="display:none;">
|
||||
<?php
|
||||
$servername = "localhost";
|
||||
$username = "svcPHPAdmin";
|
||||
$password = "tgC3*&tghlRc";
|
||||
$dbname = "sensor";
|
||||
$fanstate = "";
|
||||
$btn = "";
|
||||
$curr_temp = 0;
|
||||
$curr_humidity = 0;
|
||||
|
||||
//Read gpio pin state
|
||||
unset($btn);
|
||||
$btn = system("gpio read 26"); // this line writes the value to the screen ???? WTF!!!
|
||||
if ($btn == 1){$fanstate = "OFF";}else{$fanstate = "ON";}
|
||||
|
||||
?>
|
||||
</span>
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<!--<h1 class="text-center text-primary">Bazza's Space</h1>-->
|
||||
<h1 class="text-center">Comms cabinet atmospheric data</h1>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
|
||||
<div class="col-lg-4 col-md-6 col-sm-6">
|
||||
<div class="card card-stats">
|
||||
<div class="card-header card-header-info card-header-icon">
|
||||
<div class="card-icon">
|
||||
<i class="material-icons">toys</i>
|
||||
</div>
|
||||
<p class="card-category">Fan State</p>
|
||||
<h3 class="card-title"><?php echo $fanstate;?></h3>
|
||||
</div>
|
||||
<!--
|
||||
<div class="card-footer">
|
||||
<div class="stats">
|
||||
<i class="material-icons">date_range</i> Last 24 Hours
|
||||
</div>
|
||||
</div>
|
||||
-->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="hidden">
|
||||
<?php
|
||||
// get the data from the DB for the following 2 cards
|
||||
// Create connection
|
||||
$conn = new mysqli($servername, $username, $password, $dbname);
|
||||
|
||||
// Check connection
|
||||
if ($conn->connect_error) {
|
||||
die("Connection failed: " . $conn->connect_error);
|
||||
}
|
||||
|
||||
$sql = "SELECT * FROM tblSENSOR_DATA WHERE SCODE = 'COMMS_CAB' ORDER BY ID DESC LIMIT 1";
|
||||
$result = $conn->query($sql);
|
||||
|
||||
if ($result->num_rows > 0)
|
||||
{
|
||||
// output data of each row
|
||||
while($row = $result->fetch_assoc())
|
||||
{
|
||||
$curr_temp = round($row["VALUE_1"],1);
|
||||
$curr_humidity = round($row["VALUE_2"],1);
|
||||
}
|
||||
}
|
||||
else
|
||||
{
|
||||
echo "No rows found";
|
||||
}
|
||||
|
||||
$conn->close();
|
||||
?>
|
||||
</div>
|
||||
|
||||
<div class="col-lg-4 col-md-6 col-sm-6">
|
||||
<div class="card card-stats">
|
||||
<div class="card-header card-header-info card-header-icon">
|
||||
<div class="card-icon">
|
||||
<i class="material-icons">warning</i>
|
||||
</div>
|
||||
<p class="card-category">Current Temperature</p>
|
||||
<h3 class="card-title"><?php echo $curr_temp;?>°C</h3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-lg-4 col-md-6 col-sm-6">
|
||||
<div class="card card-stats">
|
||||
<div class="card-header card-header-info card-header-icon">
|
||||
<div class="card-icon">
|
||||
<i class="material-icons">warning</i>
|
||||
</div>
|
||||
<p class="card-category">Current Humidity</p>
|
||||
<h3 class="card-title"><?php echo $curr_humidity;?>%</h3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div> <!-- class="row" -->
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<div class="card card-chart">
|
||||
<div class="card-header card-header-warning">
|
||||
<div class="ct-chart" id="TemperatureChart" style="height:25vh"></div>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<h4 class="card-title">Temperature Average</h4>
|
||||
<p class="card-category">Last 24 Hours</p>
|
||||
<!-- <div class="" style="height:20vh"></div> -->
|
||||
</div>
|
||||
<!--
|
||||
<div class="card-footer">
|
||||
<div class="stats">
|
||||
<i class="material-icons">access_time</i> campaign sent 2 days ago
|
||||
</div>
|
||||
</div>
|
||||
-->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<div class="card card-chart">
|
||||
<div class="card-header card-header-warning">
|
||||
<div class="ct-chart" id="HumidityChart" style="height:25vh"></div>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<h4 class="card-title">Humidity Average</h4>
|
||||
<p class="card-category">Last 24 Hours</p>
|
||||
<!-- <div class="" style="height:20vh"></div> -->
|
||||
</div>
|
||||
<!--
|
||||
<div class="card-footer">
|
||||
<div class="stats">
|
||||
<i class="material-icons">access_time</i> campaign sent 2 days ago
|
||||
</div>
|
||||
</div>
|
||||
-->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<table class="table table-hover">
|
||||
<thead class="thead-dark">
|
||||
<tr><td colspan=4>Last 24 hours</td></tr>
|
||||
<tr>
|
||||
<td>
|
||||
<b>Sensor</b>
|
||||
</td>
|
||||
<td>
|
||||
<b>Average</b>
|
||||
</td>
|
||||
<td>
|
||||
<b>Minimum</b>
|
||||
</td>
|
||||
<td>
|
||||
<b>Maximum</b>
|
||||
</td>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<?php
|
||||
//$servername = "localhost";
|
||||
//$username = "svcfan";
|
||||
//$password = "Tgh5^rtDBG";
|
||||
//$dbname = "fan_control";
|
||||
|
||||
|
||||
// Create connection
|
||||
$conn = new mysqli($servername, $username, $password, $dbname);
|
||||
|
||||
// Check connection
|
||||
if ($conn->connect_error) {
|
||||
die("Connection failed: " . $conn->connect_error);
|
||||
}
|
||||
|
||||
$sql = "select 'Temperature' AS Sensor,ROUND(avg(VALUE_1),1) AS Average,min(VALUE_1) AS Min,max(VALUE_1) AS Max
|
||||
from tblSENSOR_DATA
|
||||
where CREATED_DATE > curdate() + interval -1 day
|
||||
AND SCODE = 'COMMS_CAB'
|
||||
union
|
||||
select 'Humidity %' AS Sensor,ROUND(avg(VALUE_2),1) AS Average,min(VALUE_2) AS Min,max(VALUE_2) AS Max
|
||||
from tblSENSOR_DATA
|
||||
where CREATED_DATE > curdate() + interval -1 day
|
||||
AND SCODE = 'COMMS_CAB'";
|
||||
$result = $conn->query($sql);
|
||||
|
||||
if ($result->num_rows > 0) {
|
||||
// output data of each row
|
||||
while($row = $result->fetch_assoc()) {
|
||||
echo "<tr><td><b>" . $row["Sensor"] . "</b></td><td>" . round($row["Average"],1) . "</td><td>" . $row["Min"] . "</td><td>" . $row["Max"] . "</td></tr>";
|
||||
}
|
||||
} else {
|
||||
echo "<tr><td colspan=4>No rows found</td></tr>";
|
||||
}
|
||||
$conn->close();
|
||||
?>
|
||||
|
||||
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<!-- Core JS Files -->
|
||||
|
||||
<script src="../mat-dashboard/assets/js/core/jquery.min.js"></script>
|
||||
<script src="../mat-dashboard/assets/js/core/popper.min.js"></script>
|
||||
<script src="../mat-dashboard/assets/js/core/bootstrap-material-design.min.js"></script>
|
||||
<script src="../mat-dashboard/assets/js/plugins/perfect-scrollbar.jquery.min.js"></script>
|
||||
|
||||
<!-- Plugin for the momentJs -->
|
||||
<script src="../mat-dashboard/assets/js/plugins/moment.min.js"></script>
|
||||
<!-- Plugin for Sweet Alert -->
|
||||
<script src="../mat-dashboard/assets/js/plugins/sweetalert2.js"></script>
|
||||
<!-- Forms Validations Plugin -->
|
||||
<script src="../mat-dashboard/assets/js/plugins/jquery.validate.min.js"></script>
|
||||
<!-- Plugin for the Wizard, full documentation here: https://github.com/VinceG/twitter-bootstrap-wizard -->
|
||||
<script src="../mat-dashboard/assets/js/plugins/jquery.bootstrap-wizard.js"></script>
|
||||
<!-- Plugin for Select, full documentation here: http://silviomoreto.github.io/bootstrap-select -->
|
||||
<script src="../mat-dashboard/assets/js/plugins/bootstrap-selectpicker.js"></script>
|
||||
<!-- Plugin for the DateTimePicker, full documentation here: https://eonasdan.github.io/bootstrap-datetimepicker/ -->
|
||||
<script src="../mat-dashboard/assets/js/plugins/bootstrap-datetimepicker.min.js"></script>
|
||||
<!-- DataTables.net Plugin, full documentation here: https://datatables.net/ -->
|
||||
<script src="../mat-dashboard/assets/js/plugins/jquery.dataTables.min.js"></script>
|
||||
<!-- Plugin for Tags, full documentation here: https://github.com/bootstrap-tagsinput/bootstrap-tagsinputs -->
|
||||
<script src="../mat-dashboard/assets/js/plugins/bootstrap-tagsinput.js"></script>
|
||||
<!-- Plugin for Fileupload, full documentation here: http://www.jasny.net/bootstrap/javascript/#fileinput
|
||||
<script src="../mat-dashboard/assets/js/plugins/jasny-bootstrap.min.js"></script>-->
|
||||
<!-- Full Calendar Plugin, full documentation here: https://github.com/fullcalendar/fullcalendar
|
||||
<script src="../mat-dashboard/assets/js/plugins/fullcalendar.min.js"></script> -->
|
||||
<!-- Vector Map plugin, full documentation here: http://jvectormap.com/documentation/
|
||||
<script src="../mat-dashboard/assets/js/plugins/jquery-jvectormap.js"></script>-->
|
||||
<!-- Plugin for the Sliders, full documentation here: http://refreshless.com/nouislider/
|
||||
<script src="../mat-dashboard/assets/js/plugins/nouislider.min.js"></script>-->
|
||||
<!-- Include a polyfill for ES6 Promises (optional) for IE11, UC Browser and Android browser support SweetAlert -->
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/core-js/2.4.1/core.js"></script>
|
||||
<!-- Library for adding dinamically elements -->
|
||||
<script src="../mat-dashboard/assets/js/plugins/arrive.min.js"></script>
|
||||
<!-- Google Maps Plugin
|
||||
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_KEY_HERE"></script> -->
|
||||
<!-- Chartist JS -->
|
||||
<script src="../mat-dashboard/assets/js/plugins/chartist.min.js"></script>
|
||||
<!-- Notifications Plugin -->
|
||||
<script src="../mat-dashboard/assets/js/plugins/bootstrap-notify.js"></script>
|
||||
<!-- Control Center for Material Dashboard: parallax effects, scripts for the example pages etc -->
|
||||
<script src="../mat-dashboard/assets/js/material-dashboard.js?v=2.1.1" type="text/javascript"></script>
|
||||
|
||||
<!-- js for the sensor data -->
|
||||
<!--<script src="../mat-dashboard/assets/data/sensor.js"></script>-->
|
||||
|
||||
<script>
|
||||
$(document).ready(function()
|
||||
{
|
||||
// Javascript method's body can be found in mat-dashboard/assets/data/sensor.js
|
||||
//sensor.initDashboardPageCharts();
|
||||
//console.log("Before get command");
|
||||
//var tdata;
|
||||
$.get('http://10.0.0.140/data/comms_cab_data.php').done((tdata) =>
|
||||
{
|
||||
|
||||
//console.log("got through");
|
||||
//console.log(tdata);
|
||||
|
||||
//console.log("Parsed from JSON");
|
||||
var JSONObject = JSON.parse(tdata);
|
||||
//console.log(JSONObject);
|
||||
//console.log("Parsed from JSON - logging labels")
|
||||
//console.log(JSONObject["labels"]);
|
||||
|
||||
var tmin = Math.min.apply(null, JSONObject["series"]),
|
||||
tmax = Math.max.apply(null, JSONObject["series"]);
|
||||
|
||||
var dataTemperatureChart = {'labels':JSONObject.labels, 'series':[JSONObject.series[0]]};
|
||||
var dataHumidityChart = {'labels':JSONObject.labels, 'series':[JSONObject.series[1]]};
|
||||
|
||||
var optionsTemperatureChart =
|
||||
{
|
||||
axisX:
|
||||
{
|
||||
showGrid: false
|
||||
},
|
||||
low: tmin,
|
||||
high: tmax + 0.2,
|
||||
chartPadding:
|
||||
{
|
||||
top: 20,
|
||||
right: 0,
|
||||
bottom: 15,
|
||||
left: 0
|
||||
}
|
||||
};
|
||||
|
||||
var responsiveOptions = {
|
||||
lineSmooth: Chartist.Interpolation.cardinal({
|
||||
tension: 1
|
||||
}),
|
||||
low: tmin,
|
||||
high: tmax + 0.2,
|
||||
chartPadding: {
|
||||
top: 20,
|
||||
right: 0,
|
||||
bottom: 10,
|
||||
left: 0
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
var TemperatureChart = Chartist.Line('#TemperatureChart', dataTemperatureChart, optionsTemperatureChart, responsiveOptions);
|
||||
var HumidityChart = Chartist.Line('#HumidityChart', dataHumidityChart, optionsTemperatureChart, responsiveOptions);
|
||||
});
|
||||
});
|
||||
|
||||
</script>
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
366
html/sensor_pages/rpi.php
Normal file
366
html/sensor_pages/rpi.php
Normal file
|
|
@ -0,0 +1,366 @@
|
|||
<html>
|
||||
<head>
|
||||
|
||||
<meta charset="utf-8" />
|
||||
<link rel="apple-touch-icon" sizes="76x76" href="../mat-dashboard/assets/img/apple-icon.png">
|
||||
<link rel="icon" type="image/png" href="../mat-dashboard/assets/img/favicon.png">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
|
||||
<title>
|
||||
Sensor Stats
|
||||
</title>
|
||||
<meta content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0, shrink-to-fit=no' name='viewport' />
|
||||
<!-- Fonts and icons -->
|
||||
<link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Slab:400,700|Material+Icons" />
|
||||
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/latest/css/font-awesome.min.css">
|
||||
<!-- CSS Files -->
|
||||
<link href="../mat-dashboard/assets/css/material-dashboard.css?v=2.1.1" rel="stylesheet" />
|
||||
|
||||
|
||||
<!--<title>Bazza's Space</title>-->
|
||||
<!--<link href="css/bootstrap.css" rel="stylesheet" />-->
|
||||
|
||||
<!--https://getbootstrap.com/docs/4.3/utilities/shadows/-->
|
||||
</head>
|
||||
<body>
|
||||
<span style="display:none;">
|
||||
<?php
|
||||
$servername = "localhost";
|
||||
$username = "svcPHPAdmin";
|
||||
$password = "tgC3*&tghlRc";
|
||||
$dbname = "sensor";
|
||||
$temperature_colour = "bob";
|
||||
?>
|
||||
</span>
|
||||
|
||||
<nav class="navbar navbar-default" role="navigation-demo" id="demo-navbar">
|
||||
<div class="container">
|
||||
<a class="navbar-brand" href="www.bazzas.space">Bazzas Space</a>
|
||||
</div><!-- /.container-->
|
||||
</nav>
|
||||
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<!--<h1 class="text-center text-primary">Bazza's Space</h1>-->
|
||||
<h1 class="text-center">Raspberry Pi Temperature Data</h1>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="hidden">
|
||||
<?php
|
||||
// get the data from the DB for the following 2 cards
|
||||
// Create connection
|
||||
$conn = new mysqli($servername, $username, $password, $dbname);
|
||||
|
||||
// Check connection
|
||||
if ($conn->connect_error) {
|
||||
die("Connection failed: " . $conn->connect_error);
|
||||
}
|
||||
|
||||
$sql = "SELECT * FROM tblSENSOR_DATA WHERE SCODE = 'RPI4-A' ORDER BY ID DESC LIMIT 1";
|
||||
$result = $conn->query($sql);
|
||||
|
||||
if ($result->num_rows > 0)
|
||||
{
|
||||
// output data of each row
|
||||
while($row = $result->fetch_assoc())
|
||||
{
|
||||
$curr_temp = round($row["VALUE_1"],1);
|
||||
}
|
||||
}
|
||||
else
|
||||
{
|
||||
echo "No rows found";
|
||||
}
|
||||
|
||||
$conn->close();
|
||||
?>
|
||||
</div>
|
||||
<div class="col-lg-4 col-md-6 col-sm-6">
|
||||
<div class="card card-stats">
|
||||
|
||||
<?php
|
||||
switch(true)
|
||||
{
|
||||
case $curr_temp >= 70:
|
||||
echo "<div class='card-header card-header-danger card-header-icon'>";
|
||||
break;
|
||||
case $curr_temp >= 60:
|
||||
echo "<div class='card-header card-header-warning card-header-icon'>";
|
||||
break;
|
||||
default:
|
||||
echo "<div class='card-header card-header-success card-header-icon'>";
|
||||
break;
|
||||
|
||||
}
|
||||
|
||||
?>
|
||||
|
||||
<div class="card-icon">
|
||||
<i class="material-icons">warning</i>
|
||||
</div>
|
||||
<p class="card-category">Current Temperature</p>
|
||||
<h3 class="card-title"><?php echo $curr_temp;?>°C</h3>
|
||||
</div>
|
||||
<!--
|
||||
<div class="card-footer">
|
||||
<div class="stats">
|
||||
<i class="material-icons">date_range</i> Last 24 Hours
|
||||
</div>
|
||||
</div>
|
||||
-->
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<!--
|
||||
<div class="col-lg-4 col-md-6 col-sm-6">
|
||||
<div class="card card-stats">
|
||||
<div class="card-header card-header-info card-header-icon">
|
||||
<div class="card-icon">
|
||||
<i class="material-icons">warning</i>
|
||||
</div>
|
||||
<p class="card-category">Current Temperature</p>
|
||||
<h3 class="card-title"><?php echo $curr_temp;?>°C</h3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="col-lg-4 col-md-6 col-sm-6">
|
||||
<div class="card card-stats">
|
||||
<div class="card-header card-header-info card-header-icon">
|
||||
<div class="card-icon">
|
||||
<i class="material-icons">warning</i>
|
||||
</div>
|
||||
<p class="card-category">Current Humidity</p>
|
||||
<h3 class="card-title"><?php echo $curr_humidity;?>%</h3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
-->
|
||||
|
||||
</div> <!-- class="row" -->
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<div class="card card-chart">
|
||||
<div class="card-header card-header-warning">
|
||||
<div class="ct-chart" id="TemperatureChart" style="height:25vh"></div>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<h4 class="card-title">Temperature Average</h4>
|
||||
<p class="card-category">Last 24 Hours</p>
|
||||
<!-- <div class="" style="height:20vh"></div> -->
|
||||
</div>
|
||||
<!--
|
||||
<div class="card-footer">
|
||||
<div class="stats">
|
||||
<i class="material-icons">access_time</i> campaign sent 2 days ago
|
||||
</div>
|
||||
</div>
|
||||
-->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!--
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<div class="card card-chart">
|
||||
<div class="card-header card-header-warning">
|
||||
<div class="ct-chart" id="HumidityChart" style="height:25vh"></div>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<h4 class="card-title">Humidity Average</h4>
|
||||
<p class="card-category">Last 24 Hours</p>
|
||||
<!-- <div class="" style="height:20vh"></div>
|
||||
</div>
|
||||
<!--
|
||||
<div class="card-footer">
|
||||
<div class="stats">
|
||||
<i class="material-icons">access_time</i> campaign sent 2 days ago
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
-->
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<table class="table table-hover">
|
||||
<thead class="thead-dark">
|
||||
<tr><td colspan=4>Last 24 hours</td></tr>
|
||||
<tr>
|
||||
<td>
|
||||
<b>Sensor</b>
|
||||
</td>
|
||||
<td>
|
||||
<b>Average</b>
|
||||
</td>
|
||||
<td>
|
||||
<b>Minimum</b>
|
||||
</td>
|
||||
<td>
|
||||
<b>Maximum</b>
|
||||
</td>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<?php
|
||||
//$servername = "localhost";
|
||||
//$username = "svcfan";
|
||||
//$password = "Tgh5^rtDBG";
|
||||
//$dbname = "fan_control";
|
||||
|
||||
|
||||
// Create connection
|
||||
$conn = new mysqli($servername, $username, $password, $dbname);
|
||||
|
||||
// Check connection
|
||||
if ($conn->connect_error) {
|
||||
die("Connection failed: " . $conn->connect_error);
|
||||
}
|
||||
|
||||
$sql = "select 'Temperature' AS Sensor,ROUND(avg(VALUE_1),1) AS Average,min(VALUE_1) AS Min,max(VALUE_1) AS Max
|
||||
from tblSENSOR_DATA
|
||||
where CREATED_DATE > curdate() + interval -1 day
|
||||
AND SCODE = 'RPI4-A'";
|
||||
$result = $conn->query($sql);
|
||||
|
||||
if ($result->num_rows > 0) {
|
||||
// output data of each row
|
||||
while($row = $result->fetch_assoc()) {
|
||||
echo "<tr><td><b>" . $row["Sensor"] . "</b></td><td>" . round($row["Average"],1) . "</td><td>" . $row["Min"] . "</td><td>" . $row["Max"] . "</td></tr>";
|
||||
}
|
||||
} else {
|
||||
echo "<tr><td colspan=4>No rows found</td></tr>";
|
||||
}
|
||||
$conn->close();
|
||||
?>
|
||||
|
||||
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<!-- Core JS Files -->
|
||||
|
||||
<script src="../mat-dashboard/assets/js/core/jquery.min.js"></script>
|
||||
<script src="../mat-dashboard/assets/js/core/popper.min.js"></script>
|
||||
<script src="../mat-dashboard/assets/js/core/bootstrap-material-design.min.js"></script>
|
||||
<script src="../mat-dashboard/assets/js/plugins/perfect-scrollbar.jquery.min.js"></script>
|
||||
|
||||
<!-- Plugin for the momentJs -->
|
||||
<script src="../mat-dashboard/assets/js/plugins/moment.min.js"></script>
|
||||
<!-- Plugin for Sweet Alert -->
|
||||
<script src="../mat-dashboard/assets/js/plugins/sweetalert2.js"></script>
|
||||
<!-- Forms Validations Plugin -->
|
||||
<script src="../mat-dashboard/assets/js/plugins/jquery.validate.min.js"></script>
|
||||
<!-- Plugin for the Wizard, full documentation here: https://github.com/VinceG/twitter-bootstrap-wizard -->
|
||||
<script src="../mat-dashboard/assets/js/plugins/jquery.bootstrap-wizard.js"></script>
|
||||
<!-- Plugin for Select, full documentation here: http://silviomoreto.github.io/bootstrap-select -->
|
||||
<script src="../mat-dashboard/assets/js/plugins/bootstrap-selectpicker.js"></script>
|
||||
<!-- Plugin for the DateTimePicker, full documentation here: https://eonasdan.github.io/bootstrap-datetimepicker/ -->
|
||||
<script src="../mat-dashboard/assets/js/plugins/bootstrap-datetimepicker.min.js"></script>
|
||||
<!-- DataTables.net Plugin, full documentation here: https://datatables.net/ -->
|
||||
<script src="../mat-dashboard/assets/js/plugins/jquery.dataTables.min.js"></script>
|
||||
<!-- Plugin for Tags, full documentation here: https://github.com/bootstrap-tagsinput/bootstrap-tagsinputs -->
|
||||
<script src="../mat-dashboard/assets/js/plugins/bootstrap-tagsinput.js"></script>
|
||||
<!-- Plugin for Fileupload, full documentation here: http://www.jasny.net/bootstrap/javascript/#fileinput
|
||||
<script src="../mat-dashboard/assets/js/plugins/jasny-bootstrap.min.js"></script>-->
|
||||
<!-- Full Calendar Plugin, full documentation here: https://github.com/fullcalendar/fullcalendar
|
||||
<script src="../mat-dashboard/assets/js/plugins/fullcalendar.min.js"></script> -->
|
||||
<!-- Vector Map plugin, full documentation here: http://jvectormap.com/documentation/
|
||||
<script src="../mat-dashboard/assets/js/plugins/jquery-jvectormap.js"></script>-->
|
||||
<!-- Plugin for the Sliders, full documentation here: http://refreshless.com/nouislider/
|
||||
<script src="../mat-dashboard/assets/js/plugins/nouislider.min.js"></script>-->
|
||||
<!-- Include a polyfill for ES6 Promises (optional) for IE11, UC Browser and Android browser support SweetAlert -->
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/core-js/2.4.1/core.js"></script>
|
||||
<!-- Library for adding dinamically elements -->
|
||||
<script src="../mat-dashboard/assets/js/plugins/arrive.min.js"></script>
|
||||
<!-- Google Maps Plugin
|
||||
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_KEY_HERE"></script> -->
|
||||
<!-- Chartist JS -->
|
||||
<script src="../mat-dashboard/assets/js/plugins/chartist.min.js"></script>
|
||||
<!-- Notifications Plugin -->
|
||||
<script src="../mat-dashboard/assets/js/plugins/bootstrap-notify.js"></script>
|
||||
<!-- Control Center for Material Dashboard: parallax effects, scripts for the example pages etc -->
|
||||
<script src="../mat-dashboard/assets/js/material-dashboard.js?v=2.1.1" type="text/javascript"></script>
|
||||
|
||||
<!-- js for the sensor data -->
|
||||
<!--<script src="../mat-dashboard/assets/data/sensor.js"></script>-->
|
||||
|
||||
<script>
|
||||
$(document).ready(function()
|
||||
{
|
||||
// Javascript method's body can be found in mat-dashboard/assets/data/sensor.js
|
||||
//sensor.initDashboardPageCharts();
|
||||
//console.log("Before get command");
|
||||
//var tdata;
|
||||
$.get('http://10.0.0.140/data/rpi_data.php').done((tdata) =>
|
||||
{
|
||||
|
||||
//console.log("got through");
|
||||
//console.log(tdata);
|
||||
|
||||
//console.log("Parsed from JSON");
|
||||
var JSONObject = JSON.parse(tdata);
|
||||
//console.log(JSONObject);
|
||||
//console.log("Parsed from JSON - logging labels")
|
||||
//console.log(JSONObject["labels"]);
|
||||
|
||||
var tmin = Math.min.apply(null, JSONObject["series"]),
|
||||
tmax = Math.max.apply(null, JSONObject["series"]);
|
||||
|
||||
var dataTemperatureChart = {'labels':JSONObject.labels, 'series':[JSONObject.series[0]]};
|
||||
//var dataHumidityChart = {'labels':JSONObject.labels, 'series':[JSONObject.series[1]]};
|
||||
|
||||
var optionsTemperatureChart =
|
||||
{
|
||||
axisX:
|
||||
{
|
||||
showGrid: false
|
||||
},
|
||||
low: tmin,
|
||||
high: tmax + 0.2,
|
||||
chartPadding:
|
||||
{
|
||||
top: 20,
|
||||
right: 0,
|
||||
bottom: 15,
|
||||
left: 0
|
||||
}
|
||||
};
|
||||
|
||||
var responsiveOptions = {
|
||||
lineSmooth: Chartist.Interpolation.cardinal({
|
||||
tension: 1
|
||||
}),
|
||||
low: tmin,
|
||||
high: tmax + 0.2,
|
||||
chartPadding: {
|
||||
top: 20,
|
||||
right: 0,
|
||||
bottom: 10,
|
||||
left: 0
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
var TemperatureChart = Chartist.Line('#TemperatureChart', dataTemperatureChart, optionsTemperatureChart, responsiveOptions);
|
||||
//var HumidityChart = Chartist.Line('#HumidityChart', dataHumidityChart, optionsTemperatureChart, responsiveOptions);
|
||||
});
|
||||
});
|
||||
|
||||
</script>
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
225
html/sensor_pages/sensor_home.html
Normal file
225
html/sensor_pages/sensor_home.html
Normal file
|
|
@ -0,0 +1,225 @@
|
|||
<!doctype html>
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<link rel="icon" type="image/png" href="../assets/paper_img/favicon.ico">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
|
||||
|
||||
<title>Sensors Home</title>
|
||||
|
||||
<meta content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0' name='viewport' />
|
||||
<meta name="viewport" content="width=device-width" />
|
||||
|
||||
<link href="../bootstrap3/css/bootstrap.css" rel="stylesheet" />
|
||||
<link href="../assets/css/ct-paper.css" rel="stylesheet"/>
|
||||
<!--<link href="../assets/css/demo.css" rel="stylesheet" /> -->
|
||||
<link href="../assets/css/examples.css" rel="stylesheet" />
|
||||
|
||||
<!-- Fonts and icons -->
|
||||
<link href="http://maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">
|
||||
<link href='http://fonts.googleapis.com/css?family=Montserrat' rel='stylesheet' type='text/css'>
|
||||
<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,300' rel='stylesheet' type='text/css'>
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
|
||||
<nav class="navbar navbar-default" role="navigation-demo" id="demo-navbar">
|
||||
<div class="container">
|
||||
<!-- Brand and toggle get grouped for better mobile display
|
||||
<div class="navbar-header">
|
||||
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navigation-example-2">
|
||||
<span class="sr-only">Toggle navigation</span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
</button>
|
||||
<a class="navbar-brand" href="www.creative-tim.com">Creative Tim</a>
|
||||
</div>
|
||||
-->
|
||||
<a class="navbar-brand" href="www.bazzas.space">Bazzas Space</a>
|
||||
|
||||
<!-- Collect the nav links, forms, and other content for toggling
|
||||
<div class="collapse navbar-collapse" id="navigation-example-2">
|
||||
<ul class="nav navbar-nav navbar-right">
|
||||
<li>
|
||||
<a href="#" class="btn btn-simple">Components</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#" class="btn btn-simple">Tutorial</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#" target="_blank" class="btn btn-simple"><i class="fa fa-twitter"></i></a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#" target="_blank" class="btn btn-simple"><i class="fa fa-facebook"></i></a>
|
||||
</li>
|
||||
</ul>
|
||||
</div><!-- /.navbar-collapse -->
|
||||
|
||||
</div><!-- /.container-->
|
||||
</nav>
|
||||
<!--
|
||||
<div class="alert alert-danger landing-alert">
|
||||
<div class="container text-center">
|
||||
<h5>Available sensors</h5>
|
||||
</div>
|
||||
</div>
|
||||
-->
|
||||
<div class="wrapper">
|
||||
<div class="landing-header" style="background-image: url('../assets/images/img-sensors.jpg');">
|
||||
<div class="container">
|
||||
<div class="motto">
|
||||
<h1 class="title-uppercase">Sensor Page</h1>
|
||||
<br />
|
||||
</div>
|
||||
<div>
|
||||
<a href="../sensor_pages/comms_cab.php" class="btn">Comms Cabinet</a><br/>
|
||||
<a href="../sensor_pages/rpi.php" class="btn">Raspberry Pi's</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="main">
|
||||
<div class="section text-center landing-section">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-8 col-md-offset-2">
|
||||
<h2>Let's talk product</h2>
|
||||
<h5>This is the paragraph where you can write more details about your product. Keep you user engaged by providing meaningful information. Remember that by this time, the user is curious, otherwise he wouldn't scroll to get here. Add a button if you want the user to see more.</h5>
|
||||
<br />
|
||||
<a href="#" class="btn btn-danger btn-fill">See Details</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--
|
||||
<div class="section section-light-brown landing-section">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-4 column">
|
||||
<h4>First Attribute</h4>
|
||||
<p>Divide details about your product or agency work into parts. Write a few lines about each one. A paragraph describing a feature will be enough.</p>
|
||||
<a class="btn btn-danger btn-simple" href="#">See more <i class="fa fa-chevron-right"></i></a>
|
||||
</div>
|
||||
<div class="col-md-4 column">
|
||||
<h4>Second Attribute</h4>
|
||||
<p>Divide details about your product or agency work into parts. Write a few lines about each one. A paragraph describing a feature will be enough.</p>
|
||||
<a class="btn btn-danger btn-simple" href="#">See more <i class="fa fa-chevron-right"></i></a>
|
||||
</div>
|
||||
<div class="col-md-4 column">
|
||||
<h4>Third Attribute</h4>
|
||||
<p>Divide details about your product or agency work into parts. Write a few lines about each one. A paragraph describing a feature will be enough.</p>
|
||||
<a class="btn btn-danger btn-simple" href="#">See more <i class="fa fa-chevron-right"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="section section-dark text-center landing-section">
|
||||
<div class="container">
|
||||
<h2>Let's talk about us</h2>
|
||||
<div class="col-md-4">
|
||||
<div class="team-player">
|
||||
<img src="../assets/paper_img/chet_faker_2.jpg" alt="Thumbnail Image" class="img-circle img-responsive">
|
||||
<h5>Chet Faker <br /><small class="text-muted">Music</small></h5>
|
||||
<p>You can write here details about one of your team members. You can give more details about what they do. Feel free to add some <a href="#">links</a> for people to be able to follow them outside the site.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<div class="team-player">
|
||||
<img src="../assets/paper_img/flume.jpg" alt="Thumbnail Image" class="img-circle img-responsive">
|
||||
<h5>Flume <br /><small class="text-muted">Production</small></h5>
|
||||
<p>You can write here details about one of your team members. You can give more details about what they do. Feel free to add some <a href="#">links</a> for people to be able to follow them outside the site.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<div class="team-player">
|
||||
<img src="../assets/paper_img/banks.jpg" alt="Thumbnail Image" class="img-circle img-circle img-responsive">
|
||||
<h5>Banks <br /><small class="text-muted">Music</small></h5>
|
||||
<p>You can write here details about one of your team members. You can give more details about what they do. Feel free to add some <a href="#">links</a> for people to be able to follow them outside the site.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="section landing-section">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-8 col-md-offset-2">
|
||||
<h2 class="text-center">Keep in touch?</h2>
|
||||
<form class="contact-form">
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<label>Name</label>
|
||||
<input class="form-control" placeholder="Name">
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<label>Email</label>
|
||||
<input class="form-control" placeholder="Email">
|
||||
</div>
|
||||
</div>
|
||||
<label>Message</label>
|
||||
<textarea class="form-control" rows="4" placeholder="Tell us your thoughts and feelings..."></textarea>
|
||||
<div class="row">
|
||||
<div class="col-md-4 col-md-offset-4">
|
||||
<button class="btn btn-danger btn-block btn-lg btn-fill">Send Message</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
-->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<footer class="footer-demo section-dark">
|
||||
<div class="container">
|
||||
<nav class="pull-left">
|
||||
<ul>
|
||||
|
||||
<li>
|
||||
<!-- <a href="http://www.creative-tim.com">
|
||||
Creative Tim
|
||||
</a> -->
|
||||
</li>
|
||||
<li>
|
||||
<!--
|
||||
<a href="http://blog.creative-tim.com">
|
||||
Blog
|
||||
</a>
|
||||
-->
|
||||
</li>
|
||||
<li>
|
||||
<!--
|
||||
<a href="http://www.creative-tim.com/product/rubik">
|
||||
Licenses
|
||||
</a>
|
||||
-->
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
<div class="copyright pull-right">
|
||||
© 2020, B. Roberts
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
</body>
|
||||
|
||||
<script src="../assets/js/jquery-1.10.2.js" type="text/javascript"></script>
|
||||
<script src="../assets/js/jquery-ui-1.10.4.custom.min.js" type="text/javascript"></script>
|
||||
|
||||
<script src="../bootstrap3/js/bootstrap.js" type="text/javascript"></script>
|
||||
|
||||
<!-- Plugins -->
|
||||
<script src="../assets/js/ct-paper-checkbox.js"></script>
|
||||
<script src="../assets/js/ct-paper-radio.js"></script>
|
||||
<script src="../assets/js/bootstrap-select.js"></script>
|
||||
<script src="../assets/js/bootstrap-datepicker.js"></script>
|
||||
|
||||
<script src="../assets/js/ct-paper.js"></script>
|
||||
|
||||
</html>
|
||||
Loading…
Add table
Add a link
Reference in a new issue