UI/UX - New component for difficult adjustment. (#602)

* Add next difficulty blocks.
Add next difficulty target date.
Add next difficulty total progress.
Add ajustment difficulty avg min per block.

* Fix typo.

* Trigger difficulty calculation every 5 seconds.

* Add rxjs timer to difficultyEpoch.

* Fix pipe.

* Fix small bar position.

* Change i18n strings.

* Fix typo.

* Add time-until component.

* Speed up difficultyEpoch timer to 1000 ms.

* Fix values to 2 decimal places.

* Add title to fee and difficulty adjustment cards.

* Add title outside the card.

* Fix title to center position.

* Add other titles.

* Add new transalations strings.
Refactor time span component.

* Fix difficulty adjustment i18n string.
Fix duplicated i18n strings.
This commit is contained in:
Miguel Medeiros
2021-07-17 08:58:16 -03:00
committed by GitHub
parent 38aee1a897
commit d405334109
13 changed files with 509 additions and 117 deletions

View File

@@ -1,5 +1,6 @@
import { Component, OnInit, OnDestroy, ChangeDetectionStrategy, Input, ChangeDetectorRef, OnChanges, PLATFORM_ID, Inject } from '@angular/core';
import { Component, OnInit, OnDestroy, ChangeDetectionStrategy, Input, ChangeDetectorRef, OnChanges } from '@angular/core';
import { StateService } from 'src/app/services/state.service';
import { dates } from 'src/app/shared/i18n/dates';
@Component({
selector: 'app-time-since',
@@ -53,48 +54,49 @@ export class TimeSinceComponent implements OnInit, OnChanges, OnDestroy {
calculate() {
const seconds = Math.floor((+new Date() - +new Date(this.time * 1000)) / 1000);
if (seconds < 60) {
return $localize`:@@time-since.just-now:Just now`;
return $localize`:@@date-base.just-now:Just now`;
}
let counter;
for (const i in this.intervals) {
if (this.intervals.hasOwnProperty(i)) {
counter = Math.floor(seconds / this.intervals[i]);
const dateStrings = dates(counter);
if (counter > 0) {
if (counter === 1) {
switch (i) { // singular (1 day ago)
case 'year': return $localize`:@@time-since.year.ago:${counter}:INTERPOLATION: year ago`; break;
case 'month': return $localize`:@@time-since.month.ago:${counter}:INTERPOLATION: month ago`; break;
case 'week': return $localize`:@@time-since.week.ago:${counter}:INTERPOLATION: week ago`; break;
case 'day': return $localize`:@@time-since.day.ago:${counter}:INTERPOLATION: day ago`; break;
case 'hour': return $localize`:@@time-since.hour.ago:${counter}:INTERPOLATION: hour ago`; break;
switch (i) { // singular (1 day)
case 'year': return $localize`:@@time-since:${dateStrings.i18nYear}:DATE: ago`; break;
case 'month': return $localize`:@@time-since:${dateStrings.i18nMonth}:DATE: ago`; break;
case 'week': return $localize`:@@time-since:${dateStrings.i18nWeek}:DATE: ago`; break;
case 'day': return $localize`:@@time-since:${dateStrings.i18nDay}:DATE: ago`; break;
case 'hour': return $localize`:@@time-since:${dateStrings.i18nHour}:DATE: ago`; break;
case 'minute':
if (document.body.clientWidth < 768) {
return $localize`:@@time-since.min.ago:${counter}:INTERPOLATION: min ago`;
return $localize`:@@time-since:${dateStrings.i18nMin}:DATE: ago`;
}
return $localize`:@@time-since.minute.ago:${counter}:INTERPOLATION: minute ago`;
return $localize`:@@time-since:${dateStrings.i18nMinute}:DATE: ago`;
case 'second':
if (document.body.clientWidth < 768) {
return $localize`:@@time-since.sec.ago:${counter}:INTERPOLATION: sec ago`;
return $localize`:@@time-since:${dateStrings.i18nSec}:DATE: ago`;
}
return $localize`:@@time-since.second.ago:${counter}:INTERPOLATION: second ago`;
return $localize`:@@time-since:${dateStrings.i18nSecond}:DATE: ago`;
}
} else {
switch (i) { // plural (2 days ago)
case 'year': return $localize`:@@time-since.years.ago:${counter}:INTERPOLATION: years ago`; break;
case 'month': return $localize`:@@time-since.months.ago:${counter}:INTERPOLATION: months ago`; break;
case 'week': return $localize`:@@time-since.weeks.ago:${counter}:INTERPOLATION: weeks ago`; break;
case 'day': return $localize`:@@time-since.days.ago:${counter}:INTERPOLATION: days ago`; break;
case 'hour': return $localize`:@@time-since.hours.ago:${counter}:INTERPOLATION: hours ago`; break;
switch (i) { // plural (2 days)
case 'year': return $localize`:@@time-since:${dateStrings.i18nYears}:DATE: ago`; break;
case 'month': return $localize`:@@time-since:${dateStrings.i18nMonths}:DATE: ago`; break;
case 'week': return $localize`:@@time-since:${dateStrings.i18nWeeks}:DATE: ago`; break;
case 'day': return $localize`:@@time-since:${dateStrings.i18nDays}:DATE: ago`; break;
case 'hour': return $localize`:@@time-since:${dateStrings.i18nHours}:DATE: ago`; break;
case 'minute':
if (document.body.clientWidth < 768) {
return $localize`:@@time-since.mins.ago:${counter}:INTERPOLATION: mins ago`;
return $localize`:@@time-since:${dateStrings.i18nMins}:DATE: ago`;
}
return $localize`:@@time-since.minutes.ago:${counter}:INTERPOLATION: minutes ago`;
return $localize`:@@time-since:${dateStrings.i18nMinutes}:DATE: ago`;
case 'second':
if (document.body.clientWidth < 768) {
return $localize`:@@time-since.secs.ago:${counter}:INTERPOLATION: secs ago`;
return $localize`:@@time-since:${dateStrings.i18nSecs}:DATE: ago`;
}
return $localize`:@@time-since.seconds.ago:${counter}:INTERPOLATION: seconds ago`;
return $localize`:@@time-since:${dateStrings.i18nSeconds}:DATE: ago`;
}
}
}