UI changes

This commit is contained in:
trian-gles 2024-08-08 15:31:57 +02:00 committed by Kieran McAuliffe
parent 37a65058bc
commit 45e168ba11
3 changed files with 27 additions and 7 deletions

View File

@ -168,7 +168,7 @@
"numoutlets" : 1, "numoutlets" : 1,
"outlettype" : [ "" ], "outlettype" : [ "" ],
"patching_rect" : [ 586.0, 713.0, 89.0, 36.0 ], "patching_rect" : [ 586.0, 713.0, 89.0, 36.0 ],
"text" : "harmoniclarity 40.156651" "text" : "harmoniclarity 14.213599"
} }
} }
@ -181,7 +181,7 @@
"numoutlets" : 1, "numoutlets" : 1,
"outlettype" : [ "" ], "outlettype" : [ "" ],
"patching_rect" : [ 491.0, 713.0, 85.0, 36.0 ], "patching_rect" : [ 491.0, 713.0, 85.0, 36.0 ],
"text" : "event_length 29.843349" "text" : "event_length 55.786401"
} }
} }
@ -194,7 +194,7 @@
"numoutlets" : 1, "numoutlets" : 1,
"outlettype" : [ "" ], "outlettype" : [ "" ],
"patching_rect" : [ 385.0, 715.0, 84.0, 36.0 ], "patching_rect" : [ 385.0, 715.0, 84.0, 36.0 ],
"text" : "metriclarity 0.5" "text" : "metriclarity 79.192955"
} }
} }

View File

@ -48,6 +48,7 @@ function MasterLfoHandler(){
const [userDefinedWave, setUserDefinedWave] = React.useState(Array(50).fill(0)); const [userDefinedWave, setUserDefinedWave] = React.useState(Array(50).fill(0));
const [modVisibleArr, setModVisibleArr] = React.useState(initVisArr); const [modVisibleArr, setModVisibleArr] = React.useState(initVisArr);
const [modTypeArr, setModTypeArr] = React.useState(Array(MAXLFOS).fill('LFO'));
const [modInstanceNumArr, setModInstanceNumArr] = React.useState(Array(MAXLFOS).fill('1')); const [modInstanceNumArr, setModInstanceNumArr] = React.useState(Array(MAXLFOS).fill('1'));
const [modCenterVals, setModCenterVals] = React.useState({'1':{}, '2':{}, '3':{}, '4':{}}); const [modCenterVals, setModCenterVals] = React.useState({'1':{}, '2':{}, '3':{}, '4':{}});
@ -55,6 +56,7 @@ function MasterLfoHandler(){
const [ticks, setTicks] = React.useState(0); const [ticks, setTicks] = React.useState(0);
const [beatsInMeasure, setBeatsInMeasure] = React.useState(4); const [beatsInMeasure, setBeatsInMeasure] = React.useState(4);
const [noiseTypeArr, setNoiseTypeArr] = React.useState(Array(MAXLFOS).fill('Sine Int.'));
const [shapeArr, setShapeArr] = React.useState(Array(MAXLFOS).fill('Sine')); const [shapeArr, setShapeArr] = React.useState(Array(MAXLFOS).fill('Sine'));
const [djParamArr, setDjParamArr] = React.useState(Array(MAXLFOS).fill('NONE')); const [djParamArr, setDjParamArr] = React.useState(Array(MAXLFOS).fill('NONE'));
@ -66,8 +68,8 @@ function MasterLfoHandler(){
const [phaseArr, setPhaseArr] = React.useState(Array(MAXLFOS).fill('0')); const [phaseArr, setPhaseArr] = React.useState(Array(MAXLFOS).fill('0'));
const allModArrays = [modVisibleArr, modInstanceNumArr, shapeArr, djParamArr, freqArr, minArr, maxArr, phaseArr]; const allModArrays = [modVisibleArr, modTypeArr, modInstanceNumArr, shapeArr, noiseTypeArr, djParamArr, freqArr, minArr, maxArr, phaseArr];
const allModSetters = [setModVisibleArr, setModInstanceNumArr, setShapeArr, setDjParamArr, setFreqArr, setMinArr, setMaxArr, setPhaseArr]; const allModSetters = [setModVisibleArr, setModTypeArr, setModInstanceNumArr, setShapeArr, setNoiseTypeArr, setDjParamArr, setFreqArr, setMinArr, setMaxArr, setPhaseArr];
const modBlankVals = [true, '1', SHAPETYPES[0], MODPARAMOPTIONS[0], '1hz', '0', '1', '0']; const modBlankVals = [true, '1', SHAPETYPES[0], MODPARAMOPTIONS[0], '1hz', '0', '1', '0'];
@ -259,8 +261,14 @@ function MasterLfoHandler(){
e(LfoRow, { e(LfoRow, {
instanceNum : modInstanceNumArr[i], instanceNum : modInstanceNumArr[i],
setInstanceNum: CreateParamChanger(modInstanceNumArr, setModInstanceNumArr, i), setInstanceNum: CreateParamChanger(modInstanceNumArr, setModInstanceNumArr, i),
type: modTypeArr[i],
setType: CreateParamChanger(modTypeArr, setModTypeArr, i),
shape: shapeArr[i], shape: shapeArr[i],
setShape: CreateParamChanger(shapeArr, setShapeArr, i), setShape: CreateParamChanger(shapeArr, setShapeArr, i),
noise: noiseTypeArr[i],
setNoise: CreateParamChanger(noiseTypeArr, setNoiseTypeArr, i),
djParam: djParamArr[i], djParam: djParamArr[i],
setDjParam: CreateParamChanger(djParamArr, setDjParamArr, i), setDjParam: CreateParamChanger(djParamArr, setDjParamArr, i),
centerVals: modCenterVals, centerVals: modCenterVals,

View File

@ -2,7 +2,10 @@
// MODULATORS // MODULATORS
///////////////////////// /////////////////////////
var TYPEOPTIONS = ["LFO", "Noise"];
var SHAPETYPES = ["Sine", "SawUp", "SawDown", "Tri", "Square", "Custom"]; var SHAPETYPES = ["Sine", "SawUp", "SawDown", "Tri", "Square", "Custom"];
var NOISETYPES = ["Sine Int."]
var INSTANCEOPTIONS = ["1", "2", "3", "4"]; var INSTANCEOPTIONS = ["1", "2", "3", "4"];
@ -28,10 +31,19 @@ function LfoRow(props){
if (!center) if (!center)
center = 0; center = 0;
let typeOption = null;
if (props.type == "LFO"){
typeOption = ListItem(DropDown({onChange: props.setShape, value:props.shape, options: SHAPETYPES}));
}
else if (props.type == "Noise"){
typeOption = ListItem(DropDown({onChange: props.setNoise, value:props.noise, options: NOISETYPES}));
}
let content = e('ul', {className: 'lfo-item'}, let content = e('ul', {className: 'lfo-item'},
ListItem(DropDown({onChange: props.setInstanceNum, value:props.instanceNum, options: INSTANCEOPTIONS})), ListItem(DropDown({onChange: props.setInstanceNum, value:props.instanceNum, options: INSTANCEOPTIONS})),
ListItem(ControlType()), ListItem(DropDown({options: TYPEOPTIONS, onChange: props.setType, value:props.type})),
ListItem(DropDown({onChange: props.setShape, value:props.shape, options: SHAPETYPES})), typeOption,
ListItem(DropDown({onChange: props.setDjParam, value: props.djParam, options: MODPARAMOPTIONS})), ListItem(DropDown({onChange: props.setDjParam, value: props.djParam, options: MODPARAMOPTIONS})),
ListItem(e("input", {onChange:props.setFreq, value:props.freq, className:"timeInput"}, null)), ListItem(e("input", {onChange:props.setFreq, value:props.freq, className:"timeInput"}, null)),
ListItem(e(NumberBox, {onChange:props.setMin, value:props.min, step:0.1}, null)), ListItem(e(NumberBox, {onChange:props.setMin, value:props.min, step:0.1}, null)),