tail.BBSolid – A valid BBCode Markup Parser

tail.BBSolid

The tail.BBSolid JavaScript BBCode Markup Parser is inspired by Patorjks Extendible BBCode Parser! It is completely written in vanilla JavaScript and compatible with all modern browsers, including the 9+. The script offers also a AMD and nodeJS Module definition.

Almost 60 BBCode Tags are supported by the tail.BBSolid script, 12 of them are excluded in a separated file. Many BBCode Tags supports also custom attributes, to configure the respective output. And some other tags are restricted to specific parents or just allow a handful (or also just 1 or 2) specific children tags. The fetched Errors in the BBCode structure are either displayed directly in the console or stored in a variable.

Download the latest version of tail.BBSolid as .ZIP or as .TAR package!

npm i tail.bbsolid --save

yarn add tail.bbsolid --save

Instructions

The package itself contains the main JavaScript file as well as an additional file with extended BBCodes. Both files are also available in a minified version. The script itself uses valid HTML 4 and HTML 5 tags, and therefore doesn’t need any stylesheet!

 

Load tail.BBSolid

It’s recommended to load the respective JavaScript file (as well as the additional file, if desired) immediately after the opened <body> tag.

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
    </head>
    <body>
        <!-- Required JavaScript -->
        <script type="text/javascript" src="/js/tail.bbsolid.min.js"></script>
        
        <!-- Additional BBCode Markups -->
        <script type="text/javascript" src="/js/tail.bbsolid-extended.min.js"></script>
    </body>
</html>

 

Configure tail.BBSolid

The current verison of this BBCode Parser offers 6 different options to configure the respective HTML Output. It also has some public methods to get the latest data or errors.

document.addEventListener("DOMContentLoaded", {
    /*
     |  The tail.BBSolid "constructor" is just an alias for
     |  `tail.BBSolid.parse(content, options)`
     */
    tail.BBSolid("[b]Your BBCode[/b]", {
        debug:          false,
        prettyPrint:    true,
        allowedHTML:    false,
        wrapParagraphs: true,
        showLineBreaks: true,
        removeUnparsed: false
    });

    // Get the latest "passed" content with
    var LatestBBCodeContent = tail.BBSolid.content;

    // Get the latest "parsed" content with
    var LatestHTMLContent = tail.BBSolid.parsed;

    // Check if the latest passed occured an Error
    if(tail.BBSolid.error){
        console.log( tail.BBSolid.errors );
    }
});

 

Configure: Options

debug
Set this option to true to show each error directly in the JavaScript console.
prettyPrint
This option will try to “pretty” format the Output HTML Code.
allowedHTML
You can (dis)allow written HTML Content within the passed Content to parse. Pass the allowed HTML Tags as array (ex: ["a", "b", "br"]), or set this option to true or false to en/disable all HTML Tags.
wrapParagraphs
This option will wrap all inline elements within an paragraph. Block elements, gets skipped around.
showLineBreaks
You need to set wrapParagraphs to true too, to show Line Breaks (\n) within the passed BBCode content als real line breaks (<br />)
removeUnparsed
This option will remove all known but invalid / faulty BBCode Tags.

Leave a Reply

Top