Drop and Filter Patch

Reverb now defaults to 0
Added the ability to drop files into the program
added Filter controller to the synth controller
Voices end way earlier now

index.html

@@ -71,6 +71,10 @@
   <h1 id='loading_message'>Loading...</h1>
 </div>
 
+<div class='drop_prompt hidden'>
+  <h1 translate-path='locale.dropPrompt'>Drop files here...</h1>
+</div>
+
 <div class='spessasynth_main'>
   <div class="top_part">
     <div id="synthetizer_controls"></div>

package.json

@@ -1,6 +1,6 @@
 {
   "name": "SpessaSynth",
-  "version": "3.20.30",
+  "version": "3.20.31",
   "type": "module",
   "scripts": {
     "start": "node src/website/server/server.js"

src/spessasynth_lib/sequencer/worklet_sequencer/play.js

@@ -11,7 +11,7 @@ defaultControllerArray[midiControllers.expressionController] = 127;
 defaultControllerArray[midiControllers.pan] = 64;
 defaultControllerArray[midiControllers.releaseTime] = 64;
 defaultControllerArray[midiControllers.brightness] = 64;
-defaultControllerArray[midiControllers.effects1Depth] = 40;
+defaultControllerArray[midiControllers.effects1Depth] = 0;
 
 /**
  * plays from start to the target time, excluding note messages (to get the synth to the correct state)

src/spessasynth_lib/sequencer/worklet_sequencer/process_event.js

@@ -102,6 +102,7 @@ export function _processEvent(event, trackIndex)
         case messageTypes.activeSensing:
         case messageTypes.keySignature:
         case messageTypes.sequenceNumber:
+        case messageTypes.sequenceSpecific:
             break;
 
         case messageTypes.text:

src/spessasynth_lib/synthetizer/worklet_system/worklet_methods/reset_controllers.js

@@ -87,6 +87,7 @@ export function resetAllControllers(log= true)
         restoreControllerValueEvent(midiControllers.modulationWheel);
         restoreControllerValueEvent(midiControllers.effects3Depth);
         restoreControllerValueEvent(midiControllers.effects1Depth);
+        restoreControllerValueEvent(midiControllers.brightness);
 
         // restore pitch wheel
         if(this.workletProcessorChannels[channelNumber].lockedControllers[NON_CC_INDEX_OFFSET + modulatorSources.pitchWheel])

src/spessasynth_lib/synthetizer/worklet_system/worklet_utilities/volume_envelope.js

@@ -10,6 +10,7 @@ export const VOLUME_ENVELOPE_SMOOTHING_FACTOR = 0.001;
 
 const DB_SILENCE = 100;
 const PERCEIVED_DB_SILENCE = 90;
+const PERCEIVED_GAIN_SILENCE = 0.005;
 
 /**
  * VOL ENV STATES:
@@ -291,18 +292,17 @@ export class WorkletVolumeEnvelope
                 return;
             }
             let dbDifference = DB_SILENCE - env.releaseStartDb;
-            let db = 0;
             for (let i = 0; i < audioBuffer.length; i++)
             {
-                db = (elapsedRelease / env.releaseDuration) * dbDifference + env.releaseStartDb;
+                let db = (elapsedRelease / env.releaseDuration) * dbDifference + env.releaseStartDb;
                 let gain = decibelAttenuationToGain(db + decibelOffset);
                 env.currentReleaseGain += (gain - env.currentReleaseGain) * releaseSmoothingFactor;
                 audioBuffer[i] *= env.currentReleaseGain;
                 env.currentSampleTime++;
                 elapsedRelease++;
             }
-    
-            if(db >= PERCEIVED_DB_SILENCE)
+
+            if(env.currentReleaseGain <= PERCEIVED_GAIN_SILENCE)
             {
                 voice.finished = true;
             }

src/spessasynth_lib/synthetizer/worklet_system/worklet_utilities/worklet_processor_channel.js

@@ -92,7 +92,6 @@ resetArray[midiControllers.expressionController] = 127 << 7;
 resetArray[midiControllers.pan] = 64 << 7;
 resetArray[midiControllers.releaseTime] = 64 << 7;
 resetArray[midiControllers.brightness] = 64 << 7;
-resetArray[midiControllers.effects1Depth] = 40 << 7;
 resetArray[NON_CC_INDEX_OFFSET + modulatorSources.pitchWheel] = 8192;
 resetArray[NON_CC_INDEX_OFFSET + modulatorSources.pitchWheelRange] = 2 << 7;
 

src/website/css/style.css

@@ -121,6 +121,18 @@ button{
     z-index: 0;
 }
 
+.drop_prompt{
+    flex-direction: column;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    position: fixed;
+    width: 100%;
+    height: 100%;
+    z-index: var(--top-index);
+    background: rgba(0, 0, 0, 0.6);
+}
+
 .loading {
     flex-direction: column;
     display: flex;

src/website/js/locale/locale_files/locale_en/locale.js

@@ -37,6 +37,7 @@ export const localeEnglish = {
     demoGithubPage: "Project's page",
     demoSongButton: "Demo Song",
     credits: "Credits",
+    dropPrompt: "Drop files here...",
 
     warnings: {
         outOfMemory: "Your browser ran out of memory. Consider using Firefox or SF3 soundfont instead. (see console for error).",

src/website/js/locale/locale_files/locale_en/synthesizer_controller/channel_controller.js

@@ -39,6 +39,11 @@ export const channelControllerLocale = {
         description: "The current level of reverb effect applied to channel {0} (right-click to lock)"
     },
 
+    filterMeter: {
+        title: "Filter: ",
+        description: "The current level of low-pass filter cutoff applied to channel {0} (right-click to lock)"
+    },
+
     transposeMeter: {
         title: "Transpose: ",
         description: "The current transposition (key shift) of channel {0}"

src/website/js/locale/locale_files/locale_ja/locale.js

@@ -37,6 +37,7 @@ export const localeJapanese = {
     demoGithubPage: "プロジェクトのページ",
     demoSongButton: "デモソング",
     credits: "クリエイター",
+    dropPrompt: "ここにファイルをドロップ...",
 
     warnings: {
         noMidiSupport: "このブラウザはMIDI入力をサポートしていないため、この機能は利用できません。ChromeまたはFirefoxを使用することを検討してください。",

src/website/js/locale/locale_files/locale_ja/synthesizer_controller/channel_controller.js

@@ -39,7 +39,13 @@ export const channelControllerLocale = {
         description: "チャンネル {0} に適用されている現在のリバーブエフェクトのレベル（右クリックでロック）"
     },
 
-    transposeMeter: {
+    filterMeter: {
+        title: "フィルター: ",
+        description: "チャンネル {0} に適用されているローパスフィルターのカットオフの現在のレベル (右クリックでロック)"
+    },
+
+
+transposeMeter: {
         title: "トランスポーズ: ",
         description: "チャンネル {0} の現在の移調（キーシフト）"
     },

src/website/js/locale/locale_files/locale_pl/locale.js

@@ -40,6 +40,7 @@ export const localePolish = {
     demoGithubPage: "Strona projektu",
     demoSongButton: "Piosenka demo",
     credits: "Twórcy",
+    dropPrompt: "Upuść pliki tutaj...",
 
     warnings: {
         outOfMemory: "Twojej przeglądarce skończyła się pamięć. Rozważ użycie Firefoxa albo plików SF3. (Zobacz błąd w konsoli)",

src/website/js/locale/locale_files/locale_pl/synthesizer_controller/channel_controller.js

@@ -39,6 +39,11 @@ export const channelControllerLocale = {
         description: "Aktualny efekt pogłosu na kanale {0} (kliknij prawym aby zablokować)"
     },
 
+    filterMeter: {
+        title: "Filtr: ",
+        description: "Aktualny poziom filtra niskopasmowego na kanale {0} (kliknij prawym aby zablokować)"
+    },
+
     transposeMeter: {
         title: "Transpozycja: ",
         description: "Aktualna transpozycja (przesunięcie klawiszy) kanału {0}"

src/website/js/manager/manager.js

@@ -24,6 +24,7 @@ import { loadSoundFont } from '../../../spessasynth_lib/soundfont/load_soundfont
 import { readBytesAsString } from '../../../spessasynth_lib/utils/byte_functions/string.js'
 import { IndexedByteArray } from '../../../spessasynth_lib/utils/indexed_array.js'
 import { closeNotification, showNotification } from '../notification/notification.js'
+import { DropFileHandler } from '../utils/drop_file_handler.js'
 
 // this enables transitions on body because if we enable them on load, it flashbangs us with white
 document.body.classList.add("load");
@@ -249,6 +250,18 @@ class Manager
             this.playerUI,
             this.localeManager);
 
+        // set up drop file handler
+        this.dropFileHandler = new DropFileHandler((data) => {
+            this.play([{binary: data.buf, altName: data.name}]);
+            if(data.name.length > 20)
+            {
+                data.name = data.name.substring(0, 21) + "...";
+            }
+            document.getElementById("file_upload").textContent = data.name;
+        }, buf => {
+            this.reloadSf(buf);
+        });
+
         // set up soundfont mixer (unfinished)
         //this.soundFontMixer = new SoundFontMixer(document.getElementsByClassName("midi_and_sf_controller")[0], this.synth, this.synthUI);
         //this.soundFontMixer.soundFontChange(soundFont);
@@ -379,6 +392,12 @@ class Manager
             return;
         }
 
+        if(this.seq)
+        {
+            this.seq.loadNewSongList(parsedMidi);
+            return;
+        }
+
         // create a new sequencer
         this.seq = new Sequencer(parsedMidi, this.synth);
 

src/website/js/synthesizer_ui/methods/create_channel_controller.js

@@ -9,6 +9,7 @@
  *     mod: Meter,
  *     chorus: Meter,
  *     reverb: Meter,
+ *     brightness: Meter,
  *     transpose: Meter,
  *     preset: Selector,
  *     presetReset: HTMLDivElement,
@@ -39,7 +40,7 @@ import {
 } from '../../../../spessasynth_lib/synthetizer/worklet_system/worklet_utilities/worklet_processor_channel.js'
 import { modulatorSources } from '../../../../spessasynth_lib/soundfont/read_sf2/modulators.js'
 
-const ICON_SIZE = 32;
+export const ICON_SIZE = 32;
 
 /**
  * Creates a new channel controller js
@@ -158,9 +159,13 @@ export function createChannelController(channelNumber)
     controller.appendChild(chorus.div);
 
     // reverb
-    const reverb = createCCMeterHelper(midiControllers.effects1Depth, "channelController.reverbMeter", 40);
+    const reverb = createCCMeterHelper(midiControllers.effects1Depth, "channelController.reverbMeter", 0);
     controller.appendChild(reverb.div);
 
+    // brightness
+    const brightness = createCCMeterHelper(midiControllers.brightness, "channelController.filterMeter", 64);
+    controller.appendChild(brightness.div);
+
     // transpose is not a cc, add it manually
     const transpose = new Meter(this.channelColors[channelNumber % this.channelColors.length],
         LOCALE_PATH + "channelController.transposeMeter",
@@ -304,6 +309,7 @@ export function createChannelController(channelNumber)
         mod: modulation,
         chorus: chorus,
         reverb: reverb,
+        brightness: brightness,
         preset: presetSelector,
         presetReset: presetReset,
         drumsToggle: drumsToggle,

src/website/js/synthesizer_ui/methods/create_main_controller.js

@@ -1,6 +1,11 @@
 import { Meter } from './synthui_meter.js'
 import { VOICE_CAP } from '../../../../spessasynth_lib/synthetizer/synthetizer.js'
 import { LOCALE_PATH } from '../synthetizer_ui.js'
+import {
+    ALL_CHANNELS_OR_DIFFERENT_ACTION
+} from '../../../../spessasynth_lib/synthetizer/worklet_system/message_protocol/worklet_message.js'
+import { getEmptyMicSvg, getVolumeSvg } from '../../utils/icons.js'
+import { ICON_SIZE } from './create_channel_controller.js'
 
 /**
  * @this {SynthetizerUI}
@@ -99,7 +104,37 @@ export function createMainSynthController()
 
     resetCCButton.classList.add("synthui_button");
     resetCCButton.classList.add("main_controller_element");
-    resetCCButton.onclick = () => this.synth.resetControllers();
+    resetCCButton.onclick = () => {
+        // unlock everything
+        this.controllers.forEach((channel, number) =>
+        {
+            // CCs
+            if(channel.pitchWheel.isLocked) channel.pitchWheel.lockMeter();
+            if(channel.pan.isLocked) channel.pan.lockMeter();
+            if(channel.expression.isLocked) channel.expression.lockMeter();
+            if(channel.volume.isLocked) channel.volume.lockMeter();
+            if(channel.mod.isLocked) channel.mod.lockMeter();
+            if(channel.chorus.isLocked) channel.chorus.lockMeter();
+            if(channel.reverb.isLocked) channel.reverb.lockMeter();
+            if(channel.brightness.isLocked) channel.brightness.lockMeter();
+            // program
+            if(channel.preset.mainDiv.classList.contains("locked_selector"))
+            {
+                this.synth.lockController(number, ALL_CHANNELS_OR_DIFFERENT_ACTION, false);
+                channel.preset.mainDiv.classList.remove("locked_selector");
+            }
+            // transpose
+            this.synth.transposeChannel(number, 0, true);
+            channel.transpose.update(0);
+
+            // mute/solo
+            channel.soloButton.innerHTML = getEmptyMicSvg(ICON_SIZE);
+            channel.muteButton.innerHTML = getVolumeSvg(ICON_SIZE);
+            this.synth.muteChannel(number, false);
+
+        });
+        this.synth.resetControllers();
+    };
 
 
 

src/website/js/synthesizer_ui/methods/hide_show_controllers.js

@@ -11,6 +11,8 @@ export function hideControllers()
         c.volume.hide();
         c.mod.hide();
         c.chorus.hide();
+        c.reverb.hide();
+        c.brightness.hide();
         c.preset.hide();
     })
 }
@@ -28,6 +30,8 @@ export function showControllers()
         c.volume.show();
         c.mod.show();
         c.chorus.show();
+        c.reverb.show();
+        c.brightness.show();
         c.preset.show();
     })
 }

src/website/js/synthesizer_ui/methods/set_event_listeners.js

@@ -21,7 +21,8 @@ export function setEventListeners()
             controller.pitchWheel.update(0);
             controller.expression.update(127);
             controller.volume.update(100);
-            controller.reverb.update(40);
+            controller.reverb.update(0);
+            controller.brightness.update(64);
         }
     });
 
@@ -62,6 +63,11 @@ export function setEventListeners()
             case midiControllers.effects1Depth:
                 // reverb
                 this.controllers[channel].reverb.update(value);
+                break;
+
+            case midiControllers.brightness:
+                // brightness
+                this.controllers[channel].brightness.update(value);
         }
     });
 

src/website/js/synthesizer_ui/methods/toggle_dark_mode.js

@@ -21,6 +21,8 @@ export function toggleDarkMode()
         controller.volume.toggleMode();
         controller.mod.toggleMode();
         controller.chorus.toggleMode();
+        controller.reverb.toggleMode();
+        controller.brightness.toggleMode();
         controller.preset.toggleMode();
         controller.presetReset.classList.toggle("voice_reset_light");
         controller.drumsToggle.classList.toggle("mute_button_light");

src/website/js/synthesizer_ui/synthetizer_ui.js

@@ -96,6 +96,7 @@ class SynthetizerUI
                 controller.mod.update(controller.mod.currentValue, true);
                 controller.chorus.update(controller.chorus.currentValue, true);
                 controller.reverb.update(controller.reverb.currentValue, true);
+                controller.brightness.update(controller.brightness.currentValue, true);
                 controller.transpose.update(controller.transpose.currentValue, true);
             }
         })