<!DOCTYPE html>
<html>
<head>
<!-- Stilizovanje -->
<style type=text/css>
//voda {
text-align: center;
}
//detektcija{ text-align: center; }
h1{ text-align: center; }
</style>
<title>Pametna basta</title>
<!-- Potrebni fajlovi -->
<?php include skripte/funkcije.php; ?>
<link rel=stylesheet href=https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.
min.css>
<script src=https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.
js></script>
<meta charset=utf-8>
<meta http-equiv=X-UA-Compatible content=IE=edge>
<meta name=viewport content=width=device-width, initial-scale=1>
<!-- Skripta koja omogucava proveru statusa bez potrebe za osveavanjem stranice -->
<script type=text/javascript>
function proveriStatus(){
var timer = setInterval(function(){
$.ajax({
url: testuzmibastu.php,
dataType : json,
success: function(response) {
var status = response[status];
var voda = response[voda];
$(//voda).html(<div class=alert alert-success>Nivo vode u kanisteru je  +voda+
 %.</div>);
if (status==0) {
$(//detektcija).html(<div class=alert alert-success>Vlaznost zemljista je
normalna.</div>);
}
if (status==1){
$(//detektcija).html(<div class=alert alert-danger>Vlaznost zemljista ispod
normale! <br> Vreme detekcije: +response[senzor]+<br> Status sms-a: + response[smsodgovor]+
<br> Vreme slanja sms-a: +response[sms]+</div>); // buffers automatically
when created
document.getElementById(audio).play();
clearInterval(timer);
setTimeout(function(){
proveriStatus();
},1000);
}
}
})}, 1000)} ;
</script>
<!-- Upit koji vraca poslednju detekciju senzora -->
<?php
$sql=SELECT * FROM rpi;
$q=$mysqli->query($sql);
$red=$q->fetch_object();
$poslednjadetekcija = date(d/m/Y - H:i:s, $red->rpivremesenzor);
?>
</head>
<body onload=proveriStatus();>
<div class=container-fluid>
<div class=row>
<div class=col-lg-4 col-sm-4 col-xs-12></div>
<div class=col-lg-4 col-sm-4 col-xs-12>
<h1>Pametna basta</h1>
<audio id=audio controls=controls hidden>
<source src=mp3/pozar.mp3 type=audio/mp3>
Your browser does not support the audio element.
</audio>
<div class=alert alert-success id=poslednjadetekcija>Cvece je poslednji put zaliveno:
<?php echo $poslednjadetekcija; ?></div>
<div id=detektcija></div>
<div id=voda></div>
</div>
<div class=col-lg-4 col-sm-4 col-xs-12></div>
</div>
</div>
<script src=https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js></
script>
</body>
</html>