Skip to Content

initBootstrapFunctions()

Only initialize Bootstrap libraries on pages that they are needed.

JavaScript February 22, 2017

Usage

This function runs automatically, so it is not called manually. Is this incorrect?

Additional Notes

Currently this function works for tooltips and carousels.

Source File

Located in /assets/js/nebula.js on line 3555.

Note: This function contains 1 to-do comment.

JavaScript
nebula.initBootstrapFunctions = function(){
    if ( typeof bootstrap !== 'undefined' ){
        //Tooltips
        if ( jQuery('[data-toggle="tooltip"]').length ){
            jQuery('[data-toggle="tooltip"]').tooltip();
        }

        //Popovers
        if ( jQuery('[data-toggle="popover"]').length ){
            jQuery('[data-toggle="popover"]').popover({'trigger': 'hover'});
        }

        nebula.checkBootstrapToggleButtons();
        jQuery('[data-toggle=buttons] input').on('change', function(){
            nebula.checkBootstrapToggleButtons();
        });

        //Carousels - Override this to customize options
        if ( jQuery('.carousel').length ){
            jQuery('.carousel').each(function(){
                if ( jQuery(this).hasClass('auto-indicators') ){
                    var carouselID = jQuery(this).attr('id');
                    var slideCount = jQuery(this).find('.carousel-item').length;

                    var i = 0;
                    var markup = '<ol class="carousel-indicators">'; //@TODO "Nebula" 0: Why is there no space between indicators when using this auto-indicators?
                    while ( i < slideCount ){
                        var active = ( i === 0 )? 'class="active"' : '';
                        markup += '<li data-target="#' + carouselID + '" data-slide-to="' + i + '" ' + active + '></li>';
                        i++;
                    }
                    markup += '</ol>';
                    jQuery(this).prepend(markup);
                    jQuery(this).find('.carousel-item').first().addClass('active');

                    if ( !jQuery(this).find('.carousel-inner').length ){
                        jQuery(this).find('.carousel-item').wrapAll('<div class="carousel-inner">');
                    }
                }

                jQuery(this).carousel();
            });
        }

        //Allow Bootstrap modals to use Nebula animation transitions
        //Place the data-animation attribue on the .modal div (which is what e.target is)
        nebula.dom.document.on('show.bs.modal', function(e){
            if ( jQuery(e.target).attr('data-animation-in') || jQuery(e.target).attr('data-animation') || jQuery(e.target).attr('data-animation-out') ){ //If there is any Nebula animation attribute
                var anim = jQuery(e.target).attr('data-animation-in') || jQuery(e.target).attr('data-animation') || '';

                if ( !jQuery('#' + e.target.id + ' .modal-dialog').attr('data-original-classes') ){
                    jQuery('#' + e.target.id + ' .modal-dialog').attr('data-original-classes', jQuery('#' + e.target.id + ' .modal-dialog').attr('class')); //Store the original classes in a data-attribute to use later
                }

                if ( anim ){
                    var originalClasses = jQuery('#' + e.target.id + ' .modal-dialog').attr('data-original-classes');
                    jQuery('#' + e.target.id + ' .modal-dialog').attr('class', originalClasses + ' ' + anim + ' animate'); //Replace classes each time for re-animation.
                }
            }
        });
        nebula.dom.document.on('hide.bs.modal', function(e){
            if ( jQuery(e.target).attr('data-animation-in') || jQuery(e.target).attr('data-animation') || jQuery(e.target).attr('data-animation-out') ){ //If there is any Nebula animation attribute
                var anim = jQuery(e.target).attr('data-animation-out') || '';

                if ( anim ){
                    var originalClasses = jQuery('#' + e.target.id + ' .modal-dialog').attr('data-original-classes');
                    jQuery('#' + e.target.id + ' .modal-dialog').attr('class', originalClasses + ' ' + anim + ' animate'); //Replace classes each time for re-animation.
                }
            }
        });
    }
};

Override

To override or disable this JavaScript function, simply redeclare it with the exact same function name.

JavaScript
nebula.initBootstrapFunctions = function(){
    //Write your own code here, leave it blank, or return false.
}