filterSelection("all", "None"); function filterSelection(c, name, id) { resetDropDownButtons(); var i; var button = document.getElementById(id); if(button){ button.innerText = name; addClass(button, "activebtn"); } var alldistribusis = document.getElementsByClassName("filter"); if (c == "all") { for (i = 0; i < alldistribusis.length; i++) { addClass(alldistribusis[i], "show"); } } else { for (i = 0; i < alldistribusis.length; i++) { removeClass(alldistribusis[i], "show"); if (alldistribusis[i].className.indexOf(c) > -1) { addClass(alldistribusis[i], "show"); } } } } function resetDropDownButtons(){ document.getElementById("Academicyear").innerText = "Academic year"; document.getElementById("Term").innerText = "Term"; document.getElementById("Course").innerText = "Course"; allactivebuttons = document.getElementsByClassName("activebtn"); for(var i = 0;allactivebuttons.length; i++) { removeClass(allactivebuttons[i], "activebtn"); } } function addClass(element, name) { var i, arr1, arr2; arr1 = element.className.split(" "); arr2 = name.split(" "); for (i = 0; i < arr2.length; i++) { if (arr1.indexOf(arr2[i]) == -1) {element.className += " " + arr2[i];} } } function removeClass(element, name) { var i, arr1, arr2; arr1 = element.className.split(" "); arr2 = name.split(" "); for (i = 0; i < arr2.length; i++) { while (arr1.indexOf(arr2[i]) > -1) { arr1.splice(arr1.indexOf(arr2[i]), 1); } } element.className = arr1.join(" "); } let searchInput = document.getElementById('tagsearch'); let timeout = null; // Listen for keystroke events searchInput.addEventListener('keyup', function (e) { // Clear the timeout if it has already been set. clearTimeout(timeout); // Make a new timeout set to go off in 1000ms (1 second) timeout = setTimeout(function () { console.log('Input Value:', searchInput.value); if (searchInput.value.length > 2) { searchTags(searchInput.value); } else { clearSearchTags(); } }, 1000); }); function searchTags(searchInput) { let tag_ele = document.getElementsByClassName('tags'); for (var i = 0; i < tag_ele.length; ++i) { let searchText = searchInput.toLowerCase().trim(); let tagtext = tag_ele[i].innerText.toLowerCase(); if(searchText.includes(tagtext) || tagtext.includes(searchText)) { addClass(tag_ele[i], "searched"); } else { removeClass(tag_ele[i], "searched"); } } } function clearSearchTags() { let tag_ele = document.getElementsByClassName('tags'); for (var i = 0; i < tag_ele.length; ++i) { removeClass(tag_ele[i], "searched"); } }