search.js 1.4 KB

123456789101112131415161718192021222324252627282930313233343536373839
  1. (function() {
  2. const input = document.querySelector('#search')
  3. const targets = [ ...document.querySelectorAll('#sidebarNav li')]
  4. input.addEventListener('keyup', () => {
  5. // loop over each targets and hide the not corresponding ones
  6. targets.forEach(target => {
  7. if (!target.innerText.toLowerCase().includes(input.value.toLowerCase())) {
  8. target.style.display = 'none'
  9. /**
  10. * Detects an empty list
  11. * Remove the list and the list's title if the list is not displayed
  12. */
  13. const list = [...target.parentNode.childNodes].filter( elem => elem.style.display !== 'none')
  14. if (!list.length) {
  15. target.parentNode.style.display = 'none'
  16. target.parentNode.previousSibling.style.display = 'none'
  17. }
  18. /**
  19. * Detects empty category
  20. * Remove the entire category if no item is displayed
  21. */
  22. const category = [...target.parentNode.parentNode.childNodes]
  23. .filter( elem => elem.tagName !== 'H2' && elem.style.display !== 'none')
  24. if (!category.length) {
  25. target.parentNode.parentNode.style.display = 'none'
  26. }
  27. } else {
  28. target.parentNode.style.display = 'block'
  29. target.parentNode.previousSibling.style.display = 'block'
  30. target.parentNode.parentNode.style.display = 'block'
  31. target.style.display = 'block'
  32. }
  33. })
  34. })
  35. })()