Mercurial > bugzilla-dashboard
changeset 44:d3ed74176b4d
added module preloading and loading screen
author | Atul Varma <avarma@mozilla.com> |
---|---|
date | Sat, 24 Apr 2010 19:04:38 -0700 |
parents | 0974c1df3714 |
children | 72d01c7d5258 |
files | css/main.css js/main.js js/require.js main.html |
diffstat | 4 files changed, 40 insertions(+), 8 deletions(-) [+] |
line wrap: on
line diff
--- a/css/main.css Sat Apr 24 18:33:45 2010 -0700 +++ b/css/main.css Sat Apr 24 19:04:38 2010 -0700 @@ -41,6 +41,11 @@ float: right; } +#loading-screen { + width: 2em; + margin: 10em auto; +} + #reports .container { display: table; }
--- a/js/main.js Sat Apr 24 18:33:45 2010 -0700 +++ /dev/null Thu Jan 01 00:00:00 1970 +0000 @@ -1,5 +0,0 @@ -$(window).ready( - function() { - var require = Require.build(Require.modules, {jQuery: jQuery}); - require("app/ui").init(document); - });
--- a/js/require.js Sat Apr 24 18:33:45 2010 -0700 +++ b/js/require.js Sat Apr 24 19:04:38 2010 -0700 @@ -18,6 +18,24 @@ } return moduleExports[module]; }; + }, + preload: function preload(document, scripts, cb) { + var scriptsLeft = scripts.length; + + function onScriptLoaded() { + scriptsLeft--; + if (!scriptsLeft) + cb(); + }; + + scripts.forEach( + function(scriptName) { + var script = document.createElement("script"); + + script.src = scriptName; + script.onload = onScriptLoaded; + document.body.appendChild(script); + }); } };
--- a/main.html Sat Apr 24 18:33:45 2010 -0700 +++ b/main.html Sat Apr 24 19:04:38 2010 -0700 @@ -15,6 +15,7 @@ <li title="file-bug">File A Bug</span> </ul> </div> +<div id="loading-screen" class="loading"> </div> <div id="reports"> </div> <div id="login" class="dialog"> @@ -43,8 +44,21 @@ <!-- Base Scripts --> <script src="js/jquery.js"></script> <script src="js/require.js"></script> -<script src="js/main.js"></script> +<script> +$(window).ready(function() { + var moduleScripts = [ + "js/modules/app.js" + ]; -<!-- CommonJS Modules --> -<script src="js/modules/app.js"></script> + var customModuleExports = { + jQuery: jQuery + }; + + Require.preload(document, moduleScripts, function whenLoaded() { + $("#loading-screen").hide(); + var require = Require.build(Require.modules, customModuleExports); + require("app/ui").init(document); + }); +}); +</script> </html>