add Vocoder Components
This commit is contained in:
[poww10s]
@@ -67,3 +67,67 @@ export default function Amp(props) {
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export const VocoderAmp = (props) => {
|
||||
const parameters = useSelector((state) => selectById(state, props.id));
|
||||
const dispatch = useDispatch();
|
||||
|
||||
return (
|
||||
<div className={styles.container}>
|
||||
Amp Level
|
||||
<Slider
|
||||
parameter={parameters.ampLevel}
|
||||
min={0}
|
||||
max={127}
|
||||
onChange={(value) =>
|
||||
dispatch(
|
||||
parameterUpdated({
|
||||
id: props.id,
|
||||
changes: { ampLevel: value },
|
||||
})
|
||||
)
|
||||
}
|
||||
/>
|
||||
Direct Level
|
||||
<Slider
|
||||
parameter={parameters.directLevel}
|
||||
min={0}
|
||||
max={127}
|
||||
onChange={(value) =>
|
||||
dispatch(
|
||||
parameterUpdated({
|
||||
id: props.id,
|
||||
changes: { directLevel: value },
|
||||
})
|
||||
)
|
||||
}
|
||||
/>
|
||||
Amp Keyboard Tracking
|
||||
<Slider
|
||||
parameter={parameters.ampTrack}
|
||||
min={-63}
|
||||
max={63}
|
||||
onChange={(value) =>
|
||||
dispatch(
|
||||
parameterUpdated({
|
||||
id: props.id,
|
||||
changes: { ampTrack: value },
|
||||
})
|
||||
)
|
||||
}
|
||||
/>
|
||||
Distortion
|
||||
<Checkbox
|
||||
parameter={parameters.distortion}
|
||||
onChange={(value) =>
|
||||
dispatch(
|
||||
parameterUpdated({
|
||||
id: props.id,
|
||||
changes: { distortion: value },
|
||||
})
|
||||
)
|
||||
}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
@@ -87,3 +87,98 @@ export default function Filter(props) {
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export const VocoderFilter = (props) => {
|
||||
const parameters = useSelector((state) => selectById(state, props.id));
|
||||
const dispatch = useDispatch();
|
||||
return (
|
||||
<div className={styles.container}>
|
||||
Cutoff
|
||||
<Slider
|
||||
parameter={parameters.cutoff}
|
||||
min={0}
|
||||
max={127}
|
||||
onChange={(value) =>
|
||||
dispatch(
|
||||
parameterUpdated({
|
||||
id: props.id,
|
||||
changes: { cutoff: value },
|
||||
})
|
||||
)
|
||||
}
|
||||
/>
|
||||
Resonance
|
||||
<Slider
|
||||
parameter={parameters.resonance}
|
||||
min={0}
|
||||
max={127}
|
||||
onChange={(value) =>
|
||||
dispatch(
|
||||
parameterUpdated({
|
||||
id: props.id,
|
||||
changes: { resonance: value },
|
||||
})
|
||||
)
|
||||
}
|
||||
/>
|
||||
EF Sense
|
||||
<Slider
|
||||
parameter={parameters.efSense}
|
||||
min={0}
|
||||
max={127}
|
||||
onChange={(value) =>
|
||||
dispatch(
|
||||
parameterUpdated({
|
||||
id: props.id,
|
||||
changes: { efSense: value },
|
||||
})
|
||||
)
|
||||
}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export const FCMod = (props) => {
|
||||
const parameters = useSelector((state) => selectById(state, props.id));
|
||||
const dispatch = useDispatch();
|
||||
return (
|
||||
<div className={styles.container}>
|
||||
Source
|
||||
<SelectList
|
||||
value={parameters.source}
|
||||
list={[
|
||||
{ value: 'Amp EG' },
|
||||
{ value: 'LFO 1' },
|
||||
{ value: 'LFO 2' },
|
||||
{ value: 'Velocity' },
|
||||
{ value: 'Keyboard Track' },
|
||||
{ value: 'Pitch Bend' },
|
||||
{ value: 'Mod Wheel' },
|
||||
]}
|
||||
onChange={(value) =>
|
||||
dispatch(
|
||||
parameterUpdated({
|
||||
id: props.id,
|
||||
changes: { source: value },
|
||||
})
|
||||
)
|
||||
}
|
||||
/>
|
||||
Intensity
|
||||
<Slider
|
||||
parameter={parameters.intensity}
|
||||
min={0}
|
||||
max={127}
|
||||
onChange={(value) =>
|
||||
dispatch(
|
||||
parameterUpdated({
|
||||
id: props.id,
|
||||
changes: { intensity: value },
|
||||
})
|
||||
)
|
||||
}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
import React from 'react';
|
||||
import { useSelector, useDispatch } from 'react-redux';
|
||||
import { selectById, parameterUpdated } from './parameterSlice.js';
|
||||
import { Slider, SelectList } from '../../helpers/Helpers';
|
||||
import { Slider, SelectList, Checkbox } from '../../helpers/Helpers';
|
||||
import styles from './Parameters.module.css';
|
||||
|
||||
export default function VCO(props) {
|
||||
@@ -39,7 +39,7 @@ export default function VCO(props) {
|
||||
Waveform Mod
|
||||
<Slider
|
||||
min={0}
|
||||
max={100}
|
||||
max={127}
|
||||
parameter={parameters.waveMod}
|
||||
onChange={(value) =>
|
||||
dispatch(
|
||||
@@ -53,7 +53,7 @@ export default function VCO(props) {
|
||||
LFO Mod
|
||||
<Slider
|
||||
min={0}
|
||||
max={100}
|
||||
max={127}
|
||||
parameter={parameters.lfoMod}
|
||||
onChange={(value) =>
|
||||
dispatch(
|
||||
@@ -67,3 +67,67 @@ export default function VCO(props) {
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export const AudioIn = (props) => {
|
||||
const parameters = useSelector((state) => selectById(state, props.id));
|
||||
const dispatch = useDispatch();
|
||||
|
||||
return (
|
||||
<div className={styles.container}>
|
||||
Gate
|
||||
<Slider
|
||||
min={0}
|
||||
max={127}
|
||||
parameter={parameters.gate}
|
||||
onChange={(value) =>
|
||||
dispatch(
|
||||
parameterUpdated({
|
||||
id: props.id,
|
||||
changes: { gate: value },
|
||||
})
|
||||
)
|
||||
}
|
||||
/>
|
||||
Threshold
|
||||
<Slider
|
||||
min={0}
|
||||
max={127}
|
||||
parameter={parameters.threshold}
|
||||
onChange={(value) =>
|
||||
dispatch(
|
||||
parameterUpdated({
|
||||
id: props.id,
|
||||
changes: { threshold: value },
|
||||
})
|
||||
)
|
||||
}
|
||||
/>
|
||||
HPF Level
|
||||
<Slider
|
||||
min={0}
|
||||
max={127}
|
||||
parameter={parameters.hpfLevel}
|
||||
onChange={(value) =>
|
||||
dispatch(
|
||||
parameterUpdated({
|
||||
id: props.id,
|
||||
changes: { hpfLevel: value },
|
||||
})
|
||||
)
|
||||
}
|
||||
/>
|
||||
HPF Gate
|
||||
<Checkbox
|
||||
parameter={parameters.hpfGate}
|
||||
onChange={(value) =>
|
||||
dispatch(
|
||||
parameterUpdated({
|
||||
id: props.id,
|
||||
changes: { hpfGate: value },
|
||||
})
|
||||
)
|
||||
}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
@@ -28,6 +28,18 @@ const parametersSlice = createSlice({
|
||||
'lfo3',
|
||||
'lfo4',
|
||||
'patches2',
|
||||
'vco5',
|
||||
'audioIn',
|
||||
'mixer3',
|
||||
'pitch3',
|
||||
'filter3',
|
||||
'fcMod',
|
||||
'eg4',
|
||||
'amp3',
|
||||
'lfo5',
|
||||
'lfo6',
|
||||
'levels',
|
||||
'pans',
|
||||
],
|
||||
entities: {
|
||||
'vco1': {
|
||||
@@ -39,24 +51,38 @@ const parametersSlice = createSlice({
|
||||
},
|
||||
'vco2': {
|
||||
id: 'vco2',
|
||||
waveform: 'Square',
|
||||
waveform: 'Saw',
|
||||
dwgsOrModType: 'Off',
|
||||
waveMod: 0,
|
||||
lfoMod: 0,
|
||||
},
|
||||
'vco3': {
|
||||
id: 'vco3',
|
||||
waveform: 'Sine',
|
||||
waveform: 'Saw',
|
||||
dwgsOrModType: 'SynWave1',
|
||||
waveMod: 100,
|
||||
waveMod: 0,
|
||||
lfoMod: 0,
|
||||
},
|
||||
'vco4': {
|
||||
id: 'vco4',
|
||||
waveform: 'Triangle',
|
||||
waveform: 'Saw',
|
||||
dwgsOrModType: 'Off',
|
||||
waveMod: 0,
|
||||
lfoMod: 100,
|
||||
lfoMod: 0,
|
||||
},
|
||||
'vco5': {
|
||||
id: 'vco5',
|
||||
waveform: 'Saw',
|
||||
dwgsOrModType: 'SynWave1',
|
||||
waveMod: 0,
|
||||
lfoMod: 0,
|
||||
},
|
||||
'audioIn': {
|
||||
id: 'audioIn',
|
||||
gate: 0,
|
||||
threshold: 0,
|
||||
hpfLevel: 0,
|
||||
hpfGate: false,
|
||||
},
|
||||
'mixer1': {
|
||||
id: 'mixer1',
|
||||
@@ -70,6 +96,12 @@ const parametersSlice = createSlice({
|
||||
vol2: 0,
|
||||
vol3: 0,
|
||||
},
|
||||
'mixer3': {
|
||||
id: 'mixer3',
|
||||
vol1: 127,
|
||||
vol2: 0,
|
||||
vol3: 0,
|
||||
},
|
||||
'pitch1': {
|
||||
id: 'pitch1',
|
||||
voiceAssign: 'Mono',
|
||||
@@ -92,6 +124,17 @@ const parametersSlice = createSlice({
|
||||
bendRange: 0,
|
||||
vibratoIntensity: 0,
|
||||
},
|
||||
'pitch3': {
|
||||
id: 'pitch3',
|
||||
voiceAssign: 'Mono',
|
||||
triggerMode: 'Single',
|
||||
transpose: 0,
|
||||
tune: 0,
|
||||
unisonDetune: 0,
|
||||
portamento: 0,
|
||||
bendRange: 0,
|
||||
vibratoIntensity: 0,
|
||||
},
|
||||
'filter1': {
|
||||
id: 'filter1',
|
||||
filterType: '-24db Low Pass',
|
||||
@@ -108,6 +151,17 @@ const parametersSlice = createSlice({
|
||||
egIntensity: 0,
|
||||
keyboardTrack: 0,
|
||||
},
|
||||
'filter3': {
|
||||
id: 'filter3',
|
||||
cutoff: 0,
|
||||
resonance: 0,
|
||||
efSense: 0,
|
||||
},
|
||||
'fcMod': {
|
||||
id: 'fcMod',
|
||||
source: 'Amp EG',
|
||||
intensity: 0,
|
||||
},
|
||||
'eg1': {
|
||||
id: 'eg1',
|
||||
attack: 0,
|
||||
@@ -129,7 +183,7 @@ const parametersSlice = createSlice({
|
||||
decay: 0,
|
||||
sustain: 127,
|
||||
release: 0,
|
||||
egReset: true,
|
||||
egReset: false,
|
||||
},
|
||||
'eg3': {
|
||||
id: 'eg3',
|
||||
@@ -152,7 +206,22 @@ const parametersSlice = createSlice({
|
||||
decay: 0,
|
||||
sustain: 127,
|
||||
release: 0,
|
||||
egReset: true,
|
||||
egReset: false,
|
||||
},
|
||||
'eg5': {
|
||||
id: 'eg5',
|
||||
attack: 0,
|
||||
decay: 0,
|
||||
sustain: 127,
|
||||
release: 0,
|
||||
egReset: false,
|
||||
},
|
||||
'amp3': {
|
||||
id: 'amp3',
|
||||
ampLevel: 127,
|
||||
directLevel: 0,
|
||||
ampTrack: 0,
|
||||
distortion: false,
|
||||
},
|
||||
'lfo1': {
|
||||
id: 'lfo1',
|
||||
@@ -182,6 +251,20 @@ const parametersSlice = createSlice({
|
||||
tempoSync: false,
|
||||
frequency: 0,
|
||||
},
|
||||
'lfo5': {
|
||||
id: 'lfo5',
|
||||
waveform: 'Saw',
|
||||
keySync: 'Off',
|
||||
tempoSync: false,
|
||||
frequency: 0,
|
||||
},
|
||||
'lfo6': {
|
||||
id: 'lfo6',
|
||||
waveform: 'Saw',
|
||||
keySync: 'Off',
|
||||
tempoSync: false,
|
||||
frequency: 0,
|
||||
},
|
||||
},
|
||||
}),
|
||||
reducers: {
|
||||
|
||||
Reference in New Issue
Block a user