Fossil SCM
branch/quickfilter
branch quickfilter
description
This feature implements a quick filtering option in lists in tables. The branch adds that feature to two pages: repolist and ticket reports. In both cases the feature has to be enabled to be used.
The filter works by showing the user a text input, in which they can type text. The list is then filtered via javascript and all entries not matching the search term are made invisible, while the found text is highlighted. This reduces the text down to the items you are looking for.
details and limitations
This feature is implemented using Javascript, therefore it only works with JS enabled. It does not make any AJAX-callbacks, therefore it can only filter on information that is shown on the page. It cannot filter on items not shown in the first place and not on information that isn't displayed on the page.
As the implementation is made to work on tables, the list has to be presented this way.
activation
To enable this feature for the repository list, you need to set the environment variable FOSSIL_REPOLIST_QUICKFILTER to on.
If you activate fossil via CGI-Script, then add the following line:
setenv: FOSSIL_REPOLIST_QUICKFILTER on
In the ticket report a new checkbox is available on editing or creating reports. If checked the quickfilter will be shown.
implementation
The implementation consists of adding the input-field to the page, marking the table with the items to filter and including the script quickfilter.js.
input-field
The input field can be added with the following HTML:
<input type="search" id="quickfilter" style="display: none" placeholder="filter list...">
The id quickfilter is important, as the script searches for this and reacts to inputs made in such a field. The input-type can be text, search is used as some browsers add functionality to clear the input. Either works with the script. The style-attribute set to display: none is there to prevent users with disabled Javascript to see an input without functionality. If Javascript is enabled, the script will change the display of the input field and make it visible.
marking the table
The table with the items to be filtered has to be marked with the class filterable. Like so:
<table class="filterable">
This can be combined with other classes, for instance to enable sorting as well:
<table class="sortable filterable">
including the script
You can include the script by calling the function style_quickfilter() to add the Javascript to the page.