PfBlockerNG Bootstrap Conversion

  • Moderator

    The conversion of the pfBlockerNG GUI to bootstrap is nearly complete.

    There are a bunch of improvements that could be made to pkg.php and pkg_edit.php, would it be best to submit individual Redmine tickets, or lump them together into one ticket? or just provide a summary of my findings in this thread?

  • Developer Netgate

    One ticket on Redmine would be good.

  • Administrator

    If you want to discuss stuff you can also do that here. You can also link directly to files in your github repo and add syntax at the end to highlight lines you would like to talk about. For instance adding #L17-L24 highlights line 17 through 24. And the code formatting for snippets of code is nicer here than in email as well.

  • Moderator

    Thanks Steve/Jared,

    Steve B. has fixed a few of the issues already.

    • issue where subfolders of wwwroot would not load the new form classes,
    • issue where subfolders of wwwroot would not load the css files, causing icons to not display.


    As a note for other Devs, the checkbox Form_Section class would not allow any embedded html in the < description > tag, so Steve added a new xml tag < sethelp >

    pkg_edit.php - Outstanding items:

    1. < type >aliases< /type >, Type Aliases show ( value=" ) in a blank input field. I also noticed in the Dark theme, that the dropdown entries are in yellow, and the text is almost invisible.

    2. I have noticed that when adding a single Button, that it also displays the 'button text' beside the button. The code could be swapped out for the following example:

    $button = new Form_Button(
    $section->addInput(new Form_StaticText(
    1. A hide/show option was added. Would be nice to remove the Slide bar at the bottom if possible.
    $section = new Form_Section("Module settings", "modsettings", COLLAPSIBLE|SEC_CLOSED);
    1. The < type >listtopic< /type >, prints in an excessively large font size.

    2. Rowhelper descriptions are not printing to the screen?

    3. textarea is missing code to define the rows, cols and wrap values.

    (suggest setting some default values)

    $rows = $pkga['rows'] ?: '10';
    $cols = $pkga['cols'] ?: '50';
    $wrap = $pkga['wrap'] ?: 'wrap="off style="white-space:

    Adding the following:  (Note- cols is not being defined with this setting below!! )

    ->setAttribute('rows', $rows)
    ->setAttribute('cols', $cols)
    ->setAttribute('wrap', $wrap);
    1. There should be some setting to change the textarea backgrounds when using the default theme, and the Dark theme.

    8 ) The < type >select< /type > should allow for defining the width of the field, or auto-size to the largest entry.

    1. Rowhelpers with multiple "Select" fields, are currently all sized equally in width. Should be definable, or auto-size.

    2. Rowhelper fields have an "Add" and "Delete" Button which should be changed to fa icons.

    3. < combinefields > is not working as expected when grouping over two or more lines. Would also be nice to be able to set the colspan value.


    1. The Rowhelper table is missing its Title bar, and does not allow dragging the Lines.  < movable >on< /movable >

    2. The "Edit this item", "Delete" and "Add" buttons should be swapped for fa Icons.

    Other Items:

    1. Selecting any of the  H[1-6]  tags makes no change to the size of the header text.
    #### Alert Entries"); ?>
    2) With the table settings above, can the < **th** > tags be centered with the text in the column below?

  • Moderator

    I have submitted a PR for pfBlockerNG Bootstrap converted package.

    There are still the issues outstanding in pkg.php and pkg_edit.php… They are mostly cosmetic issues and should not necessarily affect functionality, but the XML pages are slightly unpleasant on the eyes atm! ;)

    Once merged, if anyone has any feedback, please let me know and I will get it addressed!


  • Banned

    So what's the grand idea with sethelp? So people are now expected to go through all the package XML, check whether there's some HTML code with checkbox, and change the tags to sethelp? Wouldn't it make more sense to fix the description tag instead?

  • Developer Netgate

    Not really. The annoyance is only that while inputs, selects etc optionally take two strings (label and help) as in :

    new Form_Input(
        'First Name',
    ))->setHelp("The name you mother uses");

    Checkboxes can accept three strings:

    new Form_Checkbox(
        'Log firewall default blocks',
        'Log packets matched from the default block rules in the ruleset.',
    ))->setHelp("Log packets that are blocked by the implicit default block rule. - Per-rule logging options are still respected.");

    Only two display strings are present in the current XML. For a checkbox it seemed better to map them to the label and to the display string that appears to the right of the checkbox. You don't lose anything and whatever is in the current XML will display on the page. The new sethelp tag allows you to add specific help text if you wish.

    There are other ways of skinning the cat of course, but this method is in line with some other, more extensive changes I have in mind.

  • Moderator

    Do you guys have any feedback about the items that were posted above?

  • Developer Netgate

    I'm working on some of them as time permits.Stay tuned.

  • Moderator


    I'm working on some of them as time permits.Stay tuned.

    Thanks Steve, I thought that would have been a 5 minute job for you ;)  If you want to test your changes, you can use the following file  pfblockerng_v4lists.xml  from my recent PR. Let me know if you need anything else…  Thanks!

  • Moderator

    I have posted Pull Request #52 for pfBlockerNG v2.0.7.

Log in to reply