jQuery( document ).ready( function( $ ) {

    //  Must wait for everything to be loaded before affixing the
    //  navbar because the logic looks at it's y-position and that
    //  can change if not everything is loaded in-place.
    $( window ).load( function() {

        /**
         * The navbar can be fixed to the top when it scrolls off the
         * top of the screen.  This is an administrative option.
         */
        var nav_element = $( '#navigation > nav' );
        var div_element = nav_element.children( 'div' );
        if ( ( nav_element.length > 0 ) && ( div_element.length > 0 ) )
        {
            //  Tell Bootstrap to stick the navbar to the top of
            //  the browser when the navbar scrolls offscreen.
            nav_element.affix({
                offset: { top: nav_element.offset().top + 1 }   //  Note: Without the +1, every other click would toggle between 'affix' and 'affix-top'.
            });

            //  Avoid scroll-skipping.
            $( '#navigation' ).height( nav_element.height() );

            //  The container toggle only matters in the boxed-narrow mode.
            var is_boxed_format_span = ( $( 'body.boxed-narrow' ).length > 0 );
            if ( is_boxed_format_span ) {

                //  The page can be refreshed when not scrolled to the top,
                //  so the container change must take place initially.
                if ( window.pageYOffset > nav_element.offset().top ) {
                    div_element.removeClass( 'container-fluid' );
                    div_element.addClass( 'container' );
                }

                //  These are the bindings that Bootstrap provides to indicate
                //  when the navbar is affixed and detached from the top.
                nav_element.bind( 'affixed.bs.affix', function() {
                    div_element.removeClass( 'container-fluid' );
                    div_element.addClass( 'container' );
                });
                nav_element.bind( 'affixed-top.bs.affix', function() {
                    div_element.removeClass( 'container' );
                    div_element.addClass( 'container-fluid' );
                });
            }
        }
    });

});