Alamantus
/
Lexiconga
mirror of https://github.com/Alamantus/Lexiconga.git
1
0
Fork 0
Code Issues Releases Activity

Add searching by case sensitive and exact

This commit is contained in:
Robbie Antenesse 2019-05-07 10:41:26 -06:00
parent c5c17d022e
commit 4cad266d52
3 changed files with 48 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
index.html
View File

@ -26,6 +26,19 @@
</a>
</section>
<footer id="searchOptions" style="display:none;">
<div class="split">
<div class="quarter category">
<h3>Search For</h3>
</div>
<div class="three-quarter options">
<label>Case-Sensitive
<input type="checkbox" id="searchCaseSensitive">
</label>
<label>Exact Words
<input type="checkbox" id="searchExactWords">
</label>
</div>
</div>
<div class="split">
<div class="quarter category">
<h3>Include in Search</h3>

29
src/js/search.js
View File

@ -6,6 +6,8 @@ export function getSearchTerm() {
export function getSearchFilters() {
const filters = {
caseSensitive: document.getElementById('searchCaseSensitive').checked,
exact: document.getElementById('searchExactWords').checked,
name: document.getElementById('searchIncludeName').checked,
definition: document.getElementById('searchIncludeDefinition').checked,
details: document.getElementById('searchIncludeDetails').checked,
@ -26,7 +28,7 @@ export function getSearchFilters() {
}
export function getMatchingSearchWords() {
const searchTerm = getSearchTerm();
let searchTerm = getSearchTerm();
const filters = getSearchFilters();
if (searchTerm !== '' || !filters.allPartsOfSpeechChecked) {
const matchingWords = window.currentDictionary.words.slice().filter(word => {
@ -37,9 +39,20 @@ export function getMatchingSearchWords() {
}
return true;
}).filter(word => {
const isInName = filters.name && new RegExp(searchTerm, 'g').test(word.name);
const isInDefinition = filters.definition && new RegExp(searchTerm, 'g').test(word.simpleDefinition);
const isInDetails = filters.details && new RegExp(searchTerm, 'g').test(word.longDefinition);
searchTerm = filters.caseSensitive ? searchTerm : searchTerm.toLowerCase();
const name = filters.caseSensitive ? word.name : word.name.toLowerCase();
const simpleDefinition = filters.caseSensitive ? word.simpleDefinition : word.simpleDefinition.toLowerCase();
const longDefinition = filters.caseSensitive ? word.longDefinition : word.longDefinition.toLowerCase();
const isInName = filters.name
&& (filters.exact
? searchTerm == name
: new RegExp(searchTerm, 'g').test(name));
const isInDefinition = filters.definition
&& (filters.exact
? searchTerm == simpleDefinition
: new RegExp(searchTerm, 'g').test(simpleDefinition));
const isInDetails = filters.details && new RegExp(searchTerm, 'g').test(longDefinition);
return searchTerm === '' || isInName || isInDefinition || isInDetails;
});
return matchingWords;
@ -51,10 +64,12 @@ export function getMatchingSearchWords() {
export function highlightSearchTerm(word) {
const searchTerm = getSearchTerm();
if (searchTerm) {
const filters = getSearchFilters();
const regexMethod = 'g' + (filters.caseSensitive ? '' : 'i');
const markedUpWord = cloneObject(word);
markedUpWord.name = markedUpWord.name.replace(new RegExp(searchTerm, 'g'), `<mark>${searchTerm}</mark>`);
markedUpWord.simpleDefinition = markedUpWord.simpleDefinition.replace(new RegExp(searchTerm, 'g'), `<mark>${searchTerm}</mark>`);
markedUpWord.longDefinition = markedUpWord.longDefinition.replace(new RegExp(searchTerm, 'g'), `<mark>${searchTerm}</mark>`);
markedUpWord.name = markedUpWord.name.replace(new RegExp(`(${searchTerm})`, regexMethod), `<mark>$1</mark>`);
markedUpWord.simpleDefinition = markedUpWord.simpleDefinition.replace(new RegExp(`(${searchTerm})`, regexMethod), `<mark>$1</mark>`);
markedUpWord.longDefinition = markedUpWord.longDefinition.replace(new RegExp(`(${searchTerm})`, regexMethod), `<mark>$1</mark>`);
return markedUpWord;
}
return word;

14
src/js/setupListeners.js
View File

@ -78,7 +78,9 @@ function setupEditFormButtons() {
function setupSearchBar() {
const searchBox = document.getElementById('searchBox'),
clearSearchButton = document.getElementById('clearSearchButton'),
openSearchModal = document.getElementById('openSearchModal');
openSearchModal = document.getElementById('openSearchModal'),
searchExactWords = document.getElementById('searchExactWords'),
searchIncludeDetails = document.getElementById('searchIncludeDetails');
searchBox.addEventListener('change', () => {
renderWords();
});
@ -93,6 +95,16 @@ function setupSearchBar() {
openSearchModal.addEventListener('click', () => {
document.getElementById('searchModal').style.display = 'block';
});
searchExactWords.addEventListener('change', () => {
if (searchExactWords.checked) {
searchIncludeDetails.checked = false;
searchIncludeDetails.disabled = true;
} else {
searchIncludeDetails.disabled = false;
searchIncludeDetails.checked = true;
}
});
}
export function setupSearchFilters() {