Mudanças entre as edições de "Widget:MapViewer.js"

De Wiki Gla
Ir para navegação Ir para pesquisar
(Página substituída por '<includeonly><div id="mapa-<!--{$id|escape:'quotes'|default:'mapa1'}-->" style="width:<!--{$largura|escape:'quotes'|default:'100%'}-->; height:<!--{$altura|escape:'quot...')
Etiqueta: Substituído
Linha 1: Linha 1:
<includeonly><div id="mapa-debug-<!--{$id|escape:'quotes'|default:'teste'}-->" style="width:<!--{$largura|escape:'quotes'|default:'100%'}-->; min-height:<!--{$altura|escape:'quotes'|default:'500px'}-->; background:#0f172a; border-radius:12px; padding:20px; font-family:monospace; color:#e2e8f0;">
<includeonly><div id="mapa-<!--{$id|escape:'quotes'|default:'mapa1'}-->" style="width:<!--{$largura|escape:'quotes'|default:'100%'}-->; height:<!--{$altura|escape:'quotes'|default:'500px'}-->; background:#0f172a; border-radius:12px; overflow:hidden; position:relative;">
    <div style="background:#1e293b; padding:15px; border-radius:8px; margin-bottom:10px;">
    <div style="position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); color:#64748b; text-align:center;">
        <strong>🐛 DEBUG MODE - Visualizador de Mapas</strong>
        🗺️ Carregando mapa...
        <div id="debug-log-<!--{$id|escape:'quotes'}-->" style="margin-top:10px; font-size:12px;"></div>
    </div>
    <div id="mapa-container-<!--{$id|escape:'quotes'}-->" style="min-height:400px; background:#0f172a; border:1px solid #334155; border-radius:8px; position:relative;">
        <div style="position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); text-align:center;">
            ⏳ Aguardando carregamento...<br>
            <small style="color:#64748b;">Verifique o console do navegador (F12)</small>
        </div>
     </div>
     </div>
</div>
</div>
Linha 15: Linha 8:
// @noescape
// @noescape
(function() {
(function() {
     var id = '<!--{$id|escape:'quotes'|default:'teste'}-->';
     var id = '<!--{$id|escape:'quotes'|default:'mapa1'}-->';
     var debugDiv = document.getElementById('debug-log-' + id);
     var container = document.getElementById('mapa-' + id);
     var container = document.getElementById('mapa-container-' + id);
     if (!container) return;
     var jsonRaw = '<!--{$json|escape:'quotes'}-->';
      
// PEGAR O JSON DIRETAMENTE COMO TEXTO BRUTO
    // PEGAR O JSON DIRETAMENTE COMO TEXTO BRUTO
     var jsonBruto = `<!--{$json}-->`;
     var jsonBruto = `<!--{$json}-->`;
      
      
     // LIMPAR O JSON: remover espaços extras e quebras
     // LIMPAR O JSON: remover espaços extras e quebras
     jsonRaw= jsonBruto.replace(/\s+/g, ' ');
     jsonBruto = jsonBruto.replace(/\s+/g, ' ');
     jsonRaw= jsonBruto.trim();
     jsonBruto = jsonBruto.trim();
      
      
     console.log('JSON bruto:', jsonRaw.substring(0, 200));
     console.log('JSON bruto:', jsonBruto.substring(0, 200));
      
      
     var config;
     var config;
Linha 37: Linha 30:
         return;
         return;
     }
     }
   
    function log(msg, type) {
        var color = '#10b981';
        if (type === 'error') color = '#ef4444';
        if (type === 'warning') color = '#f59e0b';
        if (type === 'info') color = '#3b82f6';
        var timestamp = new Date().toLocaleTimeString();
        debugDiv.innerHTML += '<div style="color:' + color + '; border-bottom:1px solid #334155; padding:4px 0;">[' + timestamp + '] ' + msg + '</div>';
        console.log('[MapaDebug]', msg);
    }
   
    log('🔧 Iniciando debug do mapa...', 'info');
    log('📌 ID do container: ' + id, 'info');
    log('📏 Largura: <!--{$largura|escape:'quotes'|default:'100%'}-->', 'info');
    log('📐 Altura: <!--{$altura|escape:'quotes'|default:'500px'}-->', 'info');
    log('📝 Título: <!--{$titulo|escape:'quotes'|default:'Mapa'}-->', 'info');
    log('📦 JSON raw length: ' + jsonRaw.length, 'info');
    log('📦 JSON raw preview: ' + jsonRaw.substring(0, 200) + (jsonRaw.length > 200 ? '...' : ''), 'info');
      
      
     if (!jsonRaw || jsonRaw === '') {
     if (!config.layers || config.layers.length === 0) {
        log('❌ NENHUM JSON FORNECIDO! Use o parâmetro |json=...', 'error');
         container.innerHTML = '<div style="padding:20px; text-align:center; color:#f59e0b;">⚠️ Nenhuma camada</div>';
         container.innerHTML = '<div style="position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); text-align:center; color:#ef4444;">❌ Nenhum JSON fornecido<br><small>Use o parâmetro |json=...</small></div>';
         return;
         return;
     }
     }
      
      
     log('✅ JSON recebido, tentando parse...', 'info');
     container.innerHTML = '<div style="padding:20px; text-align:center; color:#10b981;">✅ Mapa carregado! ' + config.layers.length + ' camadas.</div>';
   
    var mapConfig = null;
    try {
        mapConfig = JSON.parse(jsonRaw);
        log('✅ JSON parseado com sucesso!', 'success');
        log('📊 Camadas encontradas: ' + (mapConfig.layers ? mapConfig.layers.length : 0), 'info');
       
        if (mapConfig.layers && mapConfig.layers.length > 0) {
            log('📋 Detalhes da primeira camada:', 'info');
            log('  - Nome: ' + (mapConfig.layers[0].name || 'sem nome'), 'info');
            log('  - Imagem: ' + (mapConfig.layers[0].imagePath || 'sem imagem'), 'info');
            log('  - Marcadores: ' + (mapConfig.layers[0].markers ? mapConfig.layers[0].markers.length : 0), 'info');
        } else {
            log('⚠️ Nenhuma camada encontrada no JSON', 'warning');
        }
       
        log('🚀 Iniciando visualizador do mapa...', 'info');
        iniciarVisualizador(container, mapConfig, id, log);
       
    } catch(e) {
        log('❌ ERRO AO PARSEAR JSON: ' + e.message, 'error');
        log('🔍 Verifique se o JSON está válido. Use um validador JSON online.', 'error');
        container.innerHTML = '<div style="position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); text-align:center; color:#ef4444;">❌ Erro no JSON<br><small>' + e.message + '</small></div>';
    }
   
    function iniciarVisualizador(container, config, id, log) {
        try {
            log('📐 Configurações do mapa:', 'info');
            log('  - Zoom inicial: ' + (config.mapConfig?.defaultZoom || 1), 'info');
            log('  - Andar inicial: ' + (config.mapConfig?.initialFloor || 0), 'info');
            log('  - Zoom min: ' + (config.mapConfig?.minZoom || 0.5), 'info');
            log('  - Zoom max: ' + (config.mapConfig?.maxZoom || 3), 'info');
           
            // Limpar container
            container.innerHTML = '';
            container.style.position = 'relative';
            container.style.overflow = 'hidden';
           
            // Criar toolbar
            var toolbar = document.createElement('div');
            toolbar.style.cssText = 'position:absolute; top:10px; left:10px; right:10px; z-index:100; display:flex; justify-content:space-between; gap:8px; flex-wrap:wrap;';
            toolbar.innerHTML = '<div style="display:flex; gap:5px; background:rgba(0,0,0,0.7); padding:5px 10px; border-radius:30px;">' +
                '<button id="zoom-in-' + id + '" style="background:#334155; border:none; color:white; width:32px; height:32px; border-radius:50%; cursor:pointer;">+</button>' +
                '<button id="zoom-out-' + id + '" style="background:#334155; border:none; color:white; width:32px; height:32px; border-radius:50%; cursor:pointer;">-</button>' +
                '<button id="reset-' + id + '" style="background:#334155; border:none; color:white; width:32px; height:32px; border-radius:50%; cursor:pointer;">⟳</button>' +
                '</div>' +
                '<div style="background:rgba(0,0,0,0.7); padding:5px 15px; border-radius:30px; color:white; font-size:12px;"><span id="floor-name-' + id + '">' + (config.layers[0]?.name || 'Mapa') + '</span></div>' +
                '<div id="zoom-level-' + id + '" style="background:rgba(0,0,0,0.7); padding:5px 12px; border-radius:30px; color:#a5b4fc; font-size:12px;">100%</div>';
           
            var viewport = document.createElement('div');
            viewport.style.cssText = 'width:100%; height:100%; overflow:auto; cursor:grab; background:#0f172a;';
            var camadasDiv = document.createElement('div');
            camadasDiv.style.cssText = 'position:relative; min-width:100%; min-height:100%;';
            viewport.appendChild(camadasDiv);
           
            var navDiv = document.createElement('div');
            navDiv.style.cssText = 'position:absolute; bottom:20px; left:20px; z-index:100; display:flex; gap:8px; background:rgba(0,0,0,0.7); padding:8px; border-radius:40px;';
            navDiv.innerHTML = '<button id="prev-' + id + '" style="background:#334155; border:none; color:white; width:36px; height:36px; border-radius:50%; cursor:pointer;">▲</button>' +
                '<button id="next-' + id + '" style="background:#334155; border:none; color:white; width:36px; height:36px; border-radius:50%; cursor:pointer;">▼</button>';
           
            var coordsDiv = document.createElement('div');
            coordsDiv.style.cssText = 'position:absolute; bottom:10px; right:10px; background:rgba(0,0,0,0.6); padding:4px 10px; border-radius:20px; color:#a5b4fc; font-size:10px; font-family:monospace;';
            coordsDiv.textContent = '📍 0, 0';
           
            container.appendChild(toolbar);
            container.appendChild(viewport);
            container.appendChild(coordsDiv);
            container.appendChild(navDiv);
           
            log('✅ Interface criada com sucesso', 'success');
           
            // Variáveis de estado
            var zoomAtual = config.mapConfig?.defaultZoom || 1;
            var andarAtual = config.mapConfig?.initialFloor || 0;
            var zoomMin = config.mapConfig?.minZoom || 0.5;
            var zoomMax = config.mapConfig?.maxZoom || 3;
            var zoomPasso = config.mapConfig?.zoomStep || 0.1;
            var camadas = [];
            var marcadores = [];
            var arrastando = false;
            var arrasteInicio = { x: 0, y: 0, scrollLeft: 0, scrollTop: 0 };
           
            log('🎮 Controles inicializados', 'info');
           
            function renderizarCamadas() {
                camadasDiv.innerHTML = '';
                camadas = [];
                marcadores = [];
               
                if (!config.layers || config.layers.length === 0) {
                    log('⚠️ Nenhuma camada para renderizar', 'warning');
                    return;
                }
               
                // Verificar andar atual
                var andarExiste = false;
                for (var i = 0; i < config.layers.length; i++) {
                    if (config.layers[i].id === andarAtual) andarExiste = true;
                }
                if (!andarExiste && config.layers.length > 0) {
                    andarAtual = config.layers[0].id;
                    log('🔄 Andar ajustado para: ' + andarAtual, 'info');
                }
               
                var andarInfo = null;
                for (var i = 0; i < config.layers.length; i++) {
                    if (config.layers[i].id === andarAtual) andarInfo = config.layers[i];
                }
                var nomeSpan = document.getElementById('floor-name-' + id);
                if (nomeSpan && andarInfo) nomeSpan.textContent = andarInfo.name;
               
                log('🎨 Renderizando ' + config.layers.length + ' camada(s)', 'info');
               
                for (var i = 0; i < config.layers.length; i++) {
                    var layer = config.layers[i];
                    var divLayer = document.createElement('div');
                    divLayer.className = 'mapa-layer';
                    divLayer.setAttribute('data-floor', layer.id);
                    divLayer.style.display = layer.id === andarAtual ? 'block' : 'none';
                    divLayer.style.position = 'absolute';
                    divLayer.style.top = '0';
                    divLayer.style.left = '0';
                    divLayer.style.transform = 'translate(' + (layer.alignment?.offsetX || 0) + 'px, ' + (layer.alignment?.offsetY || 0) + 'px)';
                    divLayer.style.opacity = (layer.opacity || 100) / 100;
                   
                    var img = document.createElement('img');
                    img.style.display = 'block';
                    img.style.transform = 'scale(' + zoomAtual + ')';
                    img.style.transformOrigin = '0 0';
                    img.src = layer.imagePath || '';
                   
                    img.onload = function() {
                        camadasDiv.style.width = this.width + 'px';
                        camadasDiv.style.height = this.height + 'px';
                        log('🖼️ Imagem carregada: ' + this.width + 'x' + this.height, 'info');
                    };
                   
                    img.onerror = function() {
                        this.src = 'data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%22800%22 height=%22600%22%3E%3Crect width=%22100%25%22 height=%22100%25%22 fill=%22%23334155%22/%3E%3Ctext x=%2250%25%22 y=%2250%25%22 text-anchor=%22middle%22 fill=%22white%22%3ESem imagem%3C/text%3E%3C/svg%3E';
                        log('⚠️ Imagem não encontrada: ' + layer.imagePath, 'warning');
                    };
                   
                    divLayer.appendChild(img);
                   
                    var markersDiv = document.createElement('div');
                    markersDiv.style.position = 'absolute';
                    markersDiv.style.top = '0';
                    markersDiv.style.left = '0';
                    markersDiv.style.width = '100%';
                    markersDiv.style.height = '100%';
                    markersDiv.style.pointerEvents = 'none';
                   
                    if (layer.markers && layer.markers.length > 0) {
                        log('📍 Renderizando ' + layer.markers.length + ' marcador(es) para camada ' + layer.name, 'info');
                        for (var j = 0; j < layer.markers.length; j++) {
                            var marker = layer.markers[j];
                            var markerDiv = criarMarcador(marker, layer.id);
                            markersDiv.appendChild(markerDiv);
                            marcadores.push({ el: markerDiv, data: marker });
                        }
                    }
                   
                    divLayer.appendChild(markersDiv);
                    camadasDiv.appendChild(divLayer);
                    camadas.push(divLayer);
                }
               
                log('✅ Renderização concluída', 'success');
            }
           
            function criarMarcador(marker, floorId) {
                var div = document.createElement('div');
                div.className = 'mapa-marker';
                div.setAttribute('data-marker-id', marker.id);
                div.setAttribute('data-floor', floorId);
                div.setAttribute('data-x', marker.x);
                div.setAttribute('data-y', marker.y);
                div.style.position = 'absolute';
                div.style.left = (marker.x * zoomAtual) + 'px';
                div.style.top = (marker.y * zoomAtual) + 'px';
                div.style.zIndex = '100';
                div.style.transform = 'translate(-50%, -50%)';
                div.style.cursor = (marker.action && marker.action !== 'none') ? 'pointer' : 'default';
               
                var tamanhoIcone = Math.max(20, Math.floor(20 * zoomAtual));
                var htmlIcone = marker.iconBase64 ? '<img src="' + marker.iconBase64 + '" style="width:' + tamanhoIcone + 'px; height:' + tamanhoIcone + 'px;">' : '<span style="font-size:' + tamanhoIcone + 'px;">📍</span>';
               
                var textoAcao = '';
                if (marker.action === 'popup') textoAcao = '📋 Informações';
                else if (marker.action === 'nextFloor') textoAcao = '⬆️ Próximo andar';
                else if (marker.action === 'prevFloor') textoAcao = '⬇️ Andar anterior';
                else if (marker.action === 'gotoFloor') textoAcao = '🎯 Ir para andar';
                else if (marker.action === 'link') textoAcao = '🔗 Link externo';
                else textoAcao = '📍 Clique';
               
                div.innerHTML = '<div style="display:flex; align-items:center; justify-content:center;">' + htmlIcone + '</div>' +
                    '<div style="position:absolute; bottom:100%; left:50%; transform:translateX(-50%); background:#1e293b; color:white; padding:4px 8px; border-radius:6px; font-size:10px; white-space:nowrap; opacity:0; visibility:hidden; transition:0.2s; pointer-events:none;">' +
                    '<strong>' + (marker.name || 'Marcador') + '</strong><br><small>' + textoAcao + '</small></div>' +
                    '<div style="position:absolute; top:-8px; right:-8px; background:#ef4444; color:white; font-size:9px; min-width:16px; height:16px; border-radius:10px; display:flex; align-items:center; justify-content:center; padding:0 4px; ' + (!marker.hasBadge ? 'display:none;' : '') + '">' + (marker.hasBadge ? (marker.badgeNumber || marker.number || '') : '') + '</div>';
               
                div.addEventListener('mouseenter', function() { this.style.transform = 'translate(-50%, -50%) scale(1.15)'; var tp = this.children[1]; if (tp) { tp.style.opacity = '1'; tp.style.visibility = 'visible'; } });
                div.addEventListener('mouseleave', function() { this.style.transform = 'translate(-50%, -50%) scale(1)'; var tp = this.children[1]; if (tp) { tp.style.opacity = '0'; tp.style.visibility = 'hidden'; } });
               
                if (marker.action && marker.action !== 'none') {
                    div.addEventListener('click', function(e) {
                        e.stopPropagation();
                        if (marker.action === 'popup') alert(marker.name + '\n\n' + (marker.actionData?.text || 'Sem informações'));
                        else if (marker.action === 'nextFloor') irProximoAndar();
                        else if (marker.action === 'prevFloor') irAndarAnterior();
                        else if (marker.action === 'gotoFloor' && marker.actionData?.floorId !== undefined) irParaAndar(marker.actionData.floorId);
                        else if (marker.action === 'link' && marker.actionData?.url && marker.actionData.url !== '#') window.open(marker.actionData.url, marker.actionData.target || '_blank');
                    });
                }
                return div;
            }
           
            function atualizarPosicaoMarcadores() {
                for (var i = 0; i < marcadores.length; i++) {
                    var item = marcadores[i];
                    if (parseInt(item.el.getAttribute('data-floor')) === andarAtual) {
                        item.el.style.left = (item.data.x * zoomAtual) + 'px';
                        item.el.style.top = (item.data.y * zoomAtual) + 'px';
                        var ts = Math.max(20, Math.floor(20 * zoomAtual));
                        var idiv = item.el.children[0];
                        if (idiv) {
                            if (item.data.iconBase64) idiv.innerHTML = '<img src="' + item.data.iconBase64 + '" style="width:' + ts + 'px; height:' + ts + 'px;">';
                            else idiv.innerHTML = '<span style="font-size:' + ts + 'px;">📍</span>';
                        }
                    }
                }
            }
           
            function irProximoAndar() {
                var idx = -1;
                for (var i = 0; i < config.layers.length; i++) {
                    if (config.layers[i].id === andarAtual) idx = i;
                }
                if (idx < config.layers.length - 1) {
                    irParaAndar(config.layers[idx + 1].id);
                    log('⬆️ Mudando para próximo andar: ' + config.layers[idx + 1].name, 'info');
                }
            }
           
            function irAndarAnterior() {
                var idx = -1;
                for (var i = 0; i < config.layers.length; i++) {
                    if (config.layers[i].id === andarAtual) idx = i;
                }
                if (idx > 0) {
                    irParaAndar(config.layers[idx - 1].id);
                    log('⬇️ Mudando para andar anterior: ' + config.layers[idx - 1].name, 'info');
                }
            }
           
            function irParaAndar(floorId) {
                andarAtual = floorId;
                for (var i = 0; i < camadas.length; i++) {
                    var lf = parseInt(camadas[i].getAttribute('data-floor'));
                    camadas[i].style.display = lf === floorId ? 'block' : 'none';
                }
                var fd = null;
                for (var i = 0; i < config.layers.length; i++) {
                    if (config.layers[i].id === floorId) fd = config.layers[i];
                }
                var nomeSpan = document.getElementById('floor-name-' + id);
                if (nomeSpan && fd) nomeSpan.textContent = fd.name;
                atualizarPosicaoMarcadores();
            }
           
            function zoomIn() {
                if (zoomAtual < zoomMax) {
                    var old = zoomAtual;
                    zoomAtual = Math.min(zoomAtual + zoomPasso, zoomMax);
                    aplicarZoom(old);
                    log('🔍 Zoom in: ' + Math.round(zoomAtual * 100) + '%', 'info');
                }
            }
           
            function zoomOut() {
                if (zoomAtual > zoomMin) {
                    var old = zoomAtual;
                    zoomAtual = Math.max(zoomAtual - zoomPasso, zoomMin);
                    aplicarZoom(old);
                    log('🔍 Zoom out: ' + Math.round(zoomAtual * 100) + '%', 'info');
                }
            }
           
            function aplicarZoom(oldZoom) {
                var imgs = document.querySelectorAll('.mapa-image');
                for (var i = 0; i < imgs.length; i++) imgs[i].style.transform = 'scale(' + zoomAtual + ')';
                var rect = viewport.getBoundingClientRect();
                var cx = rect.width / 2, cy = rect.height / 2;
                var sx = (viewport.scrollLeft + cx) / oldZoom, sy = (viewport.scrollTop + cy) / oldZoom;
                viewport.scrollLeft = sx * zoomAtual - cx;
                viewport.scrollTop = sy * zoomAtual - cy;
                atualizarPosicaoMarcadores();
                var zoomSpan = document.getElementById('zoom-level-' + id);
                if (zoomSpan) zoomSpan.textContent = Math.round(zoomAtual * 100) + '%';
            }
           
            function resetarView() {
                zoomAtual = config.mapConfig?.defaultZoom || 1;
                var imgs = document.querySelectorAll('.mapa-image');
                for (var i = 0; i < imgs.length; i++) imgs[i].style.transform = 'scale(' + zoomAtual + ')';
                viewport.scrollLeft = 0;
                viewport.scrollTop = 0;
                atualizarPosicaoMarcadores();
                var zoomSpan = document.getElementById('zoom-level-' + id);
                if (zoomSpan) zoomSpan.textContent = Math.round(zoomAtual * 100) + '%';
                log('⟳ Visualização resetada', 'info');
            }
           
            // Conectar botões
            document.getElementById('zoom-in-' + id).addEventListener('click', zoomIn);
            document.getElementById('zoom-out-' + id).addEventListener('click', zoomOut);
            document.getElementById('reset-' + id).addEventListener('click', resetarView);
            document.getElementById('prev-' + id).addEventListener('click', irAndarAnterior);
            document.getElementById('next-' + id).addEventListener('click', irProximoAndar);
           
            // Arrastar
            viewport.addEventListener('mousedown', function(e) {
                if (e.target.closest('.mapa-marker')) return;
                arrastando = true;
                arrasteInicio = { x: e.clientX, y: e.clientY, scrollLeft: viewport.scrollLeft, scrollTop: viewport.scrollTop };
                viewport.style.cursor = 'grabbing';
                e.preventDefault();
            });
           
            window.addEventListener('mousemove', function(e) {
                if (!arrastando) return;
                viewport.scrollLeft = arrasteInicio.scrollLeft - (e.clientX - arrasteInicio.x);
                viewport.scrollTop = arrasteInicio.scrollTop - (e.clientY - arrasteInicio.y);
            });
           
            window.addEventListener('mouseup', function() { arrastando = false; viewport.style.cursor = 'grab'; });
           
            // Zoom com scroll
            viewport.addEventListener('wheel', function(e) {
                if (e.ctrlKey) { e.preventDefault(); e.deltaY < 0 ? zoomIn() : zoomOut(); }
            });
           
            // Coordenadas
            viewport.addEventListener('mousemove', function(e) {
                var rect = viewport.getBoundingClientRect();
                var x = (e.clientX - rect.left + viewport.scrollLeft) / zoomAtual;
                var y = (e.clientY - rect.top + viewport.scrollTop) / zoomAtual;
                coordsDiv.textContent = '📍 ' + Math.round(x) + ', ' + Math.round(y) + ' | ' + Math.round(zoomAtual * 100) + '%';
            });
           
            renderizarCamadas();
            log('🎉 Visualizador iniciado com sucesso!', 'success');
           
        } catch(e) {
            log('❌ ERRO NO VISUALIZADOR: ' + e.message, 'error');
            container.innerHTML = '<div style="position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); text-align:center; color:#ef4444;">❌ Erro no visualizador<br><small>' + e.message + '</small></div>';
        }
    }
})();
})();
</script></includeonly>
</script></includeonly>

Edição das 20h34min de 9 de abril de 2026

Disponível em “https://wiki.gla.com.br/index.php?title=Widget:MapViewer.js&oldid=45861”