5 801
edições
Sem resumo de edição |
Sem resumo de edição |
||
Linha 200: | Linha 200: | ||
<script> | <script> | ||
// Dados de exemplo para filtros | |||
const specificOptions = { | const specificOptions = { | ||
1: { | 1: { | ||
'Areia': [ | 'Areia': [ | ||
{ id: '101', local: ' | { id: '101', local: 'Local Verde 1', coordinates: '3780, 3326, 7', imageUrl: 'https://wiki.pokexgames.com/images/d/db/3780%2C_3326%2C_7.png' } | ||
] | ] | ||
}, | }, | ||
2: { | 2: { | ||
'Areia': [ | 'Areia': [ | ||
{ id: '1001', local: 'Outland Water', tag: 'agua', coordinates: '2847, 2827, 6', imageUrl: 'https://wiki.pokexgames.com/images/b/b9/Mapa_Verde_ADV_-_2847%2C_2827%2C_6.webp' }, | { id: '1001', local: 'Outland Water', tag: 'agua', coordinates: '2847, 2827, 6', 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: { | 3: { | ||
Linha 243: | Linha 244: | ||
const specificOptionSelect = document.getElementById('specificOption'); | const specificOptionSelect = document.getElementById('specificOption'); | ||
specificOptionSelect.innerHTML = '<option value="">Selecione uma opção</option>'; | |||
if (selectedMapType) { | if (selectedMapType) { | ||
const options = Object.keys(specificOptions[selectedMapType] || {}); | const options = Object.keys(specificOptions[selectedMapType] || {}); | ||
options.forEach(option => { | options.forEach(option => { | ||
Linha 256: | Linha 257: | ||
document.getElementById('filterButton').addEventListener('click', function () { | document.getElementById('filterButton').addEventListener('click', function () { | ||
const selectedMapType = document.getElementById('mapType').value; | const selectedMapType = document.getElementById('mapType').value; | ||
const selectedOption = document.getElementById('specificOption').value; | const selectedOption = document.getElementById('specificOption').value; | ||
const filterMode = document.getElementById('filterMode').value; | |||
const searchIds = document.getElementById('searchIds').value.split(',').map(id => id.trim().toLowerCase()); | |||
const imageContainer = document.getElementById('imageContainer'); | const imageContainer = document.getElementById('imageContainer'); | ||
Linha 269: | Linha 270: | ||
let imagesHtml = ''; | let imagesHtml = ''; | ||
let allImages = []; | let allImages = []; | ||
const mapOptions = specificOptions[selectedMapType] || {}; | const mapOptions = specificOptions[selectedMapType] || {}; | ||
const images = mapOptions[selectedOption] || []; | const images = mapOptions[selectedOption] || []; | ||
if (filterMode === 'number') { | if (filterMode === 'number') { | ||
allImages = images.filter(image => searchIds.includes(image.id)); | allImages = images.filter(image => searchIds.includes(image.id.toLowerCase())); | ||
} else if (filterMode === 'tag') { | } else if (filterMode === 'tag') { | ||
allImages = images.filter(image => searchIds.includes(image.tag)); | allImages = images.filter(image => searchIds.includes(image.tag.toLowerCase())); | ||
} | } | ||
allImages.sort((a, b) => a.local.localeCompare(b.local)); | allImages.sort((a, b) => a.local.localeCompare(b.local)); | ||
allImages.forEach(image => { | allImages.forEach(image => { | ||
imagesHtml += ` | imagesHtml += ` | ||
Linha 291: | Linha 289: | ||
<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} <br> | <b>Tag</b>: ${image.tag || 'Não disponível'} <br> | ||
</div> | </div> | ||
</div> | </div> |