Class for providing the sequence of interdependent scripts that should be loaded into the Web page
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
var dps=function(p){ | |
this.desc="Class for providing the sequence of interdependent scripts that should be loaded into the Web page"; | |
this.loadCSS=function(url,cb){ | |
var style=document.createElement("link"); | |
style.href=url+"?"+new Date().getTime(); | |
style.rel="stylesheet"; | |
document.head.appendChild(style); | |
style.onload=function(){if(cb!=undefined)cb(style);}; | |
}; | |
this.loadJS=function(url,cb){ | |
var script=document.createElement("script"); | |
script.src=url+"?"+new Date().getTime(); | |
script.type="text/javascript"; | |
document.head.appendChild(script); | |
script.onload=function(){if(cb!=undefined)cb(script);}; | |
}; | |
this.progress=function(p){ | |
p.scripts=p.scripts==undefined?0:p.scripts; | |
if(p.onProgress!=undefined){ | |
p.onProgress(100*p.scripts/(p.css.length+p.js.length)); | |
p.scripts++; | |
} | |
}; | |
this.loadDPS=function(p){ | |
var obj=this; | |
var cur=0; | |
obj.progress(p); | |
var cb=function(){ | |
obj.progress(p); | |
cur++; | |
if(cur<p.css.length){ | |
obj.loadCSS(p.css[cur],cb); | |
}else{ | |
cur=0; | |
cb=function(){ | |
obj.progress(p); | |
cur++; | |
if(cur<p.js.length){ | |
obj.loadJS(p.js[cur],cb); | |
}else{ | |
p.callBack(); | |
} | |
}; | |
obj.loadJS(p.js[cur],cb); | |
} | |
}; | |
obj.loadCSS(p.css[cur],cb); | |
}; | |
this.loadDPS(p); | |
}; | |
var dp = new dps({ | |
css:[//define the paths of stylesheets | |
"//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css", | |
"//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css" | |
], | |
js:[//define the paths of javascript | |
"//code.jquery.com/jquery-1.11.3.min.js", | |
"//code.jquery.com/jquery-migrate-1.2.1.min.js", | |
"//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js" | |
], | |
onProgress:function(p){//show the percentage of the loading | |
console.log(p+"% Loaded"); | |
}, | |
callBack:function(){ | |
console.log('interdependent scripts are loaded, lets show page'); | |
document.body.style.display='block'; | |
} | |
}); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
No jquery, just pure JavaScript