Autosave: 20260415-180938
This commit is contained in:
Flatlogic Bot
parent
ee0bd438e1
commit
1659ef93b5
330
index.php
330
index.php
@ -70,6 +70,7 @@ $ship_preset_rows = [];
|
||||
$ship_preset_manufacturers = [];
|
||||
$ship_preset_error = null;
|
||||
$item_custom_public_rows = [];
|
||||
$item_custom_public_types = [];
|
||||
$item_custom_public_error = null;
|
||||
|
||||
try {
|
||||
@ -238,13 +239,24 @@ if ($has_member_access) {
|
||||
}
|
||||
}
|
||||
|
||||
$item_custom_public_types_lookup = [];
|
||||
|
||||
foreach ($grouped_item_custom_public as $item_custom_public_row) {
|
||||
$item_custom_public_row['search'] = trim(implode(' ', array_filter($item_custom_public_row['search_parts'], static function ($value) {
|
||||
return trim((string) $value) !== '';
|
||||
})));
|
||||
unset($item_custom_public_row['search_parts']);
|
||||
$item_custom_public_rows[] = $item_custom_public_row;
|
||||
|
||||
$item_custom_public_type_label = $item_custom_public_row['type'] !== '' ? $item_custom_public_row['type'] : 'Type inconnu';
|
||||
$item_custom_public_type_key = strtolower($item_custom_public_type_label);
|
||||
if (!isset($item_custom_public_types_lookup[$item_custom_public_type_key])) {
|
||||
$item_custom_public_types_lookup[$item_custom_public_type_key] = $item_custom_public_type_label;
|
||||
}
|
||||
}
|
||||
|
||||
natcasesort($item_custom_public_types_lookup);
|
||||
$item_custom_public_types = array_values($item_custom_public_types_lookup);
|
||||
} catch (Throwable $e) {
|
||||
$item_custom_public_error = 'Impossible de charger les objets Item Custom pour le moment.';
|
||||
}
|
||||
@ -491,9 +503,12 @@ if ($has_member_access) {
|
||||
}
|
||||
|
||||
.item-custom-dialog {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
background: linear-gradient(180deg, rgba(15, 20, 29, 0.98), rgba(7, 10, 16, 0.98));
|
||||
border: 1px solid rgba(162, 155, 120, 0.35);
|
||||
box-shadow: 0 20px 50px rgba(0, 0, 0, 0.45);
|
||||
max-height: min(88vh, 980px);
|
||||
}
|
||||
|
||||
.item-custom-dialog h3 {
|
||||
@ -502,10 +517,14 @@ if ($has_member_access) {
|
||||
}
|
||||
|
||||
.item-custom-dialog > div {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
flex: 1 1 auto;
|
||||
min-height: 0;
|
||||
overflow: hidden;
|
||||
padding: 22px 26px 26px;
|
||||
}
|
||||
|
||||
.item-custom-intro,
|
||||
.item-custom-empty,
|
||||
.item-custom-error {
|
||||
margin: 0 0 18px;
|
||||
@ -515,11 +534,6 @@ if ($has_member_access) {
|
||||
text-align: left !important;
|
||||
}
|
||||
|
||||
.item-custom-intro {
|
||||
background: rgba(162, 155, 120, 0.12);
|
||||
border: 1px solid rgba(162, 155, 120, 0.18);
|
||||
color: #f0ead2;
|
||||
}
|
||||
|
||||
.item-custom-empty {
|
||||
background: rgba(255, 255, 255, 0.06);
|
||||
@ -534,22 +548,92 @@ if ($has_member_access) {
|
||||
|
||||
.item-custom-filter-bar {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 16px;
|
||||
flex-direction: column;
|
||||
align-items: stretch;
|
||||
gap: 10px;
|
||||
margin: 0 0 18px;
|
||||
padding: 14px 16px;
|
||||
border-radius: 14px;
|
||||
background: rgba(255, 255, 255, 0.04);
|
||||
border: 1px solid rgba(162, 155, 120, 0.18);
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.item-custom-filter-top {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 14px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.item-custom-search-wrap {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 12px;
|
||||
flex: 1 1 420px;
|
||||
min-width: 280px;
|
||||
flex: 1 1 auto;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.item-custom-type-filters {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
gap: 8px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.item-custom-type-label {
|
||||
font-size: 0.64em;
|
||||
font-weight: 700;
|
||||
letter-spacing: 0.08em;
|
||||
text-transform: uppercase;
|
||||
color: rgba(255, 255, 255, 0.62);
|
||||
}
|
||||
|
||||
.item-custom-type-options {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.item-custom-type-chip {
|
||||
position: relative;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.item-custom-type-chip input {
|
||||
position: absolute;
|
||||
opacity: 0;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.item-custom-type-chip span {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
padding: 4px 9px;
|
||||
min-height: 24px;
|
||||
border-radius: 999px;
|
||||
border: 1px solid rgba(162, 155, 120, 0.22);
|
||||
background: rgba(255, 255, 255, 0.028);
|
||||
color: rgba(255, 255, 255, 0.76);
|
||||
font-size: 0.62em;
|
||||
font-weight: 400;
|
||||
letter-spacing: 0.03em;
|
||||
line-height: 1;
|
||||
transition: border-color 0.18s ease, background 0.18s ease, color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
|
||||
}
|
||||
|
||||
.item-custom-type-chip input:checked + span {
|
||||
border-color: rgba(162, 155, 120, 0.72);
|
||||
background: rgba(162, 155, 120, 0.18);
|
||||
color: #fff7dd;
|
||||
box-shadow: inset 0 0 0 1px rgba(162, 155, 120, 0.18);
|
||||
}
|
||||
|
||||
.item-custom-type-chip input:focus-visible + span {
|
||||
outline: 2px solid rgba(162, 155, 120, 0.45);
|
||||
outline-offset: 2px;
|
||||
}
|
||||
|
||||
.item-custom-search-input {
|
||||
@ -581,24 +665,28 @@ if ($has_member_access) {
|
||||
}
|
||||
|
||||
.item-custom-filter-status {
|
||||
margin: 0 0 0 auto;
|
||||
margin: 0;
|
||||
flex: 0 0 auto;
|
||||
font-size: 0.85em;
|
||||
color: rgba(255, 255, 255, 0.7);
|
||||
text-align: right;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.item-custom-grid {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
flex: 1 1 auto;
|
||||
gap: 8px;
|
||||
max-height: 68vh;
|
||||
min-height: clamp(320px, 52vh, 620px);
|
||||
max-height: none;
|
||||
overflow-y: auto;
|
||||
padding-right: 4px;
|
||||
}
|
||||
|
||||
.item-custom-card {
|
||||
display: grid;
|
||||
grid-template-columns: 56px minmax(0, 380px) minmax(320px, 1.65fr);
|
||||
grid-template-columns: 56px minmax(0, 430px) minmax(320px, 1.65fr);
|
||||
gap: 14px;
|
||||
align-items: center;
|
||||
padding: 7px 14px 8px;
|
||||
@ -839,7 +927,8 @@ if ($has_member_access) {
|
||||
font-size: 0.88em;
|
||||
}
|
||||
|
||||
.item-custom-card.is-hidden-by-search {
|
||||
.item-custom-card.is-hidden-by-search,
|
||||
.item-custom-card.is-hidden-by-type {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@ -1060,13 +1149,13 @@ if ($has_member_access) {
|
||||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||
}
|
||||
|
||||
.item-custom-filter-bar {
|
||||
.item-custom-filter-top {
|
||||
align-items: stretch;
|
||||
}
|
||||
|
||||
.item-custom-filter-status {
|
||||
margin-left: 0;
|
||||
text-align: left;
|
||||
white-space: normal;
|
||||
}
|
||||
|
||||
.item-custom-card {
|
||||
@ -1081,6 +1170,14 @@ if ($has_member_access) {
|
||||
}
|
||||
|
||||
@media (max-width: 720px) {
|
||||
.item-custom-dialog {
|
||||
max-height: 92vh;
|
||||
}
|
||||
|
||||
.item-custom-grid {
|
||||
min-height: min(42vh, 340px);
|
||||
}
|
||||
|
||||
.ship-presets-grid {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
@ -1089,11 +1186,17 @@ if ($has_member_access) {
|
||||
min-height: 0;
|
||||
}
|
||||
|
||||
.item-custom-search-wrap {
|
||||
.item-custom-filter-top,
|
||||
.item-custom-search-wrap,
|
||||
.item-custom-type-filters {
|
||||
flex-direction: column;
|
||||
align-items: stretch;
|
||||
}
|
||||
|
||||
.item-custom-filter-status {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.item-custom-card {
|
||||
grid-template-columns: 52px minmax(0, 1fr);
|
||||
padding: 8px;
|
||||
@ -1135,13 +1238,13 @@ if ($has_member_access) {
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="assets-div-menu">
|
||||
<a href="#" class="md-trigger" data-modal="modal-ScanReference">Signatures de minage</a>
|
||||
<?php if ($has_member_access): ?>
|
||||
<?php if ($has_member_access): ?>
|
||||
<div class="assets-div-menu">
|
||||
<a href="#" class="md-trigger" data-modal="modal-ScanReference">Signatures de minage</a>
|
||||
<a href="#" class="md-trigger" data-modal="modal-ShipPresets">Presets de vaisseaux</a>
|
||||
<a href="#" class="md-trigger" data-modal="modal-ItemCustom">Item Custom</a>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
<a href="#" class="md-trigger" data-modal="modal-ItemCustom">Objet(s) personnalisé(s)</a>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
<div class="connexion-div-menu <?php echo $is_authenticated ? 'is-authenticated' : 'md-trigger'; ?>" data-login-label="Connexion" <?php echo $is_authenticated ? '' : 'data-modal="modal-Login"'; ?> id="accountPanel">
|
||||
<span id="accountLabel"><?php echo htmlspecialchars($is_authenticated ? $session_cl_auth_user : 'Connexion', ENT_QUOTES, 'UTF-8'); ?></span>
|
||||
@ -1263,7 +1366,7 @@ if ($has_member_access) {
|
||||
<div class="md-content item-custom-dialog">
|
||||
<h3>
|
||||
<img class="float-left" src="img/icon_bops.png" width="48" height="48" alt="" />
|
||||
ITEM CUSTOM
|
||||
OBJET(S) PERSONNALISÉ(S)
|
||||
<a class="frame-icon-close md-close float-right" href="#"><img src="img/icon_close.png" width="48" height="48" alt="" /></a>
|
||||
</h3>
|
||||
<div>
|
||||
@ -1272,18 +1375,32 @@ if ($has_member_access) {
|
||||
<?php elseif ($item_custom_public_rows === []): ?>
|
||||
<p class="item-custom-empty">Aucun objet Item Custom n'est disponible pour le moment.</p>
|
||||
<?php else: ?>
|
||||
<p class="item-custom-intro">Consulte ici les objets personnalisés partagés : nom de l'objet, créateur et statistiques configurées avec leur valeur finale directement lisible.</p>
|
||||
<div class="item-custom-filter-bar">
|
||||
<div class="item-custom-search-wrap">
|
||||
<input type="search" id="itemCustomSearch" class="item-custom-search-input" placeholder="Rechercher un objet, un créateur ou une statistique..." autocomplete="off">
|
||||
<button type="button" id="itemCustomSearchReset" class="item-custom-reset-btn">Effacer</button>
|
||||
<div class="item-custom-filter-top">
|
||||
<div class="item-custom-search-wrap">
|
||||
<input type="search" id="itemCustomSearch" class="item-custom-search-input" placeholder="Rechercher un objet, un créateur ou une statistique..." autocomplete="off">
|
||||
<button type="button" id="itemCustomSearchReset" class="item-custom-reset-btn">Réinitialiser</button>
|
||||
</div>
|
||||
<p class="item-custom-filter-status" id="itemCustomSearchStatus"></p>
|
||||
</div>
|
||||
<p class="item-custom-filter-status" id="itemCustomSearchStatus"></p>
|
||||
<?php if ($item_custom_public_types !== []): ?>
|
||||
<div class="item-custom-type-filters" id="itemCustomTypeFilters">
|
||||
<span class="item-custom-type-label">Filtrer par type</span>
|
||||
<div class="item-custom-type-options">
|
||||
<?php foreach ($item_custom_public_types as $item_custom_public_type): ?>
|
||||
<label class="item-custom-type-chip">
|
||||
<input type="checkbox" class="item-custom-type-checkbox" value="<?php echo htmlspecialchars($item_custom_public_type, ENT_QUOTES, 'UTF-8'); ?>">
|
||||
<span><?php echo htmlspecialchars($item_custom_public_type, ENT_QUOTES, 'UTF-8'); ?></span>
|
||||
</label>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
<div class="item-custom-grid" id="itemCustomGrid">
|
||||
<?php foreach ($item_custom_public_rows as $item_custom_public_row): ?>
|
||||
<?php $item_custom_stat_count = count($item_custom_public_row['stats']); ?>
|
||||
<article class="item-custom-card" data-item-search="<?php echo htmlspecialchars($item_custom_public_row['search'], ENT_QUOTES, 'UTF-8'); ?>">
|
||||
<article class="item-custom-card" data-item-search="<?php echo htmlspecialchars($item_custom_public_row['search'], ENT_QUOTES, 'UTF-8'); ?>" data-item-type="<?php echo htmlspecialchars($item_custom_public_row['type'] !== '' ? $item_custom_public_row['type'] : 'Type inconnu', ENT_QUOTES, 'UTF-8'); ?>">
|
||||
<div class="item-custom-card-media">
|
||||
<img src="https://cstone.space/uifimages/<?php echo htmlspecialchars($item_custom_public_row['uuid'], ENT_QUOTES, 'UTF-8'); ?>.png" class="item-custom-card-thumb" alt="Aperçu de <?php echo htmlspecialchars($item_custom_public_row['name'], ENT_QUOTES, 'UTF-8'); ?>" loading="lazy" onerror="this.closest('.item-custom-card-media').classList.add('is-image-missing'); this.remove();">
|
||||
<div class="item-custom-card-preview" aria-hidden="true">
|
||||
@ -1333,67 +1450,69 @@ if ($has_member_access) {
|
||||
|
||||
<?php endif; ?>
|
||||
|
||||
<div class="md-modal md-effect-1 modal-scan-reference" id="modal-ScanReference">
|
||||
<div class="md-content scan-reference-dialog">
|
||||
<h3>
|
||||
<img class="float-left" src="img/icon_bops.png" width="48" height="48" alt="" />
|
||||
TABLEAU DES SIGNATURES DE SCAN
|
||||
<a class="frame-icon-close md-close float-right" href="#"><img src="img/icon_close.png" width="48" height="48" alt="" /></a>
|
||||
</h3>
|
||||
<div>
|
||||
<?php if ($has_member_access): ?>
|
||||
<div class="md-modal md-effect-1 modal-scan-reference" id="modal-ScanReference">
|
||||
<div class="md-content scan-reference-dialog">
|
||||
<h3>
|
||||
<img class="float-left" src="img/icon_bops.png" width="48" height="48" alt="" />
|
||||
TABLEAU DES SIGNATURES DE SCAN
|
||||
<a class="frame-icon-close md-close float-right" href="#"><img src="img/icon_close.png" width="48" height="48" alt="" /></a>
|
||||
</h3>
|
||||
<div>
|
||||
|
||||
<?php if ($scan_reference_error !== null): ?>
|
||||
<p class="scan-reference-error"><?php echo htmlspecialchars($scan_reference_error, ENT_QUOTES, 'UTF-8'); ?></p>
|
||||
<?php elseif ($scan_reference_rows === []): ?>
|
||||
<p class="scan-reference-empty">Aucune donnée de scan n'est configurée pour le moment.</p>
|
||||
<?php else: ?>
|
||||
<div class="scan-reference-filter-bar">
|
||||
<div class="scan-reference-filter-actions">
|
||||
<button type="button" class="scan-reference-filter-btn" id="scanReferenceIsolateBtn">Isoler</button>
|
||||
<button type="button" class="scan-reference-filter-btn" id="scanReferenceClearBtn">Supprimer le filtrage</button>
|
||||
<?php if ($scan_reference_error !== null): ?>
|
||||
<p class="scan-reference-error"><?php echo htmlspecialchars($scan_reference_error, ENT_QUOTES, 'UTF-8'); ?></p>
|
||||
<?php elseif ($scan_reference_rows === []): ?>
|
||||
<p class="scan-reference-empty">Aucune donnée de scan n'est configurée pour le moment.</p>
|
||||
<?php else: ?>
|
||||
<div class="scan-reference-filter-bar">
|
||||
<div class="scan-reference-filter-actions">
|
||||
<button type="button" class="scan-reference-filter-btn" id="scanReferenceIsolateBtn">Isoler</button>
|
||||
<button type="button" class="scan-reference-filter-btn" id="scanReferenceClearBtn">Supprimer le filtrage</button>
|
||||
</div>
|
||||
<p class="scan-reference-filter-status" id="scanReferenceFilterStatus">Clique sur les lignes à conserver puis sur « Isoler ».</p>
|
||||
</div>
|
||||
<p class="scan-reference-filter-status" id="scanReferenceFilterStatus">Clique sur les lignes à conserver puis sur « Isoler ».</p>
|
||||
</div>
|
||||
<div class="scan-reference-table-wrapper">
|
||||
<table class="scan-reference-table" id="scanReferenceTable">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Ressource</th>
|
||||
<th>Récupérations</th>
|
||||
<?php for ($occurrence = 1; $occurrence <= $scan_reference_max_occurrence; $occurrence++): ?>
|
||||
<th>x <?php echo $occurrence; ?></th>
|
||||
<?php endfor; ?>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<?php foreach ($scan_reference_rows as $scan_reference_row): ?>
|
||||
<tr class="scan-reference-row <?php echo htmlspecialchars($scan_reference_row['rarity_class'], ENT_QUOTES, 'UTF-8'); ?>" data-resource-id="<?php echo htmlspecialchars($scan_reference_row['id'], ENT_QUOTES, 'UTF-8'); ?>" data-resource-name="<?php echo htmlspecialchars($scan_reference_row['name'], ENT_QUOTES, 'UTF-8'); ?>">
|
||||
<td class="scan-reference-name">
|
||||
<span><?php echo htmlspecialchars($scan_reference_row['name'], ENT_QUOTES, 'UTF-8'); ?></span>
|
||||
</td>
|
||||
<td class="scan-reference-recovery">
|
||||
<?php if ($scan_reference_row['recovery_modes'] !== []): ?>
|
||||
<?php foreach ($scan_reference_row['recovery_modes'] as $recovery_mode): ?>
|
||||
<span class="scan-reference-pill"><?php echo htmlspecialchars($recovery_mode, ENT_QUOTES, 'UTF-8'); ?></span>
|
||||
<?php endforeach; ?>
|
||||
<?php else: ?>
|
||||
<span class="scan-reference-muted">—</span>
|
||||
<?php endif; ?>
|
||||
</td>
|
||||
<div class="scan-reference-table-wrapper">
|
||||
<table class="scan-reference-table" id="scanReferenceTable">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Ressource</th>
|
||||
<th>Récupérations</th>
|
||||
<?php for ($occurrence = 1; $occurrence <= $scan_reference_max_occurrence; $occurrence++): ?>
|
||||
<td class="scan-reference-value">
|
||||
<?php echo array_key_exists($occurrence - 1, $scan_reference_row['scan_steps']) ? number_format((int) $scan_reference_row['scan_steps'][$occurrence - 1], 0, ',', ' ') : '<span class="scan-reference-muted">—</span>'; ?>
|
||||
</td>
|
||||
<th>x <?php echo $occurrence; ?></th>
|
||||
<?php endfor; ?>
|
||||
</tr>
|
||||
<?php endforeach; ?>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
</thead>
|
||||
<tbody>
|
||||
<?php foreach ($scan_reference_rows as $scan_reference_row): ?>
|
||||
<tr class="scan-reference-row <?php echo htmlspecialchars($scan_reference_row['rarity_class'], ENT_QUOTES, 'UTF-8'); ?>" data-resource-id="<?php echo htmlspecialchars($scan_reference_row['id'], ENT_QUOTES, 'UTF-8'); ?>" data-resource-name="<?php echo htmlspecialchars($scan_reference_row['name'], ENT_QUOTES, 'UTF-8'); ?>">
|
||||
<td class="scan-reference-name">
|
||||
<span><?php echo htmlspecialchars($scan_reference_row['name'], ENT_QUOTES, 'UTF-8'); ?></span>
|
||||
</td>
|
||||
<td class="scan-reference-recovery">
|
||||
<?php if ($scan_reference_row['recovery_modes'] !== []): ?>
|
||||
<?php foreach ($scan_reference_row['recovery_modes'] as $recovery_mode): ?>
|
||||
<span class="scan-reference-pill"><?php echo htmlspecialchars($recovery_mode, ENT_QUOTES, 'UTF-8'); ?></span>
|
||||
<?php endforeach; ?>
|
||||
<?php else: ?>
|
||||
<span class="scan-reference-muted">—</span>
|
||||
<?php endif; ?>
|
||||
</td>
|
||||
<?php for ($occurrence = 1; $occurrence <= $scan_reference_max_occurrence; $occurrence++): ?>
|
||||
<td class="scan-reference-value">
|
||||
<?php echo array_key_exists($occurrence - 1, $scan_reference_row['scan_steps']) ? number_format((int) $scan_reference_row['scan_steps'][$occurrence - 1], 0, ',', ' ') : '<span class="scan-reference-muted">—</span>'; ?>
|
||||
</td>
|
||||
<?php endfor; ?>
|
||||
</tr>
|
||||
<?php endforeach; ?>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
<div class="center-page-bops"></div>
|
||||
|
||||
@ -1578,6 +1697,7 @@ if ($has_member_access) {
|
||||
const resetButton = document.getElementById('itemCustomSearchReset');
|
||||
const status = document.getElementById('itemCustomSearchStatus');
|
||||
const grid = document.getElementById('itemCustomGrid');
|
||||
const typeCheckboxes = Array.from(document.querySelectorAll('.item-custom-type-checkbox'));
|
||||
|
||||
if (!searchInput || !resetButton || !status || !grid) {
|
||||
return;
|
||||
@ -1593,29 +1713,59 @@ if ($has_member_access) {
|
||||
.trim();
|
||||
}
|
||||
|
||||
function getSelectedTypes() {
|
||||
return typeCheckboxes
|
||||
.filter((checkbox) => checkbox.checked)
|
||||
.map((checkbox) => ({
|
||||
label: checkbox.value,
|
||||
value: normalizeValue(checkbox.value)
|
||||
}));
|
||||
}
|
||||
|
||||
function applyFilter() {
|
||||
const query = normalizeValue(searchInput.value);
|
||||
const selectedTypes = getSelectedTypes();
|
||||
const selectedTypeSet = new Set(selectedTypes.map((type) => type.value));
|
||||
let visibleCount = 0;
|
||||
|
||||
cards.forEach((card) => {
|
||||
const haystack = normalizeValue(card.dataset.itemSearch || '');
|
||||
const isVisible = query === '' || haystack.includes(query);
|
||||
card.classList.toggle('is-hidden-by-search', !isVisible);
|
||||
const itemType = normalizeValue(card.dataset.itemType || '');
|
||||
const matchesQuery = query === '' || haystack.includes(query);
|
||||
const matchesType = selectedTypeSet.size === 0 || selectedTypeSet.has(itemType);
|
||||
const isVisible = matchesQuery && matchesType;
|
||||
card.classList.toggle('is-hidden-by-search', !matchesQuery);
|
||||
card.classList.toggle('is-hidden-by-type', matchesQuery && !matchesType);
|
||||
if (isVisible) {
|
||||
visibleCount += 1;
|
||||
}
|
||||
});
|
||||
|
||||
if (query === '') {
|
||||
if (query === '' && selectedTypeSet.size === 0) {
|
||||
status.textContent = visibleCount + ' objet(s) affiché(s) sur ' + cards.length + '.';
|
||||
} else {
|
||||
status.textContent = visibleCount + ' objet(s) correspondent à « ' + searchInput.value.trim() + ' ».';
|
||||
return;
|
||||
}
|
||||
|
||||
const activeFilters = [];
|
||||
if (query !== '') {
|
||||
activeFilters.push('la recherche « ' + searchInput.value.trim() + ' »');
|
||||
}
|
||||
if (selectedTypes.length > 0) {
|
||||
activeFilters.push((selectedTypes.length > 1 ? 'les types ' : 'le type ') + selectedTypes.map((type) => '« ' + type.label + ' »').join(', '));
|
||||
}
|
||||
|
||||
status.textContent = visibleCount + ' objet(s) correspondent à ' + activeFilters.join(' + ') + '.';
|
||||
}
|
||||
|
||||
searchInput.addEventListener('input', applyFilter);
|
||||
typeCheckboxes.forEach((checkbox) => {
|
||||
checkbox.addEventListener('change', applyFilter);
|
||||
});
|
||||
resetButton.addEventListener('click', function () {
|
||||
searchInput.value = '';
|
||||
typeCheckboxes.forEach((checkbox) => {
|
||||
checkbox.checked = false;
|
||||
});
|
||||
applyFilter();
|
||||
searchInput.focus();
|
||||
});
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user