Add check/uncheck button to search filters
This commit is contained in:
parent
6b46eaa148
commit
b69af6c4f6
|
@ -104,6 +104,7 @@ export function renderPartsOfSpeech(onlyOptions = false) {
|
||||||
optionsHTML += `<option value="${partOfSpeech}">${partOfSpeech}</option>`;
|
optionsHTML += `<option value="${partOfSpeech}">${partOfSpeech}</option>`;
|
||||||
searchHTML += `<label>${partOfSpeech} <input type="checkbox" checked id="searchPartOfSpeech_${slugify(partOfSpeech)}"></label>`;
|
searchHTML += `<label>${partOfSpeech} <input type="checkbox" checked id="searchPartOfSpeech_${slugify(partOfSpeech)}"></label>`;
|
||||||
});
|
});
|
||||||
|
searchHTML += `<a class="small button" id="checkAllFilters">Check All</a> <a class="small button" id="uncheckAllFilters">Uncheck All</a>`;
|
||||||
|
|
||||||
Array.from(document.getElementsByClassName('part-of-speech-select')).forEach(select => {
|
Array.from(document.getElementsByClassName('part-of-speech-select')).forEach(select => {
|
||||||
const selectedValue = select.value;
|
const selectedValue = select.value;
|
||||||
|
|
|
@ -127,3 +127,19 @@ export function highlightSearchTerm(word) {
|
||||||
}
|
}
|
||||||
return word;
|
return word;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export function checkAllPartsOfSpeechFilters() {
|
||||||
|
const searchFilters = document.querySelectorAll('#searchPartsOfSpeech input[type="checkbox"]');
|
||||||
|
Array.from(searchFilters).forEach(filter => {
|
||||||
|
filter.checked = true;
|
||||||
|
});
|
||||||
|
renderWords();
|
||||||
|
}
|
||||||
|
|
||||||
|
export function uncheckAllPartsOfSpeechFilters() {
|
||||||
|
const searchFilters = document.querySelectorAll('#searchPartsOfSpeech input[type="checkbox"]');
|
||||||
|
Array.from(searchFilters).forEach(filter => {
|
||||||
|
filter.checked = false;
|
||||||
|
});
|
||||||
|
renderWords();
|
||||||
|
}
|
|
@ -7,7 +7,7 @@ import { insertAtCursor, getInputSelection, setSelectionRange } from './StackOve
|
||||||
import { usePhondueDigraphs } from './KeyboardFire/phondue/ipaField';
|
import { usePhondueDigraphs } from './KeyboardFire/phondue/ipaField';
|
||||||
import { openSettingsModal, saveSettingsModal, saveAndCloseSettingsModal } from './settings';
|
import { openSettingsModal, saveSettingsModal, saveAndCloseSettingsModal } from './settings';
|
||||||
import { enableHotKeys } from './hotkeys';
|
import { enableHotKeys } from './hotkeys';
|
||||||
import { showSearchModal, clearSearchText } from './search';
|
import { showSearchModal, clearSearchText, checkAllPartsOfSpeechFilters, uncheckAllPartsOfSpeechFilters } from './search';
|
||||||
|
|
||||||
export default function setupListeners() {
|
export default function setupListeners() {
|
||||||
setupDetailsTabs();
|
setupDetailsTabs();
|
||||||
|
@ -141,11 +141,16 @@ function setupSearchBar() {
|
||||||
}
|
}
|
||||||
|
|
||||||
export function setupSearchFilters() {
|
export function setupSearchFilters() {
|
||||||
const searchFilters = document.querySelectorAll('#searchOptions input[type="checkbox"]');
|
const searchFilters = document.querySelectorAll('#searchOptions input[type="checkbox"]'),
|
||||||
|
searchBox = document.getElementById('searchBox');
|
||||||
Array.from(searchFilters).concat([searchBox]).forEach(filter => {
|
Array.from(searchFilters).concat([searchBox]).forEach(filter => {
|
||||||
filter.removeEventListener('change', renderWords);
|
filter.removeEventListener('change', renderWords);
|
||||||
filter.addEventListener('change', renderWords);
|
filter.addEventListener('change', renderWords);
|
||||||
});
|
});
|
||||||
|
document.getElementById('checkAllFilters').removeEventListener('click', checkAllPartsOfSpeechFilters);
|
||||||
|
document.getElementById('checkAllFilters').addEventListener('click', checkAllPartsOfSpeechFilters);
|
||||||
|
document.getElementById('uncheckAllFilters').removeEventListener('click', uncheckAllPartsOfSpeechFilters);
|
||||||
|
document.getElementById('uncheckAllFilters').addEventListener('click', uncheckAllPartsOfSpeechFilters);
|
||||||
}
|
}
|
||||||
|
|
||||||
function setupWordForm() {
|
function setupWordForm() {
|
||||||
|
|
Loading…
Reference in New Issue