summaryrefslogtreecommitdiffhomepage
path: root/app/components/Switch.js
diff options
context:
space:
mode:
authorAndrej Mihajlov <and@mullvad.net>2018-06-01 16:13:10 +0200
committerAndrej Mihajlov <and@mullvad.net>2018-06-05 12:11:55 +0200
commitca2f6fbfcad7b73d4ea63ef46cb1cab943ec9087 (patch)
treeb1f7754eb50896ab3681e35fa4e08be642b940c9 /app/components/Switch.js
parent5852c980980de53e00d76a0bdb4b41bf5c0f5b39 (diff)
downloadmullvadvpn-ca2f6fbfcad7b73d4ea63ef46cb1cab943ec9087.tar.xz
mullvadvpn-ca2f6fbfcad7b73d4ea63ef46cb1cab943ec9087.zip
Add formatted source code
Diffstat (limited to 'app/components/Switch.js')
-rw-r--r--app/components/Switch.js66
1 files changed, 34 insertions, 32 deletions
diff --git a/app/components/Switch.js b/app/components/Switch.js
index 6bd4b8e4d0..257b2c6587 100644
--- a/app/components/Switch.js
+++ b/app/components/Switch.js
@@ -5,41 +5,41 @@ const CLICK_TIMEOUT = 1000;
const MOVE_THRESHOLD = 10;
export type SwitchProps = {
- className?: string;
- isOn: boolean;
- onChange: ?((isOn: boolean) => void);
+ className?: string,
+ isOn: boolean,
+ onChange: ?(isOn: boolean) => void,
};
type State = {
ignoreChange: boolean,
- initialPos: {x: number, y: number},
+ initialPos: { x: number, y: number },
startTime: ?number,
};
export default class Switch extends React.Component<SwitchProps, State> {
static defaultProps: SwitchProps = {
isOn: false,
- onChange: null
+ onChange: null,
};
state = {
ignoreChange: false,
- initialPos: {x: 0, y: 0},
- startTime: (null: ?number)
+ initialPos: { x: 0, y: 0 },
+ startTime: (null: ?number),
};
isCapturingMouseEvents = false;
ref: ?HTMLInputElement;
- onRef = (e: ?HTMLInputElement) => this.ref = e;
+ onRef = (e: ?HTMLInputElement) => (this.ref = e);
handleMouseDown = (e: MouseEvent) => {
const { clientX: x, clientY: y } = e;
this.startCapturingMouseEvents();
this.setState({
initialPos: { x, y },
- startTime: e.timeStamp
+ startTime: e.timeStamp,
});
- }
+ };
handleMouseMove = (e: MouseEvent) => {
const inputElement = this.ref;
@@ -47,66 +47,66 @@ export default class Switch extends React.Component<SwitchProps, State> {
const { clientX: x, clientY: y } = e;
const dx = Math.abs(x0 - x);
- if(dx < MOVE_THRESHOLD) {
+ if (dx < MOVE_THRESHOLD) {
return;
}
const isOn = !!this.props.isOn;
let nextOn = isOn;
- if(x < x0 && isOn) {
+ if (x < x0 && isOn) {
nextOn = false;
- } else if(x > x0 && !isOn) {
+ } else if (x > x0 && !isOn) {
nextOn = true;
}
- if(isOn !== nextOn) {
+ if (isOn !== nextOn) {
this.setState({
initialPos: { x, y },
- ignoreChange: true
+ ignoreChange: true,
});
- if(inputElement) {
+ if (inputElement) {
inputElement.checked = nextOn;
}
this.notify(nextOn);
}
- }
+ };
handleMouseUp = () => {
this.stopCapturingMouseEvents();
- }
+ };
handleChange = (e: Event) => {
const startTime = this.state.startTime;
const eventTarget: Object = e.target;
- if(typeof(startTime) !== 'number') {
+ if (typeof startTime !== 'number') {
throw new Error('startTime must be a number.');
}
const dt = e.timeStamp - startTime;
- if(this.state.ignoreChange) {
+ if (this.state.ignoreChange) {
this.setState({ ignoreChange: false });
e.preventDefault();
- } else if(dt > CLICK_TIMEOUT) {
+ } else if (dt > CLICK_TIMEOUT) {
e.preventDefault();
} else {
this.notify(eventTarget.checked);
}
- }
+ };
notify(isOn: boolean) {
const onChange = this.props.onChange;
- if(onChange) {
+ if (onChange) {
onChange(isOn);
}
}
startCapturingMouseEvents() {
- if(this.isCapturingMouseEvents) {
+ if (this.isCapturingMouseEvents) {
throw new Error('startCapturingMouseEvents() is called out of order.');
}
document.addEventListener('mousemove', this.handleMouseMove);
@@ -115,7 +115,7 @@ export default class Switch extends React.Component<SwitchProps, State> {
}
stopCapturingMouseEvents() {
- if(!this.isCapturingMouseEvents) {
+ if (!this.isCapturingMouseEvents) {
throw new Error('stopCapturingMouseEvents() is called out of order.');
}
document.removeEventListener('mousemove', this.handleMouseMove);
@@ -125,7 +125,7 @@ export default class Switch extends React.Component<SwitchProps, State> {
componentWillUnmount() {
// guard from abrupt programmatic unmount
- if(this.isCapturingMouseEvents) {
+ if (this.isCapturingMouseEvents) {
this.stopCapturingMouseEvents();
}
}
@@ -135,13 +135,15 @@ export default class Switch extends React.Component<SwitchProps, State> {
const { isOn, onChange, ...otherProps } = this.props;
const className = ('switch ' + (otherProps.className || '')).trim();
return (
- <input { ...otherProps }
+ <input
+ {...otherProps}
type="checkbox"
- ref={ this.onRef }
- className={ className }
- checked={ isOn }
- onMouseDown={ this.handleMouseDown }
- onChange={ this.handleChange } />
+ ref={this.onRef}
+ className={className}
+ checked={isOn}
+ onMouseDown={this.handleMouseDown}
+ onChange={this.handleChange}
+ />
);
}
}