diff --git a/src/spessasynth_lib/sequencer/sequencer.js b/src/spessasynth_lib/sequencer/sequencer.js index d601bc28..11bb1e28 100644 --- a/src/spessasynth_lib/sequencer/sequencer.js +++ b/src/spessasynth_lib/sequencer/sequencer.js @@ -523,11 +523,25 @@ export class Sequencer { } else { - if(savedControllers[info.channel] === undefined) + // Keep in mind midi ports to determine channel!! + const channel = info.channel + (this.midiPortChannelOffsets[this.midiPorts[trackIndex]] || 0); + if(savedControllers[channel] === undefined) { - savedControllers[info.channel] = Array.from(defaultControllerArray); + savedControllers[channel] = Array.from(defaultControllerArray); + } + savedControllers[channel][controllerNumber] = event.messageData[1]; + } + break; + + // midiport: handle it and make sure that the saved controllers table is the same size as synth channels + case messageTypes.midiPort: + this._processEvent(event, trackIndex); + if(this.synth.midiChannels.length > savedControllers.length) + { + while(this.synth.midiChannels.length > savedControllers.length) + { + savedControllers.push(Array.from(defaultControllerArray)); } - savedControllers[info.channel][controllerNumber] = event.messageData[1]; } break; @@ -606,7 +620,7 @@ export class Sequencer { if(this.paused) { // adjust the start time - this.absoluteStartTime = this.now - this.pausedTime; + this.absoluteStartTime = this.now - this.pausedTime / this.playbackRate; this.pausedTime = undefined; } @@ -619,7 +633,7 @@ export class Sequencer { }); this.playbackInterval = setInterval(this._processTick.bind(this)); - this.noteCounterClearInterval = setInterval( () =>this.noteOnsPerS = 0, 100); + setInterval( () =>this.noteOnsPerS = 0, 100); } setTimeTicks(ticks) diff --git a/src/website/css/settings.css b/src/website/css/settings.css index 19769b2c..39b23c3b 100644 --- a/src/website/css/settings.css +++ b/src/website/css/settings.css @@ -41,11 +41,9 @@ overflow: scroll; top: 100%; right: 0; - width: 30em; min-width: 30%; max-width: 100%; min-height: 100%; - max-height: 30rem; z-index: 256; display: block; opacity: 0; @@ -129,9 +127,15 @@ text-shadow: 0 0 5px white; } +.settings_groups_parent{ + display: flex; + flex-wrap: wrap; + justify-content: space-evenly; +} + .settings_group{ border-radius: 10px; border: solid #333 1px; margin: 10px; - padding: 5px; + padding: 10px; } \ No newline at end of file diff --git a/src/website/ui/renderer.js b/src/website/ui/renderer.js index e65ad65e..8754e3f8 100644 --- a/src/website/ui/renderer.js +++ b/src/website/ui/renderer.js @@ -37,6 +37,7 @@ export class Renderer this.lineThickness = ANALYSER_STROKE; this.normalAnalyserFft = CHANNEL_ANALYSER_FFT; this.drumAnalyserFft = DRUMS_ANALYSER_FFT; + this.waveMultiplier = WAVE_MULTIPLIER; // booleans @@ -325,7 +326,7 @@ export class Renderer const relativeX = waveWidth * x; const relativeY = waveHeight * y + waveHeight / 2; const step = waveWidth / waveform.length; - const multiplier = WAVE_MULTIPLIER * waveHeight; + const multiplier = this.waveMultiplier * waveHeight; // draw this.drawingContext.lineWidth = this.lineThickness; diff --git a/src/website/ui/settings_ui/settings.js b/src/website/ui/settings_ui/settings.js index cf899887..fa91d1a0 100644 --- a/src/website/ui/settings_ui/settings.js +++ b/src/website/ui/settings_ui/settings.js @@ -78,7 +78,8 @@ export class Settings document.getElementById("note_toggler"), document.getElementById("active_note_toggler"), document.getElementById("analyser_thickness_slider"), - document.getElementById("analyser_fft_slider")); + document.getElementById("analyser_fft_slider"), + document.getElementById("wave_multiplier_slider")); this._createMidiSettingsHandler(document.getElementById("midi_input_selector"), document.getElementById("midi_output_selector"), @@ -306,9 +307,17 @@ export class Settings * @param activeNote {HTMLButtonElement} * @param analyserSlider {HTMLInputElement} * @param fftSlider {HTMLInputElement} + * @param waveMultiplierSlider {HTMLInputElement} * @private */ - _createRendererHandler(renderer, slider, analyser, note, activeNote, analyserSlider, fftSlider) + _createRendererHandler(renderer, + slider, + analyser, + note, + activeNote, + analyserSlider, + fftSlider, + waveMultiplierSlider) { slider.oninput = () => { renderer.noteFallingTimeMs = slider.value; @@ -327,6 +336,11 @@ export class Settings fftSlider.nextElementSibling.innerText = `${value}`; } + waveMultiplierSlider.oninput = () => { + renderer.waveMultiplier = parseInt(waveMultiplierSlider.value); + waveMultiplierSlider.nextElementSibling.innerText = waveMultiplierSlider.value; + } + analyser.onclick = () => renderer.renderAnalysers = !renderer.renderAnalysers; note.onclick = () => renderer.renderNotes = !renderer.renderNotes; activeNote.onclick = () => renderer.drawActiveNotes = !renderer.drawActiveNotes; diff --git a/src/website/ui/settings_ui/settings_html.js b/src/website/ui/settings_ui/settings_html.js index bf6f5181..ba5d5b98 100644 --- a/src/website/ui/settings_ui/settings_html.js +++ b/src/website/ui/settings_ui/settings_html.js @@ -1,7 +1,7 @@ export const settingsHtml = `
@@ -24,6 +24,13 @@ export const settingsHtml = `
+ ++ + 2 + +
+Selected channel:
@@ -40,6 +48,7 @@ export const settingsHtml = `MIDI Input
@@ -55,8 +64,10 @@ export const settingsHtml = `