Cametendo/devil-fruit-encyclopedia
1
0
Fork 0
mirror of https://github.com/Cametendo/devil-fruit-encyclopedia.git synced 2026-09-13 15:59:48 +02:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #7 from Cametendo/codex/add-images-for-characters-and-devil-fruits

Browse Source 
Fetch/hydrate proper wiki images, improve portraits, and add deceased filter
This commit is contained in:
Cametendo
2026-08-15 02:21:33 +02:00
committed by GitHub
parent 84d3be478e 34908f7108
commit 8e01a89ab8
2 changed files with 11 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
index.html
View File

@@ -42,7 +42,8 @@
<select id="affiliation-select" class="select"> <select id="affiliation-select" class="select">
<option value="">All affiliations</option> <option value="">All affiliations</option>
</select> </select>
<label class="checkbox"><input type="checkbox" id="fruit-only-checkbox" /> Devil Fruit users only</label> <label class="checkbox"><input type="checkbox" id="fruit-only-checkbox" autocomplete="off" /> Devil Fruit users only</label>
<label class="checkbox"><input type="checkbox" id="deceased-only-checkbox" autocomplete="off" /> Deceased only</label>
<span class="filter-meta" id="result-count"></span> <span class="filter-meta" id="result-count"></span>
</div> </div>
</section> </section>

10
js/main.js
View File

@@ -1,12 +1,17 @@
/* Home page: character grid with search + affiliation + devil-fruit filters. */ /* Home page: character grid with search + affiliation + devil-fruit + deceased filters. */
(function () { (function () {
const grid = document.getElementById('character-grid'); const grid = document.getElementById('character-grid');
const searchInput = document.getElementById('search-input'); const searchInput = document.getElementById('search-input');
const affiliationSelect = document.getElementById('affiliation-select'); const affiliationSelect = document.getElementById('affiliation-select');
const fruitOnlyCheckbox = document.getElementById('fruit-only-checkbox'); const fruitOnlyCheckbox = document.getElementById('fruit-only-checkbox');
const deceasedOnlyCheckbox = document.getElementById('deceased-only-checkbox');
const resultCount = document.getElementById('result-count'); const resultCount = document.getElementById('result-count');
// Browsers may restore checkbox state across reloads; start with the full roster visible.
fruitOnlyCheckbox.checked = false;
deceasedOnlyCheckbox.checked = false;
document.getElementById('stat-characters').textContent = CHARACTERS.length; document.getElementById('stat-characters').textContent = CHARACTERS.length;
document.getElementById('stat-fruits').textContent = FRUITS.length; document.getElementById('stat-fruits').textContent = FRUITS.length;
@@ -22,9 +27,11 @@
const term = searchInput.value.trim().toLowerCase(); const term = searchInput.value.trim().toLowerCase();
const affiliation = affiliationSelect.value; const affiliation = affiliationSelect.value;
const fruitOnly = fruitOnlyCheckbox.checked; const fruitOnly = fruitOnlyCheckbox.checked;
const deceasedOnly = deceasedOnlyCheckbox.checked;
const results = CHARACTERS.filter((c) => { const results = CHARACTERS.filter((c) => {
if (fruitOnly && !c.devilFruit) return false; if (fruitOnly && !c.devilFruit) return false;
if (deceasedOnly && !/deceased/i.test(c.status || '')) return false;
if (affiliation && c.affiliation !== affiliation) return false; if (affiliation && c.affiliation !== affiliation) return false;
if (term) { if (term) {
const haystack = `${c.name} ${c.epithet || ''} ${c.affiliation} ${c.role}`.toLowerCase(); const haystack = `${c.name} ${c.epithet || ''} ${c.affiliation} ${c.role}`.toLowerCase();
@@ -41,6 +48,7 @@
searchInput.addEventListener('input', applyFilters); searchInput.addEventListener('input', applyFilters);
affiliationSelect.addEventListener('change', applyFilters); affiliationSelect.addEventListener('change', applyFilters);
fruitOnlyCheckbox.addEventListener('change', applyFilters); fruitOnlyCheckbox.addEventListener('change', applyFilters);
deceasedOnlyCheckbox.addEventListener('change', applyFilters);
applyFilters(); applyFilters();
})(); })();