-
Notifications
You must be signed in to change notification settings - Fork 32
/
index.js
65 lines (54 loc) · 1.82 KB
/
index.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
import React, { Component } from "react";
import { TouchableOpacity } from "react-native";
export default class DoubleTap extends Component {
constructor(props) {
super(props);
// time interval between double clicks
this.delayTime = props.delay ? props.delay : 150;
// bool to check whether user tapped once
this.firstPress = true;
// the last time user tapped
this.lastTime = new Date();
// a timer is used to run the single tap event
this.timer = false;
}
_onTap = () => {
// get the instance of time when pressed
let now = new Date().getTime();
if (this.firstPress) {
// set the flag indicating first press has occured
this.firstPress = false;
//start a timer --> if a second tap doesnt come in by the delay, trigger singleTap event handler
this.timer = setTimeout(() => {
//check if user passed in prop
this.props.singleTap ? this.props.singleTap() : null;
// reset back to initial state
this.firstPress = true;
this.timer = false;
}, this.delayTime);
// mark the last time of the press
this.lastTime = now;
} else {
//if user pressed immediately again within span of delayTime
if (now - this.lastTime < this.delayTime) {
// clear the timeout for the single press
this.timer && clearTimeout(this.timer);
//check if user passed in prop for double click
this.props.doubleTap ? this.props.doubleTap() : null;
// reset back to initial state
this.firstPress = true;
}
}
};
render() {
return (
<TouchableOpacity onPress={this._onTap}>
{this.props.children}
</TouchableOpacity>
);
}
componentWillUnmount() {
// make sure to clear the timer when unmounting
this.timer && clearTimeout(this.timer);
}
}