Skip to content

Commit

Permalink
Merge pull request #2328 from somiaj/achievement-filter
Browse files Browse the repository at this point in the history 
Add filter action to achievements manager.
  • Loading branch information
@drgrice1
drgrice1 authored Mar 2, 2024
2 parents 59b1f9f + 49f9ea8 commit 3f6ac13
Show file tree
Hide file tree
Showing 12 changed files with 370 additions and 375 deletions.
192 changes: 89 additions & 103 deletions htdocs/js/AchievementList/achievementlist.js
View file
Original file line number Diff line number Diff line change
@@ -1,119 +1,102 @@
(() => {
// Action form validation.
// Store event listeners so they can be removed.
const event_listeners = {};

const show_errors = (ids, elements) => {
for (const id of ids) elements.push(document.getElementById(id));
for (const element of elements) {
if (element?.id.endsWith('_err_msg')) {
element?.classList.remove('d-none');
} else {
element?.classList.add('is-invalid');
if (!(element.id in event_listeners)) {
event_listeners[element.id] = hide_errors([], elements);
element?.addEventListener('change', event_listeners[element.id]);
}
}
}
};

const hide_errors = (ids, elements) => {
return () => {
for (const id of ids) elements.push(document.getElementById(id));
for (const element of elements) {
if (element?.id.endsWith('_err_msg')) {
element?.classList.add('d-none');
if (element.id === 'select_achievement_err_msg' && 'achievement_table' in event_listeners) {
document
.getElementById('achievement-table')
?.removeEventListener('change', event_listeners.achievement_table);
delete event_listeners.achievement_table;
}
} else {
element?.classList.remove('is-invalid');
if (element.id in event_listeners) {
element?.removeEventListener('change', event_listeners[element.id]);
delete event_listeners[element.id];
}
}
}
};
};

const is_achievement_selected = () => {
for (const achievement of document.getElementsByName('selected_achievements')) {
if (achievement.checked) return true;
}
document.getElementById('select_achievement_err_msg')?.classList.remove('d-none');
document.getElementById('achievement-table')?.addEventListener(
'change',
() => {
document.getElementById('select_achievement_err_msg')?.classList.add('d-none');
for (const id of ['edit_select', 'assign_select', 'export_select', 'score_select']) {
document.getElementById(id)?.classList.remove('is-invalid');
}
},
{ once: true }
);
const err_msg = document.getElementById('select_achievement_err_msg');
err_msg?.classList.remove('d-none');
if (!('achievement_table' in event_listeners)) {
event_listeners.achievement_table = hide_errors(
['filter_select', 'edit_select', 'assign_select', 'export_select', 'score_select'],
[err_msg]
);
document.getElementById('achievement-table')?.addEventListener('change', event_listeners.achievement_table);
}
return false;
};

document.getElementById('achievement-list')?.addEventListener('submit', (e) => {
const action = document.getElementById('current_action')?.value || '';
if (action === 'edit') {
const edit_select = document.getElementById('edit_select');
if (edit_select.value === 'selected' && !is_achievement_selected()) {
if (action === 'filter') {
const filter_select = document.getElementById('filter_select');
const filter = filter_select?.value || '';
const filter_text = document.getElementById('filter_text');
if (filter === 'selected' && !is_achievement_selected()) {
e.preventDefault();
e.stopPropagation();
edit_select.classList.add('is-invalid');
edit_select.addEventListener(
'change',
() => {
document.getElementById('select_achievement_err_msg')?.classList.add('d-none');
document.getElementById('edit_select')?.classList.remove('is-invalid');
},
{ once: true }
);
show_errors(['select_achievement_err_msg'], [filter_select]);
} else if (filter === 'match_ids' && filter_text?.value === '') {
e.preventDefault();
e.stopPropagation();
show_errors(['filter_text_err_msg'], [filter_select, filter_text]);
}
} else if (action === 'assign') {
const assign_select = document.getElementById('assign_select');
if (assign_select.value === 'selected' && !is_achievement_selected()) {
} else if (['edit', 'assign', 'export', 'score'].includes(action)) {
const action_select = document.getElementById(`${action}_select`);
if (action_select.value === 'selected' && !is_achievement_selected()) {
e.preventDefault();
e.stopPropagation();
assign_select.classList.add('is-invalid');
assign_select.addEventListener(
'change',
() => {
document.getElementById('select_achievement_err_msg')?.classList.add('d-none');
document.getElementById('assign_select')?.classList.remove('is-invalid');
},
{ once: true }
);
show_errors(['select_achievement_err_msg'], [action_select]);
}
} else if (action === 'import') {
const import_file = document.getElementById('import_file_select');
if (!import_file.value.endsWith('.axp')) {
e.preventDefault();
e.stopPropagation();
document.getElementById('import_file_err_msg')?.classList.remove('d-none');
import_file.classList.add('is-invalid');
import_file.addEventListener(
'change',
() => {
document.getElementById('import_file_err_msg')?.classList.add('d-none');
document.getElementById('import_file_select')?.classList.remove('is-invalid');
},
{ once: true }
);
}
} else if (action === 'export') {
const export_select = document.getElementById('export_select');
if (export_select.value === 'selected' && !is_achievement_selected()) {
e.preventDefault();
e.stopPropagation();
export_select.classList.add('is-invalid');
export_select.addEventListener(
'change',
() => {
document.getElementById('select_achievement_err_msg')?.classList.add('d-none');
document.getElementById('export_select')?.classList.remove('is-invalid');
},
{ once: true }
);
}
} else if (action === 'score') {
const score_select = document.getElementById('score_select');
if (export_select.value === 'selected' && !is_achievement_selected()) {
e.preventDefault();
e.stopPropagation();
score_select.classList.add('is-invalid');
score_select.addEventListener(
'change',
() => {
document.getElementById('select_achievement_err_msg')?.classList.add('d-none');
document.getElementById('score_select')?.classList.remove('is-invalid');
},
{ once: true }
);
show_errors(['import_file_err_msg'], [import_file]);
}
} else if (action === 'create') {
const create_text = document.getElementById('create_text');
const create_select = document.getElementById('create_select');
if (create_text.value === '') {
e.preventDefault();
e.stopPropagation();
document.getElementById('create_file_err_msg')?.classList.remove('d-none');
create_text.classList.add('is-invalid');
create_text.addEventListener(
'change',
() => {
document.getElementById('create_file_err_msg')?.classList.add('d-none');
document.getElementById('create_text')?.classList.remove('is-invalid');
},
{ once: true }
);
} else if (document.getElementById('create_select')?.selectedIndex == 1 && !is_achievement_selected()) {
show_errors(['create_file_err_msg'], [create_text]);
} else if (create_select?.value == 'copy' && !is_achievement_selected()) {
e.preventDefault();
e.stopPropagation();
show_errors(['select_achievement_err_msg'], [create_select]);
}
} else if (action === 'delete') {
const delete_confirm = document.getElementById('delete_select');
Expand All @@ -123,30 +106,33 @@
} else if (delete_confirm.value != 'yes') {
e.preventDefault();
e.stopPropagation();
document.getElementById('delete_confirm_err_msg')?.classList.remove('d-none');
delete_confirm.classList.add('is-invalid');
delete_confirm.addEventListener(
'change',
() => {
document.getElementById('delete_select')?.classList.remove('is-invalid');
document.getElementById('delete_confirm_err_msg')?.classList.add('d-none');
},
{ once: true }
);
show_errors(['delete_confirm_err_msg'], [delete_confirm]);
}
}
});

// Remove all error messages when changing tabs.
for (const tab of document.querySelectorAll('a[data-bs-toggle="tab"]')) {
tab.addEventListener('shown.bs.tab', () => {
const actionForm = document.getElementById('achievement-list');
for (const err_msg of actionForm.querySelectorAll('div[id$=_err_msg]')) {
err_msg.classList.add('d-none');
}
for (const invalid of actionForm.querySelectorAll('.is-invalid')) {
invalid.classList.remove('is-invalid');
}
if (Object.keys(event_listeners).length != 0)
hide_errors(
[],
document.getElementById('achievement-list')?.querySelectorAll('div[id$=_err_msg], .is-invalid')
)();
});
}

// Toggle the display of the filter elements as the filter select changes.
const filter_select = document.getElementById('filter_select');
const filter_text_elements = document.getElementById('filter_text_elements');
const filter_category_elements = document.getElementById('filter_category_elements');
const filterElementToggle = () => {
if (filter_select?.value === 'match_ids') filter_text_elements.style.display = 'flex';
else filter_text_elements.style.display = 'none';
if (filter_select?.value === 'match_category') filter_category_elements.style.display = 'flex';
else filter_category_elements.style.display = 'none';
};

if (filter_select) filterElementToggle();
filter_select?.addEventListener('change', filterElementToggle);
})();
Loading

0 comments on commit 3f6ac13

Please sign in to comment.