I'm building a small web application and it's starting to get a bit complex. I have reached to a point where I have to run some tests and load some libraries.
I made it so I can use it in this way :
this.loadDependencies([
{
test : tests.JSON,
polyfill : self.polyfills.json
},
{
test : tests.Storage,
polyfill : self.polyfills.storage
}], self.libraries);
The first argument, the array, it's just a series of tests and polyfil loading, the second argument it's where I load the libraries. This is how the self.libraries looks :
libraries: {
underscore: {
enabled: true,
library: [directory + 'libraries/underscore/underscore-1.4.2.js']
},
handlebars: {
enabled: true,
library: [directory + 'libraries/handlebars/handlebars-1.0.rc.1.js']
},
hammer: {
enabled: true,
library: [directory + 'libraries/hammer/hammer.js', directory + 'libraries/hammer/jquery.specialevent.hammer.js']
},
bootstrap: {
transition: {
enabled: true,
library: [directory + 'libraries/bootstrap/bootstrap-transition.js']
},
alert: {
enabled: false,
library: [directory + 'libraries/bootstrap/bootstrap-alert.js']
},
modal: {
enabled: false,
library: [directory + 'libraries/bootstrap/bootstrap-modal.js']
},
dropdown: {
enabled: false,
library: [directory + 'libraries/bootstrap/bootstrap-dropdown.js']
},
scrollspy: {
enabled: false,
library: [directory + 'libraries/bootstrap/bootstrap-scrollspy.js']
},
tab: {
enabled: false,
library: [directory + 'libraries/bootstrap/bootstrap-tab.js']
},
tooltip: {
enabled: false,
library: [directory + 'libraries/bootstrap/bootstrap-tooltip.js']
},
popover: {
enabled: false,
library: [directory + 'libraries/bootstrap/bootstrap-popover.js']
},
button: {
enabled: false,
library: [directory + 'libraries/bootstrap/bootstrap-button.js']
},
collapse: {
enabled: true,
library: [directory + 'libraries/bootstrap/bootstrap-collapse.js']
},
carousel: {
enabled: false,
library: [directory + 'libraries/bootstrap/bootstrap-carousel.js']
},
typeahead: {
enabled: false,
library: [directory + 'libraries/bootstrap/bootstrap-typeahead.js']
},
affix: {
enabled: false,
library: [directory + 'libraries/bootstrap/bootstrap-affix.js']
}
}
}
So what the loadDependencies function does is : it takes that object and runs on each level, it checks if the enabled exists and if it's true it loads the library that is defined on the same level.
The function that does the above is what I want to improve a bit, so I'm looking for any advice or tips on how I could improve that code :
Application.Dependencies.prototype.loadLibraries = function(polyfills, libraries, callback) {
var self = this,
libs = self.helpers.objectSize(libraries),
iterations = [],
loaded = [];
self.helpers.each(libraries, function(object) {
if(object.hasOwnProperty('enabled') && object.enabled === true) {
for(var i = object.library.length - 1; i >= 0; i--) {
iterations.push(object.library[i]);
};
} else if(self.helpers.objectSize(object) >= 0) {
self.helpers.each(object, function(obj) {
if(obj.hasOwnProperty('enabled') && obj.enabled === true) {
for(var i = obj.library.length - 1; i >= 0; i--) {
iterations.push(obj.library[i]);
};
};
});
};
});
return self.helpers.each(libraries, function(object) {
if(object.hasOwnProperty('enabled') && object.enabled === true) {
var results = (typeof object.enabled === 'array') ? (object.enabled.length === 1 ? false : true) : true;
Modernizr.load([{
test: results ? object.enabled : self.helpers.reduceArray(object.enabled, function(initial, current) {
return initial && current;
}, 1),
yep: object.library,
callback: function(url, result, key) {
loaded.push(url);
if(loaded.length === self.helpers.objectSize(iterations)) {
self.console(function() {
console.log('Libraries : ', loaded);
self.polyfillize(polyfills, function() {
return(typeof callback === 'function' && callback !== undefined) ? callback.apply(this, [this]) : console.log('Argument : Invalid [ Function Required ]');
});
});
};
}
}]);
} else if(self.helpers.objectSize(object) >= 0) {
self.helpers.each(object, function(obj) {
if(obj.hasOwnProperty('enabled') && obj.enabled === true) {
var results = (typeof obj.enabled === 'array') ? (obj.enabled.length === 1 ? false : true) : true;
Modernizr.load([{
test: results ? obj.enabled : self.helpers.reduceArray(obj.enabled, function(initial, current) {
return initial && current;
}, 1),
yep: obj.library,
callback: function(url, result, key) {
loaded.push(url);
if(loaded.length === self.helpers.objectSize(iterations)) {
self.console(function() {
console.log('Libraries : ', loaded);
self.polyfillize(polyfills, function() {
return(typeof callback === 'function' && callback !== undefined) ? callback.apply(this, [this]) : console.log('Argument : Invalid [ Function Required ]');
});
});
};
}
}]);
};
});
};
});
};
I would appreciate every comment or tip :)
