Optimal way to load global AND conditional scripts with Yepnope

265 Views Asked by At

I've got about 8 js files that need to be loaded on every page of my site, plus a number of others that need to be loaded conditionally. I've got things working, I just want to ensure that I'm doing this as elegantly as possible (which I suspect I am not).

Here is the code I'm currently using:

yepnope({
    load: {
        'jquery':       '/include/js/libraries/jquery-1.8rc1.js',
        'ui':           '/include/js/jquery-ui-1.8.16.custom.min.js',
        'global':       '/include/js/global.js',
        'dbObject':     '/include/js/dbObject.js',
        'dbQuery':      '/include/js/dbQuery.js',
        'common':       '/include/js/common.js',
        'credit':       '/include/js/credit.js',
        'messages':     '/include/js/messages.js',
        'poller':       '/include/js/poller.js',
        'ajax_global':  '/include/js/ajax_global.js'
    },
    complete: function (url, res, key) {

        yepnope({
            test: $('body').hasClass('project'),
            yep: {
                'project': '/include/js/project.js'
            },
            callback: function(url, res, key) {

            }
        });

    }
});

Everything in that initial load object must be loaded for every page on the site. Then in the complete function I am testing to see if the body tag has the project class and, if so, I'm loading other scripts I rely on for this page.

Couple of questions:

  1. Is this the best way to do this?
  2. How should I add other tests for other pages? Would I throw that nested yepnope call into an array and just add more test objects?

I appreciate any help I can get.

0

There are 0 best solutions below