Spaces:
Sleeping
Sleeping
| |
<html> | |
<head> | |
<!--meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests"--> | |
<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>ATUALLI MOSAICO WEB</title> | |
<meta name="viewport" content="width=device-width, initial-scale=1"> | |
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"> | |
<style> | |
* { | |
box-sizing: border-box; | |
} | |
body { | |
margin: 0; | |
font-family: Arial; | |
background: #000000; | |
} | |
#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; | |
} | |
.buttondiv { | |
float: left; | |
overflow: auto; | |
padding: 4px 10px; | |
} | |
.buttonfila { | |
font-size: 14px; | |
border-radius: 25px; | |
border: 2px solid black; | |
outline: none; | |
color: white; | |
padding: 11px 16px; | |
background-color: #000000; | |
font-family: inherit; | |
margin: 0; | |
} | |
.buttonwork { | |
font-size: 14px; | |
border-radius: 25px; | |
// border: none; | |
border: 2px solid black; | |
outline: none; | |
color: white; | |
padding: 11px 16px; | |
background-color: #339BFF; | |
font-family: inherit; | |
margin: 0; | |
} | |
.tudo { | |
// position: absolute; | |
// display: none; | |
// flex-wrap: wrap; | |
// background: #000000; | |
// height: 100%; | |
// width: 100%; | |
} | |
/* Bottom left text */ | |
.bottom-left { | |
position: absolute; | |
bottom: 8px; | |
left: 16px; | |
} | |
/* Top left text */ | |
.top-left { | |
position: absolute; | |
top: 18px; | |
left: 16px; | |
} | |
/* Top right text */ | |
.top-right { | |
position: absolute; | |
top: 18px; | |
right: 16px; | |
} | |
/* Bottom right text */ | |
.bottom-right { | |
position: absolute; | |
bottom: 8px; | |
right: 16px; | |
} | |
/* Centered text */ | |
.centered { | |
position: absolute; | |
top: 50%; | |
left: 50%; | |
transform: translate(-50%, -50%); | |
} | |
.row { | |
// position: fixed; | |
display: none; | |
flex-wrap: wrap; | |
padding: 6.3vh 0; | |
background: #000000; | |
width:100%; | |
height:92%; | |
} | |
.rowblock { | |
display: none; | |
flex-wrap: wrap; | |
padding: 100% 0; | |
background-image: url('getresource?r=accessdenied.png'); | |
height: 100%; | |
} | |
/* Create four equal columns that sits next to each other */ | |
.column7x { | |
flex: 14.28%; | |
max-width: 14.28%; | |
padding: 0 2px; | |
} | |
.column7x img { | |
margin-top: 2px; | |
vertical-align: middle; | |
} | |
.column7x:active canvas { | |
position: fixed; | |
top: 50%; | |
left: 0; | |
width: 100%; | |
height: 100%; | |
-webkit-transform: translateY(-50%); | |
transform: translateY(-50%); | |
cursor: zoom-out; | |
} | |
.column6x { | |
flex: 16.6%; | |
max-width: 16.6%; | |
padding: 0 2px; | |
} | |
.column6x img { | |
margin-top: 2px; | |
vertical-align: middle; | |
} | |
.column6x:active canvas { | |
position: fixed; | |
top: 50%; | |
left: 0; | |
width: 100%; | |
height: 100%; | |
-webkit-transform: translateY(-50%); | |
transform: translateY(-50%); | |
cursor: zoom-out; | |
} | |
.column5x { | |
flex: 20%; | |
max-width: 20%; | |
padding: 0 2px; | |
} | |
.column5x img { | |
margin-top: 2px; | |
vertical-align: middle; | |
} | |
.column5x:active canvas { | |
position: fixed; | |
top: 50%; | |
left: 0; | |
width: 100%; | |
height: 100%; | |
-webkit-transform: translateY(-50%); | |
transform: translateY(-50%); | |
cursor: zoom-out; | |
} | |
.column3x { | |
flex: 33.33%; | |
max-width: 33.33%; | |
padding: 0 2px; | |
} | |
.column3x img { | |
margin-top: 2px; | |
vertical-align: middle; | |
} | |
.column3x:active canvas { | |
position: fixed; | |
top: 50%; | |
left: 0; | |
width: 100%; | |
height: 100%; | |
-webkit-transform: translateY(-50%); | |
transform: translateY(-50%); | |
cursor: zoom-out; | |
} | |
.column { | |
flex: 25%; | |
max-width: 25%; | |
padding: 0 2px; | |
} | |
.column img { | |
margin-top: 2px; | |
vertical-align: middle; | |
} | |
.column:hover img { | |
/* position: absolute; | |
// bottom: 0%; | |
left: 0; | |
right: 0; | |
height: 50%; | |
width: 50%; | |
background: rgba(0, 0, 0, 0.5); | |
padding: 5px 10px; | |
transition: all 1s; | |
color: white; */ | |
} | |
.column:active canvas { | |
position: fixed; | |
top: 50%; | |
left: 0; | |
width: 100%; | |
height: 100%; | |
-webkit-transform: translateY(-50%); | |
transform: translateY(-50%); | |
cursor: zoom-out; | |
} | |
/* Responsive layout - makes a two column-layout instead of four columns */ | |
@media screen and (max-width: 800px) { | |
.column { | |
flex: 50%; | |
max-width: 50%; | |
} | |
.column3x { | |
flex: 50%; | |
max-width: 50%; | |
} | |
.column5x { | |
flex: 50%; | |
max-width: 50%; | |
} | |
.column6x { | |
flex: 50%; | |
max-width: 50%; | |
} | |
.column7x { | |
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%; | |
} | |
.column3x { | |
flex: 100%; | |
max-width: 100%; | |
} | |
.column5x { | |
flex: 100%; | |
max-width: 100%; | |
} | |
.column6x { | |
flex: 100%; | |
max-width: 100%; | |
} | |
.column7x { | |
flex: 100%; | |
max-width: 100%; | |
} | |
} | |
#popupbox { | |
margin: 0; | |
margin-left: 40%; | |
margin-right: 40%; | |
margin-top: 50px; | |
padding-top: 10px; | |
width: 20%; | |
height: 150px; | |
position: fixed; | |
background: #FBFBF0; | |
border: solid #000000 2px; | |
z-index: 9; | |
font-family: arial; | |
visibility: hidden; | |
} | |
#ocorrencia { | |
margin: 0; | |
margin-left: 25%; | |
margin-right: 25%; | |
margin-top: 12%; | |
padding-top: 10px; | |
width: 50%; | |
height: 50%; | |
position: fixed; | |
background: white; | |
border: solid black 2px; | |
z-index: 9; | |
font-family: arial; | |
visibility: hidden; | |
} | |
.sidenav { | |
height: 100%; | |
width: 0; | |
position: fixed; | |
z-index: 1; | |
top: 0; | |
left: 0; | |
background-color: #111; | |
overflow-x: hidden; | |
transition: 0.5s; | |
padding-top: 60px; | |
} | |
.sidenav a { | |
padding: 8px 8px 8px 32px; | |
text-decoration: none; | |
font-size: 25px; | |
color: #818181; | |
display: block; | |
transition: 0.3s; | |
} | |
.sidenav a:hover { | |
color: #f1f1f1; | |
} | |
.sidenav .closebtn { | |
position: absolute; | |
top: 0; | |
right: 25px; | |
font-size: 36px; | |
margin-left: 50px; | |
} | |
@media screen and (max-height: 450px) { | |
.sidenav {padding-top: 15px;} | |
.sidenav a {font-size: 18px;} | |
} | |
.topnav { | |
position: fixed; | |
top: 0; | |
width: 100%; | |
height:6.3vh; | |
overflow: hidden; | |
background-color: #fefefe; | |
} | |
.topnav a { | |
float: left; | |
display: block; | |
color: #000000; | |
text-align: center; | |
padding: 14px 16px; | |
text-decoration: none; | |
font-size: 17px; | |
} | |
.active { | |
background-color: #4CAF50; | |
color: white; | |
} | |
.topnav .icon { | |
display: none; | |
} | |
.dropdown { | |
float: left; | |
overflow: auto; | |
padding: 4px 10px; | |
} | |
.dropdown .dropbtn { | |
font-size: 14px; | |
border-radius: 25px; | |
border: 2px solid black; | |
outline: none; | |
color: black; | |
padding: 11px 16px; | |
background-color: #fefefe; | |
font-family: inherit; | |
margin: 0; | |
} | |
.dropdown-content { | |
display: none; | |
position: fixed; | |
background-color: #f9f9f9; | |
min-width: 160px; | |
overflow: auto; | |
max-height: 90%;/* you can change as you need it */ | |
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); | |
z-index: 1; | |
} | |
.dropdown-content a { | |
float: none; | |
color: black; | |
padding: 12px 16px; | |
text-decoration: none; | |
display: block; | |
text-align: left; | |
} | |
.topnav a:hover, .dropdown:hover .dropbtn { | |
background-color: #555; | |
color: white; | |
} | |
.dropdown-content a:hover { | |
background-color: #ddd; | |
color: black; | |
} | |
.dropdown:hover .dropdown-content { | |
display: block; | |
} | |
@media screen and (max-width: 1300px) { | |
.topnav a:not(:first-child), .dropdown .dropbtn { | |
display: none; | |
} | |
.topnav a.icon { | |
float: right; | |
display: block; | |
position: fixed; | |
top: 0; | |
right: 0; | |
} | |
} | |
@media screen and (max-width: 1300px) { | |
.topnav.responsive { | |
position: relative; | |
height:1%; | |
} | |
.topnav.responsive .icon { | |
position: absolute; | |
right: 0; | |
top: 0; | |
} | |
.topnav.responsive a { | |
float: none; | |
display: block; | |
text-align: left; | |
} | |
.topnav.responsive .dropdown { | |
float: none; | |
} | |
.topnav.responsive .dropdown-content { | |
position: relative; | |
} | |
.topnav.responsive .dropdown .dropbtn { | |
display: block; | |
width: 100%; | |
text-align: left; | |
float: right; | |
} | |
} | |
/* | |
novo popup | |
*/ | |
/* Button used to open the contact form - fixed at the bottom of the page */ | |
.open-button { | |
background-color: #555; | |
color: white; | |
padding: 16px 20px; | |
border: none; | |
cursor: pointer; | |
opacity: 0.8; | |
position: fixed; | |
bottom: 23px; | |
right: 28px; | |
width: 280px; | |
} | |
/* The popup form - hidden by default */ | |
.form-popup { | |
display: none; | |
position: fixed; | |
bottom: 0; | |
right: 15px; | |
border: 3px solid #f1f1f1; | |
z-index: 9; | |
} | |
/* Add styles to the form container */ | |
.form-container { | |
max-width: 300px; | |
padding: 10px; | |
background-color: white; | |
} | |
/* Full-width input fields */ | |
.form-container input[type=text], .form-container input[type=password] { | |
width: 100%; | |
padding: 15px; | |
margin: 5px 0 22px 0; | |
border: none; | |
background: #f1f1f1; | |
} | |
/* When the inputs get focus, do something */ | |
.form-container input[type=text]:focus, .form-container input[type=password]:focus { | |
background-color: #ddd; | |
outline: none; | |
} | |
/* Set a style for the submit/login button */ | |
.form-container .btn { | |
background-color: #4CAF50; | |
color: white; | |
padding: 16px 20px; | |
border: none; | |
cursor: pointer; | |
width: 100%; | |
margin-bottom: 10px; | |
opacity: 0.8; | |
} | |
/* Add a red background color to the cancel button */ | |
.form-container .cancel { | |
background-color: red; | |
} | |
/* Add some hover effects to buttons */ | |
.form-container .btn:hover, .open-button:hover { | |
opacity: 1; | |
} | |
/* POPUP central */ | |
/* Full-width input fields */ | |
input[type=text], input[type=password] { | |
width: 100%; | |
padding: 12px 20px; | |
margin: 8px 0; | |
display: inline-block; | |
border: 1px solid #ccc; | |
box-sizing: border-box; | |
} | |
/* Set a style for all buttons */ | |
.button { | |
background-color: #4CAF50; | |
color: white; | |
padding: 14px 20px; | |
margin: 8px 0; | |
border: none; | |
cursor: pointer; | |
width: 100%; | |
text-align: center; | |
} | |
button:hover { | |
opacity: 0.8; | |
} | |
/* Extra styles for the cancel button */ | |
.cancelbtn { | |
width: 100%; | |
padding: 10px 18px; | |
background-color: #f44336; | |
text-align: center; | |
} | |
/* Center the image and position the close button */ | |
.imgcontainer { | |
text-align: center; | |
margin: 24px 0 12px 0; | |
position: relative; | |
border: 3px solid #fff; | |
background: #f1f1f1; | |
width: 100%; | |
// min-height: 450px; | |
} | |
.imgchild { | |
width: 50%; | |
height: 26vw; | |
float: left; | |
padding: 0px; | |
margin: 0 0; | |
border: 1px solid #000; | |
} | |
img.avatar { | |
width: 40%; | |
border-radius: 50%; | |
} | |
.container { | |
padding: 16px; | |
} | |
.select { | |
padding: 16px; | |
width: 40%; | |
} | |
.select_audio { | |
width: 40%; | |
} | |
options { | |
padding: 16px; | |
width: 40%; | |
} | |
span.psw { | |
float: right; | |
padding-top: 16px; | |
} | |
/* The Modal (background) */ | |
.modal { | |
display: none; /* Hidden by default */ | |
position: fixed; /* Stay in place */ | |
z-index: 1; /* Sit on top */ | |
left: 20%; | |
top: 0; | |
width: 60%; /* Full width */ | |
height: 100%; /* Full height */ | |
overflow: auto; /* Enable scroll if needed */ | |
background-color: rgb(0,0,0); /* Fallback color */ | |
background-color: rgba(0,0,0,0.0); /* Black w/ opacity */ | |
padding-top: 10%; | |
} | |
/* Hide scrollbar for Chrome, Safari and Opera */ | |
.modal::-webkit-scrollbar { | |
display: none; | |
} | |
/* Hide scrollbar for IE, Edge and Firefox */ | |
.modal { | |
-ms-overflow-style: none; /* IE and Edge */ | |
scrollbar-width: none; /* Firefox */ | |
} | |
/* Modal Content/Box */ | |
.modal-content { | |
background-color: #fefefe; | |
margin: 0% auto 0% auto; /* 5% from the top, 15% from the bottom and centered */ | |
border: 1px solid #888; | |
width: 100%; /* Could be more or less, depending on screen size */ | |
} | |
/* The Close Button (x) */ | |
.close { | |
position: absolute; | |
right: 25px; | |
top: 0; | |
color: #000; | |
font-size: 35px; | |
font-weight: bold; | |
} | |
.close:hover, | |
.close:focus { | |
color: red; | |
cursor: pointer; | |
} | |
/* Add Zoom Animation */ | |
.animate { | |
-webkit-animation: animatezoom 0.6s; | |
animation: animatezoom 0.6s | |
} | |
@-webkit-keyframes animatezoom { | |
from { | |
-webkit-transform: scale(0) | |
} | |
to { | |
-webkit-transform: scale(1) | |
} | |
} | |
@keyframes animatezoom { | |
from { | |
transform: scale(0) | |
} | |
to { | |
transform: scale(1) | |
} | |
} | |
/* Change styles for span and cancel button on extra small screens */ | |
@media screen and (max-width: 300px) { | |
span.psw { | |
display: block; | |
float: none; | |
} | |
.cancelbtn { | |
width: 100%; | |
} | |
} | |
</style> | |
</head> | |
<body onload="iniciaPagina();"> | |
<title>Hello</title> | |
<script type="text/javascript"> | |
function storeLogin(name) | |
{ | |
setCookieh("LOGIN",name,10); | |
} | |
function loadLogin() | |
{ | |
var name = getCookieh("LOGIN"); | |
return name; | |
} | |
function loadFotoLogin() { | |
var foto = getCookieh("FOTO"); | |
return foto; | |
} | |
function setCookieh(name,value,days) { | |
window.localStorage.setItem(name, value); | |
} | |
function getCookieh(name) { | |
return window.localStorage.getItem(name); | |
} | |
function sleeph(time) { | |
return new Promise((resolve) => setTimeout(resolve, time)); | |
} | |
function handleClientLoad() { | |
sleeph(100).then(() => { | |
document.getElementById("conteudototal").style.display = "block"; | |
var name=loadLogin(); | |
if((!name) || (name=="LOGIN")) | |
{ | |
waitLogin(); | |
} | |
else | |
{ | |
waitLogout(name); | |
} | |
}); | |
} | |
function updateSigninStatus(isSignedIn) { | |
if (isSignedIn) { | |
} else { | |
waitLogin(); | |
} | |
} | |
/** | |
* Sign in the user upon button click. | |
*/ | |
var init=0; | |
function handleAuthClick(event) { | |
document.getElementById("myLogin").innerHTML = "AGUARDE..."; | |
if(init==0) | |
{ | |
init=1; | |
} | |
} | |
function waitLogin() | |
{ | |
document.getElementById("tudo").style.display = "none"; | |
document.getElementById("conteudototal").style.display = "none"; | |
document.getElementById("listaclientes").style.display = "none"; | |
// document.getElementById("ferramentas").style.display = "none"; | |
document.getElementById("Fila").style.display = "none"; | |
document.getElementById("operacao").style.display = "none"; | |
document.getElementById("viewList").style.display = "none"; | |
document.getElementById("portal").style.display = "flex"; | |
document.getElementById("myLogin").innerHTML = "LOGIN"; | |
document.getElementById("myLoginS").innerHTML = "LOGIN"; | |
var obj = document.getElementById("myLoginS"); | |
obj.setAttribute('href', "javascript:handleAuthClick(0);"); | |
document.getElementById("Fila").setAttribute('onclick', "document.getElementById('ocoModal').style.display = 'none'; javascript:void(0);"); | |
storeLogin("LOGIN"); | |
openurl("/novo-front/index"); | |
} | |
function waitLogout(logname) { | |
document.getElementById("tudo").style.display = "inline"; | |
document.getElementById("conteudototal").style.display = "block"; | |
document.getElementById("listaclientes").style.display = "inline"; | |
// document.getElementById("ferramentas").style.display = "inline"; | |
//document.getElementById("Fila").style.display = "flex"; | |
//document.getElementById("operacao").style.display = "flex"; | |
document.getElementById("viewList").style.display = "inline"; | |
document.getElementById("portal").style.display = "none"; | |
document.getElementById("myLogin").innerHTML = "LOGOFF"; | |
var obj = document.getElementById("myLoginS"); | |
obj.setAttribute('href', "javascript:handleSignoutClick(0);"); | |
document.getElementById("Fila").setAttribute('onclick', "getVideoOcorrencia();"); | |
// var name = gapi.auth2.getAuthInstance().currentUser.get(); | |
// var logname = name.getBasicProfile().getName() + " ( " + name.getBasicProfile().getEmail() + " )"; | |
//login(logname); | |
document.getElementById("myLogin").innerHTML = logname; // Qt.Au = email , Qt.Bd= fullname, Qt.zU=lastname, Qt.zW=firstname. | |
var clip=logname.indexOf("("); | |
document.getElementById("myLoginS").innerHTML = logname.substring(0,clip); | |
storeLogin(logname); | |
} | |
/** | |
* Sign out the user upon button click. | |
*/ | |
function handleSignoutClick(event) { | |
var x; | |
var r = confirm("Deseja finalizar a sessao ?"); | |
if (r == true) { | |
document.getElementById("myLogin").innerHTML = "AGUARDE..."; | |
// gapi.load('client:auth2', initClientSigOut); | |
waitLogin(); | |
init=1; | |
} | |
} | |
function appendPre(message) { | |
document.body.innerHTML = message.trim(); | |
} | |
</script> | |
<script async defer src="https://apis.google.com/js/api.js" | |
onload="this.onload=function(){};handleClientLoad()" | |
onreadystatechange="if (this.readyState === 'complete') this.onload()"> | |
</script> | |
<div id="tudo"> | |
<div id="mySidenav" class="sidenav"> | |
<a href="javascript:void(0)" class="closebtn" onclick="closeNav()">×</a> | |
<a href="javascript:setMosaico();" id="mosaico">Mosaico</a> | |
<a href="javascript:setDash();" id="dash">Dashboard</a> | |
<a href="javascript:popupwindow('/visualizacao','VISUALIZACAO', screen.width/1, screen.height/1);" onclick="closeNav()" id="visualizacao"> Visualizacao</a> | |
<a href="javascript:setConfig()" id="conf">Configuracao</a> | |
<a href="javascript:setConfigCheckList()" id="confckl">Check-List</a> | |
<a href="javascript:setTelegram()" id="telegram">Telegram</a> | |
<a href="javascript:setSimulador()" id="sim">Simulador</a> | |
<a href="javascript:setSimuladorNovo()" id="simnovo">Simulador Novo</a> | |
<a href="javascript:setSimuladorLPR()" id="simlpr">Simulador LPR</a> | |
<a href="javascript:setConfigCheckList()" id="bloqueios">Bloqueios</a> | |
<a href="javascript:setResetMosaico();" id="reset">Reset Mosaico</a> | |
<a href="javascript:setSobre();" id="sobrenos">Sobre</a> | |
<a href="javascript:handleSignoutClick(0);" onclick="closeNav()" id="sair">Sair</a> | |
</div> | |
<div class="topnav" id="myTopnav"> | |
<span style="background-color: #000000;color: blue;float:left;font-size:40px;cursor:pointer" onclick="openNav()">☰ </span> | |
<img title="logo" id="logotipo" src="" align="left" style="width:9%"> | |
<!--a href="#news" onclick="javascript:void(0);" id="Fila">Fila</a--> | |
<div class="buttondiv"> | |
<button class="buttonfila" id="Fila">Fila</button> | |
</div> | |
<div class="dropdown" id="listaclientes"> | |
<button class="dropbtn" id="clientelabel"> | |
CLIENTE | |
</button> | |
<div id="listaclientesItem" class="dropdown-content"> | |
<a href="javascript:activecheckboxlist(this)">CUSTOMIZADO</a> | |
LISTA | |
</div> | |
<div id="listaclientesItembkp" style="display:none"> | |
</div> | |
</div> | |
<div class="buttondiv"> | |
<button onclick="javascript:setoperacao(0);" class="buttonwork" id="operacao">>AGUARDE...</button> | |
</div> | |
<div class="dropdown" id="viewList"> | |
<button class="dropbtn"> | |
VIEW | |
<i class="fa fa-caret-down"></i> | |
</button> | |
<div class="dropdown-content"> | |
<a href="javascript:changeGrade('column7x');">7x</a> | |
<a href="javascript:changeGrade('column6x');">6x</a> | |
<a href="javascript:changeGrade('column5x');">5x</a> | |
<a href="javascript:changeGrade('column');">4x</a> | |
<a href="javascript:changeGrade('column3x');">3x</a> | |
<a href="javascript:changeGrade('Auto');">Auto</a> | |
</div> | |
</div> | |
<img title="avatar" id="myavatar" style="width:3%" src="getresource?r=anonymus.jpg" align="left"> | |
<a href="" style="display:none" id="myLogin"></a> | |
<a href="javascript:handleAuthClick(0);" id="myLoginS"></a> | |
<a href="javascript:void(0);" class="icon" onclick="NavResponsive()"> | |
<i class="fa fa-bars"></i> | |
</a> | |
</div> | |
<div class="rowblock" id="portal"> | |
<tr></tr> | |
</div> | |
<div style="display:none" id="listocorrencias"> | |
<tr> | |
<iframe id="iframelistocorrencias" src="" frameborder="0" style="position:absolute; top:7%; left:0; width:100%; height:100%; border:0" allowfullscreen></iframe> | |
</tr> | |
</div> | |
<div style="display:none" id="configuracao"> | |
<tr> | |
<iframe id="iframeconfiguracao" src="" frameborder="0" style="position:absolute; top:7%; left:0; width:70%; height:100%; border:0" allowfullscreen></iframe> | |
</tr> | |
</div> | |
<div style="display:none" id="configuracaochecklist"> | |
<tr> | |
<iframe id="iframeconfiguracaochecklist" src="" frameborder="0" style="position:absolute; top:7%; left:0; width:100%; height:100%; border:0" allowfullscreen></iframe> | |
</tr> | |
</div> | |
<div style="display:none" id="cercavirtual"> | |
<tr> | |
<iframe id="iframecercavirtual" src="" frameborder="0" style="position:absolute; top:7%; left:70%; width:30%; height:100%; border:0" allowfullscreen></iframe> | |
</tr> | |
</div> | |
<div style="display:none" id="simulador"> | |
<tr> | |
<iframe id="iframesimulador" src="" frameborder="0" style="position:absolute; top:7%; left:0; width:100%; height:100%; border:0; background: #FFFFFF;" allowfullscreen></iframe> | |
</tr> | |
</div> | |
<div style="display:none" id="simuladornovo"> | |
<tr> | |
<iframe id="iframesimuladornovo" src="" frameborder="0" style="position:absolute; top:7%; left:0; width:100%; height:100%; border:0; background: #FFFFFF;" allowfullscreen></iframe> | |
</tr> | |
</div> | |
<div style="display:none" id="simuladorlpr"> | |
<tr> | |
<iframe id="iframesimuladorlpr" src="" frameborder="0" style="position:absolute; top:7%; left:0; width:100%; height:100%; border:0; background: #FFFFFF;" allowfullscreen></iframe> | |
</tr> | |
</div> | |
<div style="display:none" id="sobre" > | |
<tr> | |
<iframe id="iframesobre" src="" frameborder="0" style="position:absolute; top:7%; left:0; width:100%; height:100%; border:0; background: #FFFFFF;" allowfullscreen></iframe> | |
</tr> | |
</div> | |
<div id="conteudototal" > | |
<div class="row" id="conteudo"> | |
BODY | |
</div> | |
<tr id="bodymosaico"> | |
<div id="ocoModal" class="modal"> | |
<form class="modal-content animate" id="formOcorrencia" action="javascript:gravaOcorrencia()" method="get"> | |
<div class="imgcontainer"> | |
<div style="width:100%"> | |
<p><b>TRATAMENTO DE OCORRENCIA</b></p> <span onclick="document.getElementById('ocoModal').style.display = 'none'" class="close" title="Close Modal">×</span> | |
</div> | |
<div class="imgchild"> | |
<p><b>Gravacao</b></p> | |
<video id="videoocorrencia" preload="metadata" autoplay loop muted playsinline width=100% height=77% controls src="getresource?r=atualli.png&" type="video/mp4"> </video> | |
</div> | |
<div class="imgchild"> | |
<p><b>Ao Vivo</b></p> | |
<img src="" id="aovivo" class="refrx" alt="" style="width:100%;display:none;"> | |
<canvas title="Ao vivo" id="cvcx" alt="" style="width:100%"></canvas> | |
</div> | |
</div> | |
<div class="container" style="background-color:#f1f1f1"> | |
<label for="rot"><b>.</b></label></br> | |
<label id="IdOcoView" for="rot"><b>ID: </b></label></br> | |
<label id="IdCliente" for="rot"><b>Cliente: </b></label></br> | |
<label id="Operador" for="rot"><b>Operador: </b></label></br> | |
<label id="DataOcorrencia" for="rot"><b>Data: </b></label></br> | |
<label id="NomeRoteiro" for="rot"><b>Roteiro: </b></label></br> | |
<label id="Prioridade" for="rot"><b>Prioridade: </b></label></br> | |
<!--label id="videoOco" for="rot"><b>Video: </b></label></br--> | |
</div> | |
<div class="container"> | |
<label id="pergunta1" for="uname"><b>Procedimento</b></label> | |
<input type="text" id="procedimento" placeholder="Texto livre" name="procedimento" readonly style="background-color:#f1f1f1"> | |
<label id="pergunta2" for="psw"><b>Motivo</b></label> | |
<input type="text" id="template" placeholder="Texto livre" name="template" required onkeydown="return (event.keyCode!=13);"> | |
<!--textarea placeholder="Texto livre" rows="5" cols="10" id="template" style = "font-size: 12pt; width:100%; margin:5px 0;padding:3px" ></textarea--> | |
<label id="pergunta3" for="psw"><b>Audio</b></label> | |
<input type="file" id="audio" name="audio" accept="audio/*" multiple> | |
<button type="button" id="loadLastAudio" onclick="javascript:getUltimoAudio()">Carrega Ultimos Audios</button> | |
<select id="listaAudios" class="select_audio" style="background-color:#f1f1f1" name="formal" onchange="javascript:selAudio(this)"></select> | |
</br></br> | |
<a href="" id="lastaudio"></a> | |
<input type="hidden" name="cmd" id="GravaOcorrencia" value=""> | |
<input type="hidden" name="idOco" id="idOco" value=""> | |
<input type="hidden" name="idCamera" id="idCamera" value=""> | |
<input type="hidden" name="nomeOperador" id="nomeOperador" value=""> | |
<input type="hidden" name="idChat" id="idChat" value=""> | |
<input type="hidden" name="cliente" id="cliente" value=""> | |
<input type="hidden" name="roteiro" id="roteiro" value=""> | |
<button type="submit" style="display:none" id="gravar" class="button">Grava</button> | |
<button type="button" style="display:none" id="descartar" onclick="javascript:descartaOcorrencia(0)" class="cancelbtn">Descartar</button> | |
<button type="button" style="display:none" id="desbloqueio" onclick="" class="cancelbtn">Desbloqueio</button> | |
<select class="select" id="listaContatos" style="background-color:#f1f1f1" name="formal" onchange="javascript:handleSelect(this)"></select> | |
<script type="text/javascript"> | |
function handleSelect(elm) | |
{ | |
if(elm.value.length>1) | |
window.location = elm.value; | |
} | |
</script> | |
</div> | |
</form> | |
</div> | |
</tr> | |
</div> | |
</div> | |
<script async"> | |
var to = 1; // 2; //3; | |
var first = 0; | |
var idx = 0; | |
var tamFila = 0; | |
var myFila = 0; | |
var onlyView = 0; | |
var timergogo = 0; | |
var urlBase = '<?URL?>'; | |
var atualColumn = "column"; | |
var dashurl = ""; | |
var confurl = ""; | |
var voipurl = ""; | |
var confcklurl = ""; | |
var reseturl = ""; | |
var visualizacaourl = ""; | |
var telegramurl = ""; | |
var filaurl = ""; | |
var simuladorurl = ""; | |
var simuladornovo = ""; | |
var simuladorlpr = ""; | |
var logourl = ""; | |
var paginalogourl = ""; | |
var offsetpos=0; | |
function activecheckboxlist(checkBox) { | |
let lista = document.getElementById("listaclientesItem").innerHTML; | |
let position = lista.search("input type"); | |
if (position>0) | |
{ | |
let newlista = document.getElementById("listaclientesItembkp").innerHTML; | |
document.getElementById("listaclientesItem").innerHTML=newlista; | |
// gogo(); | |
offsetpos=0 | |
} | |
else | |
{ | |
// clearTimeout(timergogo); | |
document.getElementById("listaclientesItembkp").innerHTML=lista; | |
const listaarray = lista.split("</a>"); | |
let newlista=listaarray[0]; | |
for (var i = 1; i < listaarray.length; i++) { | |
let item = listaarray[i]; | |
let start = item.search(">"); | |
let end = item.substring(start).search("<"); | |
let name = item.substring(start+1,item.length); | |
let newitem = item.replace(">", "><input type=\"checkbox\" onclick=\"addclientcustom('"+name+"')\">"); | |
newlista+=newitem; | |
} | |
// let result = lista.replaceAll("</a>", "<input type=\"checkbox\" onclick=\"addclientcustom(this)\"></a>"); | |
document.getElementById("listaclientesItem").innerHTML=newlista; | |
} | |
} | |
function addclientcustom(cliente) { | |
makeMosaico(cliente,true); | |
} | |
function makeMosaico(cliente,flagAdd) | |
{ | |
if(flagAdd==false) | |
offsetpos=0; | |
clearTimeout(timergogo); | |
var xhttp = new XMLHttpRequest(); | |
xhttp.onreadystatechange = function () { | |
if (this.readyState == 4 && this.status == 200) { | |
document.getElementById("conteudo").style.display = "flex"; | |
var json = JSON.parse(this.responseText); | |
if (cliente != json.mosaico) cliente = json.mosaico; | |
json.urlbase="/proxyimg?img="+json.urlbase; | |
urlBase = json.urlbase+":"+json.portabase; | |
var mosaico=""; | |
for (var i=0;i<json.cameras.length;i++) | |
{ | |
var p=i+offsetpos; | |
var sid=p.toString().padStart(2, "0"); | |
camera = json.cameras[i]; | |
mosaico+="<div class = \"column\">\r\n" + | |
" <img id=\"img"+cliente+sid+"\" class=\"refr\" style=\"width:100;display:none;\" src=\"getresource?r=atualli.png\" srcorg=\""+json.urlbase+":"+json.portabase+"/getcamera?c="+camera.camera+"\" >\r\n" + | |
" <canvas title = \"\r\n"+ | |
" Cliente: "+camera.cliente+"\r\n" + | |
"DVR: "+camera.equipamento+" ("+camera.dvr+")\r\n"+ | |
"IP : "+camera.url+":"+camera.porta+" \r\n" + | |
"Cam : "+camera.cameranome+" ("+camera.canal+" ["+camera.id+"]) \r\n" + | |
"Recorder : "+camera.statusgravacao+"\"\r\n" + | |
" id=\"cvc"+cliente+sid+"\" class=\"refrc\" alt=\"\" style=\"width:100%\"></canvas>\r\n" + | |
"</div>\r\n" | |
} | |
var mosaicoold=document.getElementById("conteudo").innerHTML; | |
if(offsetpos==0) | |
mosaicoold=""; | |
offsetpos+=json.cameras.length; | |
var mosaiconew = mosaicoold + mosaico; | |
document.getElementById("conteudo").innerHTML = mosaiconew; | |
document.getElementById("clientelabel").innerHTML = cliente; | |
atualColumn="column"; | |
var novaGrade=getCookie("GRADE-"+cliente); | |
if(novaGrade) | |
changeGrade(novaGrade); | |
else | |
changeGrade("Auto"); | |
mosaiconew = document.getElementById("conteudo").innerHTML | |
// setCookie("MOSAICO-"+cliente,mosaiconew,10); | |
setCookie("CLIENTE", cliente, 10); | |
gogo(true); | |
} | |
}; | |
document.getElementById("clientelabel").innerHTML = cliente; | |
var name=loadLogin(); | |
xhttp.open("GET", "getdatamosaico?cliente="+cliente+"&operador="+name, true); | |
xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); | |
xhttp.send(""); | |
var mosaico=getCookie("MOSAICO-"+cliente); | |
if(mosaico) { | |
} | |
setCookie("CLIENTE",cliente,10); | |
} | |
function setAcessos(json) { | |
if (json.dashboard == "") | |
document.getElementById("dash").style.display = "none"; | |
if (json.configuracao == "") | |
document.getElementById("conf").style.display = "none"; | |
if (json.configuracaochecklist == "") { | |
document.getElementById("confckl").style.display = "none"; | |
document.getElementById("bloqueios").style.display = "none"; | |
} | |
if (json.simulador == "") | |
document.getElementById("sim").style.display = "none"; | |
if (json.simuladornovo == "") | |
document.getElementById("simnovo").style.display = "none"; | |
if (json.simuladorlpr == "") | |
document.getElementById("simlpr").style.display = "none"; | |
if (json.reset == "") | |
document.getElementById("reset").style.display = "none"; | |
if (json.telegram == "") | |
document.getElementById("telegram").style.display = "none"; | |
if (json.visualizacao == "") | |
document.getElementById("visualizacao").style.display = "none"; | |
if (json.fila == "") { | |
document.getElementById("operacao").style.display = "none"; | |
document.getElementById("Fila").style.display = "none"; | |
} | |
if (json.logo == "") { | |
document.getElementById("logotipo").src = "getresource?r=alogo.png"; | |
} else { | |
document.getElementById("logotipo").src = json.logo; | |
} | |
} | |
function makeLista() | |
{ | |
var cliente="ATUALLI"; | |
var xhttp = new XMLHttpRequest(); | |
xhttp.onreadystatechange = function () { | |
if (this.readyState == 4 && this.status == 200) { | |
var json = JSON.parse(this.responseText); | |
var lista="<a href =\"javascript:activecheckboxlist(this)\">CUSTOMIZADO</a>"; | |
for (var i=0;i<json.listaclientes.length;i++) | |
{ | |
lista+="<a href =\"javascript:makeMosaico('"+json.listaclientes[i]+"',false)\">"+json.listaclientes[i]+"</a>\r\n" | |
} | |
document.getElementById("listaclientesItem").innerHTML = lista; | |
dashurl = json.dashboard; | |
confurl = json.configuracao; | |
voipurl = json.voip; | |
confcklurl = json.configuracaochecklist; | |
reseturl = json.reset; | |
visualizacaourl = json.visualizacao; | |
telegramurl = json.telegram; | |
filaurl = json.fila; | |
simuladorurl = json.simulador; | |
simuladornovo = json.simuladornovo; | |
simuladorlpr = json.simuladorlpr; | |
paginalogourl = json.paginalogo; | |
setAcessos(json); | |
} | |
}; | |
document.getElementById("clientelabel").innerHTML = cliente; | |
var name=loadLogin(); | |
xhttp.open("GET", "getdatamosaico?cliente="+cliente+"&operador="+name, true); | |
xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); | |
xhttp.send(""); | |
} | |
function NavResponsive() { | |
var x = document.getElementById("myTopnav"); | |
if (x.className === "topnav") { | |
x.className += " responsive"; | |
} else { | |
x.className = "topnav"; | |
} | |
} | |
function setTelegram() { | |
popupwindow(telegramurl,'TELEGRAM', screen.width/4, screen.height) | |
closeNav(); | |
} | |
function resetAllView() { | |
document.getElementById("configuracao").style.display = "none"; | |
document.getElementById("configuracaochecklist").style.display = "none"; | |
document.getElementById("conteudototal").style.display = "none"; | |
document.getElementById("listocorrencias").style.display = "none"; | |
document.getElementById("simulador").style.display = "none"; | |
document.getElementById("simuladornovo").style.display = "none"; | |
document.getElementById("simuladorlpr").style.display = "none"; | |
document.getElementById("cercavirtual").style.display = "none"; | |
document.getElementById("sobre").style.display = "none"; | |
} | |
function setCercaVirtual() | |
{ | |
// resetAllView(); | |
var objAovivo = document.getElementById("iframecercavirtual"); | |
var osrc= objAovivo.getAttribute('src'); | |
if ( osrc=="") | |
{ | |
objAovivo.setAttribute('src', "/programacao?id=1"); | |
} | |
document.getElementById("cercavirtual").style.display = "flex"; | |
closeNav(); | |
} | |
function setDash() { | |
resetAllView(); | |
var objAovivo = document.getElementById("iframelistocorrencias"); | |
var osrc= objAovivo.getAttribute('src'); | |
if ( osrc=="") | |
{ | |
objAovivo.setAttribute('src', dashurl); | |
} | |
document.getElementById("listocorrencias").style.display = "flex"; | |
closeNav(); | |
} | |
function setMosaico() { | |
resetAllView(); | |
document.getElementById("conteudototal").style.display = "block"; | |
closeNav(); | |
} | |
function setResetMosaico() | |
{ | |
setMosaico(); | |
resetMosaico(0); | |
} | |
function setSimulador() | |
{ | |
resetAllView(); | |
var objAovivo = document.getElementById("iframesimulador"); | |
var osrc= objAovivo.getAttribute('src'); | |
if ( osrc=="") | |
{ | |
objAovivo.setAttribute('src', simuladorurl); | |
} | |
document.getElementById("simulador").style.display = "flex"; | |
closeNav(); | |
} | |
function setSobre() { | |
resetAllView(); | |
var objAovivo = document.getElementById("iframesobre"); | |
var osrc = objAovivo.getAttribute('src'); | |
if (osrc == "") { | |
objAovivo.setAttribute('src', paginalogourl); | |
} | |
document.getElementById("sobre").style.display = "flex"; | |
closeNav(); | |
} | |
function setSimuladorNovo() | |
{ | |
resetAllView(); | |
var objAovivo = document.getElementById("iframesimuladornovo"); | |
var osrc= objAovivo.getAttribute('src'); | |
if ( osrc=="") | |
{ | |
objAovivo.setAttribute('src', simuladornovo); | |
} | |
document.getElementById("simuladornovo").style.display = "flex"; | |
closeNav(); | |
} | |
function setSimuladorLPR() | |
{ | |
resetAllView(); | |
var objAovivo = document.getElementById("iframesimuladorlpr"); | |
var osrc= objAovivo.getAttribute('src'); | |
if ( osrc=="") | |
{ | |
objAovivo.setAttribute('src', simuladorlpr); | |
} | |
document.getElementById("simuladorlpr").style.display = "flex"; | |
closeNav(); | |
} | |
function setConfig() { | |
resetAllView(); | |
var objAovivo = document.getElementById("iframeconfiguracao"); | |
var osrc= objAovivo.getAttribute('src'); | |
if ( osrc=="") | |
{ | |
objAovivo.setAttribute('src', confurl); | |
} | |
document.getElementById("configuracao").style.display = "flex"; | |
setCercaVirtual(); | |
closeNav(); | |
} | |
function setConfigCheckList() { | |
resetAllView(); | |
var objAovivo = document.getElementById("iframeconfiguracaochecklist"); | |
var osrc= objAovivo.getAttribute('src'); | |
if ( osrc=="") | |
{ | |
objAovivo.setAttribute('src', confcklurl); | |
} | |
document.getElementById("configuracaochecklist").style.display = "flex"; | |
closeNav(); | |
} | |
function openNav() { | |
document.getElementById("mySidenav").style.width = "250px"; | |
} | |
function closeNav() { | |
document.getElementById("mySidenav").style.width = "0"; | |
} | |
function changeGrade(novo) | |
{ | |
var lista = document.getElementsByClassName(atualColumn); | |
var len=lista.length; | |
var newClass=novo; | |
if(novo=="Auto") | |
{ newClass="column3x"; | |
if (len>=8) newClass="column"; | |
if (len>=16) newClass="column5x"; | |
if (len>=24) newClass="column6x"; | |
if (len>=31) newClass="column7x"; | |
} | |
for (var i = 0; i < len; i ++) | |
{ | |
lista[0].className = newClass; | |
} | |
atualColumn=newClass; | |
let cliente=document.getElementById("clientelabel").innerHTML; | |
cliente=cliente.trim(); | |
setCookie("GRADE-"+cliente,novo,10); | |
} | |
function drawOperador(name) { | |
document.getElementById("myLogin").innerHTML = name; | |
} | |
function selecionaOperador(name) { | |
var atual= getCookie("LOGIN"); | |
if (name!=atual) | |
{ | |
if((name.length>0) && (name!="LOGOFF")&& (name!="LOGIN")) | |
login(name); | |
if(atual.length>0) | |
logout(atual); | |
} | |
if(!name) name="LOGIN"; | |
setCookie("LOGIN",name,10); | |
drawOperador(name); | |
} | |
function setCookie(name,value,days) { | |
window.localStorage.setItem(name,value); | |
} | |
function getCookie(name) { | |
return window.localStorage.getItem(name); | |
} | |
function eraseCookie(name) { | |
document.cookie = name +'=; Path=/; Expires=Thu, 01 Jan 1970 00:00:01 GMT;'; | |
} | |
function openForm() { | |
document.getElementById("myForm").style.display = "block"; | |
} | |
function closeForm() { | |
document.getElementById("myForm").style.display = "none"; | |
} | |
function resetFormOcorrencia() | |
{ | |
var obj = document.getElementById("videoocorrencia"); | |
obj.setAttribute('src', ""); | |
var objproc = document.getElementById("procedimento"); | |
objproc.setAttribute('value', ""); | |
var objtmp = document.getElementById("template"); | |
objtmp.setAttribute('value', ""); | |
// document.getElementById("videoOco").innerHTML = "<b> Video: Aguarde...</b>"; | |
document.getElementById("IdCliente").innerHTML = "<b> Cliente: Aguarde...</b>"; | |
document.getElementById("IdOcoView").innerHTML = "<b> ID: Aguarde...</b>"; | |
document.getElementById("NomeRoteiro").innerHTML = "<b> Roteiro: Aguarde...</b>"; | |
document.getElementById("DataOcorrencia").innerHTML = "<b> Data: Aguarde... </b>"; | |
document.getElementById("Operador").innerHTML = "<b> Operador: Aguarde... </b>"; | |
document.getElementById("Prioridade").innerHTML = "<b> Prioridade: Aguarde...</b>"; | |
var objidOco = document.getElementById("idOco"); | |
objidOco.setAttribute('value', ""); | |
var objnOp = document.getElementById("nomeOperador"); | |
objnOp.setAttribute('value', ""); | |
var objnidChat = document.getElementById("idChat"); | |
objnidChat.setAttribute('value', ""); | |
document.getElementById("desbloqueio").style.display = 'none' | |
document.getElementById("gravar").style.display = 'none' | |
document.getElementById("descartar").style.display = 'none' | |
document.getElementById("gravar").innerHTML = "Gravar"; | |
document.getElementById("gravar").disabled = false; | |
document.getElementById("descartar").innerHTML = "Descartar"; | |
document.getElementById("descartar").disabled = false; | |
var objAovivo = document.getElementById("aovivo"); | |
objAovivo.setAttribute('src', ''); | |
objAovivo.setAttribute('class', 'refrx'); | |
document.getElementById("audio").value = ""; | |
document.getElementById("lastaudio").innerHTML = ""; | |
document.getElementById("listaAudios").innerHTML = ""; | |
} | |
function popupwindow(url, title, w, h) { | |
var left = (screen.width / 2) - (w / 2); | |
var top = (screen.height / 2) - (h / 2); | |
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 openurl(url) | |
{ | |
var urls = url; | |
if (onlyView==1) | |
urls = urls + "?view=true"; | |
window.location.replace(urls); | |
// return window.open(urls,'_self'); | |
} | |
function execDesbloqueio(url) | |
{ | |
var xhttp = new XMLHttpRequest(); | |
xhttp.onreadystatechange = function () { | |
if (this.readyState == 4 && this.status == 200) { | |
var desbloqueio = document.getElementById("desbloqueio"); | |
desbloqueio.innerHTML = this.responseText; | |
} | |
}; | |
var desbloqueio = document.getElementById("desbloqueio").innerHTML = "AGUARDE..."; | |
xhttp.open("GET", url, true); | |
xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); | |
xhttp.send(""); | |
} | |
function sleep(time) { | |
return new Promise((resolve) => setTimeout(resolve, time)); | |
} | |
function getVideoOcorrencia() { | |
if (myFila <= 0) return; | |
resetFormOcorrencia(); | |
// Usage! | |
sleep(100).then(() => { | |
// Do something after the sleep! | |
if (myFila <= 0) return; | |
document.getElementById("desbloqueio").innerHTML="Desbloqueio"; | |
document.getElementById("gravar").innerHTML = "Grava"; | |
//document.getElementById('ocoModal').style.display = 'block' | |
var xhttp = new XMLHttpRequest(); | |
xhttp.onreadystatechange = function () { | |
if (this.readyState == 4 && this.status == 200) { | |
if(this.responseText.indexOf("VAZIO") !== -1) return; | |
var json = JSON.parse(this.responseText); | |
if (json.status == "Manual") { | |
document.getElementById('ocoModal').style.display = 'block'; | |
resetFormOcorrencia(); | |
//document.getElementById('ocoModal').style.display = 'block'; | |
document.getElementById("descartar").style.display = 'block' | |
document.getElementById("gravar").style.display = 'block' | |
document.getElementById("desbloqueio").style.display = 'none' | |
var obj = document.getElementById("videoocorrencia"); | |
obj.setAttribute('src', json.video); | |
//document.getElementById("procedimento").innerHTML = "<b>" + json.procedimento + "</b>"; | |
document.getElementById("template").innerHTML = json.templat ; | |
var objproc = document.getElementById("procedimento"); | |
objproc.setAttribute('value', json.procedimento); | |
var objtmp = document.getElementById("template"); | |
objtmp.setAttribute('value', json.templat); | |
var objidChat = document.getElementById("idChat"); | |
objidChat.setAttribute('value', json.idchat); | |
var objCliente = document.getElementById("cliente"); | |
objCliente.setAttribute('value', json.cliente); | |
var objRoteiro = document.getElementById("roteiro"); | |
objRoteiro.setAttribute('value', json.roteiro); | |
var objAovivo = document.getElementById("aovivo"); | |
objAovivo.setAttribute('src', json.urlcamera); | |
document.getElementById("IdCliente").innerHTML = "<b> Cliente: " + json.cliente + "</b>"; | |
document.getElementById("IdOcoView").innerHTML = "<b> ID: " + json.id + "</b>"; | |
document.getElementById("NomeRoteiro").innerHTML = "<b> Roteiro: " + json.roteiro + "</b>"; | |
document.getElementById("DataOcorrencia").innerHTML = "<b> Data: " + json.data + "</b>"; | |
document.getElementById("Prioridade").innerHTML = "<b> Prioridade: " + json.prioridade + "</b>"; | |
if (json.desbloqueio) { | |
var desbloqueio = document.getElementById("desbloqueio"); | |
desbloqueio.style.display = 'block' | |
var url = json.desbloqueio; | |
desbloqueio.setAttribute('onclick', "execDesbloqueio('" + url + "')"); | |
} | |
var lista = json.contatos.split(/,| |-/); | |
var options = "<option value=\"\">REALIZAR CONTATO</option>"; | |
for (var i = 0; i < lista.length; i += 2) { | |
nome = lista[i]; | |
telefone = lista[i + 1]; | |
options += "<option value=\"tel:80" + telefone + "\">Ligar para " + nome + " " + telefone + "</option>"; | |
} | |
document.getElementById("listaContatos").innerHTML = options; | |
document.getElementById("Operador").innerHTML = "<b> Operador: " + document.getElementById("myLogin").innerHTML + "</b>"; | |
var objidOco = document.getElementById("idOco"); | |
objidOco.setAttribute('value', json.id); | |
var objnOp = document.getElementById("nomeOperador"); | |
objnOp.setAttribute('value', document.getElementById("myLogin").innerHTML); | |
} | |
else { | |
document.getElementById('ocoModal').style.display = 'none'; | |
} | |
} | |
}; | |
xhttp.open("GET", "getdatalocal?comando=Ocorrencia&operador=" + document.getElementById("myLogin").innerHTML, true); | |
xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); | |
xhttp.send(""); | |
}); | |
} | |
const fileInput = document.getElementById('audio'); | |
fileInput.onchange = () => { | |
const selectedFile = fileInput.files[0]; | |
if ((selectedFile) && (selectedFile.name.length > 0)) | |
{ | |
var dt = new Date(); | |
var path = voipurl + dt.getFullYear() + "/" + String(dt.getMonth() + 1).padStart(2, '0') + "/" + String(dt.getDate()).padStart(2, '0') + "/"; | |
var saudio = path+selectedFile.name; | |
var saudio = saudio.replace("[1]", ""); | |
var objAudio = document.getElementById("lastaudio"); | |
objAudio.setAttribute('href', saudio); | |
document.getElementById("lastaudio").innerHTML = saudio; | |
} | |
else { | |
document.getElementById("lastaudio").innerHTML = ""; | |
} | |
} | |
function getUltimoAudio() | |
{ | |
var xhttp = new XMLHttpRequest(); | |
xhttp.onreadystatechange = function () | |
{ | |
if (this.readyState == 4 && this.status == 200) | |
{ | |
var json = JSON.parse(this.responseText); | |
var file = json.voips[0].file; | |
var sfile = file.replace("/var/spool/asterisk/monitor", voipurl); | |
var objAudio = document.getElementById("lastaudio"); | |
objAudio.setAttribute('href', sfile); | |
document.getElementById("lastaudio").innerHTML = sfile; | |
document.getElementById("loadLastAudio").innerHTML = "Carrega Ultimos Audios"; | |
var options = "<option value=\"\">Lista Ultimos Audios</option>"; | |
for (var i = 0; i < json.voips.length; i ++) { | |
var nome = json.voips[i].file; | |
var snome = nome.replace("/var/spool/asterisk/monitor", voipurl); | |
options += "<option value=\"" + snome + "\">" + snome + "</option>"; | |
} | |
document.getElementById("listaAudios").innerHTML = options; | |
} | |
} | |
var videoobj = document.getElementById("videoocorrencia"); | |
var video = videoobj.getAttribute('src'); | |
var dvideo = video; | |
document.getElementById("loadLastAudio").innerHTML = "AGUARDE..."; | |
xhttp.open("GET", dvideo + "&ramal=2002&phone=0", true); | |
xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); | |
xhttp.send(""); | |
} | |
function testAudio(elm) | |
{ | |
window.open(elm.value); | |
} | |
function selAudio(elm) { | |
if (elm.value.length > 1) { | |
var objAudio = document.getElementById("lastaudio"); | |
objAudio.setAttribute('href', elm.value); | |
document.getElementById("lastaudio").innerHTML = elm.value; | |
} | |
} | |
function sendMsgFinal(status) | |
{ | |
var xhttp = new XMLHttpRequest(); | |
var videoobj = document.getElementById("videoocorrencia"); | |
var video = videoobj.getAttribute('src'); | |
var objnOp = document.getElementById("nomeOperador"); | |
var operador = objnOp.getAttribute('value'); | |
var idResp2 = document.getElementById("template").value; | |
var idChat = document.getElementById("idChat").value; | |
var cliente = document.getElementById("cliente").value; | |
var roteiro = document.getElementById("roteiro").value; | |
var idOco = document.getElementById("idOco").value; | |
var saudio = document.getElementById("lastaudio").innerHTML; | |
if (saudio.length > 0) | |
idResp2 = idResp2 + " (AUDIO ANEXADO)"; | |
var dvideo = video; | |
var url = dvideo + "&idchat=" + idChat + "&status=" + status + "&idoco=" + idOco + "&cliente=" + cliente + "&roteiro=" + roteiro + "&motivo=" + idResp2 + "&audio=" + saudio; | |
xhttp.open("GET", url, true); | |
xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); | |
xhttp.send(""); | |
} | |
function gravaOcorrencia() | |
{ | |
var template = document.getElementById("template").value; | |
if (template.length > 0) { | |
var r = confirm("Deseja realmente salvar a ocorrencia ?"); | |
if (r == true) { | |
var xhttp = new XMLHttpRequest(); | |
xhttp.onreadystatechange = function () { | |
if (this.readyState == 4 && this.status == 200) { | |
var json = JSON.parse(this.responseText); | |
sendMsgFinal("grava"); | |
resetFormOcorrencia(); | |
document.getElementById('ocoModal').style.display = 'none'; | |
alert("OCORRENCIA GRAVADA COM SUCESSO !"); | |
document.getElementById("gravar").innerHTML = "Gravar"; | |
document.getElementById("gravar").disabled = false; | |
} | |
}; | |
document.getElementById("gravar").innerHTML = "Aguarde.."; | |
document.getElementById("gravar").disabled = true; | |
var objidOco = document.getElementById("idOco"); | |
var idOco = objidOco.getAttribute('value'); | |
var objnOp = document.getElementById("nomeOperador"); | |
var operador = objnOp.getAttribute('value'); | |
var idResp1 = document.getElementById("procedimento").value; | |
var idResp2 = document.getElementById("template").value; | |
var idChat = document.getElementById("idChat").value; | |
xhttp.open("GET", "getdatalocal?comando=GravaOcorrencia&idOco=" + idOco + "&resposta1=" + idResp1 + "&resposta2=" + idResp2 + "&operador=" + operador, true); | |
xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); | |
xhttp.send(""); | |
} | |
} | |
else | |
alert("Preencha o campo motivo e justifique a ocorrencia !"); | |
} | |
function resetMosaico() { | |
var r = confirm("Deseja realmente reiniciar o Mosaico ?. Use apenas em quando as imagens estiverem congeladas a mais de 1 hora"); | |
if (r == true) { | |
var xhttp = new XMLHttpRequest(); | |
xhttp.onreadystatechange = function () { | |
if (this.readyState == 4 && this.status == 200) { | |
alert("MOSAICO REINICIADO COM SUCESSO !"); | |
document.getElementById("reset").innerHTML = "RESET"; | |
document.getElementById("reset").disabled = false; | |
} | |
}; | |
document.getElementById("reset").innerHTML = "AGUARDE.."; | |
document.getElementById("reset").disabled = true; | |
var login = document.getElementById("myLogin").innerHTML; | |
var cliente = document.getElementById("clientelabel").innerHTML; | |
var texto = "AT" + cliente + "_reiniciado_pelo_operador_" + login; | |
xhttp.open("GET", urlBase+reseturl + texto, true); | |
xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); | |
xhttp.send(""); | |
} | |
} | |
function descartaOcorrencia() { | |
var template = document.getElementById("template").value; | |
if (template.length > 0) { | |
var r = confirm("Deseja realmente descartar ocorrencia ?"); | |
if (r == true) { | |
var xhttp = new XMLHttpRequest(); | |
xhttp.onreadystatechange = function () { | |
if (this.readyState == 4 && this.status == 200) { | |
var json = JSON.parse(this.responseText); | |
sendMsgFinal("descarta"); | |
resetFormOcorrencia(); | |
document.getElementById('ocoModal').style.display = 'none'; | |
alert("OCORRENCIA DESCARTADA COM SUCESSO !"); | |
document.getElementById("descartar").innerHTML = "Descartar"; | |
document.getElementById("descartar").disabled = false; | |
} | |
}; | |
document.getElementById("descartar").innerHTML = "Aguarde.."; | |
document.getElementById("descartar").disabled = true; | |
var objidOco = document.getElementById("idOco"); | |
var idOco = objidOco.getAttribute('value'); | |
var objnOp = document.getElementById("nomeOperador"); | |
var operador = objnOp.getAttribute('value'); | |
var idResp1 = document.getElementById("procedimento").value; | |
var idResp2 = document.getElementById("template").value; | |
xhttp.open("GET", "getdatalocal?comando=GravaOcorrencia&descarta=true&idOco=" + idOco + "&resposta1=" + idResp1 + "&resposta2=" + idResp2 + "&operador=" + operador, true); | |
xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); | |
xhttp.send(""); | |
} | |
} | |
else | |
alert("Preencha o campo motivo e justifique o Descarte!"); | |
} | |
function myFunctionNav() { | |
var x = document.getElementById("myTopnav"); | |
if (x.className === "topnav") { | |
x.className += " responsive"; | |
} else { | |
x.className = "topnav"; | |
} | |
} | |
var solicitaLog = 0; | |
function login(login) { | |
var xhttp = new XMLHttpRequest(); | |
xhttp.onreadystatechange = function () { | |
if (this.readyState == 4) { | |
solicitaLog = 0; | |
} | |
}; | |
xhttp.open("GET", "getdatalocal?comando=Login&login="+login+"&ip=0", true); | |
xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); | |
xhttp.send(""); | |
} | |
function logout(login) { | |
var xhttp = new XMLHttpRequest(); | |
xhttp.onreadystatechange = function () { | |
if (this.readyState == 4) { | |
solicitaLog = 0; | |
} | |
}; | |
xhttp.open("GET", "getdatalocal?comando=Logout&login=" + login + "&ip=0", true); | |
xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); | |
xhttp.send(""); | |
} | |
function setoperacao() { | |
var status = document.getElementById("operacao").innerHTML; | |
var usuario = document.getElementById("myLogin").innerHTML; | |
if ((usuario != "LOGIN") && (usuario != "")) { | |
if (status == "QUERO TRABALHAR") { | |
solicitaLog = 1; | |
document.getElementById("operacao").innerHTML = "AGUARDE..."; | |
login(usuario); | |
} | |
if (status == "TRABALHANDO") { | |
solicitaLog = 1; | |
document.getElementById("operacao").innerHTML = "AGUARDE..."; | |
logout(usuario); | |
} | |
} | |
} | |
function getFila() | |
{ | |
if (onlyView==1) { | |
document.getElementById("operacao").innerHTML = "VISUALIZANDO"; | |
tamFila = 0; | |
myFila = 0; | |
return; | |
} | |
var xhttp = new XMLHttpRequest(); | |
xhttp.onreadystatechange = function () { | |
if (this.readyState == 4 && this.status == 200) { | |
var json = JSON.parse(this.responseText); | |
document.getElementById("Fila").innerHTML = "FILA OCORRENCIAS " + "(" + json.myFila +"/"+json.numFila + ") "; | |
if (solicitaLog == 0) { | |
document.getElementById("operacao").innerHTML = json.status; | |
} | |
var status = document.getElementById("operacao").innerHTML; | |
if (status == "TRABALHANDO") { | |
if (json.numFila != "0") { | |
tamFila = parseInt(json.numFila); | |
myFila = parseInt(json.myFila); | |
if (document.getElementById('ocoModal').style.display != 'block') { | |
getVideoOcorrencia(); | |
} | |
} | |
else { | |
tamFila = 0; | |
myFila = 0; | |
} | |
} | |
else { | |
tamFila = 0; | |
myFila = 0; | |
} | |
} | |
}; | |
var usuario = document.getElementById("myLogin").innerHTML; | |
if(filaurl!=""){ | |
xhttp.open("GET", filaurl+usuario, true); | |
xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); | |
xhttp.send(""); | |
} | |
} | |
function gogo2() | |
{ | |
getFila() | |
setTimeout(gogo2, to * 1000); | |
} | |
function refreshimg(img) | |
{ | |
} | |
function imgRedirect(img) | |
{ | |
} | |
function errorloadimg(img) { | |
var d = new Date(), | |
dummy = d.getTime(); | |
var newurl = 'getresource?r=atualli.png&'; | |
var obj = img, | |
s_rc = obj.getAttribute('src'), | |
pure_src = s_rc.substring(s_rc.indexOf('c='), s_rc.indexOf('c=') + 4); | |
obj.setAttribute('src',newurl+pure_src + '&' + dummy); | |
} | |
var resx = 1000; | |
var resy = 1000; | |
var canvasvx = 720; | |
var canvasvy = 480; | |
var lastDate = new Date(); | |
var dataXhttp = []; | |
var slot = 0; | |
var forceinterval=0; | |
function gogo(flag) { | |
if(flag==true) | |
{ var pix = document.getElementsByClassName('refr'); | |
for (var i = 0; i < pix.length; i++) { | |
var img = pix[i]; | |
img.src = img.src; | |
img.onload = function () { | |
var ids = this.id; | |
var cam = "cvc" + ids.substring(3); //, 5); | |
var c = document.getElementById(cam); | |
if(c) { | |
var ctx = c.getContext("2d"); | |
c.setAttribute('width', canvasvx); | |
c.setAttribute('height', canvasvy); | |
ctx.drawImage(this, 0, 0, canvasvx, canvasvy); | |
} | |
} | |
} | |
forceinterval=30; | |
} | |
if (first == 0) { | |
first += 1; | |
for (var i = 0; i < 500; i++) { | |
for (var j = 0 ; j <= 32 ; j++) { | |
dataXhttp[i + 500 * j] = new XMLHttpRequest(); | |
} | |
} | |
var pix = document.getElementsByClassName('refr'); | |
for (var i = 0; i < pix.length; i++) { | |
var img = pix[i]; | |
img.src = img.src; | |
img.setAttribute("data-completed", -1); | |
img.setAttribute("srcorg", ""); | |
img.onload = function () { | |
var ids = this.id; | |
var cam = "cvc" + ids.substring(3); //, 5); | |
var c = document.getElementById(cam); | |
if(c) { | |
var ctx = c.getContext("2d"); | |
c.setAttribute('width', canvasvx); | |
c.setAttribute('height', canvasvy); | |
ctx.drawImage(this, 0, 0, canvasvx, canvasvy); | |
} | |
} | |
} | |
timergogo = setTimeout(gogo, 10); | |
} | |
else { | |
var pix = document.getElementsByClassName('refr'); | |
for (var i = 0; i < pix.length; i++) { | |
var img = pix[i]; | |
var size = pix.length * slot; | |
var impl = function (img, i, size) | |
{ | |
var comp = img.getAttribute("data-completed"); | |
if (comp < 0) { | |
var cam = img.id.substring(3, 5); | |
let newurl = urlBase + "c=" + cam; | |
var srcorg = img.getAttribute("srcorg"); | |
if (srcorg!="") { | |
newurl = srcorg; | |
} | |
var xhttp = dataXhttp[i + size]; | |
xhttp.onreadystatechange = function () { | |
if (this.readyState == 4 && this.status == 200) { | |
var json = this.response; | |
var reader = new FileReader(); | |
reader.onloadend = function () { | |
if (reader.result.length > 0) { | |
img.src = reader.result; | |
img.onload = function () { | |
this.setAttribute("data-completed", -1); | |
var ids = this.id; | |
var cam = "cvc" + ids.substring(3); //, 5); | |
var c = document.getElementById(cam); | |
if(c) { | |
var ctx = c.getContext("2d"); | |
var resx = this.width | |
var resy = this.height; | |
c.setAttribute('width', canvasvx); | |
c.setAttribute('height', canvasvy); | |
ctx.drawImage(this, 0, 0, canvasvx, canvasvy); | |
} | |
} | |
img.onerror = function () { | |
this.setAttribute("data-completed", -1); | |
} | |
} | |
} | |
reader.readAsDataURL(json); | |
} | |
else { | |
img.setAttribute("data-completed", -1); | |
} | |
}; | |
xhttp.open("GET", newurl, true); | |
xhttp.responseType = 'blob'; | |
xhttp.send(null); | |
img.setAttribute("data-completed", 0); | |
} | |
else { | |
comp++; | |
if (comp > 13) { | |
comp = -1; | |
} | |
img.setAttribute("data-completed", comp); | |
} | |
} | |
impl(img, i, size); | |
} | |
var d = new Date(); | |
var dummy = d.getTime(); | |
pix = document.getElementsByClassName('refrx'); | |
for (var i = 0; i < pix.length; i++) { | |
var img = pix[i]; | |
var c = document.getElementById('cvcx'); | |
if (img.src.indexOf("getcamera") >= 0) { | |
if (img.complete) { | |
var s_rc = img.src; | |
var pure_src = s_rc.substring(0, s_rc.indexOf('c=') + 4); | |
img.src = pure_src + "&" + dummy; | |
img.onload = function () { | |
this.complete = true; | |
var c = document.getElementById('cvcx'); | |
var ctx = c.getContext("2d"); | |
c.setAttribute('width', this.width); | |
c.setAttribute('height', this.height); | |
ctx.drawImage(this, 0, 0, this.width, this.height); | |
} | |
} | |
} | |
} | |
slot++; | |
slot = slot & 0x1f; | |
var actual = new Date(); | |
var interval = actual - lastDate; | |
lastDate = actual; | |
if (interval > 150) interval = 150 - (interval - 150); | |
else interval = 150; | |
// console.log("inteval = ", interval); | |
if (interval < 0 ) | |
{ | |
interval = 1; | |
} | |
if(forceinterval-->0) | |
interval = 1; | |
timergogo = setTimeout(gogo, interval); | |
} | |
} | |
function iniciaPagina() | |
{ | |
const urlParams = new URLSearchParams(window.location.search); | |
var name=loadLogin(); | |
if((!name) || (name=="LOGIN")) | |
{ | |
openurl("/novo-front/index"); | |
} | |
else | |
{ | |
var foto = loadFotoLogin(); | |
if (foto) { | |
document.getElementById("myavatar").src = foto; | |
} | |
const myParam = urlParams.get('view'); | |
if (myParam) | |
onlyView = 1; | |
var cliente=getCookie("CLIENTE"); | |
if(!cliente) { | |
cliente = document.getElementById("clientelabel").innerHTML; | |
cliente=cliente.trim(); | |
} | |
const parclient = urlParams.get('cliente'); | |
if (parclient) | |
cliente = parclient; | |
makeLista(); | |
makeMosaico(cliente,false); | |
gogo2(); | |
gogo(); | |
} | |
} | |
//Make the DIV element draggagle: | |
dragElement(document.getElementById("ocoModal")); | |
function dragElement(elmnt) { | |
var pos1 = 0, pos2 = 0, pos3 = 0, pos4 = 0; | |
if (document.getElementById(elmnt.id + "header")) { | |
/* if present, the header is where you move the DIV from:*/ | |
document.getElementById(elmnt.id + "header").onmousedown = dragMouseDown; | |
} else { | |
/* otherwise, move the DIV from anywhere inside the DIV:*/ | |
elmnt.onmousedown = dragMouseDown; | |
} | |
function dragMouseDown(e) { | |
e = e || window.event; | |
//e.preventDefault(); | |
// get the mouse cursor position at startup: | |
pos3 = e.clientX; | |
pos4 = e.clientY; | |
var elementId = e.srcElement.id; | |
if (elementId != "template") { | |
document.onmouseup = closeDragElement; | |
// call a function whenever the cursor moves: | |
document.onmousemove = elementDrag; | |
} | |
} | |
function elementDrag(e) { | |
e = e || window.event; | |
//e.preventDefault(); | |
// calculate the new cursor position: | |
pos1 = pos3 - e.clientX; | |
pos2 = pos4 - e.clientY; | |
pos3 = e.clientX; | |
pos4 = e.clientY; | |
// set the element's new position: | |
elmnt.style.top = (elmnt.offsetTop - pos2) + "px"; | |
elmnt.style.left = (elmnt.offsetLeft - pos1) + "px"; | |
} | |
function closeDragElement() { | |
/* stop moving when mouse button is released:*/ | |
document.onmouseup = null; | |
document.onmousemove = null; | |
} | |
} | |
</script> | |
</body> | |
</html> | |