load js and css files

file_loader.js

var Load = function() {}

Load.prototype = {
	log: function(t) {
		console.log("Loader: " + t);
	},
	makeUrl: function(filename, noCache) {
		if (!noCache) return filename;
		if (filename.indexOf("?") === -1)
			filename += "?no_cache=" + new Date().getTime();
		else
			filename += "&no_cache=" + new Date().getTime();
		return filename;
	},
	files: function(files, allDoneCb, noCache) {
		var allDoneCb     = allDoneCb || function() {}
		var noCache       = noCache || false;
		var self          = this;
		var stylesLoaded  = false;
		var scriptsLoaded = false;
		var m_js_files    = [];
		var m_css_files   = [];

		function endsWith(str, suffix) {
			if (str === null || suffix === null)
				return false;
			return str.indexOf(suffix) !== -1;
		}

		for (var i = 0; i < files.length; ++i) {
			if (endsWith(files[i], ".css")) {
				m_css_files.push(files[i]);
			} else if (endsWith(files[i], ".js")) {
				m_js_files.push(files[i]);
			} else
				self.log('Error unknown filetype "' + files[i] + '".');
		}

		this.loadStyles(m_css_files, function() {
			self.log('styles done');
			stylesLoaded = true;
			checkAllDone();
		}, noCache);

		this.loadScripts(m_js_files, function() {
			self.log('scripts done');
			scriptsLoaded = true;
			checkAllDone();
		}, noCache);

		function checkAllDone() {
			if (stylesLoaded && scriptsLoaded) allDoneCb()
		}
	},
	loadStyles: function(m_css_files, cb, noCache) {
		if (!m_css_files.length) return cb();
		var self      = this;
		var m_head    = document.getElementsByTagName("head")[0];
		var doneCount = 0;
		for (var i = 0; i < m_css_files.length; ++i) {
			(function(i) {
				// HTMLLinkElement
				var link  = document.createElement("link");
				link.rel  = "stylesheet";
				link.type = "text/css";
				link.href = self.makeUrl(m_css_files[i], noCache);
				// self.log('Loading style ' + m_css_files[i]);
				link.onload = function() {
					self.log('Loaded style "' + m_css_files[i] + '".');
					checkAllLoad();
				};
				link.onerror = function() {
					self.log('Error loading style "' + m_css_files[i] + '".');
					checkAllLoad();
				};
				m_head.appendChild(link);
			})(i)

		}

		function checkAllLoad() {
			doneCount++;
			if (doneCount == m_css_files.length && typeof cb == 'function') cb();
		}
	},
	loadScripts: function(m_js_files, cb, noCache) {
		if (!m_js_files.length) return cb();
		var self   = this;
		var m_head = document.getElementsByTagName("head")[0];

		function loadCircle(i) {
			var script  = document.createElement('script');
			script.type = 'text/javascript';
			script.src  = self.makeUrl(m_js_files[i], noCache);
			var loadNextScript = function() {
				if (i + 1 < m_js_files.length) {
					loadCircle(i + 1);
				} else {
					cb()
				}
			};
			script.onload = function() {
				self.log('Loaded script "' + m_js_files[i] + '".');
				loadNextScript();
			};
			script.onerror = function() {
				self.log('Error loading script "' + m_js_files[i] + '".');
				loadNextScript();
			};
			// self.log('Loading script "' + self.m_js_files[i] + '".');
			m_head.appendChild(script);
		}
		loadCircle(0);
	}
}

// usage

var load = new Load();

load.files([
    'https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js',
    'https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js',
    'https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.5.2/underscore-min.js',
    'https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css',
    'https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.5.2/animate.css',
], function() {
	console.log('ALL DONE !!!');
}, false) // last param is nocache (if true add timestamp to url)