Widget:Test: mudanças entre as edições

Ir para navegação Ir para pesquisar

Widget:Test (ver código-fonte)

Edição das 04h45min de 27 de agosto de 2024

594 bytes removidos ,  27 agosto
sem sumário de edição
Sem resumo de edição
Sem resumo de edição
Linha 314: Linha 314:
             }
             }
         };
         };
         const mapTypeSelect = document.getElementById('mapType');
     
        const locationSelect = document.getElementById('location');
         function filterMaps() {
        const filterCheckbox = document.getElementById('filterCheckbox');
            const mapType = document.getElementById('mapType').value;
        const filterOptions = document.getElementById('filterOptions');
            const location = document.getElementById('location').value;
        const filterOptionSelect = document.getElementById('filterOption');
            const filterCheckbox = document.getElementById('filterCheckbox').checked;
        const filterValueInput = document.getElementById('filterValue');
            const filterOption = document.getElementById('filterOption').value;
        const filterButton = document.getElementById('filterButton');
            const filterValue = document.getElementById('filterValue').value.toLowerCase();
        const mapContainer = document.getElementById('mapContainer');
            const mapContainer = document.getElementById('mapContainer');
 
        function getSelectedOptions() {
            const selectedType = mapTypeSelect.value;
            const selectedLocation = locationSelect.value;
            return { selectedType, selectedLocation };
        }
 
        function filterMapsByOptions(data, selectedType, selectedLocation) {
            const filteredData = [];
            if (selectedType && specificOptions[selectedType] && specificOptions[selectedType][selectedLocation]) {
                filteredData.push(...specificOptions[selectedType][selectedLocation]);
            }
            return filteredData;
        }
 
        function displayMaps(data) {
             mapContainer.innerHTML = '';
             mapContainer.innerHTML = '';
            if (data.length === 0) {
                mapContainer.innerHTML = '<p>Nenhum mapa encontrado.</p>';
                return;
            }
            data.forEach(map => {
                const div = document.createElement('div');
                div.className = 'image-item';
                div.innerHTML = `
                    <img src="${map.imageUrl}" alt="${map.local}">
                    <div class="image-info">
                        <p>ID: ${map.id}</p>
                        <p>Local: ${map.local}</p>
                        <p>Coordenadas: ${map.coordinates}</p>
                    </div>
                `;
                mapContainer.appendChild(div);
            });
        }
        function filterMaps() {
            const { selectedType, selectedLocation } = getSelectedOptions();
            if (!selectedType || !selectedLocation) {
                alert('Selecione o Tipo de Mapa e o Local do X.');
                return;
            }
            const filteredMaps = filterMapsByOptions(specificOptions, selectedType, selectedLocation);
            if (filterCheckbox.checked) {
                const filterOption = filterOptionSelect.value;
                const filterValue = filterValueInput.value.toLowerCase().trim();


                if (!filterOption || !filterValue) {
            if (mapType && location) {
                    alert('Digite um valor para filtrar.');
                const maps = specificOptions[mapType][location];
                    return;
                let filteredMaps = maps;
                }


                 const filteredByValue = filteredMaps.filter(map => {
                 if (filterCheckbox) {
                     if (filterOption === 'number') {
                     if (filterOption === 'number') {
                         return map.id.includes(filterValue);
                         filteredMaps = maps.filter(map => map.id.includes(filterValue));
                     } else if (filterOption === 'tag') {
                     } else if (filterOption === 'tag') {
                         return map.tag.toLowerCase().includes(filterValue);
                         filteredMaps = maps.filter(map => map.tag.toLowerCase().includes(filterValue));
                    } else {
                        filteredMaps = maps;
                     }
                     }
                     return false;
                }
 
                filteredMaps.forEach(map => {
                     const imageItem = document.createElement('div');
                    imageItem.className = 'image-item';
                    imageItem.innerHTML = `
                        <img src="${map.imageUrl}" alt="Imagem do Mapa">
                        <div class="image-info">
                            <p><strong>ID:</strong> ${map.id}</p>
                            <p><strong>Local:</strong> ${map.local}</p>
                            <p><strong>Coordenadas:</strong> ${map.coordinates}</p>
                            <p><strong>Tag:</strong> ${map.tag}</p>
                        </div>
                    `;
                    mapContainer.appendChild(imageItem);
                 });
                 });
            } else if (!mapType || !location) {
                const imageItem = document.createElement('div');
                imageItem.className = 'image-item';
                imageItem.innerHTML = `
                    <p><strong>Selecione um Tipo de Mapa e Local do X para ver os resultados.</strong></p>
                `;
                mapContainer.appendChild(imageItem);
            }
        }


                 displayMaps(filteredByValue);
        document.getElementById('filterCheckbox').addEventListener('change', function() {
            const filterOptions = document.getElementById('filterOptions');
            if (this.checked) {
                 filterOptions.classList.remove('hidden');
             } else {
             } else {
                 displayMaps(filteredMaps);
                 filterOptions.classList.add('hidden');
                document.getElementById('filterOption').value = '';
                document.getElementById('filterValue').value = '';
                filterMaps();
             }
             }
         }
         });
 
        document.getElementById('filterButton').addEventListener('click', function() {
            filterMaps();
        });


         mapTypeSelect.addEventListener('change', filterMaps);
         document.getElementById('filterValue').addEventListener('keypress', function(event) {
        locationSelect.addEventListener('change', filterMaps);
             if (event.key === 'Enter') {
        filterCheckbox.addEventListener('change', function() {
                 event.preventDefault();
             filterOptions.classList.toggle('hidden', !this.checked);
                 document.getElementById('filterButton').click();
            if (!this.checked) {
                 filterOptionSelect.value = '';
                 filterValueInput.value = '';
                displayMaps(filterMapsByOptions(specificOptions, ...getSelectedOptions()));
             }
             }
         });
         });
        filterButton.addEventListener('click', filterMaps);
        window.onload = filterMaps; // Executa ao carregar a página
     </script>
     </script>
</body>
</body>
</html>
</html>
Renee
Administradores
5 801

edições

Disponível em “https://wiki.pokexgames.com/index.php/Especial:MobileDiff/85835”

Menu de navegação