<link rel="stylesheet" href="/css/ui-kit.css">
<div class="uk-container">
<div class="ui uk-row mb-16">
<div class="ui uk-row">
<span class="ui header uppercase">Видеонаблюдение</span>
<i class="majordomo icon medium right-floated"></i>
</div>
<div class="ui divider"></div>
<div class="ui uk-row">
<span class="ui header">%ThisComputer.timeNow%</span>
<span class="ui header right-floated">%ThisComputer.Date%</span>
</div>
</div>
<div class="ui uk-card mb-16">
<img class="image mb-4" src="/camera.php?id=5&scale=30" id="camera" data-id="5" data-quality="30" />
<div class="content">
<div class="ui uk-buttons">
<div class="ui icon uk-button selected" data-quality="30" onclick="qualityClick(this);">
<i class="one-line icon mini"></i>
</div>
<div class="ui icon uk-button" data-quality="60" onclick="qualityClick(this);">
<i class="two-line icon mini"></i>
</div>
<div class="ui icon uk-button" data-quality="100" onclick="qualityClick(this);">
<i class="three-line icon mini"></i>
</div>
</div>
<span class="ui header uppercase inverted" id="camera_text">Кухня</span>
</div>
</div>
<div class="ui uk-button mb-16" data-id="4" onclick="roomClick(this);">
ГОСТИНАЯ
</div>
<div class="ui uk-button selected mb-16" data-id="5" onclick="roomClick(this);">
КУХНЯ
</div>
<div class="ui uk-button mb-16" data-id="3" onclick="roomClick(this);">
ПРИХОЖАЯ
</div>
<div class="ui uk-button mb-16" data-id="1" onclick="roomClick(this);">
ГАРАЖ
</div>
<div class="ui uk-button mb-16" data-id="2" onclick="roomClick(this);">
КОТЕЛЬНАЯ
</div>
<div class="ui uk-button mb-16" data-id="6" onclick="roomClick(this);">
УЛИЦА
</div>
<div class="ui uk-row">
<div class="ui divider"></div>
<div class="ui uk-row bottom-menu">
<a href="/menu/205.html"><i class="user icon medium"></i></a>
<a href="/menu/206.html"><i class="thermometer icon medium"></i></a>
<a href="/menu/208.html"><i class="camera icon medium"></i></a>
<a href="/menu/212.html"><i class="chart-donut icon medium"></i></a>
<a href="/menu/227.html"><i class="home-3-alt icon medium"></i></a>
</div>
</div>
</div>
<script type="text/javascript">
function qualityClick(btn) {
$(".ui.icon.uk-button").removeClass("selected");
$(btn).addClass("selected");
$("#camera").attr("data-quality", $(btn).attr("data-quality"));
}
function roomClick(btn) {
$(".ui.uk-button.mb-16").removeClass("selected");
$(btn).addClass("selected");
$("#camera").attr("data-id", $(btn).attr("data-id"));
$("#camera_text").html($(btn).text());
}
function refreshImage() {
id = $("#camera").attr("data-id");
scale = $("#camera").attr("data-quality");
$("#camera").attr("src","http://192.168.0.5/camera.php?id=" + id + "&scale=" + scale + "&"+ new Date().getTime());
setTimeout('refreshImage()', 2000);
}
setTimeout('refreshImage()', 2000);
</script>