Browse Source

Feature/skip the counting animation of the portfolio value on a background refresh

pull/8249/head
mister-ideas 4 days ago
parent
commit
89167d12ff
  1. 18
      apps/client/src/app/components/portfolio-performance/portfolio-performance.component.ts

18
apps/client/src/app/components/portfolio-performance/portfolio-performance.component.ts

@ -107,8 +107,9 @@ export class GfPortfolioPerformanceComponent {
} }
/** /**
* Counts up from zero on the initial value and rolls from the current to * Counts up from zero on the initial load and after a reload (e.g. a changed
* the new number on a refresh. Nothing happens if the number is unchanged. * date range). A background refresh swaps the number without any counting
* animation. Nothing happens if the number is unchanged.
*/ */
private showValue({ private showValue({
decimalPlaces, decimalPlaces,
@ -121,17 +122,20 @@ export class GfPortfolioPerformanceComponent {
return; return;
} }
const isUpdate = this.countUpTarget !== undefined; const isRefresh = this.countUpTarget !== undefined;
this.countUp = new CountUp('value', value, { this.countUp = new CountUp('value', value, {
decimalPlaces, decimalPlaces,
decimal: getNumberFormatDecimal(this.locale()), decimal: getNumberFormatDecimal(this.locale()),
duration: isUpdate ? 0.6 : 1, duration: 1,
separator: getNumberFormatGroup(this.locale()), separator: getNumberFormatGroup(this.locale())
startVal: isUpdate ? this.countUpTarget : 0
}); });
this.countUp.start(); if (isRefresh) {
this.value().nativeElement.textContent = this.countUp.formatNumber(value);
} else {
this.countUp.start();
}
this.countUpTarget = value; this.countUpTarget = value;
} }

Loading…
Cancel
Save