992
edições
Widget:SearchQuestScript (ver código-fonte)
Edição das 18h22min de 27 de dezembro de 2023
, 27 de dezembro de 2023sem sumário de edição
Sem resumo de edição |
Sem resumo de edição |
||
| (17 revisões intermediárias pelo mesmo usuário não estão sendo mostradas) | |||
| Linha 1: | Linha 1: | ||
<script defer> | <script defer> | ||
// Container dos cartões | // Container dos cartões | ||
const container = document.querySelector("#app") | const container = document.querySelector("#app-quests") | ||
const contentLevel = document.querySelector("#contentLevel") | const contentLevel = document.querySelector("#contentLevel"); | ||
const questCheck = document.querySelector("#questCheck"); | const questCheck = document.querySelector("#questCheck"); | ||
const catchCheck = document.querySelector("#catchCheck"); | const catchCheck = document.querySelector("#catchCheck"); | ||
| Linha 8: | Linha 8: | ||
const tasksCheck = document.querySelector("#tasksCheck"); | const tasksCheck = document.querySelector("#tasksCheck"); | ||
const pvpCheck = document.querySelector("#pvpCheck"); | const pvpCheck = document.querySelector("#pvpCheck"); | ||
const nwCheck = document.querySelector("#nightmareCheck"); | |||
function filterData(data) { | function filterData(data) { | ||
const temp = data.filter((item) => { | const temp = data.filter((item) => { | ||
if (contentLevel < item.level) return false; | if (Number(contentLevel.value) < Number(item.level) || !(Number(contentLevel.value) - 50 <= Number(item.level))) return false; | ||
if ( | if ( | ||
| Linha 27: | Linha 19: | ||
dailyCheck.checked != item.categories.daily && | dailyCheck.checked != item.categories.daily && | ||
tasksCheck.checked != item.categories.catch && | tasksCheck.checked != item.categories.catch && | ||
pvpCheck.checked != item.categories.pvp | pvpCheck.checked != item.categories.pvp && | ||
) | nwCheck.checked != item.categories.nw | ||
) return false; | |||
return true; | return true; | ||
| Linha 39: | Linha 31: | ||
function createCard(cardData) { | function createCard(cardData) { | ||
const icons = cardData.icons.map((icon) => ( | const icons = cardData.icons.map((icon) => ( | ||
`<img src=". | `<img src="${icon.image}" title="${icon.title}" alt="Icone ${icon.title}">` | ||
)); | )); | ||
| Linha 45: | Linha 37: | ||
<a href="${cardData.link}" class="card"> | <a href="${cardData.link}" class="card"> | ||
<main> | <main> | ||
<h2> | <h2> | ||
${cardData.title} <span class="level"> | ${cardData.title} <br /> <span class="level"> Level: ${cardData.level} </span> | ||
</h2> | </h2> | ||
<div class="description-container"> | <div class="description-container"> | ||
<p class="description"> | <p class="description" title="${cardData.description}"> | ||
${cardData.description} | ${cardData.description} | ||
</p> | </p> | ||
</div> | </div> | ||
<footer class="icon-container"> | |||
${icons.join("")} | |||
</footer> | |||
</main> | </main> | ||
| Linha 68: | Linha 60: | ||
document.querySelector("#quests-form").addEventListener("submit", function (e) { | document.querySelector("#quests-form").addEventListener("submit", function (e) { | ||
e.preventDefault() | e.preventDefault(); | ||
container.innerHTML = ''; | |||
const filteredData = filterData(json); | const filteredData = filterData(json); | ||
filteredData.forEach(data => { | filteredData.forEach(data => { | ||
container. | container.innerHTML += (createCard(data)); | ||
}); | }); | ||
}) | }); | ||
</script> | </script> | ||