Atualização 6 - Alihamentos finais do ambiente do usuário.
This commit is contained in:
daivid.alves
parent
689197674b
commit
bf0e08ed9d
|
|
@ -10,6 +10,7 @@
|
|||
<link rel="stylesheet" href="./Css/page/Telas_acao/erro_404.css">
|
||||
<link rel="icon" type="image/x-icon" href="./Acessts/Imagens/iT_Guys/logo1.png">
|
||||
|
||||
|
||||
<title>Ambiente do Usuario</title>
|
||||
</head>
|
||||
|
||||
|
|
|
|||
|
|
@ -2,93 +2,31 @@
|
|||
<html lang="pt-br">
|
||||
|
||||
<head>
|
||||
<title>Ambiente de teste</title>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta http-equiv="Feature-Policy"
|
||||
content="geolocation 'none'; microphone 'none'; camera 'none'; fullscreen 'none'; payment 'none'; vr 'none'; autoplay 'none'; accelerometer 'none'; ambient-light-sensor 'none'; gyroscope 'none'; magnetometer 'none';picture-in-picture 'none';sync-xhr 'none'; usb 'none';clipboard-write 'none'; clipboard-read 'none'; payments 'none'; ">
|
||||
|
||||
<link id="conexao" rel="stylesheet" href="../Css/page/Telas_acao/load.css">
|
||||
<link rel="icon" type="image/x-icon" href="./Acessts/Imagens/iT_Guys/logo1.png">
|
||||
<style id="fundouser">
|
||||
</style>
|
||||
<title>Ambiente de teste</title>
|
||||
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
|
||||
|
||||
<!-- Seu conteúdo principal aqui -->
|
||||
<main id="entrada_1">
|
||||
<canvas id="animationCanvas"></canvas>
|
||||
|
||||
</main>
|
||||
|
||||
|
||||
|
||||
|
||||
<script>
|
||||
const canvas = document.getElementById('animationCanvas');
|
||||
const ctx = canvas.getContext('2d');
|
||||
|
||||
// Define canvas dimensions
|
||||
canvas.width = window.innerWidth;
|
||||
canvas.height = window.innerHeight;
|
||||
|
||||
const circle = {
|
||||
centerX: canvas.width / 2,
|
||||
centerY: canvas.height / 2,
|
||||
radius: 150, // Raio do caminho circular
|
||||
rotationSpeed: 0.02,
|
||||
angle: 0,
|
||||
linePath: [], // Para armazenar a trajetória
|
||||
maxPathLength: 500 // Limite para o comprimento da trajetória
|
||||
};
|
||||
|
||||
function drawCircularPath() {
|
||||
ctx.clearRect(0, 0, canvas.width, canvas.height);
|
||||
|
||||
// Adiciona o ponto da trajetória atual ao caminho
|
||||
const pathX = circle.centerX + circle.radius * Math.cos(circle.angle);
|
||||
const pathY = circle.centerY + circle.radius * Math.sin(circle.angle);
|
||||
circle.linePath.push({ x: pathX, y: pathY });
|
||||
|
||||
// Desenha a trajetória acumulada
|
||||
ctx.beginPath();
|
||||
for (let i = 0; i < circle.linePath.length - 1; i++) {
|
||||
ctx.moveTo(circle.linePath[i].x, circle.linePath[i].y);
|
||||
ctx.lineTo(circle.linePath[i + 1].x, circle.linePath[i + 1].y);
|
||||
}
|
||||
ctx.strokeStyle = '#61dafb';
|
||||
ctx.lineWidth = 2;
|
||||
ctx.stroke();
|
||||
|
||||
// Limita o comprimento da trajetória e reinicia a trajetória quando necessário
|
||||
if (circle.linePath.length > circle.maxPathLength) {
|
||||
circle.linePath.shift(); // Remove o primeiro ponto do caminho
|
||||
if (circle.angle >= Math.PI * 2) { // Completa um ciclo
|
||||
circle.angle = 0; // Reinicia o ângulo
|
||||
circle.linePath = []; // Limpa a trajetória
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function animate() {
|
||||
circle.angle += circle.rotationSpeed;
|
||||
drawCircularPath();
|
||||
requestAnimationFrame(animate);
|
||||
}
|
||||
|
||||
animate();
|
||||
|
||||
// Ajusta o tamanho do canvas quando a janela é redimensionada
|
||||
window.addEventListener('resize', () => {
|
||||
canvas.width = window.innerWidth;
|
||||
canvas.height = window.innerHeight;
|
||||
circle.centerX = canvas.width / 2;
|
||||
circle.centerY = canvas.height / 2;
|
||||
});
|
||||
</script>
|
||||
<script src="./padrao.js"></script>
|
||||
<script src="../js/Ambiente/Estrutura/Estrutura_Primaria.js"></script>
|
||||
<script src="../js/Ambiente/Estrutura/load.js"></script>
|
||||
|
||||
<!--padrao_A1 reponsavel ter toda a estrutura que aplicara o data na tela-->
|
||||
<!-- -->
|
||||
|
||||
|
||||
</html>
|
||||
|
|
@ -0,0 +1,15 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Document</title>
|
||||
<link id="conexao" rel="stylesheet" href="">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<h2>Aqui serão apresentandos os resumos das interfaces</h2>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
|
|
@ -0,0 +1,17 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="pt-br">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Monitoramento</title>
|
||||
<link id="conexao" rel="stylesheet" href="">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<h2>Aqui vão aparecer os graficos do influx e do Zabix</h2>
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
|
|
@ -1,30 +0,0 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Document</title>
|
||||
<link rel="stylesheet" href="../../Css/Ambiente_Usuario/Configuracoes.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<section class="matriz">
|
||||
|
||||
<section class="menu">
|
||||
<div class="catalos_1">
|
||||
<img src="../../Acessts/Imagens/Iconis/paint-palette.png" alt="">
|
||||
<a href="../Tela_config/estilos.html" target="iframe">Estilo</a>
|
||||
</div>
|
||||
|
||||
<a href="../gerenciarDominios.html">novo dominio<Button>testes</Button></a>
|
||||
</section>
|
||||
|
||||
<section class="apresentacao">
|
||||
<iframe src="../Tela_config/estilos.html" frameborder="0" name="iframe"></iframe>
|
||||
</section>
|
||||
|
||||
</section>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
|
|
@ -84,7 +84,7 @@ if (autenteticação == true) {
|
|||
+
|
||||
'<div class="seguimentos_1"></div>'
|
||||
+
|
||||
'<div class="seguimentos_2"><div class="sessao_1"><a href="https://dev.itguys.com.br/ambiente_do_usu%C3%A1rio/Ambiente_Usuario_copy.html" target="frame">'
|
||||
'<div class="seguimentos_2"><div class="sessao_1"><a href="./Home.html" target="frame">'
|
||||
+
|
||||
'<div class="item_menu"><img src="../Acessts/Imagens/Iconis/home.png" alt=""><p>Home</p></div></a>'
|
||||
+
|
||||
|
|
@ -112,7 +112,7 @@ if (autenteticação == true) {
|
|||
+
|
||||
'<div class="Corpo_2">'
|
||||
+
|
||||
'<div class="Colunas_1"><iframe id = "test1" name = "frame" class="transmissão" src = "http://grafana.itguys.com.br:3000/dashboard/snapshot/6sVz7BNJVCY4sZD0m9P40k7nFEc5MqLI?kiosk"frameborder = "0" ></iframe ></div>'
|
||||
'<div class="Colunas_1"><iframe id = "test1" name = "frame" class="transmissão" src = "./Home.html"frameborder = "0" ></iframe ></div>'
|
||||
+
|
||||
'</div>'
|
||||
+
|
||||
|
|
@ -120,11 +120,11 @@ if (autenteticação == true) {
|
|||
;
|
||||
|
||||
const script1 = document.createElement('script');
|
||||
script1.src = './Reação_menu.js';
|
||||
script1.src = '../js/Ambiente/Estrutura/Reacao_menu.js';
|
||||
document.body.appendChild(script1);
|
||||
|
||||
const script2 = document.createElement('script');
|
||||
script2.src = './Monitor.js';
|
||||
script2.src = '../js/Ambiente/Monitoramento/Estrutura_Secundaria_Monitor.js';
|
||||
document.body.appendChild(script2);
|
||||
|
||||
} else {
|
||||
|
|
@ -0,0 +1,72 @@
|
|||
document.addEventListener("DOMContentLoaded", function () {
|
||||
var main = document.getElementById("entrada_1");
|
||||
|
||||
// Verificar se a tag main está vazia
|
||||
if (main.innerHTML.trim() === "") {
|
||||
|
||||
const tela_laod = document.getElementById('entrada_1');
|
||||
|
||||
tela_laod.innerHTML = '<canvas id="animationCanvas"></canvas>';
|
||||
|
||||
const canvas = document.getElementById('animationCanvas');
|
||||
const ctx = canvas.getContext('2d');
|
||||
|
||||
// Define canvas dimensions
|
||||
canvas.width = window.innerWidth;
|
||||
canvas.height = window.innerHeight;
|
||||
|
||||
const circle = {
|
||||
centerX: canvas.width / 2,
|
||||
centerY: canvas.height / 2,
|
||||
radius: 150, // Raio do caminho circular
|
||||
rotationSpeed: 0.02,
|
||||
angle: 0,
|
||||
linePath: [], // Para armazenar a trajetória
|
||||
maxPathLength: 350 // Limite para o comprimento da trajetória
|
||||
};
|
||||
|
||||
function drawCircularPath() {
|
||||
ctx.clearRect(0, 0, canvas.width, canvas.height);
|
||||
|
||||
// Adiciona o ponto da trajetória atual ao caminho
|
||||
const pathX = circle.centerX + circle.radius * Math.cos(circle.angle);
|
||||
const pathY = circle.centerY + circle.radius * Math.sin(circle.angle);
|
||||
circle.linePath.push({ x: pathX, y: pathY });
|
||||
|
||||
// Desenha a trajetória acumulada
|
||||
ctx.beginPath();
|
||||
for (let i = 0; i < circle.linePath.length - 1; i++) {
|
||||
ctx.moveTo(circle.linePath[i].x, circle.linePath[i].y);
|
||||
ctx.lineTo(circle.linePath[i + 1].x, circle.linePath[i + 1].y);
|
||||
}
|
||||
ctx.strokeStyle = '#22c0a3';
|
||||
ctx.lineWidth = 10;
|
||||
ctx.stroke();
|
||||
|
||||
// Limita o comprimento da trajetória e reinicia a trajetória quando necessário
|
||||
if (circle.linePath.length > circle.maxPathLength) {
|
||||
circle.linePath.shift(); // Remove o primeiro ponto do caminho
|
||||
if (circle.angle >= Math.PI * 2) { // Completa um ciclo
|
||||
circle.angle = 0; // Reinicia o ângulo
|
||||
circle.linePath = []; // Limpa a trajetória
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function animate() {
|
||||
circle.angle += circle.rotationSpeed;
|
||||
drawCircularPath();
|
||||
requestAnimationFrame(animate);
|
||||
}
|
||||
|
||||
animate();
|
||||
|
||||
// Ajusta o tamanho do canvas quando a janela é redimensionada
|
||||
window.addEventListener('resize', () => {
|
||||
canvas.width = window.innerWidth;
|
||||
canvas.height = window.innerHeight;
|
||||
circle.centerX = canvas.width / 2;
|
||||
circle.centerY = canvas.height / 2;
|
||||
});
|
||||
}
|
||||
});
|
||||
|
|
@ -7,7 +7,7 @@ if (visuMonitor == true) {
|
|||
+
|
||||
'<div class="sub_menu" id="sub_menu">'
|
||||
+
|
||||
'<a href="./Tela_Monitoramento/Padrão/Monitoramento_Itguys.html" target="frame"><div class="sub_item_1"><img src="../Acessts/Imagens/Iconis/hospital.png" alt=""><p>iTGuys</p></div></a>'
|
||||
'<a href="./Monitoramento.html" target="frame"><div class="sub_item_1"><img src="../Acessts/Imagens/Iconis/hospital.png" alt=""><p>iTGuys</p></div></a>'
|
||||
+
|
||||
'<a href="./Tela_Monitoramento/Padrão/Monitoramento_GAU_Freguesia.html" target="frame"><div class="sub_item_1"><img src="../Acessts/Imagens/Iconis/hospital.png" alt=""><p>Gau Freguesia</p></div></a>'
|
||||
+
|
||||
Loading…
Reference in New Issue