Skip to content

Commit

Permalink
feat: full chstrip - clean up code - delay buttons moved to array
Browse files Browse the repository at this point in the history
  • Loading branch information
olzzon authored and olzzon committed Oct 29, 2020
1 parent 486dfce commit 12937e4
Show file tree
Hide file tree
Showing 3 changed files with 65 additions and 121 deletions.
18 changes: 9 additions & 9 deletions client/assets/css/ChanStripFull.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@
color: #fff;
}

.chan-strip-full-body > .header {
.chan-strip-full-body > .ch-strip-full-header {
margin-left: 40px;
margin-top: 10px;
margin-right: 80px;
Expand Down Expand Up @@ -215,7 +215,7 @@
font-size: 95%;
}

.header > .close {
.ch-strip-full-header > .close {
position: absolute;
outline: none;
border-color: rgb(99, 99, 99);
Expand All @@ -229,20 +229,20 @@
right: 10px;
}

.header > .button {
.ch-strip-full-header > .button {
outline: none;
border-color: rgb(99, 99, 99);
background-color: rgb(27, 27, 27);
border-radius: 7px;
margin-left: 10px;
width: 80px;
width: 160px;
height: 50px;
font-size: 12px;
line-height: 30px;
color: #fff;
}

.chan-strip-fader {
.chan-strip-full-fader {
width: 10px;
height: 190px;
margin-left: 35px;
Expand All @@ -253,7 +253,7 @@
border-radius: 8px;
background-color: rgb(17, 17, 17);
}
.chan-strip-thumb {
.chan-strip-full-thumb {
margin-left: -20px;
color: #3a3a3a;
font-size: 90%;
Expand All @@ -275,18 +275,18 @@
}

.chan-strip-q {
width: 100px;
width: 300px;
height: 10px;
margin-left: 35px;
margin-right: 30px;
margin-top: 10px;
margin-top: 30px;
border-width: 0px;
border-style: solid;
border-radius: 8px;
background-color: rgb(17, 17, 17);
}
.chan-strip-q-thumb {
margin-left: -20px;
margin-top: -20px;
color: #3a3a3a;
font-size: 90%;
line-height: 50px;
Expand Down
72 changes: 20 additions & 52 deletions client/components/ChanStrip.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -36,6 +36,9 @@ interface IChanStripProps {
faderIndex: number
}

// Constants for Delay buttons:
const DEL_VALUES = [10, 1, -1, -10]

class ChanStrip extends React.PureComponent<
IChanStripProps & IChanStripInjectProps & Store
> {
Expand Down Expand Up @@ -199,58 +202,23 @@ class ChanStrip extends React.PureComponent<
<React.Fragment>
{this.fxParamFader(fxParamsList.DelayTime)}
<div className="delayButtons">
<button
className="delayTime"
onClick={() => {
this.changeDelay(
this.props.fader[this.props.faderIndex][
fxParamsList.DelayTime
][0] || 0,
10 / 500
)
}}
>
+10ms
</button>
<button
className="delayTime"
onClick={() => {
this.changeDelay(
this.props.fader[this.props.faderIndex][
fxParamsList.DelayTime
][0] || 0,
1 / 500
)
}}
>
+1ms
</button>
<button
className="delayTime"
onClick={() => {
this.changeDelay(
this.props.fader[this.props.faderIndex][
fxParamsList.DelayTime
][0] || 0,
-1 / 500
)
}}
>
-1ms
</button>
<button
className="delayTime"
onClick={() => {
this.changeDelay(
this.props.fader[this.props.faderIndex][
fxParamsList.DelayTime
][0] || 0,
-10 / 500
)
}}
>
-10ms
</button>
{DEL_VALUES.map((value: number) => {
return (
<button
className="delayTime"
onClick={() => {
this.changeDelay(
this.props.fader[this.props.faderIndex][
fxParamsList.DelayTime
]?.[0] || 0,
value / 500
)
}}
>
+{value}ms
</button>
)
})}
</div>
</React.Fragment>
)
Expand Down
96 changes: 36 additions & 60 deletions client/components/ChanStripFull.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -84,6 +84,9 @@ const EQ_X_OFFSET = 350
const EQ_Y_SIZE = 330
const EQ_Y_OFFSET = 840

// Constants for Delay buttons:
const DEL_VALUES = [10, 1, -1, -10]

class ChanStripFull extends React.PureComponent<
IChanStripFullProps & IChanStripFullInjectProps & Store
> {
Expand Down Expand Up @@ -420,8 +423,8 @@ class ChanStripFull extends React.PureComponent<
.CHANNEL_INPUT_GAIN ? (
<React.Fragment>
<ReactSlider
className="chan-strip-fader"
thumbClassName="chan-strip-thumb"
className="chan-strip-full-fader"
thumbClassName="chan-strip-full-thumb"
orientation="vertical"
invert
min={0}
Expand Down Expand Up @@ -455,58 +458,23 @@ class ChanStripFull extends React.PureComponent<
<React.Fragment>
{this.fxParamFader(fxParamsList.DelayTime)}
<div className="delayButtons">
<button
className="delayTime"
onClick={() => {
this.changeDelay(
this.props.fader[this.props.faderIndex][
fxParamsList.DelayTime
]?.[0] || 0,
10 / 500
)
}}
>
+10ms
</button>
<button
className="delayTime"
onClick={() => {
this.changeDelay(
this.props.fader[this.props.faderIndex][
fxParamsList.DelayTime
]?.[0] || 0,
1 / 500
)
}}
>
+1ms
</button>
<button
className="delayTime"
onClick={() => {
this.changeDelay(
this.props.fader[this.props.faderIndex][
fxParamsList.DelayTime
]?.[0] || 0,
-1 / 500
)
}}
>
-1ms
</button>
<button
className="delayTime"
onClick={() => {
this.changeDelay(
this.props.fader[this.props.faderIndex][
fxParamsList.DelayTime
]?.[0] || 0,
-10 / 500
)
}}
>
-10ms
</button>
{DEL_VALUES.map((value: number) => {
return (
<button
className="delayTime"
onClick={() => {
this.changeDelay(
this.props.fader[this.props.faderIndex][
fxParamsList.DelayTime
]?.[0] || 0,
value / 500
)
}}
>
+{value}ms
</button>
)
})}
</div>
</React.Fragment>
)
Expand All @@ -518,10 +486,18 @@ class ChanStripFull extends React.PureComponent<
let minLabel =
window.mixerProtocol.channelTypes[0].fromMixer[fxParam]?.[0]
.minLabel ?? 0
let valueLabel =
window.mixerProtocol.channelTypes[0].fromMixer[fxParam]?.[0]
.valueLabel ?? ''
return (
<div className="parameter-text">
<div className="parameter-mini-text">
Q :{this.props.fader[0][fxParam]?.[0]}
{Math.round(
(maxLabel - minLabel) *
this.props.fader[0][fxParam]?.[0] +
minLabel
)}
{valueLabel}
</div>
<ReactSlider
className="chan-strip-q"
Expand All @@ -538,7 +514,7 @@ class ChanStripFull extends React.PureComponent<
parseFloat(state.valueNow) +
minLabel
)}
Q
{valueLabel}
</div>
)}
onChange={(event: any) => {
Expand Down Expand Up @@ -573,8 +549,8 @@ class ChanStripFull extends React.PureComponent<
{maxLabel + valueLabel}
</div>
<ReactSlider
className="chan-strip-fader"
thumbClassName="chan-strip-thumb"
className="chan-strip-full-fader"
thumbClassName="chan-strip-full-thumb"
orientation="vertical"
invert
min={0}
Expand Down Expand Up @@ -620,8 +596,8 @@ class ChanStripFull extends React.PureComponent<
<li key={channelIndex}>
{monitorName}
<ReactSlider
className="chan-strip-fader"
thumbClassName="chan-strip-thumb"
className="chan-strip-full-fader"
thumbClassName="chan-strip-full-thumb"
orientation="vertical"
invert
min={0}
Expand Down

0 comments on commit 12937e4

Please sign in to comment.