painel / static /magma.html
Atualli's picture
Upload 85 files
490b2ec
raw
history blame
9.64 kB
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
<meta http-equiv="Pragma" content="no-cache" />
<meta http-equiv="Expires" content="0" />
<meta charset="utf-8" />
<title>MAGMA VIEW</title>
<style >
* {
box-sizing: border-box;
}
body {
margin: 0;
font-family: Arial;
}
#logo {
width: 100%;
top: 10px;
z-index: 1;
}
.title_print, .reporting_period {
text-align: center;
}
.header {
text-align: center;
padding: 0.05%;
background: #053067;
color: white;
}
.navbar {
overflow: hidden;
background-color: #333;
position: fixed;
top: 0;
width: 100%;
}
.navbar a {
float: right;
display: block;
color: #f2f2f2;
text-align: center;
padding: 14px 16px;
text-decoration: none;
font-size: 17px;
}
.navbar a:hover {
background: #ddd;
color: black;
}
.row {
display: flex;
flex-wrap: wrap;
padding: 0 2px;
}
/* Create four equal columns that sits next to each other */
.column {
flex: 25%;
max-width: 25%;
padding: 0 2px;
}
.column img {
margin-top: 2px;
vertical-align: middle;
}
/* Responsive layout - makes a two column-layout instead of four columns */
@media screen and (max-width: 800px) {
.column {
flex: 50%;
max-width: 50%;
}
}
/* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 600px) {
.column {
flex: 100%;
max-width: 100%;
}
}
.sticky {
position: fixed;
top: 0;
width: 100%;
}
.sticky + .content {
padding-top: 102px;
}
</style>
</head>
<body>
<title>Hello</title>
<!-- Header -->
<div id="myDIV" class="header">
<h1>MAGMA MOSAICO</h1>
</div>
<div class="row">
<tr>
<div class="column">
<img title="Cliente: MAGMA
DVR: INTELBRAS(DVR01)
IP: magma.ddns-intelbras.com.br:3010
Cam: CAMERA 1(1)
Setor:
" src="http://atualli.ddns.net:8091/getcamera?c=00&123" class="refr" alt="" style="width:100%" onclick="imgRedirect('zoom?n=1&m=1&p=01')">
</div>
<div class="column">
<img title="Cliente: MAGMA
DVR: INTELBRAS(DVR01)
IP: magma.ddns-intelbras.com.br:3010
Cam: CAMERA 2(2)
Setor:
" src="http://atualli.ddns.net:8091/getcamera?c=01&123" class="refr" alt="" style="width:100%" onclick="imgRedirect('zoom?n=1&m=1&p=02')">
</div>
<div class="column">
<img title="Cliente: MAGMA
DVR: INTELBRAS(DVR01)
IP: magma.ddns-intelbras.com.br:3010
Cam: CAMERA 3(3)
Setor:
" src="http://atualli.ddns.net:8091/getcamera?c=02&123" class="refr" alt="" style="width:100%" onclick="imgRedirect('zoom?n=1&m=1&p=03')">
</div>
<div class="column">
<img title="Cliente: MAGMA
DVR: INTELBRAS(DVR01)
IP: magma.ddns-intelbras.com.br:3010
Cam: CAMERA 4(4)
Setor:
" src="http://atualli.ddns.net:8091/getcamera?c=03&123" class="refr" alt="" style="width:100%" onclick="imgRedirect('zoom?n=1&m=1&p=04')">
</div>
<div class="column">
<img title="Cliente: MAGMA
DVR: INTELBRAS(DVR01)
IP: magma.ddns-intelbras.com.br:3010
Cam: CAMERA 5(5)
Setor:
" src="http://atualli.ddns.net:8091/getcamera?c=04&123" class="refr" alt="" style="width:100%" onclick="imgRedirect('zoom?n=1&m=1&p=05')">
</div>
<div class="column">
<img title="Cliente: MAGMA
DVR: INTELBRAS(DVR01)
IP: magma.ddns-intelbras.com.br:3010
Cam: CAMERA 6(6)
Setor:
" src="http://atualli.ddns.net:8091/getcamera?c=05&123" class="refr" alt="" style="width:100%" onclick="imgRedirect('zoom?n=1&m=1&p=06')">
</div>
</tr><tr>
<div class="column">
<img title="Cliente: MAGMA
DVR: INTELBRAS(DVR01)
IP: magma.ddns-intelbras.com.br:3010
Cam: CAMERA 7(7)
Setor:
" src="http://atualli.ddns.net:8091/getcamera?c=06&123" class="refr" alt="" style="width:100%" onclick="imgRedirect('zoom?n=1&m=1&p=07')">
</div>
<div class="column">
<img title="Cliente: MAGMA
DVR: INTELBRAS(DVR01)
IP: magma.ddns-intelbras.com.br:3010
Cam: CAMERA 8(8)
Setor:
" src="http://atualli.ddns.net:8091/getcamera?c=07&123" class="refr" alt="" style="width:100%" onclick="imgRedirect('zoom?n=1&m=1&p=08')">
</div>
<div class="column">
<img title="Cliente: MAGMA
DVR: INTELBRAS(DVR01)
IP: magma.ddns-intelbras.com.br:3010
Cam: CAMERA 9(9)
Setor:
" src="http://atualli.ddns.net:8091/getcamera?c=08&123" class="refr" alt="" style="width:100%" onclick="imgRedirect('zoom?n=1&m=1&p=09')">
</div>
<div class="column">
<img title="Cliente: MAGMA
DVR: INTELBRAS(DVR01)
IP: magma.ddns-intelbras.com.br:3010
Cam: CAMERA 10(10)
Setor:
" src="http://atualli.ddns.net:8091/getcamera?c=09&123" class="refr" alt="" style="width:100%" onclick="imgRedirect('zoom?n=1&m=1&p=10')">
</div>
<div class="column">
<img title="Cliente: MAGMA
DVR: INTELBRAS(DVR01)
IP: magma.ddns-intelbras.com.br:3010
Cam: CAMERA 11(11)
Setor:
" src="http://atualli.ddns.net:8091/getcamera?c=10&123" class="refr" alt="" style="width:100%" onclick="imgRedirect('zoom?n=1&m=1&p=11')">
</div>
<div class="column">
<img title="Cliente: MAGMA
DVR: INTELBRAS(DVR01)
IP: magma.ddns-intelbras.com.br:3010
Cam: CAMERA 12(12)
Setor:
" src="http://atualli.ddns.net:8091/getcamera?c=11&123" class="refr" alt="" style="width:100%" onclick="imgRedirect('zoom?n=1&m=1&p=12')">
</div>
</tr><tr>
<div class="column">
<img title="Cliente: MAGMA
DVR: INTELBRAS(DVR01)
IP: magma.ddns-intelbras.com.br:3010
Cam: CAMERA 13(13)
Setor:
" src="http://atualli.ddns.net:8091/getcamera?c=12&123" class="refr" alt="" style="width:100%" onclick="imgRedirect('zoom?n=1&m=1&p=13')">
</div>
<div class="column">
<img title="Cliente: MAGMA
DVR: INTELBRAS(DVR01)
IP: magma.ddns-intelbras.com.br:3010
Cam: CAMERA 14(14)
Setor:
" src="http://atualli.ddns.net:8091/getcamera?c=13&123" class="refr" alt="" style="width:100%" onclick="imgRedirect('zoom?n=1&m=1&p=14')">
</div>
<div class="column">
<img title="Cliente: MAGMA
DVR: INTELBRAS(DVR01)
IP: magma.ddns-intelbras.com.br:3010
Cam: CAMERA 15(15)
Setor:
" src="http://atualli.ddns.net:8091/getcamera?c=14&123" class="refr" alt="" style="width:100%" onclick="imgRedirect('zoom?n=1&m=1&p=15')">
</div>
<div class="column">
<img title="Cliente: MAGMA
DVR: INTELBRAS(DVR01)
IP: magma.ddns-intelbras.com.br:3010
Cam: CAMERA 16(16)
Setor:
" src="http://atualli.ddns.net:8091/getcamera?c=15&123" class="refr" alt="" style="width:100%" onclick="imgRedirect('zoom?n=1&m=1&p=16')">
</div>
</tr>
</div>
<script async>
// setInterval("gogo();", 1500);
var to = 1; // 2; //3;
var first = 0;
var idx=0;
function popupwindow(url, title) {
var w = screen.width*0.75;
var h = screen.height*0.75;
var left = (screen.width / 2) - (w / 2);
var top = (screen.height / 2) - (h / 1.5);
return window.open(url, title, 'toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=no, copyhistory=no, width=' + w + ', height=' + h + ', top=' + top + ', left=' + left);
}
function imgRedirect(destination) {
// location.href = destination;
// window.open(destination, 'popup', "width=300% height=300%");
// popupwindow(destination, "teste");
/* var d = new Date(),
dummy = d.getTime(),
i = 1,
pix = document.images;
for (; i < pix.length; i++) {
if (pix[i].className !== 'refr')
{ continue; }
else
{
if (pix[i].style.visibility == "collapse")
pix[i].style.visibility = "visible";
else
pix[i].style.visibility = "collapse";
}
}*/
}
function gogo()
{
var d=new Date(),
dummy=d.getTime(),
i=idx,
pix=document.images;
for (; i < pix.length; i++)
{
if (pix[i].className !== 'refr')
{ continue; }
else
{
var obj = pix[i],
s_rc=obj.getAttribute('src'),
pure_src = s_rc.substring(0, s_rc.indexOf('c=') + 4);
obj.setAttribute('src', pure_src + '&' + dummy);
obj.nextSibling.innerHTML=obj.getAttribute('src');
idx+=1;
if(idx>=pix.length) idx=0;
break;
}
}
if (first == 0)
{
first += 1;
setTimeout(gogo, to * 10000);
}
else
{ first += 1;
setTimeout(gogo, to * 100);
}
}
gogo();
</script>
</body>
</html>