/**
 * Functions in this bpq variable can be reused outside of this file.
 */
var bpq = {

    //  Note: Can add JS object properties here.
};


/**
 * Event for when the page markup is loaded.
 */
jQuery( document ).ready( function( $ ) {

    /**
     * Event for when the page content is completely loaded.
     */
    $( window ).load( function() {

        /**
         * The comment_form() template function from WP does NOT offer a
         * way to set a class to the submit button - as such, the workaround
         * is to add the class after the fact.
         */
        $( '#comment-submit' ).addClass( 'btn btn-default' );

        /**
         * The form provided by SendPress is not styled like Bootstrap -
         * so add the appropriate classes after it has been displayed.
         */
        $( 'div.sendpress input[class^="sp_"]' ).addClass( 'form-control' );
        $( 'div.sendpress input.sendpress-submit' ).addClass( 'btn btn-default' );

        /**
         * The login page is very funky - the overrides that the system provides
         * are simply not enough.  As a result, classes must be inserted into
         * specific elements to make things a bit more BluePrint-Q/Bootstrap.
         */
        $( '#login #wp-submit' ).addClass( 'btn btn-primary' );
        $( '#login #user_login, #login #user_pass, #login #user_email, #login #rememberme' ).addClass( 'form-control' );
        $( 'p.message' ).before( '<div class="alert alert-warning">' + $( 'p.message' ).text() + '</div>' );

        /**
         * Force Bootstrap classes upon some WordPress-generated elements.
         * Note: Could apply .dl-horizontal to <dl> elements, but that adversely affects gallery images too.
         */
        $( 'table' ).addClass( 'table' );

        /**
         * Videos cannot be made responsive with 'max-width: 100% / height: auto' because
         * they have explicit dimensions defined based on $content_width, work around that.
         */
        $( 'embed, iframe' ).each( function() {

            var attr_ratio = +$( this ).attr( 'height' ) / +$( this ).attr( 'width' );
            var max_width_string = $( this ).css( 'width' );
            var max_width_number = +( max_width_string.substring( 0, max_width_string.length - 'px'.length) );
            $( this ).attr( 'width', max_width_number );
            $( this ).attr( 'height', ( max_width_number * attr_ratio ) );
        });

    });

});