Correção no bug do filtro de serviço e adição de buscar a localização…

… do usuário dinamicamente
ResidenciaTICBrisa · Aug 16, 2024 · 0616e85 · 0616e85
1 parent fc9cb4b
commit 0616e85
Show file tree

Hide file tree

Showing 2 changed files with 81 additions and 58 deletions.
diff --git a/lgbtq_connect/assets/js/script.js b/lgbtq_connect/assets/js/script.js
@@ -1,19 +1,5 @@
 let pagina = null;
 
-// Função getMarcador
-function getMarcador(tipoServico) {
-    const url = marcadores[tipoServico] || marcadores['outro']; // Pega o marcador específico ou o marcador padrão
-    const icon = L.icon({
-        iconUrl: url,
-        iconSize: [40, 40], // tamanho do ícone
-        popupAnchor: [1, -10]
-    });
-    return icon;
-}
-
-// Definindo o ícone personalizado no escopo global usando a função getMarcador
-const personalIcon = getMarcador();
-
 // CLASSES
 class Mapa {
     container;
@@ -151,7 +137,8 @@ class PaginaFormulario extends Pagina {
 
         this.mapa.mapa.on('click', function (e) {
             if (self.marcador == null) {
-                const icon = getMarcador(document.getElementById('servico').value); // Supõe que você tenha um campo com o serviço selecionado
+                // Usa o valor do serviço selecionado para definir o ícone
+                const icon = getMarcador(document.getElementById('servico').value);
                 self.marcador = L.marker(e.latlng, { icon: icon }).addTo(self.mapa.mapa);
             }
             self.marcador.setLatLng(e.latlng);
@@ -175,6 +162,7 @@ class PaginaFormulario extends Pagina {
             }
         });
 
+        // Adiciona marcadores ao mapa com base em formulários aprovados
         for (var i = 0; i < formularios_aprovados.length; i++) {
             var formulario = formularios_aprovados[i];
             const icon = getMarcador(formulario.servico);
@@ -199,6 +187,19 @@ class FabricaPagina {
         return new (FabricaPagina.CLASSES.get(tipo))(id);
     }
 }
+// Função getMarcador
+function getMarcador(tipoServico) {
+    const url = marcadores[tipoServico] || marcadores['outro']; // Pega o marcador específico ou o marcador padrão
+    const icon = L.icon({
+        iconUrl: url,
+        iconSize: [60, 60], // tamanho do ícone
+        popupAnchor: [1, -10]
+    });
+    return icon;
+}
+
+// Definindo o ícone personalizado no escopo global usando a função getMarcador
+const personalIcon = getMarcador();
 
 // Função que realiza a transição entre páginas
 // Chamada uma vez quando o plugin é inicializado e depois é chamada através de botões nas páginas
@@ -260,7 +261,6 @@ document.querySelectorAll('.name_servico').forEach(function(checkbox) {
     });
 });
 
-
 function filtrarServicos() {
     // Obter os serviços selecionados
     const servicosSelecionados = Array.from(document.querySelectorAll('.name_servico:checked')).map(cb => cb.value);
@@ -287,6 +287,8 @@ function atualizarMapaComFiltrados(filtrados) {
 
     // Aplicar o filtro e adicionar os novos marcadores
     filtrados.forEach(formulario => {
+        // Define o ícone com base no serviço do formulário
+        const icon = getMarcador(formulario.servico);
         const popupConteudo = `
             <div class="pop">
                 <h4><strong>${formulario.nome}</strong></h4>
@@ -295,6 +297,6 @@ function atualizarMapaComFiltrados(filtrados) {
                 <p><strong>${formulario.descricao}</strong></p>
             </div>
         `;
-        pagina.mapa.adicionarMarcador(L.marker([formulario.latitude, formulario.longitude], { icon: personalIcon }).bindPopup(popupConteudo));
+        pagina.mapa.adicionarMarcador(L.marker([formulario.latitude, formulario.longitude], { icon: icon }).bindPopup(popupConteudo));
     });
-}
+}
diff --git a/lgbtq_connect/includes/admin/admin_script.js b/lgbtq_connect/includes/admin/admin_script.js
@@ -21,7 +21,6 @@ class Filtro {
         this.servico = "";
     }
 }
-
 class Ordenador {
     static coluna = "nome";
     static ordem = "asc";
@@ -31,7 +30,6 @@ class Ordenador {
         dados['ordem'] = this.ordem;
     }
 }
-
 class Paginacao {
     static pagina=1;
     static max_paginas=20;
@@ -290,7 +288,7 @@ function getMarcador(tipoServico) {
     const url = marcadores[tipoServico] || marcadores['outro']; // Pega o marcador específico ou o marcador padrão
     const icon = L.icon({
         iconUrl: url,
-        iconSize: [40, 40], // tamanho do ícone
+        iconSize: [60, 60], // tamanho do ícone
         popupAnchor: [1, -10]
     });
     return icon;
@@ -300,55 +298,78 @@ function initMapAdmin() {
         return;
     }
 
-    mapAdmin = L.map('mapa_admin', { doubleClickZoom: false }).setView([-15.8267, -47.9218], 13);
+    // Função para inicializar o mapa com a localização do usuário
+    function iniciarMapaComLocalizacao(lat, lng) {
+        mapAdmin = L.map('mapa_admin', { doubleClickZoom: false }).setView([lat, lng], 13);
 
-    // Adiciona o provedor de mapa OpenStreetMap
-    L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
-        attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
-    }).addTo(mapAdmin);
+        // Adiciona o provedor de mapa OpenStreetMap
+        L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
+            attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
+        }).addTo(mapAdmin);
 
-    formularios_aprovados.forEach(function (formulario) {
-        // Obtenha o marcador específico para o tipo de serviço do formulário
-        const personalIcon = getMarcador(formulario.servico);
-        L.marker([formulario.latitude, formulario.longitude], { icon: personalIcon }).addTo(mapAdmin).on('click', function () {
-            destacarLinhaTabela(formulario.id);
+        formularios_aprovados.forEach(function (formulario) {
+            // Obtenha o marcador específico para o tipo de serviço do formulário
+            const personalIcon = getMarcador(formulario.servico);
+            L.marker([formulario.latitude, formulario.longitude], { icon: personalIcon }).addTo(mapAdmin).on('click', function () {
+                destacarLinhaTabela(formulario.id);
+            });
         });
-    });
 
-    var CustomControl = L.Control.extend({
-        options: {
-            position: 'bottomright'
-        },
+        var CustomControl = L.Control.extend({
+            options: {
+                position: 'bottomright'
+            },
+
+            onAdd: function (map) {
+                var container = L.DomUtil.create('div', 'leaflet-control-custom');
+
+                container.onclick = function () {
+                    if (!document.fullscreenElement) {
+                        map.getContainer().requestFullscreen();
+                    } else {
+                        if (document.exitFullscreen) {
+                            document.exitFullscreen();
+                        }
+                    }
+                };
+
+                // Adiciona ouvintes para mudança de estado de tela cheia
+                document.addEventListener('fullscreenchange', function () {
+                    if (document.fullscreenElement) {
+                        container.classList.add('fullscreen');
+                    } else {
+                        container.classList.remove('fullscreen');
+                    }
+                });
 
-        onAdd: function (map) {
-            var container = L.DomUtil.create('div', 'leaflet-control-custom');
+                return container;
+            }
+        });
 
-            container.onclick = function () {
-                if (!document.fullscreenElement) {
-                    map.getContainer().requestFullscreen();
-                } else {
-                    if (document.exitFullscreen) {
-                        document.exitFullscreen();
-                    }
-                }
-            };
+        mapAdmin.addControl(new CustomControl());
+    }
 
-            // Adiciona ouvintes para mudança de estado de tela cheia
-            document.addEventListener('fullscreenchange', function () {
-                if (document.fullscreenElement) {
-                    container.classList.add('fullscreen');
-                } else {
-                    container.classList.remove('fullscreen');
-                }
+    // Função para lidar com a localização do usuário
+    function obterLocalizacao() {
+        if (navigator.geolocation) {
+            navigator.geolocation.getCurrentPosition(function (posicao) {
+                const lat = posicao.coords.latitude;
+                const lng = posicao.coords.longitude;
+                iniciarMapaComLocalizacao(lat, lng);
+            }, function () {
+                // Se a localização não puder ser obtida, inicializa o mapa com uma localização padrão
+                iniciarMapaComLocalizacao(-15.8267, -47.9218);
             });
-
-            return container;
+        } else {
+            // Se a geolocalização não é suportada, inicializa o mapa com uma localização padrão
+            iniciarMapaComLocalizacao(-15.8267, -47.9218);
         }
-    });
+    }
 
-    mapAdmin.addControl(new CustomControl());
+    obterLocalizacao();
 }
 
+
 function initMapEdit(latitude, longitude, nome, servico, descricao) {
     // Verifica se o mapa já foi inicializado e destrói se necessário
     if (mapEdit !== undefined) {