Carpincho/src/gui_web/index.html
Exequiel Aramburu 2d4c7b5f36 save
2025-11-16 19:35:43 -03:00

197 lines
10 KiB
HTML

<!DOCTYPE html>
<html lang="es" class="h-100">
<head>
<meta CHARSET="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>EMA Libre Cliente (Carpincho)</title>
<link rel="icon" type="image/png" href="gui_common/iconos/icono_app.png" sizes="16x16">
<!-- Estilos varios css -->
<link rel="stylesheet" type="text/css" href="/css/jquery.dataTables.min.css" />
<link rel="stylesheet" type="text/css" href="/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="/css/bootstrap-select.min.css">
<link rel="stylesheet" type="text/css" href="css/nprogress.css">
<!-- Estilo principal css -->
<link rel="stylesheet" type="text/css" href="css/style.css">
<!-- Libreria bootstrap/jquery para graficos -->
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/popper.min.js"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script>
<!-- Libreria bootstrap select para graficos -->
<script type="text/javascript" src="js/bootstrap-select.min.js"></script>
<!-- Datable - Para las tablas dinamicas -->
<script type="text/javascript" src="js/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="js/dataTables.buttons.js"></script>
<script type="text/javascript" src="js/buttons.html5.js"></script>
<script type="text/javascript" src="js/buttons.bootstrap.js"></script>
<!-- Libreria RGraph/css para graficos -->
<script type="text/javascript" src="js/RGraph.common.core.js"></script>
<script type="text/javascript" src="js/RGraph.thermometer.js"></script>
<script type="text/javascript" src="js/RGraph.gauge.js"></script>
<script type="text/javascript" src="js/RGraph.odo.js"></script>
<script type="text/javascript" src="js/RGraph.drawing.image.js"></script>
<!-- Barra de progreso -->
<script type="text/javascript" src="js/nprogress.js"></script>
<!-- Libreria Notificaciones emergentes -->
<script type="text/javascript" src="js/notify.js"></script>
<!-- Libreria del Controlador -->
<script type="text/javascript" src="controlador/funcionesgenerales.js"></script>
<script type="text/javascript" src="controlador/admingui.js"></script>
</head>
<body class="dia">
<div id="cargador" align="center" style="vertical-align:middle;">
<div class="progressinicio">
<div style="width:100%">
</br> </br> </br> </br> </br>
<img id="loadinicio" align="center" src="gui_common/iconos/icono_app.webp" height="120px" width="140px">
</br></br> <h1><b> EMA Libre Cliente</b> </br> (Carpincho)</br>Licencia GPLv3</h1>
</div>
</div>
</div>
<div id="principal" style="display: none;">
<nav style="-webkit-app-region: drag;cursor: all-scroll" class="navbar stylish-color fixed-top scrolling-navbar ">
<span style="-webkit-app-region: no-drag;color: #ffffff;" data-toggle="tooltip" data-placement="bottom" style="font-size: 15px;"><img id="signal" class="" src="gui_common/img/signal.webp" height="16px" width="16px" data-toggle="tooltip"
data-placement="right" data-html="true" title="Señal RF de la estación"> EMA Libre Cliente </span>
<spam id="mensajebarra" class="float-center" style="color:white"></spam>
<span style="-webkit-app-region: no-drag" class="float-right">
<i class="custom-controls menu" data-toggle="tooltip" data-placement="bottom" role="menusup" aria-controls="Wzoomout" style="font-size: 15px;" title="Disminuir"><img id="Wzoomout" height="16px" width="16px" src="gui_common/iconos/zoomout.webp"></i>
<i class="custom-controls menu" data-toggle="tooltip" data-placement="bottom" role="menusup" aria-controls="Wzoomin" style="font-size: 15px;" title="Aumentar" ><img id="Wzoomin" height="16px" width="16px" src="gui_common/iconos/zoomin.webp"></i>
</span>
</nav>
<br><br>
<div id="superior" class="container">
<div class="row">
<div class="col-2" align="center" style="vertical-align:top;">
<div class="row">
<div class="col-12 col-right align-self-center ">
<br>
<span class="text-muted text-align-center"><img id="carpincho_img" align="center" src="gui_common/iconos/icono_app.webp" height="48px" width="48px" onclick="HABLA(0,'Hola, soy Carpincho, ¿qué deseas?.','info');" onmouseover="GUIÑA(0);"></span>
</div>
<div class="col-12 col-left align-self-center ">
<span class='badge badge-ultimalectura' style="font-size:small">Última Lectura<br> <span id='fecha' class='badge badge-primary'>-</span></span>
</div>
</div>
<br>
</div>
<div class="col-3" align="center" style="vertical-align:top;"></div>
<div class="col-2" align="center"><div id="clima"> </div><br></div>
<div class="col-2" align="center">
<div id="DIVModo" style="vertical-align:top;visibility: hidden"> </div>
<div id="DIVPendientes" style="vertical-align:top;visibility: hidden">
<span class='badge badge-warning'>Registros Pendientes</span>
<span id="Pendientes" class='badge badge-warning'></span>
<span id="Destanqueo" class="parpadea texttanque" style="vertical-align:top;visibility: hidden"><strong>Destanqueando</strong></span>
</div>
</div>
<div class="col-3" align="right" id="RedesMet" style="list-group row vertical-align:top;"> </div>
</div>
<div class="container container-fluid">
<ul class="nav nav-tabs nav-inverse nav-pills nav-fill" id="list-tab" role="tablist">
<li class="nav-item active ">
<a class="nav-link active show" id="inicio-tab" data-toggle="tab" data-target="#inicio" role="tab" aria-controls="inicio" aria-selected="true"><img height="24px" width="24px" src="gui_common/img/home.webp" aria-controls="inicio"> INICIO</a>
</li>
<li class="nav-item">
<a class="nav-link" id="interior-tab" data-toggle="tab" data-target="#interior" role="tab" aria-controls="interior" aria-selected="false"><img height="24px" width="24px" src="gui_common/img/interior.webp" aria-controls="interior"> INTERIOR</a>
</li>
<li class="nav-item">
<a class="nav-link" id="exterior-tab" data-toggle="tab" data-target="#exterior" role="tab" aria-controls="exterior" aria-selected="false"><img height="24px" width="24px" src="gui_common/img/exterior.webp" aria-controls="exterior"> EXTERIOR</a>
</li>
<!-- <li class="nav-item">
<a class="nav-link" id="estadisticas-tab" data-toggle="tab" data-target="#estadisticas" role="tab" aria-controls="estadisticas" aria-selected="false"><img height="24px" width="24px" src="img/estadistica.png" aria-controls="estadisticas"> ESTADISTICAS</a>
</li> -->
<li class="nav-item">
<a class="nav-link" id="redes-tab" data-toggle="tab" data-target="#redes" role="tab" aria-controls="redes" aria-selected="false"><img height="24px" width="24px" src="gui_common/img/redes.webp" aria-controls="redes"> REDES</a>
</li>
<li class="nav-item">
<a class="nav-link" id="configuracion-tab" data-toggle="tab" data-target="#configuracion" role="tab" aria-controls="configuracion" aria-selected="false"><img height="24px" width="24px" src="gui_common/img/config.webp" aria-controls="configuracion"> CONFIGURACIÓN</a>
</li>
<li class="nav-item">
<a class="nav-link" id="contacto-tab" data-toggle="tab" data-target="#contacto" target="_self" role="tab" aria-controls="contacto" aria-selected="false"><img height="24px" width="24px" src="gui_common/img/about.webp" aria-controls="contacto"> CONTACTO</a>
</li>
</ul>
<div class="tab-content jumbotron" id="" style="padding: 15px;padding-bottom:15px;margin-bottom:15px">
<div id="actualizando_inicio" style="display:none" align="center"><br><br><br><br><img src='gui_common/img/animadas/cargando2.gif' width='100' height='100' /> <br><br><br><br> </div>
<div class="tab-pane fade show active" id="inicio" role="tabpanel" aria-badgeledby="inicio-tab"></div>
<div class="tab-pane fade text-center" id="interior" role="tabpanel" aria-badgeledby="interior-tab"></div>
<div class="tab-pane fade text-center" id="exterior" role="tabpanel" aria-badgeledby="exterior-tab"></div>
<!-- <div class="tab-pane fade text-center" id="estadisticas" role="tabpanel" aria-badgeledby="estadisticas-tab"></div>-->
<div class="tab-pane fade text-center" id="configuracion" role="tabpanel" aria-badgeledby="configuracion-tab"></div>
<div class="tab-pane fade text-center" id="redes" role="tabpanel" aria-badgeledby="redes-tab"></div>
<div class="tab-pane fade" id="contacto" role="tabpanel" aria-badgeledby="contacto-tab"></div>
</div>
</div>
<footer class="fixed-bottom">
<nav style="-webkit-app-region: drag" class="stylish-color-footer ">Laboratorio de Investigación Gugler</nav>
</footer>
</div>
</body>
</html>
<script>
var zoom_level=100;
function zoom_page(step, trigger)
{
if(zoom_level>=120 && step>0 || zoom_level<=80 && step<0) return;
if(step==0) zoom_level=100;
else zoom_level=zoom_level+step;
$('body').css({
transform: 'scale('+(zoom_level/100)+')', // set zoom
transformOrigin: '50% 0' // set transform scale base
});
if(zoom_level>100) $('#Wzoomin').addClass('invisible');
else $('#Wzoomin').removeClass('invisible');
}
$(document).ready(function() {
$('.menu').on('click', function(evnt) {
var obj = $(evnt.target);
$('#' + obj.attr('aria-controls')).empty();
switch (obj.attr('id')) {
case 'Wzoomin':
zoom_page(0.5, $(this));
break;
case 'Wzoomout':
zoom_page(-0.5, $(this));
break;
}
obj = null;
});
$('.nav-link').on('click', function(evnt) {
var obj = $(evnt.target);
$('#' + obj.attr('aria-controls')).empty();
MenuGUI(obj.attr('aria-controls'));
obj = null;
});
MenuGUI('inicio');
});
window.onload = function() {
$.get("/EMA_estado", async function(data, status){
if(data[0]===true){
console.log("EMA Libre Cliente ya esta recolectando...");
INICIAR();
} else {
//console.error("EMA Libre no esta recolectado ");
}
});
redimensionarInicio();
NProgress.configure({ showSpinner: false });
NProgress.done();
};
</script>