nav_sidebar.js 3.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102
  1. 'use strict';
  2. {
  3. const toggleNavSidebar = document.getElementById('toggle-nav-sidebar');
  4. if (toggleNavSidebar !== null) {
  5. const navLinks = document.querySelectorAll('#nav-sidebar a');
  6. function disableNavLinkTabbing() {
  7. for (const navLink of navLinks) {
  8. navLink.tabIndex = -1;
  9. }
  10. }
  11. function enableNavLinkTabbing() {
  12. for (const navLink of navLinks) {
  13. navLink.tabIndex = 0;
  14. }
  15. }
  16. function disableNavFilterTabbing() {
  17. document.getElementById('nav-filter').tabIndex = -1;
  18. }
  19. function enableNavFilterTabbing() {
  20. document.getElementById('nav-filter').tabIndex = 0;
  21. }
  22. const main = document.getElementById('main');
  23. let navSidebarIsOpen = localStorage.getItem('django.admin.navSidebarIsOpen');
  24. if (navSidebarIsOpen === null) {
  25. navSidebarIsOpen = 'true';
  26. }
  27. if (navSidebarIsOpen === 'false') {
  28. disableNavLinkTabbing();
  29. disableNavFilterTabbing();
  30. }
  31. main.classList.toggle('shifted', navSidebarIsOpen === 'true');
  32. toggleNavSidebar.addEventListener('click', function() {
  33. if (navSidebarIsOpen === 'true') {
  34. navSidebarIsOpen = 'false';
  35. disableNavLinkTabbing();
  36. disableNavFilterTabbing();
  37. } else {
  38. navSidebarIsOpen = 'true';
  39. enableNavLinkTabbing();
  40. enableNavFilterTabbing();
  41. }
  42. localStorage.setItem('django.admin.navSidebarIsOpen', navSidebarIsOpen);
  43. main.classList.toggle('shifted');
  44. });
  45. }
  46. function initSidebarQuickFilter() {
  47. const options = [];
  48. const navSidebar = document.getElementById('nav-sidebar');
  49. if (!navSidebar) {
  50. return;
  51. }
  52. navSidebar.querySelectorAll('th[scope=row] a').forEach((container) => {
  53. options.push({title: container.innerHTML, node: container});
  54. });
  55. function checkValue(event) {
  56. let filterValue = event.target.value;
  57. if (filterValue) {
  58. filterValue = filterValue.toLowerCase();
  59. }
  60. if (event.key === 'Escape') {
  61. filterValue = '';
  62. event.target.value = ''; // clear input
  63. }
  64. let matches = false;
  65. for (const o of options) {
  66. let displayValue = '';
  67. if (filterValue) {
  68. if (o.title.toLowerCase().indexOf(filterValue) === -1) {
  69. displayValue = 'none';
  70. } else {
  71. matches = true;
  72. }
  73. }
  74. // show/hide parent <TR>
  75. o.node.parentNode.parentNode.style.display = displayValue;
  76. }
  77. if (!filterValue || matches) {
  78. event.target.classList.remove('no-results');
  79. } else {
  80. event.target.classList.add('no-results');
  81. }
  82. sessionStorage.setItem('django.admin.navSidebarFilterValue', filterValue);
  83. }
  84. const nav = document.getElementById('nav-filter');
  85. nav.addEventListener('change', checkValue, false);
  86. nav.addEventListener('input', checkValue, false);
  87. nav.addEventListener('keyup', checkValue, false);
  88. const storedValue = sessionStorage.getItem('django.admin.navSidebarFilterValue');
  89. if (storedValue) {
  90. nav.value = storedValue;
  91. checkValue({target: nav, key: ''});
  92. }
  93. }
  94. window.initSidebarQuickFilter = initSidebarQuickFilter;
  95. initSidebarQuickFilter();
  96. }