cvancau/alapatch
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Make timbre layout responsive

Browse Source
This commit is contained in:
Aoife
2021-04-20 13:17:15 +02:00
parent 55e879929c
commit 35c60694ae
16 changed files with 111 additions and 121 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/manifest.json
-10
View File
@@ -6,16 +6,6 @@
"src": "favicon.ico", "src": "favicon.ico",
"sizes": "64x64 32x32 24x24 16x16", "sizes": "64x64 32x32 24x24 16x16",
"type": "image/x-icon" "type": "image/x-icon"
},
{
"src": "logo192.png",
"type": "image/png",
"sizes": "192x192"
},
{
"src": "logo512.png",
"type": "image/png",
"sizes": "512x512"
} }
], ],
"start_url": ".", "start_url": ".",
src/App.js
+1 -1
View File
@@ -8,7 +8,7 @@ function App() {
return false; return false;
}; };
return ( return (
<div className='bg-gray-200 grid grid-cols-6 grid-rows-1 gap-4 h-screen'> <div className="bg-gray-200 grid grid-cols-6 grid-rows-1 gap-4">
<Menu /> <Menu />
<Editor /> <Editor />
</div> </div>
src/features/editor/Timbre.js
+20 -22
View File
@@ -13,10 +13,10 @@ import { selectById } from './timbreSlice.js';
export default function Timbre(props) { export default function Timbre(props) {
const ids = useSelector((state) => selectById(state, props.id)); const ids = useSelector((state) => selectById(state, props.id));
return ( return (
<div className='h-screen grid grid-cols-8 grid-rows-3 gap-4 p-6 pr-10'> <div className="flex flex-wrap justify-between py-6 px-4">
<VCO <VCO
className='col-span-2' name="VCO 1"
name='VCO 1' className="flex-grow w-80"
id={ids.vco1} id={ids.vco1}
waveforms={[ waveforms={[
{ value: 'Saw' }, { value: 'Saw' },
@@ -28,7 +28,7 @@ export default function Timbre(props) {
{ value: 'Noise' }, { value: 'Noise' },
{ value: 'Audio In' }, { value: 'Audio In' },
]} ]}
dwgsOrModTypeName='DWGS' dwgsOrModTypeName="DWGS"
dwgsOrModType={[ dwgsOrModType={[
{ value: 'SynSine1' }, { value: 'SynSine1' },
{ value: 'SynSine2' }, { value: 'SynSine2' },
@@ -97,15 +97,15 @@ export default function Timbre(props) {
]} ]}
/> />
<VCO <VCO
className='col-span-2' name="VCO 2"
name='VCO 2' className="flex-grow w-80"
id={ids.vco2} id={ids.vco2}
waveforms={[ waveforms={[
{ value: 'Saw' }, { value: 'Saw' },
{ value: 'Square' }, { value: 'Square' },
{ value: 'Triangle' }, { value: 'Triangle' },
]} ]}
dwgsOrModTypeName='Mod Type' dwgsOrModTypeName="Mod Type"
dwgsOrModType={[ dwgsOrModType={[
{ value: 'Off' }, { value: 'Off' },
{ value: 'Ring' }, { value: 'Ring' },
@@ -113,23 +113,21 @@ export default function Timbre(props) {
{ value: 'Ring Sync' }, { value: 'Ring Sync' },
]} ]}
/> />
<Mixer className='col-span-1' name='Mixer' id={ids.mixer} /> <Mixer name="Mixer" id={ids.mixer} />
<Pitch className='col-span-3' name='Pitch' id={ids.pitch} /> <Pitch className="flex-grow w-3/6" name="Pitch" id={ids.pitch} />
<div className='col-span-8 grid grid-cols-9 grid-rows-1 gap-4'>
<div /> <Amp className="flex-grow w-80" name="Amp" id={ids.amp} />
<Amp className='col-span-2' name='Amp' id={ids.amp} /> <Filter className="flex-grow w-96" name="Filter" id={ids.filter} />
<Filter className='col-span-2' name='Filter' id={ids.filter} />
<EG <EG
className='col-span-3' className="flex-grow w-1/2"
name='EG 1 / 2' name="EG 1 / 2"
id1={ids.eg1} id1={ids.eg1}
id2={ids.eg2} id2={ids.eg2}
/> />
<div />
</div>
<LFO <LFO
className='col-span-2' className="flex-grow"
name='LFO 1' name="LFO 1"
id={ids.lfo1} id={ids.lfo1}
waveforms={[ waveforms={[
{ value: 'Saw' }, { value: 'Saw' },
@@ -139,8 +137,8 @@ export default function Timbre(props) {
]} ]}
/> />
<LFO <LFO
className='col-span-2' className="flex-grow"
name='LFO 2' name="LFO 2"
id={ids.lfo2} id={ids.lfo2}
waveforms={[ waveforms={[
{ value: 'Saw' }, { value: 'Saw' },
@@ -149,7 +147,7 @@ export default function Timbre(props) {
{ value: 'Sample & Hold' }, { value: 'Sample & Hold' },
]} ]}
/> />
<Patches className='col-span-4' name='Patches' id={ids.patches} /> <Patches className="flex-grow" name="Patches" id={ids.patches} />
</div> </div>
); );
} }
src/features/editor/card.js
+7 -6
View File
@@ -1,16 +1,17 @@
export default function Card(props = { className: 'col-span-2' }) { export default function Card(props) {
return ( return (
<div <div
className={ className={
props.className + props.className +
' flex flex-col justify-start border border-gray-300 rounded-md shadow-md bg-white' ' mb-4 mr-4 flex flex-col justify-start border border-gray-300 rounded-md shadow-md bg-white'
}> }
<header className='flex items-start justify-between py-2 px-4 border-b border-solid border-gray-200'> >
<h3 className='pointer-events-none text-xl font-semibold text-gray-900'> <header className="flex items-start justify-between py-2 px-4 border-b border-solid border-gray-200">
<h3 className="pointer-events-none text-xl font-semibold text-gray-900">
{props.header} {props.header}
</h3> </h3>
</header> </header>
<section className='flex-grow flex flex-col justify-evenly px-6'> <section className="flex-grow flex flex-col justify-evenly my-3 px-6">
{props.children} {props.children}
</section> </section>
</div> </div>
src/features/editor/index.js
+1 -1
View File
@@ -6,7 +6,7 @@ import { useSelector } from 'react-redux';
export default function Editor() { export default function Editor() {
const activeTab = useSelector((state) => state.parameters.activeTab); const activeTab = useSelector((state) => state.parameters.activeTab);
return ( return (
<div className="col-span-5 overflow-y-auto overscroll-contain"> <div className="h-screen col-span-5 overflow-y-auto overscroll-contain">
{activeTab === 'Timbre1' ? <Timbre id="timbre1" /> : null} {activeTab === 'Timbre1' ? <Timbre id="timbre1" /> : null}
{activeTab === 'Timbre2' ? <Timbre id="timbre2" /> : null} {activeTab === 'Timbre2' ? <Timbre id="timbre2" /> : null}
{activeTab === 'Vocoder' ? <Vocoder id="vocoder" /> : null} {activeTab === 'Vocoder' ? <Vocoder id="vocoder" /> : null}
src/features/editor/parameters/Amp.js
+12 -12
View File
@@ -10,8 +10,8 @@ export default function Amp(props) {
return ( return (
<Card className={props.className} header={props.name}> <Card className={props.className} header={props.name}>
<div className='flex flex-row '> <div className="flex flex-row ">
<div className='flex flex-col items-center justify-evenly w-1/2'> <div className="flex flex-col items-center justify-evenly w-1/2">
<h3>Amp Level</h3> <h3>Amp Level</h3>
<Knob <Knob
value={parameters.ampLevel} value={parameters.ampLevel}
@@ -26,7 +26,7 @@ export default function Amp(props) {
} }
/> />
</div> </div>
<div className='flex flex-col items-center justify-evenly w-1/2'> <div className="flex flex-col items-center justify-evenly w-1/2">
<h3>Pan Pot</h3> <h3>Pan Pot</h3>
<Knob <Knob
value={parameters.panpot} value={parameters.panpot}
@@ -43,8 +43,8 @@ export default function Amp(props) {
/> />
</div> </div>
</div> </div>
<div className='flex flex-row'> <div className="flex flex-row">
<div className='flex flex-col items-center justify-evenly w-1/2'> <div className="flex flex-col items-center justify-evenly w-1/2">
<h3>Keyboard Track</h3> <h3>Keyboard Track</h3>
<Knob <Knob
value={parameters.ampTrack} value={parameters.ampTrack}
@@ -60,7 +60,7 @@ export default function Amp(props) {
} }
/> />
</div> </div>
<div className='flex flex-col items-center justify-start w-1/2'> <div className="flex flex-col items-center justify-start w-1/2">
<h3>Distortion</h3> <h3>Distortion</h3>
<Checkbox <Checkbox
value={parameters.distortion} value={parameters.distortion}
@@ -85,8 +85,8 @@ export const VocoderAmp = (props) => {
return ( return (
<Card className={props.className} header={props.name}> <Card className={props.className} header={props.name}>
<div className='flex flex-row'> <div className="flex flex-row">
<div className='flex flex-col items-center w-1/2'> <div className="flex flex-col items-center w-1/2">
<h3>Amp Level</h3> <h3>Amp Level</h3>
<Knob <Knob
value={parameters.ampLevel} value={parameters.ampLevel}
@@ -101,7 +101,7 @@ export const VocoderAmp = (props) => {
} }
/> />
</div> </div>
<div className='flex flex-col items-center w-1/2'> <div className="flex flex-col items-center w-1/2">
<h3>Direct Level</h3> <h3>Direct Level</h3>
<Knob <Knob
value={parameters.directLevel} value={parameters.directLevel}
@@ -117,8 +117,8 @@ export const VocoderAmp = (props) => {
/> />
</div> </div>
</div> </div>
<div className='flex flex-row'> <div className="flex flex-row">
<div className='flex flex-col items-center w-1/2'> <div className="flex flex-col items-center w-1/2">
<h3>Keyboard Track</h3> <h3>Keyboard Track</h3>
<Knob <Knob
value={parameters.ampTrack} value={parameters.ampTrack}
@@ -134,7 +134,7 @@ export const VocoderAmp = (props) => {
} }
/> />
</div> </div>
<div className='flex flex-col items-center w-1/2'> <div className="flex flex-col items-center w-1/2">
<h3>Distortion</h3> <h3>Distortion</h3>
<Checkbox <Checkbox
value={parameters.distortion} value={parameters.distortion}
src/features/editor/parameters/Filter.js
+2 -2
View File
@@ -10,7 +10,7 @@ export default function Filter(props) {
return ( return (
<Card className={props.className} header={props.name}> <Card className={props.className} header={props.name}>
<div className="-mt-2 flex items-center justify-between"> <div className="flex items-center justify-between">
<h3>Filter Type</h3> <h3>Filter Type</h3>
<Select <Select
className="select w-4/6" className="select w-4/6"
@@ -31,7 +31,7 @@ export default function Filter(props) {
} }
/> />
</div> </div>
<div className="-mt-3 flex flex-row justify-evenly"> <div className="my-2 flex flex-row justify-evenly">
<div className="flex flex-col w-1/2"> <div className="flex flex-col w-1/2">
<div className="flex flex-col items-center"> <div className="flex flex-col items-center">
<h3 className="text-lg font-semibold text-gray-900">Cutoff</h3> <h3 className="text-lg font-semibold text-gray-900">Cutoff</h3>
src/features/editor/parameters/LFO.js
+10 -10
View File
@@ -10,10 +10,10 @@ export default function LFO(props) {
return ( return (
<Card className={props.className} header={props.name}> <Card className={props.className} header={props.name}>
<div className='flex items-center justify-between'> <div className="flex items-center justify-between">
<h3>LFO Waveform</h3> <h3>LFO Waveform</h3>
<Select <Select
className='select w-3/5' className="select w-3/5"
value={parameters.waveform} value={parameters.waveform}
list={props.waveforms} list={props.waveforms}
onChange={(value) => onChange={(value) =>
@@ -26,10 +26,10 @@ export default function LFO(props) {
} }
/> />
</div> </div>
<div className='flex items-center justify-between'> <div className="mt-2 flex items-center justify-between">
<h3>Key Sync</h3> <h3>Key Sync</h3>
<Select <Select
className='select w-3/5' className="select w-3/5"
value={parameters.keySync} value={parameters.keySync}
list={[{ value: 'Off' }, { value: 'Timbre' }, { value: 'Voice' }]} list={[{ value: 'Off' }, { value: 'Timbre' }, { value: 'Voice' }]}
onChange={(value) => onChange={(value) =>
@@ -42,10 +42,10 @@ export default function LFO(props) {
} }
/> />
</div> </div>
<div className='flex flex-row mb-4'> <div className="mt-2 flex flex-row mb-4">
<div className='flex flex-col w-1/2'> <div className="flex flex-col w-1/2">
<h3 className='self-center'>Tempo Sync</h3> <h3 className="self-center">Tempo Sync</h3>
<div className='flex flex-row items-center justify-evenly'> <div className="flex flex-row items-center justify-evenly">
<Checkbox <Checkbox
value={parameters.tempoSync} value={parameters.tempoSync}
onChange={(value) => onChange={(value) =>
@@ -58,7 +58,7 @@ export default function LFO(props) {
} }
/> />
<Select <Select
className='select mt-2 w-2/3' className="select mt-2 w-2/3"
value={parameters.syncNote} value={parameters.syncNote}
list={[ list={[
{ value: '1/1' }, { value: '1/1' },
@@ -88,7 +88,7 @@ export default function LFO(props) {
/> />
</div> </div>
</div> </div>
<div className='flex flex-col items-center w-1/2 space-y-1'> <div className="flex flex-col items-center w-1/2 space-y-2">
<h3>Frequency</h3> <h3>Frequency</h3>
<Knob <Knob
value={parameters.frequency} value={parameters.frequency}
src/features/editor/parameters/Mixer.js
+8 -8
View File
@@ -9,10 +9,10 @@ export default function Mixer(props) {
const dispatch = useDispatch(); const dispatch = useDispatch();
return ( return (
<Card header={props.name}> <Card className={props.className} header={props.name}>
<div className='-mt-3'> <div className="-mt-3">
<div className='flex flex-col items-center'> <div className="flex flex-col items-center">
<h3 className='text-lg font-semibold'>Volume 1</h3> <h3 className="text-lg font-semibold">Volume 1</h3>
<Knob <Knob
max={127} max={127}
value={parameters.vol1} value={parameters.vol1}
@@ -26,8 +26,8 @@ export default function Mixer(props) {
} }
/> />
</div> </div>
<div className='flex flex-col items-center'> <div className="flex flex-col items-center">
<h3 className='text-lg font-semibold'>Volume 2</h3> <h3 className="text-lg font-semibold">Volume 2</h3>
<Knob <Knob
max={127} max={127}
value={parameters.vol2} value={parameters.vol2}
@@ -41,8 +41,8 @@ export default function Mixer(props) {
} }
/> />
</div> </div>
<div className='flex flex-col items-center'> <div className="flex flex-col items-center">
<h3 className='text-lg font-semibold'>Volume 3</h3> <h3 className="text-lg font-semibold">Volume 3</h3>
<Knob <Knob
max={127} max={127}
value={parameters.vol3} value={parameters.vol3}
src/features/editor/parameters/Patches.js
+1 -1
View File
@@ -6,7 +6,7 @@ import { Select, Knob } from '../../utils/components';
const Patch = (props) => { const Patch = (props) => {
return ( return (
<div className="-mt-3 w-1/4"> <div className="mb-2 w-1/4">
<div className="flex flex-col items-center justify-between"> <div className="flex flex-col items-center justify-between">
<h3>Source</h3> <h3>Source</h3>
<Select <Select
src/features/editor/parameters/Pitch.js
+23 -23
View File
@@ -10,11 +10,11 @@ export default function Pitch(props) {
return ( return (
<Card className={props.className} header={props.name}> <Card className={props.className} header={props.name}>
<div className='flex flex-row justify-evenly'> <div className="mt-2 flex flex-row">
<div className='px-4 flex items-center justify-between w-1/2'> <div className="mx-4 flex items-center justify-between w-1/2">
<h3 className='text-lg font-semibold text-gray-900'>Voice Assign</h3> <h3 className="text-lg font-semibold text-gray-900">Voice Assign</h3>
<Select <Select
className='select w-2/4' className="select w-2/4"
value={parameters.voiceAssign} value={parameters.voiceAssign}
list={[{ value: 'Mono' }, { value: 'Poly' }, { value: 'Unison' }]} list={[{ value: 'Mono' }, { value: 'Poly' }, { value: 'Unison' }]}
onChange={(value) => onChange={(value) =>
@@ -27,10 +27,10 @@ export default function Pitch(props) {
} }
/> />
</div> </div>
<div className='px-4 flex items-center justify-between w-1/2'> <div className="mx-4 flex items-center justify-between w-1/2">
<h3 className='text-lg font-semibold text-gray-900'>Trigger Mode</h3> <h3 className="text-lg font-semibold text-gray-900">Trigger Mode</h3>
<Select <Select
className='select w-2/4' className="select w-2/4"
value={parameters.triggerMode} value={parameters.triggerMode}
list={[{ value: 'Single' }, { value: 'Multiple' }]} list={[{ value: 'Single' }, { value: 'Multiple' }]}
onChange={(value) => onChange={(value) =>
@@ -44,10 +44,10 @@ export default function Pitch(props) {
/> />
</div> </div>
</div> </div>
<div className='flex flex-row'> <div className="mt-2 mb-4 flex flex-row">
<section className='w-1/3'> <section className="w-1/3">
<div className='flex flex-col items-center'> <div className="flex flex-col items-center">
<h3 className='text-lg font-semibold text-gray-900'>Transpose</h3> <h3 className="text-lg font-semibold text-gray-900">Transpose</h3>
<Knob <Knob
value={parameters.transpose} value={parameters.transpose}
dual={true} dual={true}
@@ -62,8 +62,8 @@ export default function Pitch(props) {
} }
/> />
</div> </div>
<div className='flex flex-col items-center'> <div className="flex flex-col items-center">
<h3 className='text-lg font-semibold text-gray-900'>Tune</h3> <h3 className="text-lg font-semibold text-gray-900">Tune</h3>
<Knob <Knob
value={parameters.tune} value={parameters.tune}
dual={true} dual={true}
@@ -79,9 +79,9 @@ export default function Pitch(props) {
/> />
</div> </div>
</section> </section>
<section className='w-1/3'> <section className="w-1/3">
<div className='flex flex-col items-center'> <div className="flex flex-col items-center">
<h3 className='text-lg font-semibold text-gray-900'> <h3 className="text-lg font-semibold text-gray-900">
Unison Detune Unison Detune
</h3> </h3>
<Knob <Knob
@@ -97,8 +97,8 @@ export default function Pitch(props) {
} }
/> />
</div> </div>
<div className='flex flex-col items-center'> <div className="flex flex-col items-center">
<h3 className='text-lg font-semibold text-gray-900'>Portamento</h3> <h3 className="text-lg font-semibold text-gray-900">Portamento</h3>
<Knob <Knob
value={parameters.portamento} value={parameters.portamento}
max={127} max={127}
@@ -113,9 +113,9 @@ export default function Pitch(props) {
/> />
</div> </div>
</section> </section>
<section className='w-1/3'> <section className="w-1/3">
<div className='flex flex-col items-center'> <div className="flex flex-col items-center">
<h3 className='text-lg font-semibold text-gray-900'>Bend Range</h3> <h3 className="text-lg font-semibold text-gray-900">Bend Range</h3>
<Knob <Knob
value={parameters.bendRange} value={parameters.bendRange}
dual={true} dual={true}
@@ -130,8 +130,8 @@ export default function Pitch(props) {
} }
/> />
</div> </div>
<div className='flex flex-col items-center'> <div className="flex flex-col items-center">
<h3 className='text-lg font-semibold text-gray-900'> <h3 className="text-lg font-semibold text-gray-900">
Vibrato Intensity Vibrato Intensity
</h3> </h3>
<Knob <Knob
src/features/editor/parameters/VCO.js
+7 -5
View File
@@ -9,8 +9,8 @@ export default function VCO(props) {
const dispatch = useDispatch(); const dispatch = useDispatch();
return ( return (
<Card className="col-span-2" header={props.name}> <Card className={props.className} header={props.name}>
<div className="-mt-2 flex items-center justify-between"> <div className="flex items-center justify-between">
<h3 className="text-lg font-semibold text-gray-900">Waveform</h3> <h3 className="text-lg font-semibold text-gray-900">Waveform</h3>
<Select <Select
className="select w-4/6" className="select w-4/6"
@@ -26,7 +26,7 @@ export default function VCO(props) {
} }
/> />
</div> </div>
<div className="-mt-4 flex items-center justify-between"> <div className="flex items-center justify-between">
<h3 className="text-lg font-semibold text-gray-900">{`${props.dwgsOrModTypeName}`}</h3> <h3 className="text-lg font-semibold text-gray-900">{`${props.dwgsOrModTypeName}`}</h3>
<Select <Select
className="select w-4/6" className="select w-4/6"
@@ -42,9 +42,11 @@ export default function VCO(props) {
} }
/> />
</div> </div>
<div className="mb-2 flex flex-row"> <div className="my-2 flex flex-row">
<div className="flex flex-col items-center w-1/2"> <div className="flex flex-col items-center w-1/2">
<h3 className="text-lg font-semibold text-gray-900">Waveform Mod</h3> <h3 className="ml-1 text-lg font-semibold text-gray-900">
Waveform Mod
</h3>
<Knob <Knob
maxValue={127} maxValue={127}
value={parameters.waveMod} value={parameters.waveMod}
src/features/io/convert/loadStore.js
-1
View File
@@ -10,7 +10,6 @@ export default function build_store(patch, timbre1, timbre2, vocoder) {
} }
function prepare_patch(object) { function prepare_patch(object) {
console.log(object.voice_mode);
return { return {
unusedPatch: { unusedPatch: {
id: 'unusedPatch', id: 'unusedPatch',
src/features/io/convert/parse.js
-1
View File
@@ -67,7 +67,6 @@ function build_patch(patch) {
} }
function build_timbre(num, timbre) { function build_timbre(num, timbre) {
console.log(timbre[0]);
return { return {
[`t${num}_midi_channel`]: timbre[0], [`t${num}_midi_channel`]: timbre[0],
[`t${num}_assign_mode`]: getBits(timbre[1], 6, 7), [`t${num}_assign_mode`]: getBits(timbre[1], 6, 7),
src/features/io/convert/serialise.js
+14 -12
View File
@@ -1,20 +1,24 @@
import { fromBitArray, buildByte } from '../utils/functions'; import { fromBitArray, buildByte } from '../utils/functions';
export default function serialise(patch) { export default function serialise(patch) {
const data = Array.from(serialise_patch(patch[0])); let data = serialise_patch(patch[0]);
switch (patch[0].voice_mode) { switch (patch[0].voice_mode) {
default: default:
case 'Single': case 0:
data.concat(serialise_timbre(1, patch[1])); data = data.concat(serialise_timbre(1, patch[1]));
break; break;
case 'Multiple': case 2:
data.concat(serialise_timbre(1, patch[1]), serialise_timbre(2, patch[2])); data = data.concat(
serialise_timbre(1, patch[1]),
serialise_timbre(2, patch[2])
);
break; break;
case 'Vocoder': case 3:
data.concat(serialise_vocoder(patch[1])); data = data.concat(serialise_vocoder(patch[1]));
break; break;
} }
return data; return data;
//console.log(data);
} }
function serialise_patch(patch) { function serialise_patch(patch) {
@@ -72,7 +76,7 @@ function serialise_timbre(num, timbre) {
{ value: timbre[`t${num}_eg_2_reset`], start: 5 }, { value: timbre[`t${num}_eg_2_reset`], start: 5 },
{ value: timbre[`t${num}_eg_1_reset`], start: 4 }, { value: timbre[`t${num}_eg_1_reset`], start: 4 },
{ value: timbre[`t${num}_trigger_mode`], start: 3 }, { value: timbre[`t${num}_trigger_mode`], start: 3 },
{ value: timbre[`t${num}_key_priority`], start: 0 } { value: timbre[`t${num}_key_priority`], start: 1 }
), ),
timbre[`t${num}_unison_detune`], timbre[`t${num}_unison_detune`],
timbre[`t${num}_tune`], timbre[`t${num}_tune`],
@@ -155,8 +159,7 @@ function serialise_timbre(num, timbre) {
), ),
timbre[`t${num}_patch_4_intensity`], timbre[`t${num}_patch_4_intensity`],
]; ];
array.concat(Array(55).fill(0)); return array.concat(Array(55).fill(0));
return array;
} }
function serialise_vocoder(vocoder) { function serialise_vocoder(vocoder) {
@@ -242,6 +245,5 @@ function serialise_vocoder(vocoder) {
vocoder.v_pan_7, vocoder.v_pan_7,
vocoder.v_pan_8, vocoder.v_pan_8,
]; ];
array.concat(Array(174).fill(0)); return array.concat(Array(174).fill(0));
return array;
} }
src/features/menu/index.js
+1 -2
View File
@@ -15,7 +15,6 @@ export default function Menu() {
const fileRef = useRef(null); const fileRef = useRef(null);
const state = useSelector((state) => selectEntities(state)); const state = useSelector((state) => selectEntities(state));
const activeTab = useSelector((state) => state.parameters.activeTab); const activeTab = useSelector((state) => state.parameters.activeTab);
console.log(activeTab);
const dispatch = useDispatch(); const dispatch = useDispatch();
const reader = new FileReader(); const reader = new FileReader();
const loadFile = (f) => { const loadFile = (f) => {
@@ -41,7 +40,7 @@ export default function Menu() {
}, [state.patch.mode, dispatch]); }, [state.patch.mode, dispatch]);
return ( return (
<div className="col-span-1 flex flex-col justify-around border-solid border-r border-gray-300 bg-white px-4"> <div className="h-screen col-span-1 flex flex-col justify-around border-solid border-r border-gray-300 bg-white px-4">
<div className="menu-patch-container"> <div className="menu-patch-container">
<div className="patch-name"> <div className="patch-name">
<input <input