display total duration in tooltip - fix #26
This commit is contained in:
parent
154282e19a
commit
7d98e7342b
@ -417,6 +417,16 @@
|
|||||||
"node": {
|
"node": {
|
||||||
"extensions": [".js", ".jsx"]
|
"extensions": [".js", ".jsx"]
|
||||||
}
|
}
|
||||||
}
|
},
|
||||||
|
"react": {
|
||||||
|
"createClass": "createReactClass",
|
||||||
|
"pragma": "React",
|
||||||
|
"version": "16.6"
|
||||||
|
},
|
||||||
|
"propWrapperFunctions": [
|
||||||
|
"forbidExtraProps",
|
||||||
|
{"property": "freeze", "object": "Object"},
|
||||||
|
{"property": "myFavoriteWrapper"}
|
||||||
|
]
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -91,7 +91,7 @@ class Statistics extends React.Component {
|
|||||||
tickFormatter={value => displayedData === 'distance'
|
tickFormatter={value => displayedData === 'distance'
|
||||||
? `${value} km`
|
? `${value} km`
|
||||||
: displayedData === 'duration'
|
: displayedData === 'duration'
|
||||||
? format(formatDuration(value), 'HH:mm')
|
? formatDuration(value)
|
||||||
: value
|
: value
|
||||||
}
|
}
|
||||||
/>
|
/>
|
||||||
|
@ -1,10 +1,9 @@
|
|||||||
import React from 'react'
|
import React from 'react'
|
||||||
import { format } from 'date-fns'
|
|
||||||
|
|
||||||
import { formatDuration } from '../../utils'
|
import { formatDuration } from '../../utils'
|
||||||
|
|
||||||
const formatValue = (displayedData, value) => displayedData === 'duration'
|
const formatValue = (displayedData, value) => displayedData === 'duration'
|
||||||
? format(formatDuration(value), 'HH:mm')
|
? formatDuration(value, true)
|
||||||
: displayedData === 'distance'
|
: displayedData === 'distance'
|
||||||
? value.toFixed(3)
|
? value.toFixed(3)
|
||||||
: value
|
: value
|
||||||
|
@ -123,7 +123,7 @@ const user = (state = initial.user, action) => {
|
|||||||
const statistics = (state = initial.statistics, action) =>
|
const statistics = (state = initial.statistics, action) =>
|
||||||
handleDataAndError(state, 'statistics', action)
|
handleDataAndError(state, 'statistics', action)
|
||||||
|
|
||||||
export default (history) => combineReducers({
|
export default history => combineReducers({
|
||||||
activities,
|
activities,
|
||||||
calendarActivities,
|
calendarActivities,
|
||||||
chartData,
|
chartData,
|
||||||
|
@ -1,11 +1,11 @@
|
|||||||
import togeojson from '@mapbox/togeojson'
|
import togeojson from '@mapbox/togeojson'
|
||||||
import { addDays, format, parse, startOfWeek, subHours } from 'date-fns'
|
import { addDays, format, parse, startOfWeek } from 'date-fns'
|
||||||
import { DateTime } from 'luxon'
|
import { DateTime } from 'luxon'
|
||||||
|
|
||||||
export const apiUrl = `${process.env.REACT_APP_API_URL}/api/`
|
export const apiUrl = `${process.env.REACT_APP_API_URL}/api/`
|
||||||
export const thunderforestApiKey = `${
|
export const thunderforestApiKey = `${
|
||||||
process.env.REACT_APP_THUNDERFOREST_API_KEY
|
process.env.REACT_APP_THUNDERFOREST_API_KEY
|
||||||
}`
|
}`
|
||||||
export const gpxLimit = `${process.env.REACT_APP_GPX_LIMIT_IMPORT}`
|
export const gpxLimit = `${process.env.REACT_APP_GPX_LIMIT_IMPORT}`
|
||||||
export const activityColors = [
|
export const activityColors = [
|
||||||
'#55a8a3',
|
'#55a8a3',
|
||||||
@ -123,10 +123,24 @@ export const formatRecord = (record, tz) => {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
export const formatDuration = seconds => {
|
export const formatDuration = (totalSeconds, formatWithDay = false) => {
|
||||||
let newDate = new Date(0)
|
let days = '0'
|
||||||
newDate = subHours(newDate.setSeconds(seconds), 1)
|
if (formatWithDay) {
|
||||||
return newDate.getTime()
|
days = String(Math.floor(totalSeconds / 86400))
|
||||||
|
totalSeconds %= 86400
|
||||||
|
}
|
||||||
|
const hours = String(Math.floor(totalSeconds / 3600)).padStart(2, '0')
|
||||||
|
totalSeconds %= 3600
|
||||||
|
const minutes = String(Math.floor(totalSeconds / 60)).padStart(2, '0')
|
||||||
|
const seconds = String(totalSeconds % 60).padStart(2, '0')
|
||||||
|
if (formatWithDay) {
|
||||||
|
return `${
|
||||||
|
days === '0' ? '' : `${days}d:`
|
||||||
|
}${
|
||||||
|
hours === '00' ? '' : `${hours}h:`
|
||||||
|
}${minutes}m:${seconds}s`
|
||||||
|
}
|
||||||
|
return `${hours === '00' ? '' : `${hours}:`}${minutes}:${seconds}`
|
||||||
}
|
}
|
||||||
|
|
||||||
export const formatChartData = chartData => {
|
export const formatChartData = chartData => {
|
||||||
|
Loading…
Reference in New Issue
Block a user