diff --git a/src/app/modules/data/types/place/place-list-item.component.ts b/src/app/modules/data/types/place/place-list-item.component.ts
index 443bcec9..d640ced5 100644
--- a/src/app/modules/data/types/place/place-list-item.component.ts
+++ b/src/app/modules/data/types/place/place-list-item.component.ts
@@ -15,6 +15,7 @@
import {Component, Input} from '@angular/core';
import {SCBuilding, SCFloor, SCPointOfInterest, SCRoom} from '@openstapps/core';
import {PositionService} from '../../../map/position.service';
+import {Subscription, interval} from 'rxjs';
type placeTypes = (SCBuilding | SCRoom | SCPointOfInterest | SCFloor) & {
distance?: number;
@@ -51,6 +52,9 @@ export class PlaceListItemComponent {
this._item = item;
if (!isSCFloor(item)) {
this.distance = this.positionService.getDistance(item.geo.point);
+ this.distanceSubscription = interval(10_000).subscribe(_ => {
+ this.distance = this.positionService.getDistance(item.geo.point);
+ });
}
}
@@ -64,5 +68,7 @@ export class PlaceListItemComponent {
*/
distance?: number;
+ distanceSubscription?: Subscription;
+
constructor(private positionService: PositionService) {}
}
diff --git a/src/app/modules/data/types/place/place-list-item.html b/src/app/modules/data/types/place/place-list-item.html
index 345661ef..d4146272 100644
--- a/src/app/modules/data/types/place/place-list-item.html
+++ b/src/app/modules/data/types/place/place-list-item.html
@@ -20,12 +20,8 @@
}}
- {{
- distance
- | numberLocalized
- : 'style:unit,unit:meter,notation:compact'
- }}
+
+ {{ distance | metersLocalized }}
@@ -37,12 +33,8 @@
{{ 'type' | thingTranslate: item }}
- {{
- distance
- | numberLocalized
- : 'style:unit,unit:meter,notation:compact'
- }}
+
+ {{ distance | metersLocalized }}
diff --git a/src/app/translation/common-string-pipes.ts b/src/app/translation/common-string-pipes.ts
index addfee8d..cce3e294 100644
--- a/src/app/translation/common-string-pipes.ts
+++ b/src/app/translation/common-string-pipes.ts
@@ -25,7 +25,7 @@ const openingHoursFn = require('opening_hours');
@Injectable()
@Pipe({
name: 'join',
- pure: false, // required to update the value when the promise is resolved
+ pure: true,
})
export class ArrayJoinPipe implements PipeTransform {
value = '';
@@ -50,7 +50,7 @@ export class ArrayJoinPipe implements PipeTransform {
@Injectable()
@Pipe({
name: 'sentencecase',
- pure: false, // required to update the value when the promise is resolved
+ pure: true,
})
export class SentenceCasePipe implements PipeTransform {
value = '';
@@ -71,7 +71,7 @@ export class SentenceCasePipe implements PipeTransform {
@Injectable()
@Pipe({
name: 'split',
- pure: false, // required to update the value when the promise is resolved
+ pure: true,
})
export class StringSplitPipe implements PipeTransform {
value = new Array();
@@ -96,9 +96,9 @@ export class StringSplitPipe implements PipeTransform {
@Injectable()
@Pipe({
name: 'openingHours',
- pure: false, // required to update the value when the promise is resolved
+ pure: false,
})
-export class OpeningHoursPipe implements PipeTransform {
+export class OpeningHoursPipe implements PipeTransform, OnDestroy {
locale: string;
onLangChange?: Subscription;
@@ -115,6 +115,10 @@ export class OpeningHoursPipe implements PipeTransform {
}
}
+ ngOnDestroy(): void {
+ this._dispose();
+ }
+
transform(aString: string | unknown): string {
this.updateValue(aString);
this._dispose();
@@ -165,10 +169,86 @@ export class OpeningHoursPipe implements PipeTransform {
}
}
+@Injectable()
+@Pipe({
+ name: 'metersLocalized',
+ pure: false,
+})
+export class MetersLocalizedPipe implements PipeTransform, OnDestroy {
+ locale: string;
+
+ onLangChange?: Subscription;
+
+ value = '';
+
+ constructor(private readonly translate: TranslateService) {
+ this.locale = translate.currentLang;
+ }
+
+ private _dispose(): void {
+ if (this.onLangChange?.closed === false) {
+ this.onLangChange?.unsubscribe();
+ }
+ }
+
+ ngOnDestroy(): void {
+ this._dispose();
+ }
+
+ transform(value: string | number | unknown): string {
+ this.updateValue(value);
+ this._dispose();
+ if (this.onLangChange?.closed === true) {
+ this.onLangChange = this.translate.onLangChange.subscribe(
+ (event: LangChangeEvent) => {
+ this.locale = event.lang;
+ this.updateValue(value);
+ },
+ );
+ }
+
+ return this.value;
+ }
+
+ updateValue(value: string | number | unknown) {
+ if (typeof value !== 'string' && typeof value !== 'number') {
+ logger.warn(`metersLocalized pipe unable to parse input: ${value}`);
+
+ return;
+ }
+ const imperialLocale = ['US', 'UK', 'LR', 'MM'].some(term =>
+ this.locale.includes(term),
+ );
+ const meters =
+ typeof value === 'string' ? Number.parseFloat(value) : (value as number);
+
+ if (imperialLocale) {
+ const yards = meters * 1.0936;
+ const options = {
+ style: 'unit',
+ unit: yards >= 1760 ? 'mile' : 'yard',
+ maximumFractionDigits: yards >= 1760 ? 1 : 0,
+ } as unknown as Intl.NumberFormatOptions;
+ this.value = new Intl.NumberFormat(this.locale, options).format(
+ yards >= 1760 ? yards / 1760 : yards,
+ );
+ } else {
+ const options = {
+ style: 'unit',
+ unit: meters >= 1000 ? 'kilometer' : 'meter',
+ maximumFractionDigits: meters >= 1000 ? 1 : 0,
+ } as unknown as Intl.NumberFormatOptions;
+ this.value = new Intl.NumberFormat(this.locale, options).format(
+ meters >= 1000 ? meters / 1000 : meters,
+ );
+ }
+ }
+}
+
@Injectable()
@Pipe({
name: 'numberLocalized',
- pure: false, // required to update the value when the promise is resolved
+ pure: false,
})
export class NumberLocalizedPipe implements PipeTransform, OnDestroy {
locale: string;
@@ -237,7 +317,7 @@ export class NumberLocalizedPipe implements PipeTransform, OnDestroy {
@Injectable()
@Pipe({
name: 'dateFormat',
- pure: false, // required to update the value when the promise is resolved
+ pure: false,
})
export class DateLocalizedFormatPipe implements PipeTransform, OnDestroy {
locale: string;
diff --git a/src/app/translation/thing-translate.module.ts b/src/app/translation/thing-translate.module.ts
index ebeac613..b97955c8 100644
--- a/src/app/translation/thing-translate.module.ts
+++ b/src/app/translation/thing-translate.module.ts
@@ -18,6 +18,7 @@ import {
ArrayJoinPipe,
DateLocalizedFormatPipe,
NumberLocalizedPipe,
+ MetersLocalizedPipe,
SentenceCasePipe,
StringSplitPipe,
OpeningHoursPipe,
@@ -40,6 +41,7 @@ export interface ThingTranslateModuleConfig {
declarations: [
ArrayJoinPipe,
NumberLocalizedPipe,
+ MetersLocalizedPipe,
StringSplitPipe,
ThingPropertyNameTranslatePipe,
ThingTranslatePipe,
@@ -50,6 +52,7 @@ export interface ThingTranslateModuleConfig {
exports: [
ArrayJoinPipe,
NumberLocalizedPipe,
+ MetersLocalizedPipe,
StringSplitPipe,
ThingPropertyNameTranslatePipe,
ThingTranslatePipe,