ashatora/openlayers
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Use css to show / hide items; track matched items

Browse Source 
... to improve search speed.

Instead of marking all items as hidden, and then marking the matched
ones again, this keeps track of all matched items and only
removes those that no longer match and adds those that previously did
not match.
This commit is contained in:
Maximilian Krög
2020-02-09 19:14:34 +01:00
parent 646ecfd405
commit 2dec296aae
3 changed files with 213 additions and 67 deletions
Download Patch File Download Diff File Expand all files Collapse all files

44
config/jsdoc/api/template/static/styles/jaguar.css
View File

@@ -190,9 +190,51 @@ li {
margin-top: 2px;
}
.navigation li.item .member-list {
display: none;
padding-left: 8px;
}
/* search state */
/* show all classes when search is empty */
.navigation.search-empty li.item {
display: block;
}
/* hide all members by default when search is empty */
.navigation.search-empty li.item .member-list {
display: none;
}
/* but show the members of the current pages module / class */
.navigation.search-empty li.item.item-current .member-list {
display: block;
}
/* expand all members when one character is entered in the search field */
.navigation.search-started li.item,
.navigation.search-started .member-list,
.navigation.search-started .member-list li {
display: block;
}
/* when more than one character is entered hide everything that is not a match */
.navigation.searching li.item,
.navigation.searching .member-list,
.navigation.searching .member-list li {
display: none;
}
.navigation.searching li.item.match,
.navigation.searching .member-list.match,
.navigation.searching .member-list li.match {
display: block;
}
/* allow user to hide / show members */
.navigation .item.toggle-manual-show .member-list,
.navigation .item.toggle-manual-show li {
display: block!important;
}
.navigation .item.toggle-manual-hide .member-list,
.navigation .item.toggle-manual-hide li,
.navigation.searching .item.toggle-manual-show .member-list:not(.match),
.navigation.searching .item.toggle-manual-show li:not(.match) {
display: none!important;
}
.main {
padding: 20px 20px;
margin-left: 250px;