%PDF-
%PDF-
Mini Shell
Mini Shell
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<link rel="icon" href="../../favicon.ico">
<title>Spotřeba</title>
<!-- Bootstrap core CSS -->
<link href="./css/bootstrap.min.css" rel="stylesheet">
<!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
<script type="application/javascript">
/*!
* IE10 viewport hack for Surface/desktop Windows 8 bug
* Copyright 2014 Twitter, Inc.
* Licensed under the Creative Commons Attribution 3.0 Unported License. For
* details, see http://creativecommons.org/licenses/by/3.0/.
*/
// See the Getting Started docs for more information:
// http://getbootstrap.com/getting-started/#support-ie10-width
(function () {
'use strict';
if (navigator.userAgent.match(/IEMobile\/10\.0/)) {
var msViewportStyle = document.createElement('style')
msViewportStyle.appendChild(
document.createTextNode(
'@-ms-viewport{width:auto!important}'
)
)
document.querySelector('head').appendChild(msViewportStyle)
}
})();
</script>
<style type="text/css">
#content {
margin:0px;padding:0px;
width:100%;
border:1px solid #000000;
-moz-border-radius-bottomleft:5px;
-webkit-border-bottom-left-radius:5px;
border-bottom-left-radius:5px;
-moz-border-radius-bottomright:5px;
-webkit-border-bottom-right-radius:5px;
border-bottom-right-radius:5px;
-moz-border-radius-topright:5px;
-webkit-border-top-right-radius:5px;
border-top-right-radius:5px;
-moz-border-radius-topleft:5px;
-webkit-border-top-left-radius:5px;
border-top-left-radius:5px;
}
#content table{
border-collapse: collapse;
border-spacing: 0;
width:100%;
height:100%;
margin:0px;padding:0px;
}
#content tr:last-child td:last-child {
-moz-border-radius-bottomright:5px;
-webkit-border-bottom-right-radius:5px;
border-bottom-right-radius:5px;
}
#content table tr:first-child td:first-child {
-moz-border-radius-topleft:5px;
-webkit-border-top-left-radius:5px;
border-top-left-radius:5px;
}
#content table tr:first-child td:last-child {
-moz-border-radius-topright:5px;
-webkit-border-top-right-radius:5px;
border-top-right-radius:5px;
}
#content tr:last-child td:first-child{
-moz-border-radius-bottomleft:5px;
-webkit-border-bottom-left-radius:5px;
border-bottom-left-radius:5px;
}
#content tr:hover td{
background-color:#ffffff;
}
#content td{
vertical-align:middle;
background:-o-linear-gradient(bottom, #ffaa56 5%, #ffffff 100%); background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ffaa56), color-stop(1, #ffffff) );
background:-moz-linear-gradient( center top, #ffaa56 5%, #ffffff 100% );
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffaa56", endColorstr="#ffffff"); background: -o-linear-gradient(top,#ffaa56,ffffff);
background-color:#ffaa56;
border:1px solid #000000;
border-width:0px 1px 1px 0px;
text-align:left;
padding:7px;
font-size:10px;
font-family:Arial;
font-weight:normal;
color:#000000;
}
#content tr:last-child td{
border-width:0px 1px 0px 0px;
}#content tr td:last-child{
border-width:0px 0px 1px 0px;
}#content tr:last-child td:last-child{
border-width:0px 0px 0px 0px;
}
#content th{
background:-o-linear-gradient(bottom, #ff7f00 5%, #bf5f00 100%); background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ff7f00), color-stop(1, #bf5f00) );
background:-moz-linear-gradient( center top, #ff7f00 5%, #bf5f00 100% );
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#ff7f00", endColorstr="#bf5f00"); background: -o-linear-gradient(top,#ff7f00,bf5f00);
background-color:#ff7f00;
border:0px solid #000000;
text-align:center;
border-width:0px 0px 1px 1px;
font-size:14px;
font-family:Arial;
font-weight:bold;
color:#ffffff;
}
#content th{
background:-o-linear-gradient(bottom, #ff7f00 5%, #bf5f00 100%); background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ff7f00), color-stop(1, #bf5f00) );
background:-moz-linear-gradient( center top, #ff7f00 5%, #bf5f00 100% );
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#ff7f00", endColorstr="#bf5f00"); background: -o-linear-gradient(top,#ff7f00,bf5f00);
background-color:#ff7f00;
}
#content th{
border-width:0px 0px 1px 0px;
}
#content tr:first-child td:last-child{
border-width:0px 0px 1px 1px;
}
</style>
<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body style="padding-top: 70px;">
<!-- Fixed navbar -->
<div class="navbar navbar-default navbar-fixed-top" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<span class="navbar-brand" href="#">Spotřeba</span>
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li><a href="index.php?action=water">Voda</a></li>
<li><a href="index.php?action=gas">Plyn</a></li>
<li><a href="index.php?action=electricity">Elektřina</a></li>
<li><a href="index.php?action=furnace">Elektřina kotel</a></li>
<li><a href="index.php?action=pc">Elektřina PC</a></li>
<li><a href="receive.php">Přidat nový záznam</a></li>
</ul>
</div><!--/.nav-collapse -->
</div>
</div>
<div class="container">
<!-- Main component for a primary marketing message or call to action -->
<div class="jumbotron">
<div id="content">
<table id="contenttbl">
<tr>
<th>Datum</th>
<th>Množství</th>
<th>Rozdíl</th>
<th>Odhad denní spotřeby</th>
<th>Cena</th>
<th>Odhad ceny za den</th>
</tr>
</table>
</div>
</div>
</div> <!-- /container -->
<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script src="./js/jquery-1.11.1.min.js"></script>
<script src="./js/bootstrap.min.js"></script>
<?php if(!isset($_GET['action']) || $_GET['action'] == 'water') { ?>
<script type="text/javascript">
$.getJSON("api.php", {action: 'water'}).done(function( data )
{
$.each( data.sort(function(a, b) { return a.timestamp < b.timestamp ? 1 : -1; }), function( i, item ) {
$('#contenttbl').append('<tr><td>'+item.date+'</td><td>'+item.amount.toFixed(3)+' m<sup>2</sup></td><td>'+item.diff.toFixed(3)+' m<sup>2</sup></td><td>'+item.dailyAmount.toFixed(3)+' m<sup>2</sup></td><td>'+item.price.toFixed(3)+' Kč</td><td>'+item.dailyPrice.toFixed(3)+' Kč</td></tr>');
} );
} );
</script>
<?php } elseif($_GET['action'] == 'gas') { ?>
<script type="text/javascript">
$.getJSON("api.php", {action: 'gas'}).done(function( data )
{
$.each( data.sort(function(a, b) { return a.timestamp < b.timestamp ? 1 : -1; }), function( i, item ) {
$('#contenttbl').append('<tr><td>'+item.date+'</td><td>'+item.amount.toFixed(3)+' m<sup>2</sup></td><td>'+item.diff.toFixed(3)+' m<sup>2</sup></td><td>'+item.dailyAmount.toFixed(3)+' m<sup>2</sup></td><td>'+item.price.toFixed(3)+' Kč</td><td>'+item.dailyPrice.toFixed(3)+' Kč</td></tr>');
} );
} );
</script>
<?php } elseif($_GET['action'] == 'electricity') {?>
<script type="text/javascript">
$.getJSON("api.php", {action: 'electricity'}).done(function( data )
{
$.each( data.sort(function(a, b) { return a.timestamp < b.timestamp ? 1 : -1; }), function( i, item ) {
$('#contenttbl').append('<tr><td>'+item.date+'</td><td>'+item.amountLow.toFixed(3)+' kWh<hr>'+item.amountHigh.toFixed(3)+' kWh</td><td>'+item.diffLow.toFixed(3)+' kWh<hr>'+item.diffHigh.toFixed(3)+' kWh</td><td>'+item.dailyAmountLow.toFixed(3)+' kWh<hr>'+item.dailyAmountHigh.toFixed(3)+' kWh</td><td>'+item.priceLow.toFixed(3)+' Kč<hr>'+item.priceHigh.toFixed(3)+' Kč</td><td>'+item.dailyPriceLow.toFixed(3)+' Kč<hr>'+item.dailyPriceHigh.toFixed(3)+' Kč</td></tr>');
} );
} );
</script>
<?php } elseif($_GET['action'] == 'furnace') { ?>
<script type="text/javascript">
$.getJSON("api.php", {action: 'furnace'}).done(function( data )
{
$.each( data.sort(function(a, b) { return a.timestamp < b.timestamp ? 1 : -1; }), function( i, item ) {
$('#contenttbl').append('<tr><td>'+item.date+'</td><td>'+item.amount.toFixed(3)+' kWh</td><td>'+item.diff.toFixed(3)+' kWh</td><td>'+item.dailyAmount.toFixed(3)+' kWh</td><td>'+item.price.toFixed(3)+' Kč</td><td>'+item.dailyPrice.toFixed(3)+' Kč</td></tr>');
} );
} );
</script>
<?php } elseif($_GET['action'] == 'pc') { ?>
<script type="text/javascript">
$.getJSON("api.php", {action: 'pc'}).done(function( data )
{
$.each( data.sort(function(a, b) { return a.timestamp < b.timestamp ? 1 : -1; }), function( i, item ) {
$('#contenttbl').append('<tr><td>'+item.date+'</td><td>'+item.amount.toFixed(3)+' kWh</td><td>'+item.diff.toFixed(3)+' kWh</td><td>'+item.dailyAmount.toFixed(3)+' kWh</td><td>'+item.price.toFixed(3)+' Kč</td><td>'+item.dailyPrice.toFixed(3)+' Kč</td></tr>');
} );
} );
</script>
<?php } ?>
</body>
</html>
Zerion Mini Shell 1.0