diff --git a/index.html b/index.html index e1bb1ed..b35dd55 100644 --- a/index.html +++ b/index.html @@ -46,6 +46,7 @@
+ diff --git a/src/loading.js b/src/loading.js new file mode 100644 index 0000000..0419dfc --- /dev/null +++ b/src/loading.js @@ -0,0 +1,21 @@ +'use strict'; +// Small script used for the loading screen + +import $ from 'jquery'; + +async function loadingOneCycle(){ + $("#loading").fadeOut(600, ()=>{ + $("#loading").fadeIn(600); + }) +}; + +let timeoutID; +function startLoadingAnimation(){ + timeoutID = setInterval(loadingOneCycle, 200); +} + +function stopLoadingAnimation(){ + clearInterval(timeoutID); +} +document.startLoadingAnimation = startLoadingAnimation;//So that's accessible from everywhere +document.stopLoadingAnimation = stopLoadingAnimation; \ No newline at end of file diff --git a/src/main.js b/src/main.js index de6ed89..98d6445 100644 --- a/src/main.js +++ b/src/main.js @@ -60,6 +60,7 @@ function startThreeJS(quality){ } console.log("Ready to render scene, placed objects : "+scene.children.length); + document.stopLoadingAnimation(); animate(); }); diff --git a/src/menu.js b/src/menu.js index 72b96ce..d247805 100644 --- a/src/menu.js +++ b/src/menu.js @@ -4,7 +4,7 @@ import $ from 'jquery'; $("#menu button").on("click", event=>{ - $("#menu").fadeOut(300); + $("#menu").fadeOut(300, ()=>document.startLoadingAnimation()); const quality = $("#quality-select").val(); console.log(`Starting Three.Js, with quality setting ${quality} !`); document.startThreeJS(quality);