Mudanças entre as edições de "Widget:MapViewer.js"
Ir para navegação
Ir para pesquisar
(reajuste do script) |
|||
| Linha 1: | Linha 1: | ||
<includeonly><div id="mapa-viewer-{{{id|mapa1}}}" class="mapa-container" style="width:{{{largura|100%}}}; height:{{{altura|500px}}}; background:#0f172a; border-radius:12px; overflow:hidden; position:relative;"> | <includeonly>{{#tag:pre|{{{json}}}|style=display:none}}<div id="mapa-viewer-{{{id|mapa1}}}" class="mapa-container" style="width:{{{largura|100%}}}; height:{{{altura|500px}}}; background:#0f172a; border-radius:12px; overflow:hidden; position:relative;"> | ||
<div style="position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); color:#64748b; text-align:center;"> | <div style="position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); color:#64748b; text-align:center;"> | ||
<div>🗺️ Carregando mapa...</div> | <div>🗺️ Carregando mapa...</div> | ||
| Linha 13: | Linha 13: | ||
if (!container) return; | if (!container) return; | ||
// | // Buscar o JSON do pre escondido | ||
var | var preElements = document.querySelectorAll('pre'); | ||
var jsonString = ''; | |||
for (var i = 0; i < preElements.length; i++) { | |||
if (preElements[i].style.display === 'none') { | |||
jsonString = preElements[i].textContent; | |||
break; | |||
} | |||
} | |||
if (!jsonString) { | |||
container.innerHTML = '<div style="padding:20px; text-align:center; color:#ef4444;">❌ Configuração não encontrada</div>'; | |||
return; | |||
} | |||
var mapConfig; | var mapConfig; | ||
try { | try { | ||
mapConfig = JSON.parse( | mapConfig = JSON.parse(jsonString); | ||
} catch(e) { | } catch(e) { | ||
container.innerHTML = '<div style="padding:20px; text-align:center; color:#ef4444;">❌ Erro na configuração do mapa</div>'; | container.innerHTML = '<div style="padding:20px; text-align:center; color:#ef4444;">❌ Erro na configuração do mapa: ' + e.message + '</div>'; | ||
console.error('Erro | console.error('Erro JSON:', e, jsonString); | ||
return; | return; | ||
} | } | ||
| Linha 91: | Linha 103: | ||
// Verificar se o andar atual existe | // Verificar se o andar atual existe | ||
var floorExists = false; | |||
currentFloor = config.layers[0] | for (var i = 0; i < config.layers.length; i++) { | ||
if (config.layers[i].id === currentFloor) floorExists = true; | |||
} | |||
if (!floorExists && config.layers.length > 0) { | |||
currentFloor = config.layers[0].id; | |||
} | } | ||
var floorAtual = config.layers. | var floorAtual = null; | ||
for (var i = 0; i < config.layers.length; i++) { | |||
if (config.layers[i].id === currentFloor) floorAtual = config.layers[i]; | |||
} | |||
if (floorAtual && floorNameSpan) { | if (floorAtual && floorNameSpan) { | ||
floorNameSpan.textContent = floorAtual.name; | floorNameSpan.textContent = floorAtual.name; | ||
| Linha 141: | Linha 160: | ||
ctx.fillStyle = '#e0e0e0'; | ctx.fillStyle = '#e0e0e0'; | ||
ctx.font = '14px Arial'; | ctx.font = '14px Arial'; | ||
ctx.fillText(' | ctx.fillText('Sem imagem carregada', 50, 150); | ||
img.src = canvas.toDataURL(); | img.src = canvas.toDataURL(); | ||
}; | }; | ||