diff --git a/stable.user.js b/stable.user.js index e10b2ca..caffb09 100755 --- a/stable.user.js +++ b/stable.user.js @@ -58,8 +58,8 @@ var data // all data, which is in the resource txt var addEventListener // add event listener function - const serverAdress = 'https://qmining.frylabs.net/' - // const serverAdress = 'http://localhost:8080/' + // const serverAdress = 'https://qmining.frylabs.net/' + const serverAdress = 'http://localhost:8080/' // forcing pages for testing. unless you test, do not set these to true! // only one of these should be true for testing @@ -2024,7 +2024,22 @@ let collapsibles = [] - Object.entries(grouped).forEach(([subjName, subjGroup]) => { + // -------------------------------------------------------------------------------- + let searchBar = CreateNodeWithText(subjTable, '', 'input') + searchBar.style.backgroundColor = '#222d32' + searchBar.style.color = '#ffffff' + searchBar.style.width = '100%' + searchBar.addEventListener('keyup', function (e) { + collapsibles.forEach((x) => { + if (x.innerText.toLowerCase().includes(this.value.toLowerCase())) { + x.style.display = '' + } else { + x.style.display = 'none' + } + }) + }) // adding click + + Object.entries(grouped).forEach(([subjName, subjGroup], i) => { let b = CreateNodeWithText(subjTable, subjName, 'button') b.style.backgroundColor = '#222d32' b.style.color = '#ffffff' @@ -2034,6 +2049,7 @@ b.style.border = 'none' b.style.textAlign = 'left' b.style.outline = 'none' + b.setAttribute('id', 'subjectGroup' + i) collapsibles.push(b) let content = document.createElement('div') @@ -2048,7 +2064,7 @@ }) content.style.display = ifGroupActive ? 'block' : 'none' - subjTable.appendChild(content) + b.appendChild(content) subjGroup.forEach((subj) => { let tbl = document.createElement('table') @@ -2075,12 +2091,9 @@ data.ChangeActive(subj.Name, checked) }) // adding click }) - }) - collapsibles.forEach((x) => { - x.addEventListener('click', function () { + b.addEventListener('click', function () { this.classList.toggle('active') - var content = this.nextElementSibling if (content.style.display === 'block') { content.style.display = 'none' } else {