diff --git a/index.js b/index.js index 41580fb..545fc8f 100644 --- a/index.js +++ b/index.js @@ -6,15 +6,16 @@ import { View, Text, TouchableOpacity, - AppState + AppState, + I18nManager } from 'react-native'; import _ from 'lodash'; -import {sprintf} from 'sprintf-js'; +import { sprintf } from 'sprintf-js'; -const DEFAULT_DIGIT_STYLE = {backgroundColor: '#FAB913'}; -const DEFAULT_DIGIT_TXT_STYLE = {color: '#000'}; -const DEFAULT_TIME_LABEL_STYLE = {color: '#000'}; -const DEFAULT_SEPARATOR_STYLE = {color: '#000'}; +const DEFAULT_DIGIT_STYLE = { backgroundColor: '#FAB913' }; +const DEFAULT_DIGIT_TXT_STYLE = { color: '#000' }; +const DEFAULT_TIME_LABEL_STYLE = { color: '#000' }; +const DEFAULT_SEPARATOR_STYLE = { color: '#000' }; const DEFAULT_TIME_TO_SHOW = ['D', 'H', 'M', 'S']; const DEFAULT_TIME_LABELS = { d: 'Days', @@ -69,7 +70,7 @@ class CountDown extends React.Component { } _handleAppStateChange = currentAppState => { - const {until, wentBackgroundAt} = this.state; + const { until, wentBackgroundAt } = this.state; if (currentAppState === 'active' && wentBackgroundAt && this.props.running) { const diff = (Date.now() - wentBackgroundAt) / 1000.0; this.setState({ @@ -78,12 +79,12 @@ class CountDown extends React.Component { }); } if (currentAppState === 'background') { - this.setState({wentBackgroundAt: Date.now()}); + this.setState({ wentBackgroundAt: Date.now() }); } } getTimeLeft = () => { - const {until} = this.state; + const { until } = this.state; return { seconds: until % 60, minutes: parseInt(until / 60, 10) % 60, @@ -96,7 +97,6 @@ class CountDown extends React.Component { // Don't fetch these values here, because their value might be changed // in another thread // const {lastUntil, until} = this.state; - if (this.state.lastUntil === this.state.until || !this.props.running) { return; } @@ -109,6 +109,7 @@ class CountDown extends React.Component { } } + if (this.state.until === 0) { this.setState({lastUntil: 0, until: 0}); } else { @@ -123,7 +124,7 @@ class CountDown extends React.Component { }; renderDigit = (d) => { - const {digitStyle, digitTxtStyle, size} = this.props; + const { digitStyle, digitTxtStyle, size } = this.props; return ( {d} @@ -142,12 +143,12 @@ class CountDown extends React.Component { }; renderLabel = label => { - const {timeLabelStyle, size} = this.props; + const { timeLabelStyle, size } = this.props; if (label) { return ( {label} @@ -168,12 +169,12 @@ class CountDown extends React.Component { }; renderSeparator = () => { - const {separatorStyle, size} = this.props; + const { separatorStyle, size } = this.props; return ( - + {':'} @@ -183,9 +184,9 @@ class CountDown extends React.Component { }; renderCountDown = () => { - const {timeToShow, timeLabels, showSeparator} = this.props; - const {until} = this.state; - const {days, hours, minutes, seconds} = this.getTimeLeft(); + const { timeToShow, timeLabels, showSeparator } = this.props; + const { until } = this.state; + const { days, hours, minutes, seconds } = this.getTimeLeft(); const newTime = sprintf('%02d:%02d:%02d:%02d', days, hours, minutes, seconds).split(':'); const Component = this.props.onPress ? TouchableOpacity : View; @@ -229,7 +230,7 @@ CountDown.defaultProps = { const styles = StyleSheet.create({ timeCont: { - flexDirection: 'row', + flexDirection: (I18nManager.isRTL) ? 'row-reverse' : 'row', justifyContent: 'center', }, timeTxt: { @@ -238,7 +239,7 @@ const styles = StyleSheet.create({ backgroundColor: 'transparent', }, timeInnerCont: { - flexDirection: 'row', + flexDirection: (I18nManager.isRTL) ? 'row-reverse' : 'row', justifyContent: 'center', alignItems: 'center', },