Fix dark mode

and disconnect analysers when unnecessary
spessasus · Apr 2, 2024 · c33d36a · c33d36a
1 parent ea00d0c
commit c33d36a
Show file tree

Hide file tree

Showing 3 changed files with 64 additions and 28 deletions.
diff --git a/src/spessasynth_lib/synthetizer/synthetizer.js b/src/spessasynth_lib/synthetizer/synthetizer.js
@@ -314,23 +314,23 @@ export class Synthetizer {
         {
             // reset
             ch.resetControllers();
-            ch.bank = 0;
-            if((ch.channelNumber - 1) % 16 === DEFAULT_PERCUSSION) {
-                ch.setPreset(this.percussionPreset);
-                ch.percussionChannel = true;
-                this.eventHandler.callEvent("drumchange",{
-                    channel: ch.channelNumber - 1,
-                    isDrumChannel: true
-                });
-            }
-            else
-            {
-                ch.percussionChannel = false;
-                ch.setPreset(this.defaultPreset);
-                this.eventHandler.callEvent("drumchange",{
-                    channel: ch.channelNumber - 1,
-                    isDrumChannel: false
-                });
+            if(!ch.lockPreset) {
+                ch.bank = 0;
+                if ((ch.channelNumber - 1) % 16 === DEFAULT_PERCUSSION) {
+                    ch.setPreset(this.percussionPreset);
+                    ch.percussionChannel = true;
+                    this.eventHandler.callEvent("drumchange", {
+                        channel: ch.channelNumber - 1,
+                        isDrumChannel: true
+                    });
+                } else {
+                    ch.percussionChannel = false;
+                    ch.setPreset(this.defaultPreset);
+                    this.eventHandler.callEvent("drumchange", {
+                        channel: ch.channelNumber - 1,
+                        isDrumChannel: false
+                    });
+                }
             }
 
             // call all the event listeners

diff --git a/src/website/ui/renderer.js b/src/website/ui/renderer.js
@@ -1,5 +1,5 @@
 import {Synthetizer} from "../../spessasynth_lib/synthetizer/synthetizer.js";
-import { calculateRGB } from '../../spessasynth_lib/utils/other.js';
+import { calculateRGB, consoleColors } from '../../spessasynth_lib/utils/other.js'
 import { Sequencer } from '../../spessasynth_lib/sequencer/sequencer.js';
 
 /**
@@ -47,7 +47,7 @@ export class Renderer
 
 
         // booleans
-        this.renderBool = true;
+        this._renderBool = true;
         this.renderAnalysers = true;
         this.renderNotes = true;
         this.drawActiveNotes = true;
@@ -90,6 +90,7 @@ export class Renderer
          * @type {AnalyserNode[]}
          */
         this.channelAnalysers = [];
+        this.createChannelAnalysers(synth);
         this.connectChannelAnalysers(synth);
     }
 
@@ -99,10 +100,9 @@ export class Renderer
     }
 
     /**
-     * Connect the 16 channels to their respective analysers
      * @param synth {Synthetizer}
      */
-    connectChannelAnalysers(synth)
+    createChannelAnalysers(synth)
     {
         // disconnect the analysers from earlier
         for(const analyser of this.channelAnalysers)
@@ -111,24 +111,42 @@ export class Renderer
             this.channelAnalysers.splice(0, 1);
         }
         this.channelAnalysers = [];
-        for(const channel of synth.midiChannels)
+        for(let i = 0; i < synth.midiChannels.length; i++)
         {
             // create the analyser
-            const analyser = new AnalyserNode(channel.ctx, {
+            const analyser = new AnalyserNode(synth.context, {
                 fftSize: this.normalAnalyserFft
             });
-            // connect the channel's output to the analyser
-            channel.gainController.connect(analyser);
             this.channelAnalysers.push(analyser);
         }
-
         // connect more channels to the same analysers on add
         synth.eventHandler.addEvent("newchannel", "renderer-new-channel", channel => {
             const targetAnalyser = this.channelAnalysers[(synth.midiChannels.length - 1) % this.channelAnalysers.length];
             channel.gainController.connect(targetAnalyser);
         })
     }
 
+    /**
+     * Connect the 16 channels to their respective analysers
+     * @param synth {Synthetizer}
+     */
+    connectChannelAnalysers(synth)
+    {
+        for(let i = 0; i < synth.midiChannels.length; i++)
+        {
+            // connect the channel's output to the analyser
+            synth.midiChannels[i].gainController.connect(this.channelAnalysers[i % this.channelAnalysers.length]);
+        }
+    }
+
+    disconnectChannelAnalysers()
+    {
+        for (const channelAnalyser of this.channelAnalysers) {
+            channelAnalyser.disconnect();
+        }
+        console.log("%cAnalysers disconnected!", consoleColors.recognized);
+    }
+
     /**
      * @param noteTimes {NoteTimes}
      * @param sequencer {Sequencer}
@@ -253,6 +271,24 @@ export class Renderer
         }
     }
 
+    get renderBool()
+    {
+        return this._renderBool;
+    }
+
+    set renderBool(value)
+    {
+        this._renderBool = value;
+        if(value === true)
+        {
+            this.connectChannelAnalysers(this.synth);
+        }
+        else
+        {
+            this.disconnectChannelAnalysers();
+        }
+    }
+
     renderWaveforms()
     {
         this.channelAnalysers.forEach((analyser, i) => {

diff --git a/src/website/ui/settings_ui/settings.js b/src/website/ui/settings_ui/settings.js
@@ -132,8 +132,8 @@ export class Settings
 
             // rest
             // things get hacky here: change the global (*) --font-color to black:
-            document.styleSheets[0].cssRules[0].style.setProperty("--font-color",  this.mode === "dark" ? "#eee" : "#333");
-            document.styleSheets[0].cssRules[0].style.setProperty("--top-buttons-color",  this.mode === "dark" ? "#222" : "linear-gradient(270deg, #ddd, #fff)");
+            document.styleSheets[0].cssRules[5].style.setProperty("--font-color",  this.mode === "dark" ? "#eee" : "#333");
+            document.styleSheets[0].cssRules[5].style.setProperty("--top-buttons-color",  this.mode === "dark" ? "#222" : "linear-gradient(270deg, #ddd, #fff)");
             document.body.style.background = this.mode === "dark" ? "black" : "white";
         }
     }