Skip to content

Commit

Permalink
fix(client): localize decimal separator
Browse files Browse the repository at this point in the history
  • Loading branch information
kontrollanten committed Jan 27, 2021
1 parent 5d84d71 commit 1fe74db
Show file tree
Hide file tree
Showing 2 changed files with 16 additions and 9 deletions.
20 changes: 13 additions & 7 deletions client/src/app/shared/shared-main/angular/number-formatter.pipe.ts
Original file line number Diff line number Diff line change
@@ -1,14 +1,9 @@
import { Pipe, PipeTransform } from '@angular/core'
import { Inject, LOCALE_ID, Pipe, PipeTransform } from '@angular/core'

// Thanks: https://github.com/danrevah/ngx-pipes/blob/master/src/ng-pipes/pipes/math/bytes.ts

@Pipe({ name: 'myNumberFormatter' })
export class NumberFormatterPipe implements PipeTransform {
private dictionary: Array<{max: number, type: string}> = [
{ max: 1000, type: '' },
{ max: 1000000, type: 'K' },
{ max: 1000000000, type: 'M' }
]

/**
* @param x number
Expand All @@ -21,14 +16,25 @@ export class NumberFormatterPipe implements PipeTransform {
return +f
}

private dictionary: Array<{max: number, type: string}> = [
{ max: 1000, type: '' },
{ max: 1000000, type: 'K' },
{ max: 1000000000, type: 'M' }
]
constructor (@Inject(LOCALE_ID) private localeId: string) {}

transform (value: number) {
const format = this.dictionary.find(d => value < d.max) || this.dictionary[this.dictionary.length - 1]
const calc = value / (format.max / 1000)
const integralPart = Math.floor(calc)
const decimalPart = NumberFormatterPipe.getDecimalForNumber(calc)
const decimalSeparator = Intl.NumberFormat(this.localeId)
.formatToParts(1.1)
.find(part => part.type === 'decimal')
.value

return integralPart < 10 && decimalPart > 0
? `${integralPart}.${decimalPart}${format.type}`
? `${integralPart}${decimalSeparator}${decimalPart}${format.type}`
: `${integralPart}${format.type}`
}
}
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import { mapValues, pick } from 'lodash-es'
import { Component, ElementRef, ViewChild } from '@angular/core'
import { Component, ElementRef, Inject, LOCALE_ID, ViewChild } from '@angular/core'
import { AuthService, Notifier } from '@app/core'
import { NgbActiveModal, NgbModal } from '@ng-bootstrap/ng-bootstrap'
import { VideoCaption, VideoFile, VideoPrivacy } from '@shared/models'
Expand Down Expand Up @@ -34,13 +34,14 @@ export class VideoDownloadComponent {
private numbersPipe: NumberFormatterPipe

constructor (
@Inject(LOCALE_ID) private localeId: string,
private notifier: Notifier,
private modalService: NgbModal,
private videoService: VideoService,
private auth: AuthService
) {
this.bytesPipe = new BytesPipe()
this.numbersPipe = new NumberFormatterPipe()
this.numbersPipe = new NumberFormatterPipe(this.localeId)
}

get typeText () {
Expand Down

0 comments on commit 1fe74db

Please sign in to comment.