diff --git a/.gitignore b/.gitignore index 23036dd..02e2e3c 100644 --- a/.gitignore +++ b/.gitignore @@ -1,3 +1,4 @@ # node.js # -node_modules/ \ No newline at end of file +node_modules/ +.idea \ No newline at end of file diff --git a/.idea/.gitignore b/.idea/.gitignore new file mode 100644 index 0000000..90272d3 --- /dev/null +++ b/.idea/.gitignore @@ -0,0 +1,8 @@ +# Default ignored files +/shelf/ +/workspace.xml +# Datasource local storage ignored files +/../../../../../../:\Users\api84\projekty\react-native-stopwatch-timer\.idea/dataSources/ +/dataSources.local.xml +# Editor-based HTTP Client requests +/httpRequests/ diff --git a/.idea/modules.xml b/.idea/modules.xml new file mode 100644 index 0000000..300a4a6 --- /dev/null +++ b/.idea/modules.xml @@ -0,0 +1,8 @@ + + + + + + + + \ No newline at end of file diff --git a/.idea/react-native-stopwatch-timer.iml b/.idea/react-native-stopwatch-timer.iml new file mode 100644 index 0000000..c956989 --- /dev/null +++ b/.idea/react-native-stopwatch-timer.iml @@ -0,0 +1,8 @@ + + + + + + + + \ No newline at end of file diff --git a/.idea/vcs.xml b/.idea/vcs.xml new file mode 100644 index 0000000..94a25f7 --- /dev/null +++ b/.idea/vcs.xml @@ -0,0 +1,6 @@ + + + + + + \ No newline at end of file diff --git a/lib/stopwatch.js b/lib/stopwatch.js index c59be85..c4df961 100644 --- a/lib/stopwatch.js +++ b/lib/stopwatch.js @@ -9,9 +9,11 @@ class StopWatch extends Component { start: PropTypes.bool, reset: PropTypes.bool, msecs: PropTypes.bool, + hours: PropTypes.bool, options: PropTypes.object, laps: PropTypes.bool, getTime: PropTypes.func, + getTimeToParent: PropTypes.func, startTime: PropTypes.number, getMsecs: PropTypes.func, } @@ -30,6 +32,7 @@ class StopWatch extends Component { this.stop = this.stop.bind(this); this.reset = this.reset.bind(this); this.formatTime = this.formatTime.bind(this); + this.handleGetTimeToParent = this.handleGetTimeToParent.bind(this); const width = props.msecs ? 220 : 150; this.defaultStyles = { container: { @@ -52,7 +55,7 @@ class StopWatch extends Component { } } - componentWillReceiveProps(newProps) { + UNSAFE_componentWillReceiveProps(newProps, nextContext) { if(newProps.start) { this.start(); } else { @@ -94,6 +97,8 @@ class StopWatch extends Component { this.interval = null; } this.setState({started: false}); + + this.handleGetTimeToParent(); } reset() { @@ -106,10 +111,10 @@ class StopWatch extends Component { }); } - formatTime() { - const { getTime, getMsecs, msecs } = this.props; + formatTime() { + const { getTime, getMsecs, msecs, hours } = this.props; const now = this.state.elapsed; - const formatted = formatTimeString(now, msecs); + const formatted = formatTimeString(now, msecs, hours); if (typeof getTime === "function") { getTime(formatted); } @@ -119,6 +124,11 @@ class StopWatch extends Component { return formatted; } + handleGetTimeToParent() { + if (typeof this.props.getTimeToParent === 'function') { + this.props.getTimeToParent(this.formatTime()); + } + } render() { diff --git a/lib/utils.js b/lib/utils.js index 60bac43..23433ab 100644 --- a/lib/utils.js +++ b/lib/utils.js @@ -1,4 +1,4 @@ -function formatTimeString(time, showMsecs) { +function formatTimeString(time, showMsecs, showHours) { let msecs = time % 1000; if (msecs < 10) { @@ -11,19 +11,14 @@ function formatTimeString(time, showMsecs) { let minutes = Math.floor(time / 60000); let hours = Math.floor(time / 3600000); seconds = seconds - minutes * 60; - minutes = minutes - hours * 60; - let formatted; - if (showMsecs) { - formatted = `${hours < 10 ? 0 : ""}${hours}:${ - minutes < 10 ? 0 : "" - }${minutes}:${seconds < 10 ? 0 : ""}${seconds}:${msecs}`; - } else { - formatted = `${hours < 10 ? 0 : ""}${hours}:${ - minutes < 10 ? 0 : "" - }${minutes}:${seconds < 10 ? 0 : ""}${seconds}`; - } - - return formatted; + minutes = minutes - hours * 60; + + let formattedHours = showHours ? `${hours < 10 ? 0 : ""}${hours}:` : ''; + let formattedMinutes = `${minutes < 10 ? 0 : ""}${minutes}:`; + let formattedSeconds = `${seconds < 10 ? 0 : ""}${seconds}`; + let formattedMsecs = showMsecs ? `:${msecs}` : ''; + + return `${formattedHours}${formattedMinutes}${formattedSeconds}${formattedMsecs}`; } export { formatTimeString }; diff --git a/package-lock.json b/package-lock.json index 67f2293..700b45c 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,8 +1,55 @@ { "name": "react-native-stopwatch-timer", "version": "0.0.21", - "lockfileVersion": 1, + "lockfileVersion": 2, "requires": true, + "packages": { + "": { + "version": "0.0.21", + "dependencies": { + "prop-types": "^15.7.2" + } + }, + "node_modules/js-tokens": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz", + "integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==" + }, + "node_modules/loose-envify": { + "version": "1.4.0", + "resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.4.0.tgz", + "integrity": "sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==", + "dependencies": { + "js-tokens": "^3.0.0 || ^4.0.0" + }, + "bin": { + "loose-envify": "cli.js" + } + }, + "node_modules/object-assign": { + "version": "4.1.1", + "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz", + "integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM=", + "engines": { + "node": ">=0.10.0" + } + }, + "node_modules/prop-types": { + "version": "15.7.2", + "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.7.2.tgz", + "integrity": "sha512-8QQikdH7//R2vurIJSutZ1smHYTcLpRWEOlHnzcWHmBYrOGUysKwSsrC89BCiFj3CbrfJ/nXFdJepOVrY1GCHQ==", + "dependencies": { + "loose-envify": "^1.4.0", + "object-assign": "^4.1.1", + "react-is": "^16.8.1" + } + }, + "node_modules/react-is": { + "version": "16.8.6", + "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.8.6.tgz", + "integrity": "sha512-aUk3bHfZ2bRSVFFbbeVS4i+lNPZr3/WM5jT2J5omUVV1zzcs1nAaf3l51ctA5FFvCRbhrH0bdAsRRQddFJZPtA==" + } + }, "dependencies": { "js-tokens": { "version": "4.0.0",