mirror of
https://github.com/status-im/fathom.git
synced 2025-02-28 19:10:36 +00:00
fix rounding issue for percentage values
This commit is contained in:
parent
ce00a975b4
commit
9f6684f0fb
@ -5,22 +5,14 @@ import * as numbers from '../lib/numbers.js';
|
|||||||
import Client from '../lib/client.js';
|
import Client from '../lib/client.js';
|
||||||
import { bind } from 'decko';
|
import { bind } from 'decko';
|
||||||
|
|
||||||
function getSundayOfCurrentWeek(d){
|
|
||||||
var day = d.getDay();
|
|
||||||
return new Date(d.getFullYear(), d.getMonth(), d.getDate() + (day == 0?0:7)-day );
|
|
||||||
}
|
|
||||||
|
|
||||||
const dayInSeconds = 60 * 60 * 24;
|
|
||||||
|
|
||||||
class CountWidget extends Component {
|
class CountWidget extends Component {
|
||||||
constructor(props) {
|
constructor(props) {
|
||||||
super(props)
|
super(props)
|
||||||
|
|
||||||
this.state = {
|
this.state = {
|
||||||
value: 0.00,
|
value: "-",
|
||||||
loading: false,
|
loading: false,
|
||||||
before: props.before,
|
|
||||||
after: props.after,
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -29,26 +21,23 @@ class CountWidget extends Component {
|
|||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
this.setState({
|
this.fetchData(newProps.before, newProps.after);
|
||||||
before: newProps.before,
|
|
||||||
after: newProps.after,
|
|
||||||
});
|
|
||||||
this.fetchData();
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// TODO: Move to component of its own
|
||||||
@bind
|
@bind
|
||||||
countUp(toValue) {
|
countUp(toValue) {
|
||||||
const duration = 1000;
|
const duration = 1000;
|
||||||
const easeOutQuint = function (t) { return 1+(--t)*t*t*t*t };
|
const easeOutQuint = function (t) { return 1+(--t)*t*t*t*t };
|
||||||
const setState = this.setState.bind(this);
|
const setState = this.setState.bind(this);
|
||||||
const startValue = this.state.value;
|
const startValue = isFinite(this.state.value) ? this.state.value : 0;
|
||||||
const diff = toValue - startValue;
|
const diff = toValue - startValue;
|
||||||
let startTime;
|
let startTime;
|
||||||
|
|
||||||
const tick = function(t) {
|
const tick = function(t) {
|
||||||
if(!startTime) { startTime = t; }
|
if(!startTime) { startTime = t; }
|
||||||
let progress = ( t - startTime ) / duration;
|
let progress = ( t - startTime ) / duration;
|
||||||
let newValue = Math.round(startValue + (easeOutQuint(progress) * diff));
|
let newValue = startValue + (easeOutQuint(progress) * diff);
|
||||||
setState({
|
setState({
|
||||||
value: newValue,
|
value: newValue,
|
||||||
})
|
})
|
||||||
@ -62,15 +51,13 @@ class CountWidget extends Component {
|
|||||||
}
|
}
|
||||||
|
|
||||||
@bind
|
@bind
|
||||||
fetchData() {
|
fetchData(before, after) {
|
||||||
this.setState({ loading: true })
|
this.setState({ loading: true })
|
||||||
let before = this.state.before;
|
|
||||||
let after = this.state.after;
|
|
||||||
|
|
||||||
Client.request(`${this.props.endpoint}?before=${before}&after=${after}`)
|
Client.request(`${this.props.endpoint}?before=${before}&after=${after}`)
|
||||||
.then((d) => {
|
.then((d) => {
|
||||||
// request finished; check if timestamp range is still the one user wants to see
|
// request finished; check if timestamp range is still the one user wants to see
|
||||||
if( this.state.before != before || this.state.after != after ) {
|
if( this.props.before != before || this.props.after != after ) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -84,7 +71,7 @@ class CountWidget extends Component {
|
|||||||
render(props, state) {
|
render(props, state) {
|
||||||
let formattedValue = "-";
|
let formattedValue = "-";
|
||||||
|
|
||||||
if(state.value > 0) {
|
if(isFinite(state.value)) {
|
||||||
switch(props.format) {
|
switch(props.format) {
|
||||||
case "percentage":
|
case "percentage":
|
||||||
formattedValue = numbers.formatPercentage(state.value)
|
formattedValue = numbers.formatPercentage(state.value)
|
||||||
@ -92,7 +79,7 @@ class CountWidget extends Component {
|
|||||||
|
|
||||||
default:
|
default:
|
||||||
case "number":
|
case "number":
|
||||||
formattedValue = numbers.formatWithComma(state.value)
|
formattedValue = numbers.formatWithComma(Math.round(state.value))
|
||||||
break;
|
break;
|
||||||
|
|
||||||
case "duration":
|
case "duration":
|
||||||
|
@ -18,6 +18,7 @@ function formatWithComma(nStr) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
function formatDuration(seconds) {
|
function formatDuration(seconds) {
|
||||||
|
seconds = Math.round(seconds);
|
||||||
var date = new Date(null);
|
var date = new Date(null);
|
||||||
date.setSeconds(seconds); // specify value for SECONDS here
|
date.setSeconds(seconds); // specify value for SECONDS here
|
||||||
return date.toISOString().substr(14, 5);
|
return date.toISOString().substr(14, 5);
|
||||||
|
Loading…
x
Reference in New Issue
Block a user