feat: finish category filtering

This commit is contained in:
Anna 2021-10-05 14:36:24 -04:00
parent 51f80101bf
commit de3718be31
3 changed files with 169 additions and 49 deletions

View File

@ -1,8 +1,87 @@
(function () {
let stateWasNull = false;
const state = {
allowed: {},
centre: "All",
list: null,
};
const categoryDefaults = {
type: 0,
category: 0,
highEnd: false,
contentKind: -1,
};
function addJsClass() {
document.children[0].className = 'js';
}
function saveLoadState() {
let saved = localStorage.getItem('state');
if (saved !== null) {
try {
saved = JSON.parse(saved);
} catch (e) {
saved = {}
stateWasNull = true;
}
for (let key in saved) {
state[key] = saved[key];
}
} else {
stateWasNull = true;
}
window.addEventListener('pagehide', () => {
let copy = {};
for (let key in state) {
if (key === 'list') {
continue;
}
copy[key] = state[key];
}
localStorage.setItem('state', JSON.stringify(copy));
});
}
function getOptionValues(option) {
return {
type: option.dataset.type || categoryDefaults.type,
category: option.dataset.category || categoryDefaults.category,
highEnd: option.dataset.highEnd || categoryDefaults.highEnd,
contentKind: option.dataset.contentKind || categoryDefaults.contentKind,
};
}
function reflectState() {
let category = document.getElementById('category-filter');
for (let option of category.options) {
let values = getOptionValues(option);
let key = `${values.type}/${values.category}/${values.highEnd}`;
if (state.allowed[key] === undefined) {
if (stateWasNull) {
state.allowed[key] = [];
} else {
continue;
}
}
if (stateWasNull) {
state.allowed[key].push(values.contentKind);
}
option.selected = state.allowed[key].includes(-1) || state.allowed[key].includes(values.contentKind);
}
let dataCentre = document.getElementById('data-centre-filter');
dataCentre.value = state.centre;
}
function setUpList() {
let options = {
valueNames: [
@ -15,7 +94,30 @@
return new List('container', options);
}
function setUpDataCentreFilter(list) {
function refilter() {
function categoryFilter(item) {
let data = item.elm.dataset;
let type = data.type;
let category = data.category;
let highEnd = data.highEnd;
let contentKind = data.contentKind;
let allowedContentKind = state.allowed[`${type}/${category}/${highEnd}`];
if (allowedContentKind === undefined) {
return false;
}
return allowedContentKind.includes(-1) || allowedContentKind.includes(contentKind);
}
function dataCentreFilter(item) {
return state.centre === "All" || state.centre === item.values().centre;
}
state.list.filter(item => dataCentreFilter(item) && categoryFilter(item));
}
function setUpDataCentreFilter() {
let select = document.getElementById('data-centre-filter');
let data_centres = [];
@ -34,45 +136,44 @@
}
select.addEventListener('change', () => {
let centre = select.value;
if (centre === 'All') {
list.filter();
return;
}
list.filter(item => item.values().centre === centre);
state.centre = select.value;
refilter();
});
}
function setUpCategoryFilter(list) {
function setUpCategoryFilter() {
let select = document.getElementById('category-filter');
select.addEventListener('change', () => {
let allowed = [];
let allowed = new Map();
for (let option of select.options) {
if (!option.selected) {
continue;
}
let type = option.dataset.type;
let category = option.dataset.category;
let values = getOptionValues(option);
allowed.push(`${type}/${category}`);
let key = `${values.type}/${values.category}/${values.highEnd}`;
if (allowed[key] === undefined) {
allowed[key] = [];
}
if (!allowed[key].includes(values.contentKind)) {
allowed[key].push(values.contentKind);
}
}
list.filter(item => {
let data = item.elm.dataset;
let type = data.type;
let category = data.category;
return allowed.includes(`${type}/${category}`);
});
state.allowed = allowed;
refilter();
});
}
addJsClass();
let list = setUpList();
setUpDataCentreFilter(list);
setUpCategoryFilter(list);
saveLoadState();
reflectState();
state.list = setUpList();
setUpDataCentreFilter();
setUpCategoryFilter();
refilter();
})();

View File

@ -67,6 +67,36 @@ impl ContentKind {
x => Self::Other(x),
}
}
pub fn as_u32(self) -> u32 {
match self {
Self::DutyRoulette => 1,
Self::Dungeons => 2,
Self::Guildhests => 3,
Self::Trials => 4,
Self::Raids => 5,
Self::PvP => 6,
Self::QuestBattles => 7,
Self::FATEs => 8,
Self::TreasureHunt => 9,
Self::Levequests => 10,
Self::GrandCompany => 11,
Self::Companions => 12,
Self::BeastTribeQuests => 13,
Self::OverallCompletion => 14,
Self::PlayerCommendation => 15,
Self::DisciplesoftheLand => 16,
Self::DisciplesoftheHand => 17,
Self::RetainerVentures => 18,
Self::GoldSaucer => 19,
Self::DeepDungeons => 21,
Self::WondrousTails => 24,
Self::CustomDeliveries => 25,
Self::Eureka => 26,
Self::UltimateRaids => 28,
Self::Other(x) => x,
}
}
}
lazy_static::lazy_static! {

View File

@ -24,32 +24,21 @@ Remote Party Finder
<label>
Categories
<select multiple id="category-filter">
<option data-type="0" data-category="0">None</option>
<option data-type="1" data-category="0">Duty Roulette</option>
<option data-type="" data-category="">Dungeons</option>
<option data-type="" data-category="">Guildhests</option>
<option data-type="" data-category="">Trials</option>
<option data-type="" data-category="">Raids</option>
<option data-type="" data-category="">High-end Duty</option>
<option data-type="" data-category="">PvP</option>
<option data-type="0" data-category="1">Quest Battles</option>
<option data-type="0" data-category="2">FATEs</option>
<option data-type="0" data-category="4">Treasure Hunt</option>
<option data-type="0" data-category="8">The Hunt</option>
<option data-type="0" data-category="16">Gathering Forays</option>
<option data-type="0" data-category="32">Deep Dungeons</option>
<option data-type="0" data-category="64">Adventuring Forays</option>
</select>
</label>
</div>
<div class="control">
<label>
Categories
<select multiple>
<option>Lul</option>
<option>Wut</option>
<option>Uwu</option>
<option>Owo</option>
<option>None</option>
<option data-type="1">Duty Roulette</option>
<option data-type="2" data-content-kind="2">Dungeons</option>
<option data-type="2" data-content-kind="3">Guildhests</option>
<option data-type="2" data-content-kind="4">Trials</option>
<option data-type="2" data-content-kind="5">Raids</option>
<option data-type="2" data-high-end="true">High-end Duty</option>
<option data-type="2" data-content-kind="6">PvP</option>
<option data-category="1">Quest Battles</option>
<option data-category="2">FATEs</option>
<option data-category="4">Treasure Hunt</option>
<option data-category="8">The Hunt</option>
<option data-type="2" data-category="16">Gathering Forays</option>
<option data-type="2" data-category="32">Deep Dungeons</option>
<option data-type="2" data-category="64">Adventuring Forays</option>
</select>
</label>
</div>