refactor: start adding support for more filtering
This commit is contained in:
parent
e6b9d0bea6
commit
4359190f9e
|
@ -30,16 +30,70 @@ body {
|
|||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
margin: 0;
|
||||
|
||||
font-family: sans-serif;
|
||||
background-color: var(--background);
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.js body {
|
||||
margin: 1em 0 0;
|
||||
}
|
||||
|
||||
.no-js .requires-js {
|
||||
display: none;
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
details {
|
||||
margin-top: .5em;
|
||||
}
|
||||
|
||||
details > summary {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
#container {
|
||||
margin: 0 1em;
|
||||
}
|
||||
|
||||
.filter-controls > div {
|
||||
display: flex;
|
||||
flex-flow: row wrap;
|
||||
}
|
||||
|
||||
.filter-controls .control {
|
||||
width: max-content;
|
||||
flex: 0 1 auto;
|
||||
margin-left: 1em;
|
||||
}
|
||||
|
||||
.filter-controls .control > label {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.filter-controls .control > label > * {
|
||||
flex: 0 1 auto;
|
||||
margin-top: .5em;
|
||||
}
|
||||
|
||||
.js #listings {
|
||||
border-top: 2px dashed var(--text);
|
||||
margin-top: 1em;
|
||||
}
|
||||
|
||||
#listings > .no-listings {
|
||||
margin-top: 1em;
|
||||
}
|
||||
|
||||
#listings > .listing {
|
||||
display: grid;
|
||||
grid-template-columns: 3fr auto 2fr;
|
||||
gap: 1em;
|
||||
|
||||
margin: 0 -1em;
|
||||
padding: 1em;
|
||||
|
||||
background-color: var(--row-background);
|
||||
|
|
|
@ -1,45 +1,78 @@
|
|||
(function () {
|
||||
let select = document.getElementById('data-centre-filter');
|
||||
|
||||
let data_centres = [];
|
||||
for (let elem of document.querySelectorAll('#listings > .listing')) {
|
||||
let centre = elem.dataset['centre'];
|
||||
if (data_centres.indexOf(centre) === -1) {
|
||||
data_centres.push(centre);
|
||||
}
|
||||
function addJsClass() {
|
||||
document.children[0].className = 'js';
|
||||
}
|
||||
|
||||
data_centres.sort();
|
||||
for (let centre of data_centres) {
|
||||
let opt = document.createElement('option');
|
||||
opt.innerText = centre;
|
||||
select.appendChild(opt);
|
||||
function setUpList() {
|
||||
let options = {
|
||||
valueNames: [
|
||||
'duty',
|
||||
'creator',
|
||||
'description',
|
||||
{data: ['centre']},
|
||||
],
|
||||
};
|
||||
return new List('container', options);
|
||||
}
|
||||
|
||||
let options = {
|
||||
valueNames: [
|
||||
'duty',
|
||||
'creator',
|
||||
'description',
|
||||
{data: ['centre']},
|
||||
],
|
||||
};
|
||||
let list = new List('container', options);
|
||||
function setUpDataCentreFilter(list) {
|
||||
let select = document.getElementById('data-centre-filter');
|
||||
|
||||
select.addEventListener('change', () => {
|
||||
let centre = select.value;
|
||||
if (centre === 'All') {
|
||||
list.filter();
|
||||
return;
|
||||
let data_centres = [];
|
||||
for (let elem of document.querySelectorAll('#listings > .listing')) {
|
||||
let centre = elem.dataset['centre'];
|
||||
if (!data_centres.includes(centre)) {
|
||||
data_centres.push(centre);
|
||||
}
|
||||
}
|
||||
|
||||
console.log(`looking for ${centre}`);
|
||||
data_centres.sort();
|
||||
for (let centre of data_centres) {
|
||||
let opt = document.createElement('option');
|
||||
opt.innerText = centre;
|
||||
select.appendChild(opt);
|
||||
}
|
||||
|
||||
list.filter(item => {
|
||||
console.log(item.values().centre === centre)
|
||||
return item.values().centre === centre;
|
||||
// console.log(item.elm.dataset['centre']);
|
||||
// return item.elm.dataset['centre'] === centre;
|
||||
select.addEventListener('change', () => {
|
||||
let centre = select.value;
|
||||
if (centre === 'All') {
|
||||
list.filter();
|
||||
return;
|
||||
}
|
||||
|
||||
list.filter(item => item.values().centre === centre);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function setUpCategoryFilter(list) {
|
||||
let select = document.getElementById('category-filter');
|
||||
|
||||
select.addEventListener('change', () => {
|
||||
let allowed = [];
|
||||
|
||||
for (let option of select.options) {
|
||||
if (!option.selected) {
|
||||
continue;
|
||||
}
|
||||
|
||||
let type = option.dataset.type;
|
||||
let category = option.dataset.category;
|
||||
|
||||
allowed.push(`${type}/${category}`);
|
||||
}
|
||||
|
||||
list.filter(item => {
|
||||
let data = item.elm.dataset;
|
||||
let type = data.type;
|
||||
let category = data.category;
|
||||
|
||||
return allowed.includes(`${type}/${category}`);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
addJsClass();
|
||||
let list = setUpList();
|
||||
setUpDataCentreFilter(list);
|
||||
setUpCategoryFilter(list);
|
||||
})();
|
||||
|
|
3473
src/ffxiv/duties.rs
3473
src/ffxiv/duties.rs
File diff suppressed because it is too large
Load Diff
|
@ -55,8 +55,8 @@ impl PartyFinderListing {
|
|||
(DutyType::Other, DutyCategory::TheHunt) => return Cow::from("The Hunt"),
|
||||
(DutyType::Other, DutyCategory::Duty) if self.duty == 0 => return Cow::from("None"),
|
||||
(DutyType::Normal, _) => {
|
||||
if let Some(&name) = crate::ffxiv::DUTIES.get(&u32::from(self.duty)) {
|
||||
return Cow::from(name);
|
||||
if let Some(info) = crate::ffxiv::DUTIES.get(&u32::from(self.duty)) {
|
||||
return Cow::from(info.name);
|
||||
}
|
||||
}
|
||||
(DutyType::Roulette, _) => {
|
||||
|
@ -188,7 +188,7 @@ impl PartyFinderSlot {
|
|||
}
|
||||
}
|
||||
|
||||
#[derive(Debug, Deserialize_repr, Serialize_repr, PartialEq)]
|
||||
#[derive(Debug, Clone, Copy, Deserialize_repr, Serialize_repr, PartialEq)]
|
||||
#[repr(u32)]
|
||||
pub enum DutyCategory {
|
||||
Duty = 0,
|
||||
|
@ -201,7 +201,13 @@ pub enum DutyCategory {
|
|||
AdventuringForays = 1 << 6,
|
||||
}
|
||||
|
||||
#[derive(Debug, Deserialize_repr, Serialize_repr, PartialEq)]
|
||||
impl DutyCategory {
|
||||
pub fn as_u32(self) -> u32 {
|
||||
unsafe { std::mem::transmute(self) }
|
||||
}
|
||||
}
|
||||
|
||||
#[derive(Debug, Clone, Copy, Deserialize_repr, Serialize_repr, PartialEq)]
|
||||
#[repr(u8)]
|
||||
pub enum DutyType {
|
||||
Other = 0,
|
||||
|
@ -209,6 +215,12 @@ pub enum DutyType {
|
|||
Normal = 1 << 1,
|
||||
}
|
||||
|
||||
impl DutyType {
|
||||
pub fn as_u8(self) -> u8 {
|
||||
unsafe { std::mem::transmute(self) }
|
||||
}
|
||||
}
|
||||
|
||||
bitflags! {
|
||||
#[derive(Deserialize, Serialize)]
|
||||
#[serde(transparent)]
|
||||
|
|
|
@ -1,11 +1,11 @@
|
|||
<!doctype html>
|
||||
<html lang="en">
|
||||
<html lang="en" class="no-js">
|
||||
<head>
|
||||
<meta charset="utf-8"/>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1"/>
|
||||
<title>{% block title %}{% endblock %}</title>
|
||||
<link rel="stylesheet" href="/assets/minireset.css"/>
|
||||
{%- block head %}{% endblock %}
|
||||
{%- block head %}{% endblock -%}
|
||||
</head>
|
||||
<body>{% block body %}{% endblock %}</body>
|
||||
</html>
|
||||
|
|
|
@ -8,25 +8,66 @@ Remote Party Finder
|
|||
<link rel="stylesheet" href="/assets/listings.css"/>
|
||||
<script defer src="https://cdnjs.cloudflare.com/ajax/libs/list.js/2.3.1/list.min.js"></script>
|
||||
<script defer src="/assets/listings.js"></script>
|
||||
{%- endblock %}
|
||||
{% endblock %}
|
||||
|
||||
{% block body %}
|
||||
<div id="container">
|
||||
<input type="search" class="search" placeholder="Search"/>
|
||||
<select id="data-centre-filter">
|
||||
<option>All</option>
|
||||
</select>
|
||||
{%- if containers.is_empty() %}
|
||||
<br/>
|
||||
<em>No listings - download the plugin to help contribute!</em>
|
||||
{%- endif %}
|
||||
<div class="requires-js">
|
||||
<input type="search" class="search" placeholder="Search"/>
|
||||
<select id="data-centre-filter">
|
||||
<option>All</option>
|
||||
</select>
|
||||
<details class="filter-controls">
|
||||
<summary>Advanced</summary>
|
||||
<div>
|
||||
<div class="control">
|
||||
<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>
|
||||
</select>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</details>
|
||||
</div>
|
||||
<div id="listings" class="list">
|
||||
{%- if containers.is_empty() %}
|
||||
<em class="no-listings">No listings - download the plugin to help contribute!</em>
|
||||
{%- endif %}
|
||||
{%- for container in containers %}
|
||||
{%- let listing = container.listing.borrow() %}
|
||||
<div
|
||||
class="listing"
|
||||
data-id="{{ listing.id }}"
|
||||
data-centre="{{ listing.data_centre_name().unwrap_or_default() }}">
|
||||
data-centre="{{ listing.data_centre_name().unwrap_or_default() }}"
|
||||
data-type="{{ listing.duty_type.as_u8() }}"
|
||||
data-category="{{ listing.category.as_u32() }}">
|
||||
<div class="left">
|
||||
{%- let duty_class %}
|
||||
{%- if listing.is_cross_world() %}
|
||||
|
|
Loading…
Reference in New Issue