HTML5Boilerplate js structure

Question

I'm wondering if someone can check my understanding of what the intended purpose of HTML5Boilerplate js directories. I understand that main.js is where I'm expected to place all site specific javascript that I author. Plugins.js is where I would place all jQuery plugins used. Both main.js and plugins.js will be concatenated and minified by the build process. Vendor.js holds javascript libraries. This directory will be minified (unless it is already minified) but not concatenated.

If this is true, then my question is where should something like cute slider which has a modular structure be placed? I'm thinking I want it to be minified and concatenated so it shouldn't go in the vendor directory. I don't believe I can add cuteslider's javascript to main.js or plugins.js without destroying it's modular structure. Should I create a new directory, and call it something like apps, to hold cuteslider code and then modify the build code to minified and concatenated it?

Here is a snippet of cuteslider's code structure

cute
    cute.2d.module.js
    cute.canvas.module.js
    cute.css3d.module.js
    cute.gallery.plugin.js
    cute.slider.js
    cute.transitions.all.js

Valaria

Answer 1

First you have to consider cuteslider as a plugin.

Add the required files to make the plugin working (cute.slider.js, cute.transitions.all.js and respond.min.js) in the plugins.js.

Then add the js to load the slider into your page in the main.js as

$(document).ready(function() {
        // code here to load cuteslider
});

The modular look have to be set only in the main.js file.

Darwen