Skip to content

Commit

Permalink
Make multichannel-to-equave settings and color mapping dependent on mode
Browse files Browse the repository at this point in the history 
PR #657
  • Loading branch information
@000masa000
000masa000 authored Apr 18, 2024
1 parent 38665d3 commit efac5f6
Show file tree
Hide file tree
Showing 3 changed files with 70 additions and 57 deletions.
8 changes: 5 additions & 3 deletions src/App.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -72,8 +72,10 @@ function sendNoteOn(frequency: number, rawAttack: number) {
}
function midiNoteOn(index: number, rawAttack?: number, channel?: number) {
const multichannel = midi.multichannelToEquave
// in multichannel-to-equave mode calculate an offset based on the incoming channel
if (midi.multichannelToEquave && channel !== undefined) {
if (multichannel && channel !== undefined) {
let offset =
mmod(
channel - midi.multichannelCenter + midi.multichannelEquavesDown,
Expand All @@ -99,7 +101,7 @@ function midiNoteOn(index: number, rawAttack?: number, channel?: number) {
const whiteMode = midi.whiteMode
const indices = scale.whiteIndices
if (whiteMode === 'off') {
if (whiteMode === 'off' || multichannel) {
tuningTableKeyOn(index)
} else if (whiteMode === 'simple') {
if (info.whiteNumber === undefined) {
Expand Down Expand Up @@ -156,7 +158,7 @@ function midiNoteOn(index: number, rawAttack?: number, channel?: number) {
if (!midi.velocityOn) {
rawRelease = 80
}
if (whiteMode === 'simple') {
if (whiteMode === 'simple' || multichannel) {
if (info.whiteNumber !== undefined) {
tuningTableKeyOff(info.whiteNumber)
}
Expand Down
3 changes: 2 additions & 1 deletion src/components/MidiPiano.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,7 @@ const props = defineProps<{
baseMidiNote: number
whiteModeOffset: number
midiWhiteMode: 'off' | 'simple' | 'blackAverage' | 'keyColors'
multichannel: boolean
keyColors: string[]
activeKeys: Set<number>
}>()
Expand All @@ -30,7 +31,7 @@ const whiteIndices = computed(() => computeWhiteIndices(props.baseMidiNote, prop
function keyLabel(chromaticNumber: number) {
const info = midiKeyInfo(chromaticNumber)
if (props.midiWhiteMode === 'off') {
if (props.midiWhiteMode === 'off' || props.multichannel) {
return [(chromaticNumber - props.baseMidiNote).toString()]
} else if (props.midiWhiteMode === 'simple') {
if (info.whiteNumber !== undefined) {
Expand Down
116 changes: 63 additions & 53 deletions src/views/MidiView.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -186,67 +186,77 @@ onUnmounted(() => {
<label for="multichannel">Multichannel-to-equave</label>
</div>
</div>
<label>Settings for multichannel-to-equave mode</label>
<div class="control multichannel-input-container">
<div>
Center channel
<input
id="multichannel-center"
class="control"
type="number"
min="1"
max="16"
v-model="midi.multichannelCenter"
/>
</div>
<div>
Total equaves
<input
id="multichannel-num-equaves"
class="control"
type="number"
min="1"
max="16"
v-model="midi.multichannelNumEquaves"
/>
<template v-if="midi.multichannelToEquave">
<label>Settings for multichannel-to-equave mode</label>
<div class="control multichannel-input-container">
<div>
Center channel
<input
id="multichannel-center"
class="control"
type="number"
min="1"
max="16"
v-model="midi.multichannelCenter"
/>
</div>
<div>
Total equaves
<input
id="multichannel-num-equaves"
class="control"
type="number"
min="1"
max="16"
v-model="midi.multichannelNumEquaves"
/>
</div>
<div>
Equaves down
<input
id="multichannel-equaves-down"
class="control"
type="number"
min="0"
max="15"
v-model="midi.multichannelEquavesDown"
/>
</div>
</div>
<div>
Equaves down
<input
id="multichannel-equaves-down"
class="control"
type="number"
min="0"
max="15"
v-model="midi.multichannelEquavesDown"
/>
</template>
<template v-if="!midi.multichannelToEquave">
<div class="control radio-group">
<label>Color mapping</label>
<span>
<input type="radio" id="white-off" value="off" v-model="midi.whiteMode" />
<label for="white-off">Chromatic</label>
</span>
<span>
<input type="radio" id="white-simple" value="simple" v-model="midi.whiteMode" />
<label for="white-simple">White only</label>
</span>
<span>
<input
type="radio"
id="white-black"
value="blackAverage"
v-model="midi.whiteMode"
/>
<label for="white-black">White w/ interpolation</label>
</span>
<span>
<input type="radio" id="white-color" value="keyColors" v-model="midi.whiteMode" />
<label for="white-color">White key to white color</label>
</span>
</div>
</div>
<div class="control radio-group">
<label>Color mapping</label>
<span>
<input type="radio" id="white-off" value="off" v-model="midi.whiteMode" />
<label for="white-off">Chromatic</label>
</span>
<span>
<input type="radio" id="white-simple" value="simple" v-model="midi.whiteMode" />
<label for="white-simple">White only</label>
</span>
<span>
<input type="radio" id="white-black" value="blackAverage" v-model="midi.whiteMode" />
<label for="white-black">White w/ interpolation</label>
</span>
<span>
<input type="radio" id="white-color" value="keyColors" v-model="midi.whiteMode" />
<label for="white-color">White key to white color</label>
</span>
</div>
</template>
</div>
<div class="piano-container">
<MidiPiano
:whiteModeOffset="scale.whiteModeOffset"
:baseMidiNote="scale.baseMidiNote"
:midiWhiteMode="midi.whiteMode"
:multichannel="midi.multichannelToEquave"
:keyColors="scale.colors"
:activeKeys="activeKeys"
/>
Expand Down

0 comments on commit efac5f6

Please sign in to comment.