jQuery(document).ready(function($) {
    var $window = $(window),
        $body = $('body');

    // Breakpoints.
    breakpoints({
        xlarge: ['1281px', '1680px'],
        large: ['981px', '1280px'],
        medium: ['737px', '980px'],
        small: [null, '736px']
    });

    // Play initial animations on page load.
    $window.on('load', function() {
        window.setTimeout(function() {
            $body.removeClass('is-preload');
        }, 100);
    });

    // Check if dropotron is defined before using it.
    if ($.fn.dropotron) {
        $('#nav > ul').dropotron({
            mode: 'fade',
            noOpenerFade: true,
            alignment: 'center'
        });
    } else {
        console.error('dropotron plugin is not loaded or defined.');
    }

    // Title Bar.
    $('<div id="titleBar"><a href="#navPanel" class="toggle"></a></div>').appendTo($body);

    // Panel - Check that navList function is properly loaded.
    // Assuming navList is a custom function or plugin method.
    $('<div id="navPanel"><nav>' + $('#nav').navList() + '</nav></div>')
        .appendTo($body)
        .panel({
            delay: 500,
            hideOnClick: true,
            hideOnSwipe: true,
            resetScroll: true,
            resetForms: true,
            side: 'left',
            target: $body,
            visibleClass: 'navPanel-visible'
        });

});