PokeXGames

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

Widget Discussão

Widget:Test4 (ver código-fonte)

Edição das 01h48min de 20 de março de 2025

778 bytes adicionados ,  20 março
sem sumário de edição
Sem resumo de edição
Sem resumo de edição
Linha 145: Linha 145:
         }
         }


.toggle-group {
        .toggle-group {
    display: flex; /* Alinha os elementos horizontalmente */
            display: flex; /* Alinha os elementos horizontalmente */
    align-items: center; /* Centraliza verticalmente */
            align-items: center; /* Centraliza verticalmente */
    gap: 10px; /* Espaçamento entre o label e o toggle */
            gap: 10px; /* Espaçamento entre o label e o toggle */
}
        }


.toggle-container {
        .toggle-container {
    display: flex; /* Alinha os elementos horizontalmente */
            display: flex; /* Alinha os elementos horizontalmente */
    align-items: center; /* Centraliza verticalmente */
            align-items: center; /* Centraliza verticalmente */
    cursor: pointer; /* Mostra que o elemento é clicável */
            cursor: pointer; /* Mostra que o elemento é clicável */
}
        }


.toggle-container img {
        .toggle-container img {
    width: 60px; /* Tamanho da imagem */
            width: 60px; /* Tamanho da imagem */
    height: 28px;
            height: 28px;
}
        }
     </style>
     </style>
</head>
</head>
Linha 173: Linha 173:
             </select>
             </select>
         </div>
         </div>


         <!-- Filtro de Dificuldade -->
         <!-- Filtro de Dificuldade -->
Linha 183: Linha 182:
         </div>
         </div>


<div class="input-group">
        <!-- Toggle para Hunts Neutras -->
    <div class="toggle-group">
        <div class="input-group">
        <label><b>Mostrar Hunts Neutras </b></label>
            <div class="toggle-group">
        <div class="toggle-container" id="toggleNeutro">
                <label><b>Mostrar Hunts Neutras </b></label>
            <img src="https://wiki.pokexgames.com/images/2/27/Vetor_Toggle_Wiki_Off.png" alt="Desativado" id="toggleNeutroIcon">  
                <div class="toggle-container" id="toggleNeutro">
                    <img src="https://wiki.pokexgames.com/images/2/27/Vetor_Toggle_Wiki_Off.png" alt="Desativado" id="toggleNeutroIcon">
                </div>
            </div>
         </div>
         </div>
    </div>
</div>


         <!-- Barra de Busca -->
         <!-- Barra de Busca -->
Linha 274: Linha 274:
             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 toggleNeutroIcon = document.getElementById("toggleNeutroIcon");
             const searchInput = document.getElementById("search");
             const searchInput = document.getElementById("search");
             const switchClans = document.getElementById("switchClans");
             const switchClans = document.getElementById("switchClans");
Linha 284: Linha 284:
             let selectedTypes = [];
             let selectedTypes = [];
             let showNeutro = false;
             let showNeutro = false;
            // URLs das imagens para os estados "Ativado" e "Desativado"
            const neutroIconAtivado = "https://wiki.pokexgames.com/images/7/73/Vetor_Toggle_Wiki_On.png";
            const neutroIconDesativado = "https://wiki.pokexgames.com/images/2/27/Vetor_Toggle_Wiki_Off.png";
            // Verifica se os elementos do toggle existem
            if (!toggleNeutro || !toggleNeutroIcon) {
                console.error("Elementos do toggle não encontrados!");
                return;
            }
            // Toggle para Hunts Neutras
            toggleNeutro.addEventListener("click", () => {
                console.log("Toggle clicado!"); // Log de depuração
                showNeutro = !showNeutro;
                toggleNeutro.classList.toggle("active");
                // Altera a imagem com base no estado
                if (showNeutro) {
                    toggleNeutroIcon.src = neutroIconAtivado; // Imagem para estado "Ativado"
                } else {
                    toggleNeutroIcon.src = neutroIconDesativado; // Imagem para estado "Desativado"
                }
                // Filtra as hunts
                filterHunts();
            });


             // Inicializa os botões de clãs
             // Inicializa os botões de clãs
Linha 326: Linha 353:
             });
             });


  // URLs das imagens para os estados "Ativado" e "Desativado"
const neutroIconAtivado = "https://wiki.pokexgames.com/images/7/73/Vetor_Toggle_Wiki_On.png";
const neutroIconDesativado = "https://wiki.pokexgames.com/images/2/27/Vetor_Toggle_Wiki_Off.png";
// Toggle para Hunts Neutras
toggleNeutro.addEventListener("click", () => {
    showNeutro = !showNeutro;
    toggleNeutro.classList.toggle("active");
    // Altera o texto e a imagem com base no estado
    if (showNeutro) {
        toggleNeutroIcon.src = neutroIconAtivado; // Imagem para estado "Ativado"
    } else {
        toggleNeutroIcon.src = neutroIconDesativado; // Imagem para estado "Desativado"
    }
    filterHunts();
});
             // Barra de busca
             // Barra de busca
             searchInput.addEventListener("input", () => {
             searchInput.addEventListener("input", () => {
Linha 380: Linha 389:
                     const matchesTypes = selectedTypes.length === 0 || selectedTypes.some(type => hunt.huntTypes.includes(type));
                     const matchesTypes = selectedTypes.length === 0 || selectedTypes.some(type => hunt.huntTypes.includes(type));
                     const matchesDifficulty = selectedDifficulty === "" || hunt.difficulty === selectedDifficulty;
                     const matchesDifficulty = selectedDifficulty === "" || hunt.difficulty === selectedDifficulty;
                     const isNeutro = hunt.huntTipo && hunt.huntTipo === "Neutro";
                     const isNeutro = hunt.huntTipo === "Neutro";
                     const matchesSearch = hunt.name.toLowerCase().includes(searchTerm) || hunt.altName.toLowerCase().includes(searchTerm);
                     const matchesSearch = hunt.name.toLowerCase().includes(searchTerm) || (hunt.altName && hunt.altName.toLowerCase().includes(searchTerm));


                     if (matchesTags && matchesTypes && matchesDifficulty && (hunt.huntTipo !== "Neutro" || showNeutro) && matchesSearch) {
                    // Filtra as hunts com base no estado do toggle
                     if (matchesTags && matchesTypes && matchesDifficulty && (!isNeutro || (isNeutro && showNeutro)) && matchesSearch) {
                         const imageItem = document.createElement("div");
                         const imageItem = document.createElement("div");
                         imageItem.className = "image-item";
                         imageItem.className = "image-item";
Renee
Administradores
7 867

edições

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