nav_sidebar.js
102 lines
| 3.7 KiB
| application/javascript
|
JavascriptLexer
Renato-TUF
|
r367 | 'use strict'; | ||
| { | ||||
| const toggleNavSidebar = document.getElementById('toggle-nav-sidebar'); | ||||
| if (toggleNavSidebar !== null) { | ||||
| const navLinks = document.querySelectorAll('#nav-sidebar a'); | ||||
| function disableNavLinkTabbing() { | ||||
| for (const navLink of navLinks) { | ||||
| navLink.tabIndex = -1; | ||||
| } | ||||
| } | ||||
| function enableNavLinkTabbing() { | ||||
| for (const navLink of navLinks) { | ||||
| navLink.tabIndex = 0; | ||||
| } | ||||
| } | ||||
| function disableNavFilterTabbing() { | ||||
| document.getElementById('nav-filter').tabIndex = -1; | ||||
| } | ||||
| function enableNavFilterTabbing() { | ||||
| document.getElementById('nav-filter').tabIndex = 0; | ||||
| } | ||||
| const main = document.getElementById('main'); | ||||
| let navSidebarIsOpen = localStorage.getItem('django.admin.navSidebarIsOpen'); | ||||
| if (navSidebarIsOpen === null) { | ||||
| navSidebarIsOpen = 'true'; | ||||
| } | ||||
| if (navSidebarIsOpen === 'false') { | ||||
| disableNavLinkTabbing(); | ||||
| disableNavFilterTabbing(); | ||||
| } | ||||
| main.classList.toggle('shifted', navSidebarIsOpen === 'true'); | ||||
| toggleNavSidebar.addEventListener('click', function() { | ||||
| if (navSidebarIsOpen === 'true') { | ||||
| navSidebarIsOpen = 'false'; | ||||
| disableNavLinkTabbing(); | ||||
| disableNavFilterTabbing(); | ||||
| } else { | ||||
| navSidebarIsOpen = 'true'; | ||||
| enableNavLinkTabbing(); | ||||
| enableNavFilterTabbing(); | ||||
| } | ||||
| localStorage.setItem('django.admin.navSidebarIsOpen', navSidebarIsOpen); | ||||
| main.classList.toggle('shifted'); | ||||
| }); | ||||
| } | ||||
| function initSidebarQuickFilter() { | ||||
| const options = []; | ||||
| const navSidebar = document.getElementById('nav-sidebar'); | ||||
| if (!navSidebar) { | ||||
| return; | ||||
| } | ||||
| navSidebar.querySelectorAll('th[scope=row] a').forEach((container) => { | ||||
| options.push({title: container.innerHTML, node: container}); | ||||
| }); | ||||
| function checkValue(event) { | ||||
| let filterValue = event.target.value; | ||||
| if (filterValue) { | ||||
| filterValue = filterValue.toLowerCase(); | ||||
| } | ||||
| if (event.key === 'Escape') { | ||||
| filterValue = ''; | ||||
| event.target.value = ''; // clear input | ||||
| } | ||||
| let matches = false; | ||||
| for (const o of options) { | ||||
| let displayValue = ''; | ||||
| if (filterValue) { | ||||
| if (o.title.toLowerCase().indexOf(filterValue) === -1) { | ||||
| displayValue = 'none'; | ||||
| } else { | ||||
| matches = true; | ||||
| } | ||||
| } | ||||
| // show/hide parent <TR> | ||||
| o.node.parentNode.parentNode.style.display = displayValue; | ||||
| } | ||||
| if (!filterValue || matches) { | ||||
| event.target.classList.remove('no-results'); | ||||
| } else { | ||||
| event.target.classList.add('no-results'); | ||||
| } | ||||
| sessionStorage.setItem('django.admin.navSidebarFilterValue', filterValue); | ||||
| } | ||||
| const nav = document.getElementById('nav-filter'); | ||||
| nav.addEventListener('change', checkValue, false); | ||||
| nav.addEventListener('input', checkValue, false); | ||||
| nav.addEventListener('keyup', checkValue, false); | ||||
| const storedValue = sessionStorage.getItem('django.admin.navSidebarFilterValue'); | ||||
| if (storedValue) { | ||||
| nav.value = storedValue; | ||||
| checkValue({target: nav, key: ''}); | ||||
| } | ||||
| } | ||||
| window.initSidebarQuickFilter = initSidebarQuickFilter; | ||||
| initSidebarQuickFilter(); | ||||
| } | ||||