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

Ir para navegação Ir para pesquisar

Widget:Test4 (ver código-fonte)

Edição das 21h50min de 19 de março de 2025

1 027 bytes adicionados ,  19 março
sem sumário de edição
Sem resumo de edição
Sem resumo de edição
Linha 138: Linha 138:
         }
         }


         .switch-button {
         .toggle-button {
            background-color: #f1f1f1;
             display: flex;
            border: 1px solid #ccc;
            padding: 10px;
            border-radius: 5px;
            cursor: pointer;
             display: inline-flex;
             align-items: center;
             align-items: center;
             gap: 5px;
             gap: 5px;
            cursor: pointer;
         }
         }


         .switch-button.active {
         .toggle-button img {
             background-color: #d586e1;
             width: 24px;
            border-color: #9d4cea;
             height: 24px;
             color: #050000;
            font-weight: bolder;
         }
         }
     </style>
     </style>
Linha 159: Linha 153:
<body>
<body>
     <div class="borda-container">
     <div class="borda-container">
        <!-- Filtro de Local -->
         <div class="input-group">
         <div class="input-group">
             <label for="mapType"><b>Local da Hunt:</b></label>
             <label for="mapType"><b>Local da Hunt:</b></label>
Linha 167: Linha 162:
         </div>
         </div>


        <!-- Toggle Button para Hunts Neutras -->
         <div class="input-group">
         <div class="input-group">
             <label><b>Mostrar Hunts Neutras:</b></label>
             <label><b>Mostrar Hunts Neutras:</b></label>
             <div class="switch-button" id="toggleNeutro">
             <div class="toggle-button" id="toggleNeutro">
                 <span>Desativado</span>
                <img src="https://wiki.pokexgames.com/images/0/08/NeutralICON.png" alt="Desativado" id="toggleNeutroIcon">
                 <span id="toggleNeutroText">Desativado</span>
             </div>
             </div>
         </div>
         </div>


        <!-- Filtro de Dificuldade -->
         <div class="input-group">
         <div class="input-group">
             <label for="difficulty"><b>Dificuldade:</b></label>
             <label for="difficulty"><b>Dificuldade:</b></label>
Linha 179: Linha 177:
                 <option value="">Selecione uma Dificuldade</option>
                 <option value="">Selecione uma Dificuldade</option>
             </select>
             </select>
        </div>
        <!-- Barra de Busca -->
        <div class="input-group">
            <label for="search"><b>Buscar por Nome:</b></label>
            <input type="text" id="search" class="maps__select" placeholder="Digite o nome do local...">
         </div>
         </div>


Linha 184: Linha 188:
         <div class="switch-container">
         <div class="switch-container">
             <div class="switch-button" id="switchClans">
             <div class="switch-button" id="switchClans">
                 <span>Clãs</span>
                 <img src="https://wiki.pokexgames.com/images/6/64/Volcanic1.png" alt="Clãs" class="icon-filter">
             </div>
             </div>
             <div class="switch-button" id="switchTypes">
             <div class="switch-button" id="switchTypes">
                 <span>Dano Recebido</span>
                 <img src="https://wiki.pokexgames.com/images/c/c9/Steel.png" alt="Dano Recebido" class="icon-filter">
             </div>
             </div>
         </div>
         </div>
Linha 203: Linha 207:
         </div>
         </div>


        <!-- Container das Hunts -->
         <div id="imageContainer" class="image-container"></div>
         <div id="imageContainer" class="image-container"></div>
     </div>
     </div>
Linha 256: Linha 261:
             const imageContainer = document.getElementById("imageContainer");
             const imageContainer = document.getElementById("imageContainer");
             const toggleNeutro = document.getElementById("toggleNeutro");
             const toggleNeutro = document.getElementById("toggleNeutro");
            const toggleNeutroIcon = document.getElementById("toggleNeutroIcon");
            const toggleNeutroText = document.getElementById("toggleNeutroText");
            const searchInput = document.getElementById("search");


             let selectedTags = [];
             let selectedTags = [];
Linha 291: Linha 299:
                 showNeutro = !showNeutro;
                 showNeutro = !showNeutro;
                 toggleNeutro.classList.toggle("active");
                 toggleNeutro.classList.toggle("active");
                 toggleNeutro.querySelector("span").textContent = showNeutro ? "Ativado" : "Desativado";
                 toggleNeutroText.textContent = showNeutro ? "Ativado" : "Desativado";
                toggleNeutroIcon.src = showNeutro ? "https://wiki.pokexgames.com/images/0/08/NeutralICON.png" : "https://wiki.pokexgames.com/images/0/08/NeutralICON.png"; // Altere a imagem para o estado ativado
                filterHunts();
            });
 
            // Barra de busca
            searchInput.addEventListener("input", () => {
                 filterHunts();
                 filterHunts();
             });
             });
Linha 316: Linha 330:
                 const selectedMap = mapTypeSelect.value;
                 const selectedMap = mapTypeSelect.value;
                 const selectedDifficulty = difficultySelect.value;
                 const selectedDifficulty = difficultySelect.value;
                const searchTerm = searchInput.value.toLowerCase();
                 imageContainer.innerHTML = "";
                 imageContainer.innerHTML = "";


Linha 326: Linha 341:
                     const matchesDifficulty = hunt.difficulty === selectedDifficulty;
                     const matchesDifficulty = hunt.difficulty === selectedDifficulty;
                     const isNeutro = hunt.huntTipo === "Neutro";
                     const isNeutro = hunt.huntTipo === "Neutro";
                    const matchesSearch = hunt.name.toLowerCase().includes(searchTerm);


                    // Exibe a hunt se:
                     if (matchesTags && matchesTypes && matchesDifficulty && (!isNeutro || (isNeutro && showNeutro)) && matchesSearch) {
                    // 1. Corresponde à dificuldade selecionada E
                    // 2. Não é neutra OU (é neutra E o toggle está ativado)
                     if (matchesTags && matchesTypes && matchesDifficulty && (!isNeutro || (isNeutro && showNeutro))) {
                         const imageItem = document.createElement("div");
                         const imageItem = document.createElement("div");
                         imageItem.className = "image-item";
                         imageItem.className = "image-item";
Renee
Administradores
7 895

edições

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

Menu de navegação