From 0d732943b327751f7bb15550f97009e8d0006eab Mon Sep 17 00:00:00 2001
From: themancalledjakob <jrkb@jrkb.land>
Date: Mon, 1 Apr 2024 15:30:03 +0200
Subject: [PATCH] loader waits longer

dependencies hashes:
openFrameworks d78075f4bca6be2a2533c6e51a75cc1f18404501
ofxMsdfgen e14da13d02c4dff04fb69d7923469f606924e6c3
ofxGPUFont d482bb7cbdf6b296fa4ab5abcf73fb5ff8c8b239
ofxVariableLab 0b5f9bdebc1e5550621957e73c040c258ec6317b
ofxProfiler a868e34fa1a79189dd4fbdede2938e308535e5e8
theatre 86d3e07f6f2c75fd6e08fca8c97e3617c9e23b18
---
 bin/em/variabletime/web/js/artboard.js     |  6 +++++-
 bin/em/variabletime/web/js/audio.js        |  1 +
 bin/em/variabletime/web/js/layer.js        |  6 +++++-
 bin/em/variabletime/web/js/main.js         | 23 ++++++++++++++++++++--
 bin/em/variabletime/web/js/theatre-play.js |  3 ++-
 5 files changed, 34 insertions(+), 5 deletions(-)

diff --git a/bin/em/variabletime/web/js/artboard.js b/bin/em/variabletime/web/js/artboard.js
index 6638c30..7f58d73 100644
--- a/bin/em/variabletime/web/js/artboard.js
+++ b/bin/em/variabletime/web/js/artboard.js
@@ -152,7 +152,11 @@ const Artboard = function(tp, domElement = false, autoInit = true) {
                 });
                 // should we have an audio object, let's inject the buttons, etc
                 if (typeof audio === 'object' && audio.hasOwnProperty('injectPanel')) {
-                    audio.injectPanel(this);
+                    const success = audio.injectPanel(this);
+                    if (success) {
+                        const e = new CustomEvent('injectedAll', {});
+                        tp.getPanel().dispatchEvent(e);
+                    }
                 } else {
                     console.log('Artboard::findInjectPanel', `cannot inject audio panel for ${this.id()} for some reason.`);
                 }
diff --git a/bin/em/variabletime/web/js/audio.js b/bin/em/variabletime/web/js/audio.js
index 86cf7c0..03fd88d 100644
--- a/bin/em/variabletime/web/js/audio.js
+++ b/bin/em/variabletime/web/js/audio.js
@@ -807,6 +807,7 @@ const Audio = function(tp, record) {
                 addAudioButton(layer, propTitle, isActive);
             }
         });
+        return props.length > 1 && props[0] !== 'dummy'; 
     };
     const audioSourceCombos = {};
     const readAudioFiles = () => {
diff --git a/bin/em/variabletime/web/js/layer.js b/bin/em/variabletime/web/js/layer.js
index 9419dd5..a5c1d6a 100644
--- a/bin/em/variabletime/web/js/layer.js
+++ b/bin/em/variabletime/web/js/layer.js
@@ -802,7 +802,11 @@ const Layer = function(tp, layerID, fontsAndAxes, autoInit = true) {
 
                         // should we have an audio object, let's inject the buttons, etc
                         if (typeof audio === 'object' && typeof audio.injectPanel === 'function') {
-                            audio.injectPanel(this);
+                            const success = audio.injectPanel(this);
+                            if (success) {
+                                const e = new CustomEvent('injectedAll', {});
+                                tp.getPanel().dispatchEvent(e);
+                            }
                         } else {
                             console.log('Layer::findInjectPanel', `cannot inject audio panel for ${this.id()} for some reason.`);
                         }
diff --git a/bin/em/variabletime/web/js/main.js b/bin/em/variabletime/web/js/main.js
index 8268145..b27164c 100644
--- a/bin/em/variabletime/web/js/main.js
+++ b/bin/em/variabletime/web/js/main.js
@@ -324,8 +324,27 @@ const resize = () => {
     Module.windowResized(Math.round(width * ratio), Math.round(height * ratio));
 };
 
+const setLoadingDoneHook = () => {
+    let addedListener = false;
+    const loadingInjectInterval = setInterval(() => {
+        if (!addedListener) {
+            const panel = tp.getPanel();
+            if (panel !== null) {
+                addedListener = true;
+                const injectedAll = () => {
+                    window.setLoadingDone();
+                    tp.getPanel().removeEventListener('injectedAll', injectedAll);
+                };
+                tp.getPanel().addEventListener('injectedAll', injectedAll);
+                clearInterval(loadingInjectInterval);
+            }
+        }
+    }, 20);
+};
+
 const postModuleInitialized = () => {
     window.setLoadingTask('setting up animation', 80);
+    setLoadingDoneHook();
     moduleFS.init()
         .then(() => {
             artboard = new Artboard(tp, content);
@@ -334,13 +353,13 @@ const postModuleInitialized = () => {
             tp.connectModuleCallbacks();
             exporter.init();
             getFontsAndAxes();
+            window.setLoadingTask('loading project', 85);
             tp.loadProject().then(() => {
                 interactor.init();
                 resize();
                 adjustPanel();
-                window.setLoadingTask('setting up animation', 100);
+                window.setLoadingTask('setting up whatever else is necessary', 100);
                 window.isInitialized = true;
-                window.setLoadingDone();
                 window.autoSaveInterval = setInterval(() => {
                     if (config.autoSave && window.isInitialized) {
                         tp.saveProject();
diff --git a/bin/em/variabletime/web/js/theatre-play.js b/bin/em/variabletime/web/js/theatre-play.js
index 082fa86..7fc4e72 100644
--- a/bin/em/variabletime/web/js/theatre-play.js
+++ b/bin/em/variabletime/web/js/theatre-play.js
@@ -702,6 +702,7 @@ const TheatrePlay = function(autoInit = false) {
                 const defaultArtboardValues = window.getArtboard().theatreObject.value;
                 const artboardProps = {...defaultArtboardValues, ...artboardValues};
 
+                window.setLoadingTask('setting up artboard', 90);
                 studio.transaction(({
                     set
                 }) => {
@@ -719,6 +720,7 @@ const TheatrePlay = function(autoInit = false) {
                 Object.keys(objects)
                     .filter((e) => e.indexOf('layer-') === 0)
                     .forEach((layerId) => {
+                        window.setLoadingTask(`setting up the shapes of ${layerId} to come`, 90);
                         window.project_fontsHashMap = project.fontsHashMap;
                         layerPromises.push(window.addExistingLayer(layerId, objects[layerId]));
                     });
@@ -729,7 +731,6 @@ const TheatrePlay = function(autoInit = false) {
                         getLayers().forEach((layer) => {
                             if (layer.id() === project.layerOrder[project.layerOrder.length - 1]) {
                                 layer.select();
-                                // add audio mapping?
                             }
                         });
                     }