fix: update data centre filter correctly
This commit is contained in:
parent
de3718be31
commit
93777f1a4c
|
|
@ -120,19 +120,30 @@
|
|||
function setUpDataCentreFilter() {
|
||||
let select = document.getElementById('data-centre-filter');
|
||||
|
||||
let data_centres = [];
|
||||
let dataCentres = {};
|
||||
for (let elem of document.querySelectorAll('#listings > .listing')) {
|
||||
let centre = elem.dataset['centre'];
|
||||
if (!data_centres.includes(centre)) {
|
||||
data_centres.push(centre);
|
||||
if (!dataCentres.hasOwnProperty(centre)) {
|
||||
dataCentres[centre] = 0;
|
||||
}
|
||||
|
||||
dataCentres[centre] += 1;
|
||||
}
|
||||
|
||||
data_centres.sort();
|
||||
for (let centre of data_centres) {
|
||||
let opt = document.createElement('option');
|
||||
opt.innerText = centre;
|
||||
select.appendChild(opt);
|
||||
for (let opt of select.options) {
|
||||
let centre = opt.value;
|
||||
|
||||
let count = 0;
|
||||
|
||||
if (dataCentres.hasOwnProperty(centre)) {
|
||||
count = dataCentres[centre];
|
||||
}
|
||||
|
||||
if (centre === 'All') {
|
||||
count = Object.values(dataCentres).reduce((a, b) => a + b);
|
||||
}
|
||||
|
||||
opt.innerText += ` (${count})`;
|
||||
}
|
||||
|
||||
select.addEventListener('change', () => {
|
||||
|
|
|
|||
|
|
@ -5,9 +5,9 @@ Remote Party Finder
|
|||
{%- endblock %}
|
||||
|
||||
{% block head %}
|
||||
<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>
|
||||
<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 %}
|
||||
|
||||
{% block body %}
|
||||
|
|
@ -15,7 +15,24 @@ Remote Party Finder
|
|||
<div class="requires-js">
|
||||
<input type="search" class="search" placeholder="Search"/>
|
||||
<select id="data-centre-filter">
|
||||
<option>All</option>
|
||||
<option value="All">All</option>
|
||||
<optgroup label="North America">
|
||||
<option value="Aether">Aether</option>
|
||||
<option value="Crystal">Crystal</option>
|
||||
<option value="Primal">Primal</option>
|
||||
</optgroup>
|
||||
<optgroup label="Europe">
|
||||
<option value="Chaos">Chaos</option>
|
||||
<option value="Light">Light</option>
|
||||
</optgroup>
|
||||
<optgroup label="Japan">
|
||||
<option value="Elemental">Elemental</option>
|
||||
<option value="Gaia">Gaia</option>
|
||||
<option value="Mana">Mana</option>
|
||||
</optgroup>
|
||||
<optgroup label="Oceania">
|
||||
<option disabled value="">Not yet lmao</option>
|
||||
</optgroup>
|
||||
</select>
|
||||
<details class="filter-controls">
|
||||
<summary>Advanced</summary>
|
||||
|
|
@ -52,60 +69,60 @@ Remote Party Finder
|
|||
{%- 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-type="{{ listing.duty_type.as_u8() }}"
|
||||
data-category="{{ listing.category.as_u32() }}"
|
||||
data-high-end="{{ listing.high_end() }}"
|
||||
data-content-kind={{ listing.content_kind() }}>
|
||||
class="listing"
|
||||
data-id="{{ listing.id }}"
|
||||
data-centre="{{ listing.data_centre_name().unwrap_or_default() }}"
|
||||
data-type="{{ listing.duty_type.as_u8() }}"
|
||||
data-category="{{ listing.category.as_u32() }}"
|
||||
data-high-end="{{ listing.high_end() }}"
|
||||
data-content-kind={{ listing.content_kind() }}>
|
||||
<div class="left">
|
||||
{%- let duty_class %}
|
||||
{%- if listing.is_cross_world() %}
|
||||
{%- let duty_class = " cross" %}
|
||||
{%- let duty_class = " cross" %}
|
||||
{%- else %}
|
||||
{%- let duty_class = " local" %}
|
||||
{%- let duty_class = " local" %}
|
||||
{%- endif %}
|
||||
<div class="duty{{ duty_class }}">{{ listing.duty_name() }}</div>
|
||||
<div class="description">
|
||||
{%- let desc = listing.description.full_text() %}
|
||||
{%- if desc.trim().is_empty() -%}
|
||||
<em>None</em>
|
||||
<em>None</em>
|
||||
{%- else -%}
|
||||
{%- let (colour_class, prepend_flags) = listing.prepend_flags() -%}
|
||||
{%- if !prepend_flags.is_empty() -%}
|
||||
<span class="{{ colour_class }}">{{ prepend_flags }} </span>
|
||||
{%- endif -%}
|
||||
{{- desc.trim() }}
|
||||
{%- let (colour_class, prepend_flags) = listing.prepend_flags() -%}
|
||||
{%- if !prepend_flags.is_empty() -%}
|
||||
<span class="{{ colour_class }}">{{ prepend_flags }} </span>
|
||||
{%- endif -%}
|
||||
{{- desc.trim() }}
|
||||
{%- endif -%}
|
||||
</div>
|
||||
<div class="party">
|
||||
{%- for slot in listing.slots() %}
|
||||
{%- let filled %}
|
||||
{%- let title %}
|
||||
{%- let role_class %}
|
||||
{%- match slot %}
|
||||
{%- when Ok with (slot) %}
|
||||
{%- let filled = " filled" %}
|
||||
{%- match slot.role() %}
|
||||
{%- when Some with (role) %}
|
||||
{%- let role_class = " {}"|format(role.as_str().to_lowercase()) %}
|
||||
{%- when None %}
|
||||
{%- let role_class = "".to_string() %}
|
||||
{%- endmatch %}
|
||||
{%- let title = slot.code().to_string() %}
|
||||
{%- when Err with (tuple) %}
|
||||
{%- let filled = "" %}
|
||||
{%- let title = tuple.1.clone() %}
|
||||
{%- let role_class = " {}"|format(tuple.0) %}
|
||||
{%- endmatch %}
|
||||
<div class="slot{{ filled }}{{ role_class }}" title="{{ title }}">
|
||||
{%- if !filled.is_empty() %}
|
||||
<svg viewBox="0 0 32 32">
|
||||
<use href="/assets/icons.svg#{{ title }}"></use>
|
||||
</svg>
|
||||
{%- endif %}
|
||||
</div>
|
||||
{%- let filled %}
|
||||
{%- let title %}
|
||||
{%- let role_class %}
|
||||
{%- match slot %}
|
||||
{%- when Ok with (slot) %}
|
||||
{%- let filled = " filled" %}
|
||||
{%- match slot.role() %}
|
||||
{%- when Some with (role) %}
|
||||
{%- let role_class = " {}"|format(role.as_str().to_lowercase()) %}
|
||||
{%- when None %}
|
||||
{%- let role_class = "".to_string() %}
|
||||
{%- endmatch %}
|
||||
{%- let title = slot.code().to_string() %}
|
||||
{%- when Err with (tuple) %}
|
||||
{%- let filled = "" %}
|
||||
{%- let title = tuple.1.clone() %}
|
||||
{%- let role_class = " {}"|format(tuple.0) %}
|
||||
{%- endmatch %}
|
||||
<div class="slot{{ filled }}{{ role_class }}" title="{{ title }}">
|
||||
{%- if !filled.is_empty() %}
|
||||
<svg viewBox="0 0 32 32">
|
||||
<use href="/assets/icons.svg#{{ title }}"></use>
|
||||
</svg>
|
||||
{%- endif %}
|
||||
</div>
|
||||
{%- endfor %}
|
||||
<div class="total">{{ listing.slots_filled() }}/{{ listing.slots_available }}</div>
|
||||
</div>
|
||||
|
|
@ -151,7 +168,7 @@ Remote Party Finder
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{%- endfor %}
|
||||
{%- endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% endblock %}
|
||||
|
|
|
|||
Loading…
Reference in New Issue