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

Ir para navegação Ir para pesquisar

Widget:Test (ver código-fonte)

Edição das 02h51min de 27 de agosto de 2024

1 085 bytes removidos ,  27 agosto
sem sumário de edição
Sem resumo de edição
Etiqueta: Revertido
Sem resumo de edição
Etiqueta: Revertido
Linha 185: Linha 185:
         </div>
         </div>


         <div id="specificOptions" class="input-group">
         <div id="specificOptions" class="input-group hidden">
             <select id="specificOption" class="maps__select">
             <select id="specificOption" class="maps__select">
                 <option value="">Selecione uma opção</option>
                 <option value="">Selecione uma opção</option>
Linha 199: Linha 199:
         </div>
         </div>


         <div id="filterSection" class="">
         <div id="filterSection" class="hidden">
             <div id="filterById" class="input-group">
             <div id="filterById" class="input-group">
                 <label for="searchIds" class="mapsCalc__label">Filtrar por Nº do Mapa:</label>
                 <label for="searchIds" class="mapsCalc__label">Filtrar por Nº do Mapa:</label>
Linha 209: Linha 209:
                 <input type="text" id="searchTag" placeholder="Digite a tag para filtrar" class="mapsCalc__select">
                 <input type="text" id="searchTag" placeholder="Digite a tag para filtrar" class="mapsCalc__select">
             </div>
             </div>
        </div>
        <div class="filter-container">
            <input type="checkbox" id="enableFilter">
            <label class="filter-label" for="enableFilter">Ativar Filtro</label>
         </div>
         </div>


Linha 215: Linha 220:
         </div>
         </div>
     </form>
     </form>
     <script>
     <script>
         const specificOptions = {
         const specificOptions = {
Linha 221: Linha 227:
                     { id: '101', local: 'Green Island', coordinates: '3780, 3326, 7', imageUrl: 'https://wiki.pokexgames.com/images/d/db/3780%2C_3326%2C_7.png' },
                     { id: '101', local: 'Green Island', coordinates: '3780, 3326, 7', imageUrl: 'https://wiki.pokexgames.com/images/d/db/3780%2C_3326%2C_7.png' },
                 ],
                 ],
                // Outras opções do Mapa Vermelho
             },
             },
          2: {  
            2: { // Mapa Verde
                 'Areia': [
                 'Areia': [
                { id: '1001', local: ' Outland Water', coordinates: '2847, 2827, 6', tag: 'Agua', imageUrl: 'https://wiki.pokexgames.com/images/b/b9/Mapa_Verde_ADV_-_2847%2C_2827%2C_6.webp' },
                    { id: '1001', local: 'Outland Water', coordinates: '2847, 2827, 6', tag: 'Agua', imageUrl: 'https://wiki.pokexgames.com/images/b/b9/Mapa_Verde_ADV_-_2847%2C_2827%2C_6.webp' },
{ id: '1002', local: ' Outland Water', coordinates: '2863, 2850, 6', imageUrl: 'https://wiki.pokexgames.com/images/c/c9/Mapa_Verde_ADV_-_2863%2C_2850%2C_6.webp' },
                    { id: '1002', local: 'Outland Water', coordinates: '2863, 2850, 6', imageUrl: 'https://wiki.pokexgames.com/images/c/c9/Mapa_Verde_ADV_-_2863%2C_2850%2C_6.webp' },
      ],
                ],
},
            },
             3: { // Mapa Roxo
             3: { // Mapa Roxo
                 // Adicionar dados para o Mapa Roxo aqui
                 // Adicionar dados para o Mapa Roxo aqui
Linha 234: Linha 239:
         };
         };


 
         document.getElementById('enableFilter').addEventListener('change', function () {
         document.getElementById('enableFilter').addEventListener('change', function () {
             const filterSection = document.getElementById('filterSection');
             const filterSection = document.getElementById('filterSection');
Linha 261: Linha 265:


         document.getElementById('specificOption').addEventListener('change', function () {
         document.getElementById('specificOption').addEventListener('change', function () {
             const selectedMapType = document.getElementById('mapType').value;
             filterImages();
            const selectedOption = this.value;
            const imageContainer = document.getElementById('imageContainer');
 
            if (selectedMapType && selectedOption) {
                const images = specificOptions[selectedMapType][selectedOption];
                let imagesHtml = '';
 
                if (Array.isArray(images)) {
                    images.forEach(image => {
                        imagesHtml += `
                            <div class="image-item">
                                <img src="${image.imageUrl}" alt="${selectedOption}">
                                <div class="image-info">
                                    <b>Número do Mapa</b>: ${image.id} <br>
                                    <b>Local</b>: ${image.local} <br>
                                    <b>Coordenada</b>: ${image.coordinates} <br>
                                    <b>Tag</b>: ${image.tag}
                                </div>
                            </div>
                        `;
                    });
                }
                imageContainer.innerHTML = imagesHtml;
                imageContainer.classList.remove('hidden');
            } else {
                imageContainer.classList.add('hidden');
            }
         });
         });


Linha 313: Linha 290:
                 allImages = images.filter(image => {
                 allImages = images.filter(image => {
                     const idMatch = searchIds.length === 0 || searchIds.includes(image.id);
                     const idMatch = searchIds.length === 0 || searchIds.includes(image.id);
                     const tagMatch = !searchTag || image.tag.toLowerCase().includes(searchTag);
                     const tagMatch = !searchTag || (image.tag && image.tag.toLowerCase().includes(searchTag));
                     return idMatch && tagMatch;
                     return idMatch && tagMatch;
                 });
                 });
Linha 327: Linha 304:
                                 <b>Local</b>: ${image.local} <br>
                                 <b>Local</b>: ${image.local} <br>
                                 <b>Coordenada</b>: ${image.coordinates} <br>
                                 <b>Coordenada</b>: ${image.coordinates} <br>
                                 <b>Tag</b>: ${image.tag}
                                 <b>Tag</b>: ${image.tag || 'N/A'}
                             </div>
                             </div>
                         </div>
                         </div>
Renee
Administradores
5 801

edições

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

Menu de navegação