exposed active soundbanks to states (see #12)

ircam-ismm · Nov 8, 2021 · 27d9b65 · 27d9b65
1 parent e373e12
commit 27d9b65
Show file tree

Hide file tree

Showing 9 changed files with 84 additions and 60 deletions.
diff --git a/src/clients/autoplay-controller/AutoPlayControllerExperience.js b/src/clients/autoplay-controller/AutoPlayControllerExperience.js
@@ -48,30 +48,30 @@ class AutoPlayControllerExperience extends AbstractExperience {
 
     // listen all interesting states
     this.autoPlayControllerState = await this.client.stateManager.attach('autoplay-controller');
-    this.autoPlayControllerState.subscribe(updates => this.renderApp());
+    this.autoPlayControllerState.subscribe(updates => this.render());
 
     this.client.stateManager.observe(async (schemaName, stateId, nodeId) => {
       if (schemaName === 'player') {
         const playerState = await this.client.stateManager.attach(schemaName, stateId);
 
         playerState.onDetach(() => {
           this.playerStates.delete(nodeId);
-          this.renderApp();
+          this.render();
         });
 
         playerState.subscribe(updates => {
           for (let name in updates) {
             switch (name) {
               case 'autoPlayConfig':
               case 'autoPlayLoading':
-                this.renderApp();
+                this.render();
                 break;
             }
           }
         });
 
         this.playerStates.set(nodeId, playerState);
-        this.renderApp();
+        this.render();
       }
     });
 
@@ -84,31 +84,28 @@ class AutoPlayControllerExperience extends AbstractExperience {
       this.localState.soundBankValues = values;
       this.localState.soundBankDefaultPresets = soundBankDefaultPresets;
       this.localState.soundFileDefaultPresets = soundFileDefaultPresets;
-      this.renderApp();
+      this.render();
     });
 
-    window.addEventListener('resize', () => this.renderApp());
+    window.addEventListener('resize', () => this.render());
 
     super.start();
   }
 
-  renderApp() {
-    const filteredSoundBankNames = Object.keys(this.localState.soundBankValues)
-      .sort()
-      .filter((name) => {
-        return this.localState.soundBankValues[name].presets.activated.autoPlaySynth;
-      });
-
+  render() {
     const playerStates = Array.from(this.playerStates.values()).map(s => s.getValues());
     const loadingPlayers = playerStates.filter(s => s.autoPlayLoading === true);
     const loadedPlayers = playerStates.filter(s => s.autoPlayConfig !== null && s.autoPlayLoading === false);
 
-    const currentSoundBank = this.autoPlayControllerState.getValues()['currentSoundBank'];
-    let soundBankFiles = {}
+    const {
+      activeSoundbanks,
+      currentSoundBank,
+      enabled,
+    } = this.autoPlayControllerState.getValues();
+
 
-    if (currentSoundBank !== null) {
-      soundBankFiles = this.localState.soundBankValues[currentSoundBank].files;
-    }
+    const soundBankFiles = currentSoundBank ?
+      this.localState.soundBankValues[currentSoundBank].files : {};
 
     const autoPlayState = this.autoPlayControllerState.getValues();
 
@@ -118,7 +115,7 @@ class AutoPlayControllerExperience extends AbstractExperience {
     render(html`
       <playground-header
         style="min-height: 75px"
-        list="${JSON.stringify(filteredSoundBankNames)}"
+        list="${JSON.stringify(activeSoundbanks)}"
         value="${currentSoundBank ? currentSoundBank : ''}"
         @change="${e => this.eventListeners.updateSoundBank(e.detail.value)}"
       ></playground-header>
@@ -133,13 +130,13 @@ class AutoPlayControllerExperience extends AbstractExperience {
         <button
           style="
             ${btn}
-            ${autoPlayState.enabled ? btnActive : ''}
+            ${enabled ? btnActive : ''}
             margin-top: 20px;
             width: 50%;
           "
           @touchstart="${this.eventListeners.toggleSynth}"
           @mousedown="${this.eventListeners.toggleSynth}"
-        >${autoPlayState.enabled ? 'stop' : 'start'}</button>
+        >${enabled ? 'stop' : 'start'}</button>
 
 
         ${Object.keys(soundBankFiles).map((filename) => {

diff --git a/src/clients/granular-controller/GranularControllerExperience.js b/src/clients/granular-controller/GranularControllerExperience.js
@@ -166,31 +166,26 @@ class GranularControllerExperience extends AbstractExperience {
   }
 
   render() {
-    const filteredSoundBankNames = Object.keys(this.localState.soundBankValues)
-      .sort()
-      .filter((name) => {
-        return this.localState.soundBankValues[name].presets.activated.granularSynth;
-      });
-
-    const granularState = this.granularControllerState.getValues();
     const playerStates = Array.from(this.playerStates.values()).map(s => s.getValues());
     const loadingPlayers = playerStates.filter(s => s.granularLoading === true);
     const loadedPlayers = playerStates.filter(s => s.granularConfig !== null && s.granularLoading === false);
 
-    const currentSoundBank = this.granularControllerState.get('currentSoundBank');
-    let soundBankFiles = {}
+    const {
+      activeSoundbanks,
+      currentSoundBank,
+      startedSynths,
+    } = this.granularControllerState.getValues();
 
-    if (currentSoundBank !== null) {
-      soundBankFiles = this.localState.soundBankValues[currentSoundBank].files;
-    }
+    const soundBankFiles = currentSoundBank ?
+      this.localState.soundBankValues[currentSoundBank].files : {};
 
     const width = window.innerWidth;
     const height = window.innerHeight;
 
     render(html`
       <playground-header
         style="min-height: 75px"
-        list="${JSON.stringify(filteredSoundBankNames)}"
+        list="${JSON.stringify(activeSoundbanks)}"
         value="${currentSoundBank ? currentSoundBank : ''}"
         @change="${this.listeners.updateSoundBank}"
       ></playground-header>
@@ -229,7 +224,7 @@ class GranularControllerExperience extends AbstractExperience {
         ${Object.keys(soundBankFiles).map((filename) => {
           const url = soundBankFiles[filename].url;
           const starting = this.localState.startingSynths.has(url);
-          const started = (granularState.startedSynths.indexOf(url) !== -1);
+          const started = (startedSynths.indexOf(url) !== -1);
           const numPlayers = loadedPlayers.filter(p => p.granularFile === url).length;
 
           return html`

diff --git a/src/clients/soloist-controller/SoloistControllerExperience.js b/src/clients/soloist-controller/SoloistControllerExperience.js
@@ -87,13 +87,6 @@ class SoloistControllerExperience extends AbstractExperience {
     const soloistState = this.soloistState.getValues();
     const playerStates = Array.from(this.playerStates.values()).map(s => s.getValues());
 
-    const currentSoundBank = soloistState.currentSoundBank;
-    const filteredSoundBankNames = Object.keys(this.localState.soundBankValues)
-      .sort()
-      .filter((name) => {
-        return this.localState.soundBankValues[name].presets.activated.soloistSynth;
-      });
-
     const positions = playerStates.filter(p => p.position !== null).map(p => p.position);
     const loadingPlayers = playerStates.filter(s => s.soloistLoading === true);
 
@@ -113,8 +106,8 @@ class SoloistControllerExperience extends AbstractExperience {
       html`
         <playground-header
           style="min-height: 75px; max-width: calc(100vw - 400px);"
-          list="${JSON.stringify(filteredSoundBankNames)}"
-          value="${currentSoundBank ? currentSoundBank : ''}"
+          list="${JSON.stringify(soloistState.activeSoundbanks)}"
+          value="${soloistState.currentSoundBank ? soloistState.currentSoundBank : ''}"
           @change="${e => this.listeners.updateSoundBank(e.detail.value)}"
         ></playground-header>
 

diff --git a/src/clients/trigger-controller/TriggerControllerExperience.js b/src/clients/trigger-controller/TriggerControllerExperience.js
@@ -77,8 +77,9 @@ class TriggerControllerExperience extends AbstractExperience {
     this.triggerControllerState.subscribe(updates => {
       if ('currentSoundBank' in updates) {
         this.localState.editedFiles.clear();
-        this.render();
       }
+
+      this.render();
     });
 
     this.client.stateManager.observe(async (schemaName, stateId, nodeId) => {
@@ -125,30 +126,27 @@ class TriggerControllerExperience extends AbstractExperience {
   }
 
   render() {
-    const filteredSoundBankNames = Object.keys(this.localState.soundBankValues)
-      .sort()
-      .filter((name) => {
-        return this.localState.soundBankValues[name].presets.activated.triggerSynth;
-      });
-
     const playerStates = Array.from(this.playerStates.values()).map(s => s.getValues());
     const loadingPlayers = playerStates.filter(s => s.triggerLoading === true);
     const loadedPlayers = playerStates.filter(s => s.triggerConfig !== null && s.triggerLoading === false);
 
-    const currentSoundBank = this.triggerControllerState.getValues()['currentSoundBank'];
-    let soundBankFiles = {};
+    const {
+      activeSoundbanks,
+      currentSoundBank,
+    } = this.triggerControllerState.getValues();
+
+    console.log(activeSoundbanks)
 
-    if (currentSoundBank !== null) {
-      soundBankFiles = this.localState.soundBankValues[currentSoundBank].files;
-    }
+    const soundBankFiles = currentSoundBank ?
+      this.localState.soundBankValues[currentSoundBank].files : {};
 
     const width = window.innerWidth;
     const height = window.innerHeight;
 
     render(html`
       <playground-header
         style="min-height: 75px"
-        list="${JSON.stringify(filteredSoundBankNames)}"
+        list="${JSON.stringify(activeSoundbanks)}"
         value="${currentSoundBank ? currentSoundBank : ''}"
         @change="${e => this.listeners.updateSoundBank(e.detail.value)}"
       ></playground-header>

diff --git a/src/server/index.js b/src/server/index.js
@@ -195,15 +195,40 @@ server.stateManager.registerSchema('soloist-controller', soloistControllerSchema
     soloistControllerExperience.start();
     triggerControllerExperience.start();
     granularControllerExperience.start();
-
     instructionsViewerExperience.start();
     mainControllerExperience.start();
     soundbankManagerExperience.start();
-
     debugExperience.start();
-
     playerExperience.start();
 
+    soundBankManager.subscribe((oldValues, newValues) => {
+      const soundbanks = Object.values(newValues);
+
+      const autoPlaySoundbanks = soundbanks
+        .filter(s => s.presets.activated.autoPlaySynth)
+        .map(s => s.name)
+        .sort();
+      autoPlayControllerState.set({ activeSoundbanks: autoPlaySoundbanks });
+
+      const granularSoundbanks = soundbanks
+        .filter(s => s.presets.activated.granularSynth)
+        .map(s => s.name)
+        .sort();
+      granularControllerState.set({ activeSoundbanks: granularSoundbanks });
+
+      const soloistSoundbanks = soundbanks
+        .filter(s => s.presets.activated.soloistSynth)
+        .map(s => s.name)
+        .sort();
+      soloistControllerState.set({ activeSoundbanks: soloistSoundbanks });
+
+      const triggerSoundbanks = soundbanks
+        .filter(s => s.presets.activated.triggerSynth)
+        .map(s => s.name)
+        .sort();
+      triggerControllerState.set({ activeSoundbanks: triggerSoundbanks });
+    });
+
     // bind filesystem plugin and soundBankManager together
     fileSystem.state.subscribe(updates => {
       for (let key in updates) {

diff --git a/src/server/schemas/autoPlayController.js b/src/server/schemas/autoPlayController.js
@@ -1,4 +1,8 @@
 export default {
+  activeSoundbanks: {
+    type: 'any',
+    default: [],
+  },
   currentSoundBank: {
     type: 'string',
     default: null,

diff --git a/src/server/schemas/granularController.js b/src/server/schemas/granularController.js
@@ -1,5 +1,9 @@
 
 export default {
+  activeSoundbanks: {
+    type: 'any',
+    default: [],
+  },
   currentSoundBank: {
     type: 'string',
     default: null,

diff --git a/src/server/schemas/soloistController.js b/src/server/schemas/soloistController.js
@@ -1,5 +1,9 @@
 
 const soloistSchema = {
+  activeSoundbanks: {
+    type: 'any',
+    default: [],
+  },
   currentSoundBank: {
     type: 'string',
     default: null,

diff --git a/src/server/schemas/triggerController.js b/src/server/schemas/triggerController.js
@@ -1,5 +1,9 @@
 
 export default {
+  activeSoundbanks: {
+    type: 'any',
+    default: [],
+  },
   currentSoundBank: {
     type: 'string',
     default: null,