UI changes
This commit is contained in:
parent
37a65058bc
commit
45e168ba11
@ -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"
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
12
lfogui.js
12
lfogui.js
@ -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,
|
||||||
|
@ -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)),
|
||||||
|
Loading…
Reference in New Issue
Block a user