Last active
August 29, 2015 14:21
-
-
Save pygy/a778c39566cf0917d8ce to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/*\ | |
For now, back to the stable if less featureful v4 | |
TODO: implement http://stackoverflow.com/questions/4845762/onload-handler-for-script-tag-in-internet-explorer | |
for old ie compatiblity (where script.onload doesn't fire). | |
`{loading, element} = mithrilLoader(libs::Arrary [, m::mithril])` | |
where `libs` is an array of strings and array: | |
var deps = [ | |
"lib1.js", // a library without dependencies | |
["lib2.js", ["lib1.js"]], // lib2 depends on lib1 | |
"styles.css" // styles are also supported. | |
] | |
The order is irrelevant. | |
`loading` is a `prop(true)` that will be set to `false` | |
to inform the view that dependencies have loaded. | |
So: | |
var libs = mithrilLoader(deps, m) | |
var component = { | |
view: function(){ | |
return [ | |
libs.element, | |
libs.loading()? placeholder : your_app | |
] | |
} | |
} | |
That's it. | |
\*/ | |
;(function(window){ | |
var type = {}.toString | |
, ARRAY = type.call([]) | |
; | |
function mithrilLoader(libs, m) { | |
var tags = [] | |
, loaded = {} | |
, n = libs.length | |
, loadedSoFar = 0 | |
; | |
m = m || window.m; | |
var loading = m.prop(true); | |
function onLoad(e){ | |
if (e.target.tagName.toLowerCase() === "script") { | |
loaded[e.target.attributes.src.value] = true; | |
} else if (e.target.tagName.toLowerCase() === "link"){ | |
loaded[e.target.attributes.href.value] = true; | |
} | |
if (++loadedSoFar === n) loading(false); | |
load(); | |
} | |
function createTag(name) { | |
if (name.match(/\.css$/)) { | |
return m("link", { | |
href: name, | |
itemprop: "stylesheet", | |
rel: "stylesheet", | |
onload: onLoad | |
}) | |
} else if (name.match(/\.js$/)) { | |
return m('script', { | |
src: name, | |
onload: onLoad | |
}) | |
} | |
} | |
function _load() { | |
for(var i = libs.length; i--;) { | |
var lib = libs[i], deps = [] | |
if (type.call(lib) == ARRAY){ | |
deps = lib[1] || deps; | |
lib = lib[0] | |
} | |
if (lib.length === 0 || deps.every(function (dep) {return loaded[dep]})) { | |
tags.push(createTag(lib)) | |
libs.splice(i,1) | |
} | |
} | |
} | |
function load(){ | |
var count = tags.length | |
_load() | |
if (count !== tags.length || !loading()) m.redraw(); | |
} | |
_load(); | |
// return a single element to make DOM diffing more efficient. | |
return {loading:loading, element:m("[style=display:none]", tags)}; | |
} | |
window.mithrilLoader = mithrilLoader; | |
if (typeof module != "undefined" && module !== null && module.exports) module.exports = mithrilLoader; | |
})(typeof window != 'undefined' ? window : {}) |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment