canvas.php — leitura técnica completa

sistema/painel/paginas/simulador/canvas.php
Carrega uma simulação pelo ID. O arquivo atual usa LEFT JOIN para permitir registros sem cliente ou prótese associados.

SimuladorTela auxiliar do canvas655 linhas

Responsabilidade do arquivo

Carrega uma simulação pelo ID. O arquivo atual usa LEFT JOIN para permitir registros sem cliente ou prótese associados.

Fonte conferida: sistema/painel/paginas/simulador/canvas.php
SHA-256: 021f50a80749105d57486f7115d35aa68c1cf74220df776490bd606f3c21fbc0

Dependências extraídas do arquivo:
Include: "../../../conexao.php"Tabela: paraTabela: clientesTabela: proteses

Bytes inválidos em UTF-8 são exibidos como \xNN, sem alterar o arquivo original.

Tipo

Tela auxiliar do canvas

Grupo

Simulador

Total de linhas

655

Código completo

1<?php 2require_once("../../../conexao.php"); 3 4$tabela = 'simulacoes_protese'; 5$pasta_upload = __DIR__ . '/../../images/simulacoes/'; 6 7$id = @$_GET['id']; 8 9if($id == ""){ 10 echo 'ID não informado'; 11 exit(); 12} 13 14// Alterado para LEFT JOIN para permitir carregar o Canvas de simulações oriundas do front-end 15$query = $pdo->prepare("SELECT s.*, c.nome as nome_cliente, p.modelo 16 FROM $tabela s 17 LEFT JOIN clientes c ON s.cliente = c.id 18 LEFT JOIN proteses p ON s.id_protese = p.id 19 WHERE s.id = :id"); 20$query->bindValue(":id", $id); 21$query->execute(); 22$res = $query->fetchAll(PDO::FETCH_ASSOC); 23 24if(@count($res) == 0){ 25 echo 'Registro não encontrado'; 26 exit(); 27} 28 29$cliente = !empty($res[0]['nome_cliente']) ? $res[0]['nome_cliente'] : "Cliente da Página Inicial"; 30$modelo = !empty($res[0]['modelo']) ? $res[0]['modelo'] : "Não associado"; 31$foto_original = $res[0]['foto_original']; 32$imagem_simulada = $res[0]['imagem_simulada']; 33 34if($foto_original == ""){ 35 echo 'Nenhuma foto original enviada'; 36 exit(); 37} 38 39if(!is_dir($pasta_upload)){ 40 echo 'Pasta de imagens da simulação não encontrada'; 41 exit(); 42} 43 44if(!is_readable($pasta_upload)){ 45 echo 'Pasta de imagens da simulação sem permissão de leitura'; 46 exit(); 47} 48 49$foto_base = $pasta_upload . $foto_original; 50 51if(!file_exists($foto_base)){ 52 echo 'Arquivo da foto original não encontrado'; 53 exit(); 54} 55 56if(!is_file($foto_base)){ 57 echo 'Arquivo da foto original inválido'; 58 exit(); 59} 60 61if(!is_readable($foto_base)){ 62 echo 'Arquivo da foto original sem permissão de leitura'; 63 exit(); 64} 65 66$url_foto_original = '../../images/simulacoes/' . $foto_original . '?v=' . time(); 67$url_imagem_simulada = ''; 68 69if($imagem_simulada != ""){ 70 $url_imagem_simulada = '../../images/simulacoes/' . $imagem_simulada . '?v=' . time(); 71} 72?> 73<!DOCTYPE html> 74<html lang="pt-br"> 75<head> 76 <meta charset="utf-8"> 77 <meta name="viewport" content="width=device-width, initial-scale=1"> 78 <title>Canvas de Ajuste Fino</title> 79 <link rel="stylesheet" href="../../css/bootstrap.min.css"> 80 81 <style type="text/css"> 82 body{ 83 background:#f4f6f9; 84 font-family: Arial, sans-serif; 85 padding:15px; 86 color:#2d3436; 87 } 88 89 .topo-canvas{ 90 background:#ffffff; 91 border-radius:10px; 92 padding:16px 18px; 93 box-shadow:0 2px 10px rgba(0,0,0,0.06); 94 margin-bottom:15px; 95 } 96 97 .topo-canvas h4{ 98 margin:0 0 8px 0; 99 font-weight:700; 100 color:#1f4e79; 101 } 102 103 .topo-canvas .subinfo{ 104 font-size:14px; 105 line-height:24px; 106 color:#555; 107 } 108 109 .topo-canvas .explicacao{ 110 margin-top:12px; 111 background:#f8fbff; 112 border:1px solid #d9ecff; 113 border-radius:8px; 114 padding:12px 14px; 115 font-size:14px; 116 line-height:22px; 117 color:#35516b; 118 } 119 120 .card-box{ 121 background:#ffffff; 122 border-radius:10px; 123 padding:15px; 124 box-shadow:0 2px 10px rgba(0,0,0,0.06); 125 margin-bottom:15px; 126 } 127 128 .titulo-box{ 129 font-size:15px; 130 font-weight:700; 131 color:#334e68; 132 margin-bottom:10px; 133 } 134 135 .img-comparacao{ 136 width:100%; 137 height:260px; 138 object-fit:contain; 139 border:1px solid #ddd; 140 border-radius:8px; 141 background:#fafafa; 142 padding:4px; 143 } 144 145 .canvas-wrapper{ 146 width:100%; 147 overflow:auto; 148 background:#fafafa; 149 border:1px solid #ddd; 150 border-radius:8px; 151 padding:8px; 152 text-align:center; 153 } 154 155 canvas{ 156 display:block; 157 margin:0 auto; 158 background:#fff; 159 border:1px solid #ddd; 160 max-width:100%; 161 height:auto; 162 cursor:move; 163 touch-action:none; 164 } 165 166 .painel-ferramentas{ 167 position:sticky; 168 top:15px; 169 } 170 171 .preview-protese{ 172 max-width:100%; 173 max-height:120px; 174 border:1px solid #ddd; 175 padding:3px; 176 border-radius:4px; 177 display:none; 178 margin-top:8px; 179 background:#fff; 180 } 181 182 .info-canvas{ 183 background:#fff8e8; 184 border:1px solid #ffe3a6; 185 border-radius:8px; 186 padding:10px 12px; 187 font-size:13px; 188 line-height:21px; 189 color:#7a5a16; 190 margin-bottom:12px; 191 } 192 193 .rotulo-range{ 194 font-size:13px; 195 font-weight:700; 196 color:#5b6570; 197 margin-bottom:4px; 198 } 199 200 .valor-range{ 201 font-size:12px; 202 color:#7c8b98; 203 float:right; 204 } 205 206 .grupo-botoes .btn{ 207 margin-bottom:10px; 208 } 209 210 .badge-canvas{ 211 display:inline-block; 212 padding:4px 10px; 213 border-radius:20px; 214 font-size:12px; 215 font-weight:700; 216 background:#eef5ff; 217 color:#2f6fad; 218 margin-top:8px; 219 } 220 221 @media (max-width: 991px){ 222 .painel-ferramentas{ 223 position:relative; 224 top:auto; 225 } 226 } 227 228 @media (max-width: 768px){ 229 body{ 230 padding:10px; 231 } 232 233 .img-comparacao{ 234 height:220px; 235 } 236 } 237 </style> 238</head> 239<body> 240 241<div class="container-fluid"> 242 243 <div class="topo-canvas"> 244 <h4>Canvas de Ajuste Fino da Simulação</h4> 245 246 <div class="subinfo"> 247 <b>Cliente:</b> <?php echo $cliente ?> &nbsp;&nbsp; 248 <b>Prótese:</b> <?php echo $modelo ?> 249 </div> 250 251 <div class="explicacao"> 252 Este módulo permite o <b>refinamento manual da simulação</b>. 253 O profissional pode comparar a foto original com a simulação gerada pela IA e realizar ajustes visuais finais antes da apresentação ao cliente. 254 <br> 255 <span class="badge-canvas">Função do módulo: validação e ajuste visual final</span> 256 </div> 257 </div> 258 259 <div class="row"> 260 <div class="col-md-4"> 261 <div class="card-box"> 262 <div class="titulo-box">Foto Original</div> 263 <img src="<?php echo $url_foto_original ?>" class="img-comparacao"> 264 </div> 265 </div> 266 267 <div class="col-md-4"> 268 <div class="card-box"> 269 <div class="titulo-box">Simulação Gerada pela IA</div> 270 <?php if($url_imagem_simulada != ""){ ?> 271 <img src="<?php echo $url_imagem_simulada ?>" class="img-comparacao"> 272 <?php }else{ ?> 273 <div class="info-canvas">Nenhuma simulação gerada por IA até o momento.</div> 274 <?php } ?> 275 </div> 276 </div> 277 278 <div class="col-md-4"> 279 <div class="card-box painel-ferramentas"> 280 <div class="titulo-box">Ferramentas de Ajuste</div> 281 282 <div class="info-canvas"> 283 Carregue o arquivo da prótese e ajuste manualmente sobre a foto original usando posição, escala, rotação e opacidade. 284 </div> 285 286 <div class="form-group"> 287 <label>Arquivo da Prótese</label> 288 <input type="file" id="overlayInput" class="form-control" accept="image/png,image/webp,image/jpeg"> 289 <img id="previewProtese" class="preview-protese"> 290 </div> 291 292 <div class="form-group"> 293 <div class="rotulo-range"> 294 Tamanho 295 <span class="valor-range" id="valorScale">100%</span> 296 </div> 297 <input type="range" id="scaleRange" class="form-control" min="10" max="300" value="100"> 298 </div> 299 300 <div class="form-group"> 301 <div class="rotulo-range"> 302 Rotação 303 <span class="valor-range" id="valorRotate">0°</span> 304 </div> 305 <input type="range" id="rotateRange" class="form-control" min="-180" max="180" value="0"> 306 </div> 307 308 <div class="form-group"> 309 <div class="rotulo-range"> 310 Opacidade 311 <span class="valor-range" id="valorOpacity">100%</span> 312 </div> 313 <input type="range" id="opacityRange" class="form-control" min="10" max="100" value="100"> 314 </div> 315 316 <div class="grupo-botoes"> 317 <button type="button" class="btn btn-secondary btn-block" id="btnResetar">Resetar Ajuste</button> 318 <button type="button" class="btn btn-primary btn-block" id="btnSalvar">Salvar Ajuste Final</button> 319 <a href="../../simulador" class="btn btn-default btn-block">Voltar</a> 320 </div> 321 322 <small><div id="mensagem" align="center"></div></small> 323 </div> 324 </div> 325 </div> 326 327 <div class="card-box"> 328 <div class="titulo-box">Editor Manual da Prótese</div> 329 330 <div class="info-canvas"> 331 Área de ajuste fino da simulação. 332 Arraste a prótese sobre a imagem, ajuste o tamanho, a rotação e a opacidade, e então salve o resultado final. 333 </div> 334 335 <div class="canvas-wrapper"> 336 <canvas id="canvas"></canvas> 337 </div> 338 </div> 339 340</div> 341 342<script> 343var simId = "<?php echo $id ?>"; 344var fotoBase = "<?php echo $url_foto_original ?>"; 345 346var canvas = document.getElementById('canvas'); 347var ctx = canvas.getContext('2d'); 348 349var imgBase = new Image(); 350var imgOverlay = new Image(); 351 352var overlayCarregado = false; 353var dragging = false; 354var startX = 0; 355var startY = 0; 356var displayScale = 1; 357 358var overlay = { 359 x: 150, 360 y: 120, 361 width: 220, 362 height: 140, 363 rotation: 0, 364 opacity: 1 365}; 366 367var overlayOriginal = { 368 width: 220, 369 height: 140 370}; 371 372function atualizarLabels(){ 373 document.getElementById('valorScale').innerHTML = document.getElementById('scaleRange').value + '%'; 374 document.getElementById('valorRotate').innerHTML = document.getElementById('rotateRange').value + '°'; 375 document.getElementById('valorOpacity').innerHTML = document.getElementById('opacityRange').value + '%'; 376} 377 378function ajustarCanvasResponsivo(){ 379 var larguraMaxima = document.querySelector('.canvas-wrapper').clientWidth - 20; 380 381 if(larguraMaxima <= 0 || canvas.width <= 0){ 382 return; 383 } 384 385 if(canvas.width > larguraMaxima){ 386 displayScale = larguraMaxima / canvas.width; 387 canvas.style.width = larguraMaxima + 'px'; 388 canvas.style.height = (canvas.height * displayScale) + 'px'; 389 }else{ 390 displayScale = 1; 391 canvas.style.width = canvas.width + 'px'; 392 canvas.style.height = canvas.height + 'px'; 393 } 394} 395 396function resetarAjuste(){ 397 if(!overlayCarregado){ 398 return; 399 } 400 401 overlay.width = overlayOriginal.width; 402 overlay.height = overlayOriginal.height; 403 overlay.x = (canvas.width / 2) - (overlay.width / 2); 404 overlay.y = (canvas.height / 3) - (overlay.height / 2); 405 overlay.rotation = 0; 406 overlay.opacity = 1; 407 408 document.getElementById('scaleRange').value = 100; 409 document.getElementById('rotateRange').value = 0; 410 document.getElementById('opacityRange').value = 100; 411 412 atualizarLabels(); 413 desenhar(); 414} 415 416imgBase.onload = function(){ 417 canvas.width = imgBase.width; 418 canvas.height = imgBase.height; 419 desenhar(); 420 ajustarCanvasResponsivo(); 421}; 422 423imgBase.onerror = function(){ 424 document.getElementById('mensagem').innerHTML = '<span class="text-danger">Erro ao carregar a foto original</span>'; 425}; 426 427imgBase.src = fotoBase; 428 429function desenhar(){ 430 ctx.clearRect(0, 0, canvas.width, canvas.height); 431 ctx.drawImage(imgBase, 0, 0, canvas.width, canvas.height); 432 433 if(overlayCarregado){ 434 ctx.save(); 435 ctx.globalAlpha = overlay.opacity; 436 ctx.translate(overlay.x + overlay.width / 2, overlay.y + overlay.height / 2); 437 ctx.rotate(overlay.rotation * Math.PI / 180); 438 ctx.drawImage(imgOverlay, -overlay.width / 2, -overlay.height / 2, overlay.width, overlay.height); 439 ctx.restore(); 440 } 441} 442 443function getCanvasCoords(clientX, clientY){ 444 var rect = canvas.getBoundingClientRect(); 445 446 return { 447 x: (clientX - rect.left) / displayScale, 448 y: (clientY - rect.top) / displayScale 449 }; 450} 451 452document.getElementById('overlayInput').addEventListener('change', function(e){ 453 var arquivo = e.target.files[0]; 454 if(!arquivo){ 455 return; 456 } 457 458 var reader = new FileReader(); 459 reader.onload = function(event){ 460 document.getElementById('previewProtese').src = event.target.result; 461 document.getElementById('previewProtese').style.display = 'block'; 462 463 imgOverlay.onload = function(){ 464 overlayCarregado = true; 465 466 overlay.width = imgOverlay.width; 467 overlay.height = imgOverlay.height; 468 469 if(overlay.width > 300){ 470 var proporcao = overlay.height / overlay.width; 471 overlay.width = 300; 472 overlay.height = 300 * proporcao; 473 } 474 475 overlayOriginal.width = overlay.width; 476 overlayOriginal.height = overlay.height; 477 478 overlay.x = (canvas.width / 2) - (overlay.width / 2); 479 overlay.y = (canvas.height / 3) - (overlay.height / 2); 480 overlay.rotation = 0; 481 overlay.opacity = 1; 482 483 document.getElementById('scaleRange').value = 100; 484 document.getElementById('rotateRange').value = 0; 485 document.getElementById('opacityRange').value = 100; 486 487 atualizarLabels(); 488 desenhar(); 489 }; 490 491 imgOverlay.src = event.target.result; 492 }; 493 494 reader.readAsDataURL(arquivo); 495}); 496 497canvas.addEventListener('mousedown', function(e){ 498 if(!overlayCarregado){ 499 return; 500 } 501 502 var pos = getCanvasCoords(e.clientX, e.clientY); 503 504 if( 505 pos.x >= overlay.x && 506 pos.x <= overlay.x + overlay.width && 507 pos.y >= overlay.y && 508 pos.y <= overlay.y + overlay.height 509 ){ 510 dragging = true; 511 startX = pos.x - overlay.x; 512 startY = pos.y - overlay.y; 513 } 514}); 515 516canvas.addEventListener('mousemove', function(e){ 517 if(!dragging){ 518 return; 519 } 520 521 var pos = getCanvasCoords(e.clientX, e.clientY); 522 523 overlay.x = pos.x - startX; 524 overlay.y = pos.y - startY; 525 desenhar(); 526}); 527 528canvas.addEventListener('mouseup', function(){ 529 dragging = false; 530}); 531 532canvas.addEventListener('mouseleave', function(){ 533 dragging = false; 534}); 535 536canvas.addEventListener('touchstart', function(e){ 537 if(!overlayCarregado){ 538 return; 539 } 540 541 var toque = e.touches[0]; 542 var pos = getCanvasCoords(toque.clientX, toque.clientY); 543 544 if( 545 pos.x >= overlay.x && 546 pos.x <= overlay.x + overlay.width && 547 pos.y >= overlay.y && 548 pos.y <= overlay.y + overlay.height 549 ){ 550 dragging = true; 551 startX = pos.x - overlay.x; 552 startY = pos.y - overlay.y; 553 } 554 555 e.preventDefault(); 556}, {passive:false}); 557 558canvas.addEventListener('touchmove', function(e){ 559 if(!dragging){ 560 return; 561 } 562 563 var toque = e.touches[0]; 564 var pos = getCanvasCoords(toque.clientX, toque.clientY); 565 566 overlay.x = pos.x - startX; 567 overlay.y = pos.y - startY; 568 desenhar(); 569 570 e.preventDefault(); 571}, {passive:false}); 572 573canvas.addEventListener('touchend', function(){ 574 dragging = false; 575}); 576 577document.getElementById('scaleRange').addEventListener('input', function(){ 578 if(!overlayCarregado){ 579 return; 580 } 581 582 var valor = parseInt(this.value); 583 var proporcao = overlayOriginal.height / overlayOriginal.width; 584 585 overlay.width = overlayOriginal.width * (valor / 100); 586 overlay.height = overlay.width * proporcao; 587 588 atualizarLabels(); 589 desenhar(); 590}); 591 592document.getElementById('rotateRange').addEventListener('input', function(){ 593 if(!overlayCarregado){ 594 return; 595 } 596 597 overlay.rotation = parseInt(this.value); 598 atualizarLabels(); 599 desenhar(); 600}); 601 602document.getElementById('opacityRange').addEventListener('input', function(){ 603 if(!overlayCarregado){ 604 return; 605 } 606 607 overlay.opacity = parseInt(this.value) / 100; 608 atualizarLabels(); 609 desenhar(); 610}); 611 612document.getElementById('btnResetar').addEventListener('click', function(){ 613 resetarAjuste(); 614}); 615 616document.getElementById('btnSalvar').addEventListener('click', function(){ 617 618 if(!overlayCarregado){ 619 document.getElementById('mensagem').innerHTML = '<span class="text-danger">Carregue o arquivo da prótese para ajuste manual</span>'; 620 return; 621 } 622 623 var imagemFinal = canvas.toDataURL('image/png'); 624 625 if(imagemFinal == ''){ 626 document.getElementById('mensagem').innerHTML = '<span class="text-danger">Erro ao gerar imagem do canvas</span>'; 627 return; 628 } 629 630 var xhr = new XMLHttpRequest(); 631 xhr.open('POST', 'salvar_canvas.php', true); 632 xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded'); 633 634 xhr.onreadystatechange = function(){ 635 if(xhr.readyState == 4){ 636 if(xhr.responseText.trim() == 'Salvo com Sucesso'){ 637 document.getElementById('mensagem').innerHTML = '<span class="text-success">Ajuste final salvo com sucesso</span>'; 638 }else{ 639 document.getElementById('mensagem').innerHTML = '<span class="text-danger">' + xhr.responseText + '</span>'; 640 } 641 } 642 }; 643 644 xhr.send('id=' + encodeURIComponent(simId) + '&img=' + encodeURIComponent(imagemFinal)); 645}); 646 647window.addEventListener('resize', function(){ 648 ajustarCanvasResponsivo(); 649}); 650 651atualizarLabels(); 652</script> 653 654</body> 655</html>

Leitura linha por linha

LinhaCódigoExplicação técnica
1<?phpAbre um bloco PHP executado no servidor.
2require_once("../../../conexao.php");Carrega o arquivo ou a dependência indicada na própria linha.
3 Linha em branco usada para separar blocos do arquivo.
4$tabela = 'simulacoes_protese';Atribui o valor ou resultado exibido à variável.
5$pasta_upload = __DIR__ . '/../../images/simulacoes/';Atribui o valor ou resultado exibido à variável.
6 Linha em branco usada para separar blocos do arquivo.
7$id = @$_GET['id'];Atribui o valor ou resultado exibido à variável.
8 Linha em branco usada para separar blocos do arquivo.
9if($id == ""){Avalia a condição escrita nesta linha.
10 echo 'ID não informado';Envia conteúdo para a saída da requisição.
11 exit();Interrompe a execução neste ponto.
12}Fecha ou delimita a estrutura iniciada anteriormente.
13 Linha em branco usada para separar blocos do arquivo.
14// Alterado para LEFT JOIN para permitir carregar o Canvas de simulações oriundas do front-endComentário existente no código-fonte.
15$query = $pdo->prepare("SELECT s.*, c.nome as nome_cliente, p.modelo Prepara uma instrução SQL com PDO.
16 FROM $tabela sLinha do arquivo original; deve ser lida junto com o bloco em que está inserida.
17 LEFT JOIN clientes c ON s.cliente = c.idLinha do arquivo original; deve ser lida junto com o bloco em que está inserida.
18 LEFT JOIN proteses p ON s.id_protese = p.idLinha do arquivo original; deve ser lida junto com o bloco em que está inserida.
19 WHERE s.id = :id");Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
20$query->bindValue(":id", $id);Associa um valor ao parâmetro da consulta preparada.
21$query->execute();Executa a instrução preparada.
22$res = $query->fetchAll(PDO::FETCH_ASSOC);Lê dados retornados pela consulta.
23 Linha em branco usada para separar blocos do arquivo.
24if(@count($res) == 0){Avalia a condição escrita nesta linha.
25 echo 'Registro não encontrado';Envia conteúdo para a saída da requisição.
26 exit();Interrompe a execução neste ponto.
27}Fecha ou delimita a estrutura iniciada anteriormente.
28 Linha em branco usada para separar blocos do arquivo.
29$cliente = !empty($res[0]['nome_cliente']) ? $res[0]['nome_cliente'] : "Cliente da Página Inicial";Atribui o valor ou resultado exibido à variável.
30$modelo = !empty($res[0]['modelo']) ? $res[0]['modelo'] : "Não associado";Atribui o valor ou resultado exibido à variável.
31$foto_original = $res[0]['foto_original'];Atribui o valor ou resultado exibido à variável.
32$imagem_simulada = $res[0]['imagem_simulada'];Atribui o valor ou resultado exibido à variável.
33 Linha em branco usada para separar blocos do arquivo.
34if($foto_original == ""){Avalia a condição escrita nesta linha.
35 echo 'Nenhuma foto original enviada';Envia conteúdo para a saída da requisição.
36 exit();Interrompe a execução neste ponto.
37}Fecha ou delimita a estrutura iniciada anteriormente.
38 Linha em branco usada para separar blocos do arquivo.
39if(!is_dir($pasta_upload)){Avalia a condição escrita nesta linha.
40 echo 'Pasta de imagens da simulação não encontrada';Envia conteúdo para a saída da requisição.
41 exit();Interrompe a execução neste ponto.
42}Fecha ou delimita a estrutura iniciada anteriormente.
43 Linha em branco usada para separar blocos do arquivo.
44if(!is_readable($pasta_upload)){Avalia a condição escrita nesta linha.
45 echo 'Pasta de imagens da simulação sem permissão de leitura';Envia conteúdo para a saída da requisição.
46 exit();Interrompe a execução neste ponto.
47}Fecha ou delimita a estrutura iniciada anteriormente.
48 Linha em branco usada para separar blocos do arquivo.
49$foto_base = $pasta_upload . $foto_original;Atribui o valor ou resultado exibido à variável.
50 Linha em branco usada para separar blocos do arquivo.
51if(!file_exists($foto_base)){Avalia a condição escrita nesta linha.
52 echo 'Arquivo da foto original não encontrado';Envia conteúdo para a saída da requisição.
53 exit();Interrompe a execução neste ponto.
54}Fecha ou delimita a estrutura iniciada anteriormente.
55 Linha em branco usada para separar blocos do arquivo.
56if(!is_file($foto_base)){Avalia a condição escrita nesta linha.
57 echo 'Arquivo da foto original inválido';Envia conteúdo para a saída da requisição.
58 exit();Interrompe a execução neste ponto.
59}Fecha ou delimita a estrutura iniciada anteriormente.
60 Linha em branco usada para separar blocos do arquivo.
61if(!is_readable($foto_base)){Avalia a condição escrita nesta linha.
62 echo 'Arquivo da foto original sem permissão de leitura';Envia conteúdo para a saída da requisição.
63 exit();Interrompe a execução neste ponto.
64}Fecha ou delimita a estrutura iniciada anteriormente.
65 Linha em branco usada para separar blocos do arquivo.
66$url_foto_original = '../../images/simulacoes/' . $foto_original . '?v=' . time();Atribui o valor ou resultado exibido à variável.
67$url_imagem_simulada = '';Atribui o valor ou resultado exibido à variável.
68 Linha em branco usada para separar blocos do arquivo.
69if($imagem_simulada != ""){Avalia a condição escrita nesta linha.
70 $url_imagem_simulada = '../../images/simulacoes/' . $imagem_simulada . '?v=' . time();Atribui o valor ou resultado exibido à variável.
71}Fecha ou delimita a estrutura iniciada anteriormente.
72?>Fecha o bloco PHP.
73<!DOCTYPE html>Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
74<html lang="pt-br">Marca HTML presente na saída da página.
75<head>Marca HTML presente na saída da página.
76 <meta charset="utf-8">Marca HTML presente na saída da página.
77 <meta name="viewport" content="width=device-width, initial-scale=1">Marca HTML presente na saída da página.
78 <title>Canvas de Ajuste Fino</title>Marca HTML presente na saída da página.
79 <link rel="stylesheet" href="../../css/bootstrap.min.css">Marca HTML presente na saída da página.
80 Linha em branco usada para separar blocos do arquivo.
81 <style type="text/css">Marca HTML presente na saída da página.
82 body{Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
83 background:#f4f6f9;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
84 font-family: Arial, sans-serif;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
85 padding:15px;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
86 color:#2d3436;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
87 }Fecha ou delimita a estrutura iniciada anteriormente.
88 Linha em branco usada para separar blocos do arquivo.
89 .topo-canvas{Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
90 background:#ffffff;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
91 border-radius:10px;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
92 padding:16px 18px;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
93 box-shadow:0 2px 10px rgba(0,0,0,0.06);Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
94 margin-bottom:15px;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
95 }Fecha ou delimita a estrutura iniciada anteriormente.
96 Linha em branco usada para separar blocos do arquivo.
97 .topo-canvas h4{Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
98 margin:0 0 8px 0;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
99 font-weight:700;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
100 color:#1f4e79;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
101 }Fecha ou delimita a estrutura iniciada anteriormente.
102 Linha em branco usada para separar blocos do arquivo.
103 .topo-canvas .subinfo{Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
104 font-size:14px;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
105 line-height:24px;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
106 color:#555;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
107 }Fecha ou delimita a estrutura iniciada anteriormente.
108 Linha em branco usada para separar blocos do arquivo.
109 .topo-canvas .explicacao{Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
110 margin-top:12px;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
111 background:#f8fbff;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
112 border:1px solid #d9ecff;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
113 border-radius:8px;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
114 padding:12px 14px;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
115 font-size:14px;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
116 line-height:22px;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
117 color:#35516b;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
118 }Fecha ou delimita a estrutura iniciada anteriormente.
119 Linha em branco usada para separar blocos do arquivo.
120 .card-box{Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
121 background:#ffffff;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
122 border-radius:10px;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
123 padding:15px;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
124 box-shadow:0 2px 10px rgba(0,0,0,0.06);Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
125 margin-bottom:15px;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
126 }Fecha ou delimita a estrutura iniciada anteriormente.
127 Linha em branco usada para separar blocos do arquivo.
128 .titulo-box{Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
129 font-size:15px;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
130 font-weight:700;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
131 color:#334e68;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
132 margin-bottom:10px;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
133 }Fecha ou delimita a estrutura iniciada anteriormente.
134 Linha em branco usada para separar blocos do arquivo.
135 .img-comparacao{Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
136 width:100%;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
137 height:260px;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
138 object-fit:contain;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
139 border:1px solid #ddd;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
140 border-radius:8px;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
141 background:#fafafa;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
142 padding:4px;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
143 }Fecha ou delimita a estrutura iniciada anteriormente.
144 Linha em branco usada para separar blocos do arquivo.
145 .canvas-wrapper{Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
146 width:100%;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
147 overflow:auto;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
148 background:#fafafa;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
149 border:1px solid #ddd;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
150 border-radius:8px;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
151 padding:8px;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
152 text-align:center;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
153 }Fecha ou delimita a estrutura iniciada anteriormente.
154 Linha em branco usada para separar blocos do arquivo.
155 canvas{Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
156 display:block;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
157 margin:0 auto;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
158 background:#fff;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
159 border:1px solid #ddd;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
160 max-width:100%;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
161 height:auto;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
162 cursor:move;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
163 touch-action:none;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
164 }Fecha ou delimita a estrutura iniciada anteriormente.
165 Linha em branco usada para separar blocos do arquivo.
166 .painel-ferramentas{Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
167 position:sticky;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
168 top:15px;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
169 }Fecha ou delimita a estrutura iniciada anteriormente.
170 Linha em branco usada para separar blocos do arquivo.
171 .preview-protese{Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
172 max-width:100%;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
173 max-height:120px;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
174 border:1px solid #ddd;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
175 padding:3px;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
176 border-radius:4px;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
177 display:none;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
178 margin-top:8px;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
179 background:#fff;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
180 }Fecha ou delimita a estrutura iniciada anteriormente.
181 Linha em branco usada para separar blocos do arquivo.
182 .info-canvas{Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
183 background:#fff8e8;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
184 border:1px solid #ffe3a6;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
185 border-radius:8px;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
186 padding:10px 12px;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
187 font-size:13px;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
188 line-height:21px;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
189 color:#7a5a16;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
190 margin-bottom:12px;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
191 }Fecha ou delimita a estrutura iniciada anteriormente.
192 Linha em branco usada para separar blocos do arquivo.
193 .rotulo-range{Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
194 font-size:13px;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
195 font-weight:700;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
196 color:#5b6570;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
197 margin-bottom:4px;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
198 }Fecha ou delimita a estrutura iniciada anteriormente.
199 Linha em branco usada para separar blocos do arquivo.
200 .valor-range{Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
201 font-size:12px;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
202 color:#7c8b98;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
203 float:right;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
204 }Fecha ou delimita a estrutura iniciada anteriormente.
205 Linha em branco usada para separar blocos do arquivo.
206 .grupo-botoes .btn{Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
207 margin-bottom:10px;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
208 }Fecha ou delimita a estrutura iniciada anteriormente.
209 Linha em branco usada para separar blocos do arquivo.
210 .badge-canvas{Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
211 display:inline-block;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
212 padding:4px 10px;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
213 border-radius:20px;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
214 font-size:12px;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
215 font-weight:700;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
216 background:#eef5ff;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
217 color:#2f6fad;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
218 margin-top:8px;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
219 }Fecha ou delimita a estrutura iniciada anteriormente.
220 Linha em branco usada para separar blocos do arquivo.
221 @media (max-width: 991px){Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
222 .painel-ferramentas{Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
223 position:relative;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
224 top:auto;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
225 }Fecha ou delimita a estrutura iniciada anteriormente.
226 }Fecha ou delimita a estrutura iniciada anteriormente.
227 Linha em branco usada para separar blocos do arquivo.
228 @media (max-width: 768px){Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
229 body{Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
230 padding:10px;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
231 }Fecha ou delimita a estrutura iniciada anteriormente.
232 Linha em branco usada para separar blocos do arquivo.
233 .img-comparacao{Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
234 height:220px;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
235 }Fecha ou delimita a estrutura iniciada anteriormente.
236 }Fecha ou delimita a estrutura iniciada anteriormente.
237 </style>Marca HTML presente na saída da página.
238</head>Marca HTML presente na saída da página.
239<body>Marca HTML presente na saída da página.
240 Linha em branco usada para separar blocos do arquivo.
241<div class="container-fluid">Marca HTML presente na saída da página.
242 Linha em branco usada para separar blocos do arquivo.
243 <div class="topo-canvas">Marca HTML presente na saída da página.
244 <h4>Canvas de Ajuste Fino da Simulação</h4>Marca HTML presente na saída da página.
245 Linha em branco usada para separar blocos do arquivo.
246 <div class="subinfo">Marca HTML presente na saída da página.
247 <b>Cliente:</b> <?php echo $cliente ?> &nbsp;&nbsp;Marca HTML presente na saída da página.
248 <b>Prótese:</b> <?php echo $modelo ?>Marca HTML presente na saída da página.
249 </div>Marca HTML presente na saída da página.
250 Linha em branco usada para separar blocos do arquivo.
251 <div class="explicacao">Marca HTML presente na saída da página.
252 Este módulo permite o <b>refinamento manual da simulação</b>. Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
253 O profissional pode comparar a foto original com a simulação gerada pela IA e realizar ajustes visuais finais antes da apresentação ao cliente.Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
254 <br>Marca HTML presente na saída da página.
255 <span class="badge-canvas">Função do módulo: validação e ajuste visual final</span>Marca HTML presente na saída da página.
256 </div>Marca HTML presente na saída da página.
257 </div>Marca HTML presente na saída da página.
258 Linha em branco usada para separar blocos do arquivo.
259 <div class="row">Marca HTML presente na saída da página.
260 <div class="col-md-4">Marca HTML presente na saída da página.
261 <div class="card-box">Marca HTML presente na saída da página.
262 <div class="titulo-box">Foto Original</div>Marca HTML presente na saída da página.
263 <img src="<?php echo $url_foto_original ?>" class="img-comparacao">Marca HTML presente na saída da página.
264 </div>Marca HTML presente na saída da página.
265 </div>Marca HTML presente na saída da página.
266 Linha em branco usada para separar blocos do arquivo.
267 <div class="col-md-4">Marca HTML presente na saída da página.
268 <div class="card-box">Marca HTML presente na saída da página.
269 <div class="titulo-box">Simulação Gerada pela IA</div>Marca HTML presente na saída da página.
270 <?php if($url_imagem_simulada != ""){ ?>Abre um bloco PHP executado no servidor.
271 <img src="<?php echo $url_imagem_simulada ?>" class="img-comparacao">Marca HTML presente na saída da página.
272 <?php }else{ ?>Abre um bloco PHP executado no servidor.
273 <div class="info-canvas">Nenhuma simulação gerada por IA até o momento.</div>Marca HTML presente na saída da página.
274 <?php } ?>Abre um bloco PHP executado no servidor.
275 </div>Marca HTML presente na saída da página.
276 </div>Marca HTML presente na saída da página.
277 Linha em branco usada para separar blocos do arquivo.
278 <div class="col-md-4">Marca HTML presente na saída da página.
279 <div class="card-box painel-ferramentas">Marca HTML presente na saída da página.
280 <div class="titulo-box">Ferramentas de Ajuste</div>Marca HTML presente na saída da página.
281 Linha em branco usada para separar blocos do arquivo.
282 <div class="info-canvas">Marca HTML presente na saída da página.
283 Carregue o arquivo da prótese e ajuste manualmente sobre a foto original usando posição, escala, rotação e opacidade.Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
284 </div>Marca HTML presente na saída da página.
285 Linha em branco usada para separar blocos do arquivo.
286 <div class="form-group">Marca HTML presente na saída da página.
287 <label>Arquivo da Prótese</label>Marca HTML presente na saída da página.
288 <input type="file" id="overlayInput" class="form-control" accept="image/png,image/webp,image/jpeg">Marca HTML presente na saída da página.
289 <img id="previewProtese" class="preview-protese">Marca HTML presente na saída da página.
290 </div>Marca HTML presente na saída da página.
291 Linha em branco usada para separar blocos do arquivo.
292 <div class="form-group">Marca HTML presente na saída da página.
293 <div class="rotulo-range">Marca HTML presente na saída da página.
294 TamanhoLinha do arquivo original; deve ser lida junto com o bloco em que está inserida.
295 <span class="valor-range" id="valorScale">100%</span>Marca HTML presente na saída da página.
296 </div>Marca HTML presente na saída da página.
297 <input type="range" id="scaleRange" class="form-control" min="10" max="300" value="100">Marca HTML presente na saída da página.
298 </div>Marca HTML presente na saída da página.
299 Linha em branco usada para separar blocos do arquivo.
300 <div class="form-group">Marca HTML presente na saída da página.
301 <div class="rotulo-range">Marca HTML presente na saída da página.
302 RotaçãoLinha do arquivo original; deve ser lida junto com o bloco em que está inserida.
303 <span class="valor-range" id="valorRotate">0°</span>Marca HTML presente na saída da página.
304 </div>Marca HTML presente na saída da página.
305 <input type="range" id="rotateRange" class="form-control" min="-180" max="180" value="0">Marca HTML presente na saída da página.
306 </div>Marca HTML presente na saída da página.
307 Linha em branco usada para separar blocos do arquivo.
308 <div class="form-group">Marca HTML presente na saída da página.
309 <div class="rotulo-range">Marca HTML presente na saída da página.
310 OpacidadeLinha do arquivo original; deve ser lida junto com o bloco em que está inserida.
311 <span class="valor-range" id="valorOpacity">100%</span>Marca HTML presente na saída da página.
312 </div>Marca HTML presente na saída da página.
313 <input type="range" id="opacityRange" class="form-control" min="10" max="100" value="100">Marca HTML presente na saída da página.
314 </div>Marca HTML presente na saída da página.
315 Linha em branco usada para separar blocos do arquivo.
316 <div class="grupo-botoes">Marca HTML presente na saída da página.
317 <button type="button" class="btn btn-secondary btn-block" id="btnResetar">Resetar Ajuste</button>Marca HTML presente na saída da página.
318 <button type="button" class="btn btn-primary btn-block" id="btnSalvar">Salvar Ajuste Final</button>Marca HTML presente na saída da página.
319 <a href="../../simulador" class="btn btn-default btn-block">Voltar</a>Marca HTML presente na saída da página.
320 </div>Marca HTML presente na saída da página.
321 Linha em branco usada para separar blocos do arquivo.
322 <small><div id="mensagem" align="center"></div></small>Marca HTML presente na saída da página.
323 </div>Marca HTML presente na saída da página.
324 </div>Marca HTML presente na saída da página.
325 </div>Marca HTML presente na saída da página.
326 Linha em branco usada para separar blocos do arquivo.
327 <div class="card-box">Marca HTML presente na saída da página.
328 <div class="titulo-box">Editor Manual da Prótese</div>Marca HTML presente na saída da página.
329 Linha em branco usada para separar blocos do arquivo.
330 <div class="info-canvas">Marca HTML presente na saída da página.
331 Área de ajuste fino da simulação. Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
332 Arraste a prótese sobre a imagem, ajuste o tamanho, a rotação e a opacidade, e então salve o resultado final.Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
333 </div>Marca HTML presente na saída da página.
334 Linha em branco usada para separar blocos do arquivo.
335 <div class="canvas-wrapper">Marca HTML presente na saída da página.
336 <canvas id="canvas"></canvas>Marca HTML presente na saída da página.
337 </div>Marca HTML presente na saída da página.
338 </div>Marca HTML presente na saída da página.
339 Linha em branco usada para separar blocos do arquivo.
340</div>Marca HTML presente na saída da página.
341 Linha em branco usada para separar blocos do arquivo.
342<script>Marca HTML presente na saída da página.
343var simId = "<?php echo $id ?>";Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
344var fotoBase = "<?php echo $url_foto_original ?>";Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
345 Linha em branco usada para separar blocos do arquivo.
346var canvas = document.getElementById('canvas');Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
347var ctx = canvas.getContext('2d');Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
348 Linha em branco usada para separar blocos do arquivo.
349var imgBase = new Image();Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
350var imgOverlay = new Image();Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
351 Linha em branco usada para separar blocos do arquivo.
352var overlayCarregado = false;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
353var dragging = false;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
354var startX = 0;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
355var startY = 0;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
356var displayScale = 1;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
357 Linha em branco usada para separar blocos do arquivo.
358var overlay = {Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
359 x: 150,Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
360 y: 120,Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
361 width: 220,Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
362 height: 140,Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
363 rotation: 0,Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
364 opacity: 1Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
365};Fecha ou delimita a estrutura iniciada anteriormente.
366 Linha em branco usada para separar blocos do arquivo.
367var overlayOriginal = {Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
368 width: 220,Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
369 height: 140Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
370};Fecha ou delimita a estrutura iniciada anteriormente.
371 Linha em branco usada para separar blocos do arquivo.
372function atualizarLabels(){Declara a função e os parâmetros mostrados.
373 document.getElementById('valorScale').innerHTML = document.getElementById('scaleRange').value + '%';Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
374 document.getElementById('valorRotate').innerHTML = document.getElementById('rotateRange').value + '°';Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
375 document.getElementById('valorOpacity').innerHTML = document.getElementById('opacityRange').value + '%';Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
376}Fecha ou delimita a estrutura iniciada anteriormente.
377 Linha em branco usada para separar blocos do arquivo.
378function ajustarCanvasResponsivo(){Declara a função e os parâmetros mostrados.
379 var larguraMaxima = document.querySelector('.canvas-wrapper').clientWidth - 20;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
380 Linha em branco usada para separar blocos do arquivo.
381 if(larguraMaxima <= 0 || canvas.width <= 0){Avalia a condição escrita nesta linha.
382 return;Retorna o valor indicado pela linha.
383 }Fecha ou delimita a estrutura iniciada anteriormente.
384 Linha em branco usada para separar blocos do arquivo.
385 if(canvas.width > larguraMaxima){Avalia a condição escrita nesta linha.
386 displayScale = larguraMaxima / canvas.width;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
387 canvas.style.width = larguraMaxima + 'px';Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
388 canvas.style.height = (canvas.height * displayScale) + 'px';Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
389 }else{Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
390 displayScale = 1;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
391 canvas.style.width = canvas.width + 'px';Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
392 canvas.style.height = canvas.height + 'px';Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
393 }Fecha ou delimita a estrutura iniciada anteriormente.
394}Fecha ou delimita a estrutura iniciada anteriormente.
395 Linha em branco usada para separar blocos do arquivo.
396function resetarAjuste(){Declara a função e os parâmetros mostrados.
397 if(!overlayCarregado){Avalia a condição escrita nesta linha.
398 return;Retorna o valor indicado pela linha.
399 }Fecha ou delimita a estrutura iniciada anteriormente.
400 Linha em branco usada para separar blocos do arquivo.
401 overlay.width = overlayOriginal.width;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
402 overlay.height = overlayOriginal.height;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
403 overlay.x = (canvas.width / 2) - (overlay.width / 2);Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
404 overlay.y = (canvas.height / 3) - (overlay.height / 2);Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
405 overlay.rotation = 0;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
406 overlay.opacity = 1;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
407 Linha em branco usada para separar blocos do arquivo.
408 document.getElementById('scaleRange').value = 100;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
409 document.getElementById('rotateRange').value = 0;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
410 document.getElementById('opacityRange').value = 100;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
411 Linha em branco usada para separar blocos do arquivo.
412 atualizarLabels();Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
413 desenhar();Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
414}Fecha ou delimita a estrutura iniciada anteriormente.
415 Linha em branco usada para separar blocos do arquivo.
416imgBase.onload = function(){Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
417 canvas.width = imgBase.width;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
418 canvas.height = imgBase.height;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
419 desenhar();Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
420 ajustarCanvasResponsivo();Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
421};Fecha ou delimita a estrutura iniciada anteriormente.
422 Linha em branco usada para separar blocos do arquivo.
423imgBase.onerror = function(){Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
424 document.getElementById('mensagem').innerHTML = '<span class="text-danger">Erro ao carregar a foto original</span>';Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
425};Fecha ou delimita a estrutura iniciada anteriormente.
426 Linha em branco usada para separar blocos do arquivo.
427imgBase.src = fotoBase;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
428 Linha em branco usada para separar blocos do arquivo.
429function desenhar(){Declara a função e os parâmetros mostrados.
430 ctx.clearRect(0, 0, canvas.width, canvas.height);Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
431 ctx.drawImage(imgBase, 0, 0, canvas.width, canvas.height);Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
432 Linha em branco usada para separar blocos do arquivo.
433 if(overlayCarregado){Avalia a condição escrita nesta linha.
434 ctx.save();Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
435 ctx.globalAlpha = overlay.opacity;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
436 ctx.translate(overlay.x + overlay.width / 2, overlay.y + overlay.height / 2);Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
437 ctx.rotate(overlay.rotation * Math.PI / 180);Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
438 ctx.drawImage(imgOverlay, -overlay.width / 2, -overlay.height / 2, overlay.width, overlay.height);Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
439 ctx.restore();Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
440 }Fecha ou delimita a estrutura iniciada anteriormente.
441}Fecha ou delimita a estrutura iniciada anteriormente.
442 Linha em branco usada para separar blocos do arquivo.
443function getCanvasCoords(clientX, clientY){Declara a função e os parâmetros mostrados.
444 var rect = canvas.getBoundingClientRect();Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
445 Linha em branco usada para separar blocos do arquivo.
446 return {Retorna o valor indicado pela linha.
447 x: (clientX - rect.left) / displayScale,Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
448 y: (clientY - rect.top) / displayScaleLinha do arquivo original; deve ser lida junto com o bloco em que está inserida.
449 };Fecha ou delimita a estrutura iniciada anteriormente.
450}Fecha ou delimita a estrutura iniciada anteriormente.
451 Linha em branco usada para separar blocos do arquivo.
452document.getElementById('overlayInput').addEventListener('change', function(e){Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
453 var arquivo = e.target.files[0];Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
454 if(!arquivo){Avalia a condição escrita nesta linha.
455 return;Retorna o valor indicado pela linha.
456 }Fecha ou delimita a estrutura iniciada anteriormente.
457 Linha em branco usada para separar blocos do arquivo.
458 var reader = new FileReader();Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
459 reader.onload = function(event){Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
460 document.getElementById('previewProtese').src = event.target.result;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
461 document.getElementById('previewProtese').style.display = 'block';Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
462 Linha em branco usada para separar blocos do arquivo.
463 imgOverlay.onload = function(){Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
464 overlayCarregado = true;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
465 Linha em branco usada para separar blocos do arquivo.
466 overlay.width = imgOverlay.width;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
467 overlay.height = imgOverlay.height;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
468 Linha em branco usada para separar blocos do arquivo.
469 if(overlay.width > 300){Avalia a condição escrita nesta linha.
470 var proporcao = overlay.height / overlay.width;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
471 overlay.width = 300;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
472 overlay.height = 300 * proporcao;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
473 }Fecha ou delimita a estrutura iniciada anteriormente.
474 Linha em branco usada para separar blocos do arquivo.
475 overlayOriginal.width = overlay.width;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
476 overlayOriginal.height = overlay.height;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
477 Linha em branco usada para separar blocos do arquivo.
478 overlay.x = (canvas.width / 2) - (overlay.width / 2);Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
479 overlay.y = (canvas.height / 3) - (overlay.height / 2);Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
480 overlay.rotation = 0;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
481 overlay.opacity = 1;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
482 Linha em branco usada para separar blocos do arquivo.
483 document.getElementById('scaleRange').value = 100;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
484 document.getElementById('rotateRange').value = 0;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
485 document.getElementById('opacityRange').value = 100;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
486 Linha em branco usada para separar blocos do arquivo.
487 atualizarLabels();Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
488 desenhar();Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
489 };Fecha ou delimita a estrutura iniciada anteriormente.
490 Linha em branco usada para separar blocos do arquivo.
491 imgOverlay.src = event.target.result;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
492 };Fecha ou delimita a estrutura iniciada anteriormente.
493 Linha em branco usada para separar blocos do arquivo.
494 reader.readAsDataURL(arquivo);Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
495});Fecha ou delimita a estrutura iniciada anteriormente.
496 Linha em branco usada para separar blocos do arquivo.
497canvas.addEventListener('mousedown', function(e){Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
498 if(!overlayCarregado){Avalia a condição escrita nesta linha.
499 return;Retorna o valor indicado pela linha.
500 }Fecha ou delimita a estrutura iniciada anteriormente.
501 Linha em branco usada para separar blocos do arquivo.
502 var pos = getCanvasCoords(e.clientX, e.clientY);Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
503 Linha em branco usada para separar blocos do arquivo.
504 if(Avalia a condição escrita nesta linha.
505 pos.x >= overlay.x &&Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
506 pos.x <= overlay.x + overlay.width &&Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
507 pos.y >= overlay.y &&Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
508 pos.y <= overlay.y + overlay.heightLinha do arquivo original; deve ser lida junto com o bloco em que está inserida.
509 ){Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
510 dragging = true;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
511 startX = pos.x - overlay.x;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
512 startY = pos.y - overlay.y;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
513 }Fecha ou delimita a estrutura iniciada anteriormente.
514});Fecha ou delimita a estrutura iniciada anteriormente.
515 Linha em branco usada para separar blocos do arquivo.
516canvas.addEventListener('mousemove', function(e){Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
517 if(!dragging){Avalia a condição escrita nesta linha.
518 return;Retorna o valor indicado pela linha.
519 }Fecha ou delimita a estrutura iniciada anteriormente.
520 Linha em branco usada para separar blocos do arquivo.
521 var pos = getCanvasCoords(e.clientX, e.clientY);Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
522 Linha em branco usada para separar blocos do arquivo.
523 overlay.x = pos.x - startX;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
524 overlay.y = pos.y - startY;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
525 desenhar();Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
526});Fecha ou delimita a estrutura iniciada anteriormente.
527 Linha em branco usada para separar blocos do arquivo.
528canvas.addEventListener('mouseup', function(){Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
529 dragging = false;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
530});Fecha ou delimita a estrutura iniciada anteriormente.
531 Linha em branco usada para separar blocos do arquivo.
532canvas.addEventListener('mouseleave', function(){Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
533 dragging = false;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
534});Fecha ou delimita a estrutura iniciada anteriormente.
535 Linha em branco usada para separar blocos do arquivo.
536canvas.addEventListener('touchstart', function(e){Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
537 if(!overlayCarregado){Avalia a condição escrita nesta linha.
538 return;Retorna o valor indicado pela linha.
539 }Fecha ou delimita a estrutura iniciada anteriormente.
540 Linha em branco usada para separar blocos do arquivo.
541 var toque = e.touches[0];Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
542 var pos = getCanvasCoords(toque.clientX, toque.clientY);Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
543 Linha em branco usada para separar blocos do arquivo.
544 if(Avalia a condição escrita nesta linha.
545 pos.x >= overlay.x &&Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
546 pos.x <= overlay.x + overlay.width &&Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
547 pos.y >= overlay.y &&Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
548 pos.y <= overlay.y + overlay.heightLinha do arquivo original; deve ser lida junto com o bloco em que está inserida.
549 ){Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
550 dragging = true;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
551 startX = pos.x - overlay.x;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
552 startY = pos.y - overlay.y;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
553 }Fecha ou delimita a estrutura iniciada anteriormente.
554 Linha em branco usada para separar blocos do arquivo.
555 e.preventDefault();Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
556}, {passive:false});Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
557 Linha em branco usada para separar blocos do arquivo.
558canvas.addEventListener('touchmove', function(e){Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
559 if(!dragging){Avalia a condição escrita nesta linha.
560 return;Retorna o valor indicado pela linha.
561 }Fecha ou delimita a estrutura iniciada anteriormente.
562 Linha em branco usada para separar blocos do arquivo.
563 var toque = e.touches[0];Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
564 var pos = getCanvasCoords(toque.clientX, toque.clientY);Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
565 Linha em branco usada para separar blocos do arquivo.
566 overlay.x = pos.x - startX;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
567 overlay.y = pos.y - startY;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
568 desenhar();Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
569 Linha em branco usada para separar blocos do arquivo.
570 e.preventDefault();Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
571}, {passive:false});Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
572 Linha em branco usada para separar blocos do arquivo.
573canvas.addEventListener('touchend', function(){Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
574 dragging = false;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
575});Fecha ou delimita a estrutura iniciada anteriormente.
576 Linha em branco usada para separar blocos do arquivo.
577document.getElementById('scaleRange').addEventListener('input', function(){Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
578 if(!overlayCarregado){Avalia a condição escrita nesta linha.
579 return;Retorna o valor indicado pela linha.
580 }Fecha ou delimita a estrutura iniciada anteriormente.
581 Linha em branco usada para separar blocos do arquivo.
582 var valor = parseInt(this.value);Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
583 var proporcao = overlayOriginal.height / overlayOriginal.width;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
584 Linha em branco usada para separar blocos do arquivo.
585 overlay.width = overlayOriginal.width * (valor / 100);Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
586 overlay.height = overlay.width * proporcao;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
587 Linha em branco usada para separar blocos do arquivo.
588 atualizarLabels();Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
589 desenhar();Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
590});Fecha ou delimita a estrutura iniciada anteriormente.
591 Linha em branco usada para separar blocos do arquivo.
592document.getElementById('rotateRange').addEventListener('input', function(){Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
593 if(!overlayCarregado){Avalia a condição escrita nesta linha.
594 return;Retorna o valor indicado pela linha.
595 }Fecha ou delimita a estrutura iniciada anteriormente.
596 Linha em branco usada para separar blocos do arquivo.
597 overlay.rotation = parseInt(this.value);Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
598 atualizarLabels();Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
599 desenhar();Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
600});Fecha ou delimita a estrutura iniciada anteriormente.
601 Linha em branco usada para separar blocos do arquivo.
602document.getElementById('opacityRange').addEventListener('input', function(){Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
603 if(!overlayCarregado){Avalia a condição escrita nesta linha.
604 return;Retorna o valor indicado pela linha.
605 }Fecha ou delimita a estrutura iniciada anteriormente.
606 Linha em branco usada para separar blocos do arquivo.
607 overlay.opacity = parseInt(this.value) / 100;Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
608 atualizarLabels();Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
609 desenhar();Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
610});Fecha ou delimita a estrutura iniciada anteriormente.
611 Linha em branco usada para separar blocos do arquivo.
612document.getElementById('btnResetar').addEventListener('click', function(){Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
613 resetarAjuste();Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
614});Fecha ou delimita a estrutura iniciada anteriormente.
615 Linha em branco usada para separar blocos do arquivo.
616document.getElementById('btnSalvar').addEventListener('click', function(){Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
617 Linha em branco usada para separar blocos do arquivo.
618 if(!overlayCarregado){Avalia a condição escrita nesta linha.
619 document.getElementById('mensagem').innerHTML = '<span class="text-danger">Carregue o arquivo da prótese para ajuste manual</span>';Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
620 return;Retorna o valor indicado pela linha.
621 }Fecha ou delimita a estrutura iniciada anteriormente.
622 Linha em branco usada para separar blocos do arquivo.
623 var imagemFinal = canvas.toDataURL('image/png');Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
624 Linha em branco usada para separar blocos do arquivo.
625 if(imagemFinal == ''){Avalia a condição escrita nesta linha.
626 document.getElementById('mensagem').innerHTML = '<span class="text-danger">Erro ao gerar imagem do canvas</span>';Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
627 return;Retorna o valor indicado pela linha.
628 }Fecha ou delimita a estrutura iniciada anteriormente.
629 Linha em branco usada para separar blocos do arquivo.
630 var xhr = new XMLHttpRequest();Inicia ou configura uma requisição assíncrona no navegador.
631 xhr.open('POST', 'salvar_canvas.php', true);Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
632 xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
633 Linha em branco usada para separar blocos do arquivo.
634 xhr.onreadystatechange = function(){Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
635 if(xhr.readyState == 4){Avalia a condição escrita nesta linha.
636 if(xhr.responseText.trim() == 'Salvo com Sucesso'){Avalia a condição escrita nesta linha.
637 document.getElementById('mensagem').innerHTML = '<span class="text-success">Ajuste final salvo com sucesso</span>';Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
638 }else{Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
639 document.getElementById('mensagem').innerHTML = '<span class="text-danger">' + xhr.responseText + '</span>';Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
640 }Fecha ou delimita a estrutura iniciada anteriormente.
641 }Fecha ou delimita a estrutura iniciada anteriormente.
642 };Fecha ou delimita a estrutura iniciada anteriormente.
643 Linha em branco usada para separar blocos do arquivo.
644 xhr.send('id=' + encodeURIComponent(simId) + '&img=' + encodeURIComponent(imagemFinal));Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
645});Fecha ou delimita a estrutura iniciada anteriormente.
646 Linha em branco usada para separar blocos do arquivo.
647window.addEventListener('resize', function(){Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
648 ajustarCanvasResponsivo();Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
649});Fecha ou delimita a estrutura iniciada anteriormente.
650 Linha em branco usada para separar blocos do arquivo.
651atualizarLabels();Linha do arquivo original; deve ser lida junto com o bloco em que está inserida.
652</script>Marca HTML presente na saída da página.
653 Linha em branco usada para separar blocos do arquivo.
654</body>Marca HTML presente na saída da página.
655</html>Marca HTML presente na saída da página.

Navegação entre arquivos do grupo