BigBlueButton/bigbluebutton-Github
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Refactor variable names

Browse Source
This commit is contained in:
Vitor Mateus 2019-02-06 14:05:24 -02:00
parent 3948c8adb6
commit 100d9a4825
3 changed files with 41 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
bigbluebutton-html5/imports/ui/components/presentation/presentation-toolbar/component.jsx
View File

@ -244,7 +244,7 @@ class PresentationToolbar extends Component {
? ( ? (
<span className={styles.zoomWrapper}> <span className={styles.zoomWrapper}>
<ZoomTool <ZoomTool
value={zoom} zoomValue={zoom}
change={this.change} change={this.change}
minBound={HUNDRED_PERCENT} minBound={HUNDRED_PERCENT}
maxBound={MAX_PERCENT} maxBound={MAX_PERCENT}

10
bigbluebutton-html5/imports/ui/components/presentation/presentation-toolbar/styles.scss
View File

@ -122,4 +122,14 @@
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
border-top: 0 !important;
border-bottom: 0 !important;
border-top-right-radius: 0 !important;
border-bottom-right-radius: 0 !important;
&:hover{
opacity: .5;
border-left: var(--toolbar-button-border) solid var(--toolbar-button-border-color) !important;
border-right: var(--toolbar-button-border) solid var(--toolbar-button-border-color) !important;
}
} }

60
bigbluebutton-html5/imports/ui/components/presentation/presentation-toolbar/zoom-tool/component.jsx
View File

@ -61,29 +61,29 @@ export default class ZoomTool extends Component {
this.onChanger = this.onChanger.bind(this); this.onChanger = this.onChanger.bind(this);
this.setInt = 0; this.setInt = 0;
this.state = { this.state = {
stateValue: props.value, stateZoomValue: props.zoomValue,
initialStateValue: props.value, initialstateZoomValue: props.zoomValue,
mouseHolding: false, mouseHolding: false,
}; };
} }
componentDidUpdate() { componentDidUpdate() {
const { value } = this.props; const { zoomValue } = this.props;
const { stateValue } = this.state; const { stateZoomValue } = this.state;
const isDifferent = value !== stateValue; const isDifferent = zoomValue !== stateZoomValue;
if (isDifferent) this.onChanger(value); if (isDifferent) this.onChanger(zoomValue);
} }
onChanger(val) { onChanger(value) {
const { const {
maxBound, maxBound,
minBound, minBound,
change, change,
value, zoomValue,
} = this.props; } = this.props;
const { stateValue } = this.state; const { stateZoomValue } = this.state;
let newValue = val; let newValue = value;
const isDifferent = newValue !== stateValue; const isDifferent = newValue !== stateZoomValue;
if (newValue <= minBound) { if (newValue <= minBound) {
newValue = minBound; newValue = minBound;
@ -91,21 +91,21 @@ export default class ZoomTool extends Component {
newValue = maxBound; newValue = maxBound;
} }
const propsIsDifferente = value !== newValue; const propsIsDifferente = zoomValue !== newValue;
if (isDifferent && propsIsDifferente) { if (isDifferent && propsIsDifferente) {
this.setState({ stateValue: newValue }, () => { this.setState({ stateZoomValue: newValue }, () => {
change(newValue); change(newValue);
}); });
} }
if (isDifferent && !propsIsDifferente) this.setState({ stateValue: newValue }); if (isDifferent && !propsIsDifferente) this.setState({ stateZoomValue: newValue });
} }
increment() { increment() {
const { const {
step, step,
} = this.props; } = this.props;
const { stateValue } = this.state; const { stateZoomValue } = this.state;
const increaseZoom = stateValue + step; const increaseZoom = stateZoomValue + step;
this.onChanger(increaseZoom); this.onChanger(increaseZoom);
} }
@ -113,8 +113,8 @@ export default class ZoomTool extends Component {
const { const {
step, step,
} = this.props; } = this.props;
const { stateValue } = this.state; const { stateZoomValue } = this.state;
const decreaseZoom = stateValue - step; const decreaseZoom = stateZoomValue - step;
this.onChanger(decreaseZoom); this.onChanger(decreaseZoom);
} }
@ -149,17 +149,17 @@ export default class ZoomTool extends Component {
} }
resetZoom() { resetZoom() {
const { stateValue, initialStateValue } = this.state; const { stateZoomValue, initialstateZoomValue } = this.state;
if (stateValue !== initialStateValue) this.onChanger(initialStateValue); if (stateZoomValue !== initialstateZoomValue) this.onChanger(initialstateZoomValue);
} }
render() { render() {
const { const {
value, zoomValue,
minBound, minBound,
maxBound, maxBound,
} = this.props; } = this.props;
const { stateValue } = this.state; const { stateZoomValue } = this.state;
return ( return (
[ [
ZoomTool.renderAriaLabelsDescs(), ZoomTool.renderAriaLabelsDescs(),
@ -167,7 +167,7 @@ export default class ZoomTool extends Component {
<HoldButton <HoldButton
key="zoom-tool-1" key="zoom-tool-1"
exec={this.decrement} exec={this.decrement}
value={value} value={zoomValue}
minBound={minBound} minBound={minBound}
> >
<Button <Button
@ -178,7 +178,7 @@ export default class ZoomTool extends Component {
label="-" label="-"
icon="minus" icon="minus"
onClick={() => { }} onClick={() => { }}
disabled={(value <= minBound)} disabled={(zoomValue <= minBound)}
className={styles.prevSlide} className={styles.prevSlide}
hideLabel hideLabel
/> />
@ -189,21 +189,21 @@ export default class ZoomTool extends Component {
key="zoom-tool-2" key="zoom-tool-2"
role="button" role="button"
aria-labelledby="zoomIndicator" aria-labelledby="zoomIndicator"
aria-describedby={stateValue} aria-describedby={stateZoomValue}
color="default" color="default"
customIcon={`${stateValue}%`} customIcon={`${stateZoomValue}%`}
size="md" size="md"
onClick={() => this.resetZoom()} onClick={() => this.resetZoom()}
label="Reset Zoom" label="Reset Zoom"
hideLabel hideLabel
className={styles.prevSlide} className={styles.zoomPercentageDisplay}
/> />
), ),
( (
<HoldButton <HoldButton
key="zoom-tool-3" key="zoom-tool-3"
exec={this.increment} exec={this.increment}
value={value} value={zoomValue}
maxBound={maxBound} maxBound={maxBound}
> >
<Button <Button
@ -214,7 +214,7 @@ export default class ZoomTool extends Component {
label="+" label="+"
icon="plus" icon="plus"
onClick={() => { }} onClick={() => { }}
disabled={(value >= maxBound)} disabled={(zoomValue >= maxBound)}
className={styles.skipSlide} className={styles.skipSlide}
hideLabel hideLabel
/> />
@ -226,7 +226,7 @@ export default class ZoomTool extends Component {
} }
const propTypes = { const propTypes = {
value: PropTypes.number.isRequired, zoomValue: PropTypes.number.isRequired,
change: PropTypes.func.isRequired, change: PropTypes.func.isRequired,
minBound: PropTypes.number.isRequired, minBound: PropTypes.number.isRequired,
maxBound: PropTypes.number.isRequired, maxBound: PropTypes.number.isRequired,