diff --git a/src/App.js b/src/App.js
index 4269812..f3a334a 100644
--- a/src/App.js
+++ b/src/App.js
@@ -1,13 +1,15 @@
import React from 'react';
-import { Timbre } from './features/timbre/Timbre';
+import Timbre from './features/timbre/Timbre';
+import Vocoder from './features/timbre/Vocoder';
import './App.css';
function App() {
return (
);
diff --git a/src/features/helpers/index.css b/src/features/helpers/rcSelectTheme.css
similarity index 100%
rename from src/features/helpers/index.css
rename to src/features/helpers/rcSelectTheme.css
diff --git a/src/features/timbre/Timbre.js b/src/features/timbre/Timbre.js
index 438f73a..bc8a2f6 100644
--- a/src/features/timbre/Timbre.js
+++ b/src/features/timbre/Timbre.js
@@ -20,7 +20,7 @@ const lineBreak = {
width: '100%',
};
-export function Timbre(props) {
+export default function Timbre(props) {
const ids = useSelector((state) => selectById(state, props.id));
return (
diff --git a/src/features/timbre/Vocoder.js b/src/features/timbre/Vocoder.js
index e87a71e..ee3f82b 100644
--- a/src/features/timbre/Vocoder.js
+++ b/src/features/timbre/Vocoder.js
@@ -1,8 +1,119 @@
import React from 'react';
import { useSelector } from 'react-redux';
import { selectById } from './timbreSlice';
+import VCO, { AudioIn } from './parameters/VCO';
+import Mixer from './parameters/Mixer';
+import Pitch from './parameters/Pitch';
+import EG from './parameters/EG';
+import LFO from './parameters/LFO';
+import { VocoderFilter, FCMod } from './parameters/Filter';
+import { VocoderAmp } from './parameters/Amp';
+
+const timbreStyle = {
+ display: 'flex',
+ flexWrap: 'wrap',
+ flexDirection: 'row',
+ justifyContent: 'center',
+};
+
+const lineBreak = {
+ width: '100%',
+};
export default function Vocoder(props) {
const ids = useSelector((state) => selectById(state, props.id));
- return
;
+ return (
+
+ );
}
diff --git a/src/features/timbre/parameters/Amp.js b/src/features/timbre/parameters/Amp.js
index d5cc10f..d51b5dd 100644
--- a/src/features/timbre/parameters/Amp.js
+++ b/src/features/timbre/parameters/Amp.js
@@ -67,3 +67,67 @@ export default function Amp(props) {
);
}
+
+export const VocoderAmp = (props) => {
+ const parameters = useSelector((state) => selectById(state, props.id));
+ const dispatch = useDispatch();
+
+ return (
+
+ Amp Level
+
+ dispatch(
+ parameterUpdated({
+ id: props.id,
+ changes: { ampLevel: value },
+ })
+ )
+ }
+ />
+ Direct Level
+
+ dispatch(
+ parameterUpdated({
+ id: props.id,
+ changes: { directLevel: value },
+ })
+ )
+ }
+ />
+ Amp Keyboard Tracking
+
+ dispatch(
+ parameterUpdated({
+ id: props.id,
+ changes: { ampTrack: value },
+ })
+ )
+ }
+ />
+ Distortion
+
+ dispatch(
+ parameterUpdated({
+ id: props.id,
+ changes: { distortion: value },
+ })
+ )
+ }
+ />
+
+ );
+};
diff --git a/src/features/timbre/parameters/Filter.js b/src/features/timbre/parameters/Filter.js
index 12e7283..993f87e 100644
--- a/src/features/timbre/parameters/Filter.js
+++ b/src/features/timbre/parameters/Filter.js
@@ -87,3 +87,98 @@ export default function Filter(props) {
);
}
+
+export const VocoderFilter = (props) => {
+ const parameters = useSelector((state) => selectById(state, props.id));
+ const dispatch = useDispatch();
+ return (
+
+ Cutoff
+
+ dispatch(
+ parameterUpdated({
+ id: props.id,
+ changes: { cutoff: value },
+ })
+ )
+ }
+ />
+ Resonance
+
+ dispatch(
+ parameterUpdated({
+ id: props.id,
+ changes: { resonance: value },
+ })
+ )
+ }
+ />
+ EF Sense
+
+ dispatch(
+ parameterUpdated({
+ id: props.id,
+ changes: { efSense: value },
+ })
+ )
+ }
+ />
+
+ );
+};
+
+export const FCMod = (props) => {
+ const parameters = useSelector((state) => selectById(state, props.id));
+ const dispatch = useDispatch();
+ return (
+
+ Source
+
+ dispatch(
+ parameterUpdated({
+ id: props.id,
+ changes: { source: value },
+ })
+ )
+ }
+ />
+ Intensity
+
+ dispatch(
+ parameterUpdated({
+ id: props.id,
+ changes: { intensity: value },
+ })
+ )
+ }
+ />
+
+ );
+};
diff --git a/src/features/timbre/parameters/VCO.js b/src/features/timbre/parameters/VCO.js
index 3f1e67e..8906497 100644
--- a/src/features/timbre/parameters/VCO.js
+++ b/src/features/timbre/parameters/VCO.js
@@ -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
dispatch(
@@ -53,7 +53,7 @@ export default function VCO(props) {
LFO Mod
dispatch(
@@ -67,3 +67,67 @@ export default function VCO(props) {
);
}
+
+export const AudioIn = (props) => {
+ const parameters = useSelector((state) => selectById(state, props.id));
+ const dispatch = useDispatch();
+
+ return (
+
+ Gate
+
+ dispatch(
+ parameterUpdated({
+ id: props.id,
+ changes: { gate: value },
+ })
+ )
+ }
+ />
+ Threshold
+
+ dispatch(
+ parameterUpdated({
+ id: props.id,
+ changes: { threshold: value },
+ })
+ )
+ }
+ />
+ HPF Level
+
+ dispatch(
+ parameterUpdated({
+ id: props.id,
+ changes: { hpfLevel: value },
+ })
+ )
+ }
+ />
+ HPF Gate
+
+ dispatch(
+ parameterUpdated({
+ id: props.id,
+ changes: { hpfGate: value },
+ })
+ )
+ }
+ />
+
+ );
+};
diff --git a/src/features/timbre/parameters/parameterSlice.js b/src/features/timbre/parameters/parameterSlice.js
index 8d5ff9b..ee4a69a 100644
--- a/src/features/timbre/parameters/parameterSlice.js
+++ b/src/features/timbre/parameters/parameterSlice.js
@@ -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: {
diff --git a/src/features/timbre/timbreSlice.js b/src/features/timbre/timbreSlice.js
index 3e0dd1a..5e33a51 100644
--- a/src/features/timbre/timbreSlice.js
+++ b/src/features/timbre/timbreSlice.js
@@ -35,6 +35,19 @@ const timbreSlice = createSlice({
lfo2: 'lfo4',
patches: 'patches2',
},
+ 'vocoder': {
+ id: 'vocoder',
+ vco: 'vco5',
+ audioIn: 'audioIn',
+ mixer: 'mixer3',
+ pitch: 'pitch3',
+ filter: 'filter3',
+ fcMod: 'fcMod',
+ eg: 'eg5',
+ amp: 'amp3',
+ lfo1: 'lfo5',
+ lfo2: 'lfo6',
+ },
},
}),
reducers: {