Currently, the rendered HTML Bunyan logs show all recorded log entries, with no way to filter which logs are displayed. This can make reading the rendered output of very long log files difficult when there are a lot of verbose debug or trace log entries. In order to make it easier to visually inspect rendered log files, it would be nice to have a way of filtering which logs are displayed. Display-time filtering also has a nice advantage over filtering when the logs are recorded, since we can still collect and store the more verbose logs, but only display them to the reader when they're actually wanted.
This branch improves the rendered HTML Bunyan logs by adding a dropdown menu that allows the user to select the most verbose log level to display. I've changed the code that renders Bunyan as HTML to use CSS classes for each level, rather than a style tag to set the background color. Now, we can add a little JavaScript to toggle whether or not each table row is displayed based on its log level.
I used a JSFiddle to develop the JavaScript changes, and tested it with with some demo data I copied from the rendered output of a Propolis phd-run build (and manually changed some of the log levels to make it interesting). You can try out the new filtering UI here: https://jsfiddle.net/mycoliza/0s3nbrje/13/
Currently, the rendered HTML Bunyan logs show all recorded log entries, with no way to filter which logs are displayed. This can make reading the rendered output of very long log files difficult when there are a lot of verbose debug or trace log entries. In order to make it easier to visually inspect rendered log files, it would be nice to have a way of filtering which logs are displayed. Display-time filtering also has a nice advantage over filtering when the logs are recorded, since we can still collect and store the more verbose logs, but only display them to the reader when they're actually wanted.
This branch improves the rendered HTML Bunyan logs by adding a dropdown menu that allows the user to select the most verbose log level to display. I've changed the code that renders Bunyan as HTML to use CSS classes for each level, rather than a
styletag to set the background color. Now, we can add a little JavaScript to toggle whether or not each table row is displayed based on its log level.I used a JSFiddle to develop the JavaScript changes, and tested it with with some demo data I copied from the rendered output of a Propolis
phd-runbuild (and manually changed some of the log levels to make it interesting). You can try out the new filtering UI here: https://jsfiddle.net/mycoliza/0s3nbrje/13/