diff --git a/apps/fxc-front/src/app/components/ui/ionic.ts b/apps/fxc-front/src/app/components/ui/ionic.ts index 1adb721a..c08a8943 100644 --- a/apps/fxc-front/src/app/components/ui/ionic.ts +++ b/apps/fxc-front/src/app/components/ui/ionic.ts @@ -48,8 +48,9 @@ import { defineCustomElement as d44 } from '@ionic/core/components/ion-title'; import { defineCustomElement as d45 } from '@ionic/core/components/ion-toast'; import { defineCustomElement as d46 } from '@ionic/core/components/ion-toggle'; import { defineCustomElement as d47 } from '@ionic/core/components/ion-toolbar'; +import { defineCustomElement as d48 } from '@ionic/core/components/ion-searchbar'; -import { defineCustomElement as d48 } from './ion-router'; +import { defineCustomElement as d49 } from './ion-router'; export function ionicInit(): void { initialize(); @@ -101,4 +102,5 @@ export function ionicInit(): void { d46(); d47(); d48(); + d49(); } diff --git a/apps/fxc-front/src/app/components/ui/live-modal.ts b/apps/fxc-front/src/app/components/ui/live-modal.ts index 088a96e7..fa82a2fb 100644 --- a/apps/fxc-front/src/app/components/ui/live-modal.ts +++ b/apps/fxc-front/src/app/components/ui/live-modal.ts @@ -13,7 +13,7 @@ import { RootState, store } from '../../redux/store'; import { getUniqueContrastColor } from '../../styles/track'; // Maximum number of pilots to list. -const MAX_PILOTS = 100; +const MAX_PILOTS = 200; // How long tracks are considered recent. const RECENT_PILOTS_HOUR = 3; @@ -37,6 +37,8 @@ export class LiveModal extends connect(store)(LitElement) { private location!: common.LatLon; @state() private currentLiveId?: string; + @state() + private filter = ''; private watchLocationId = 0; @@ -83,6 +85,9 @@ export class LiveModal extends connect(store)(LitElement) { > + + + ${this.getPilotItems()} @@ -107,6 +112,10 @@ export class LiveModal extends connect(store)(LitElement) { store.dispatch(setCenterOnLocation(watch)); } + private filterPilots(e: CustomEvent): void { + this.filter = e.detail.value; + } + private async watchLocation(watch: boolean): Promise { if ('geolocation' in navigator) { if (watch) { @@ -156,6 +165,13 @@ export class LiveModal extends connect(store)(LitElement) { let pilots = [...this.pilots]; const distances = new Map(); + if (this.filter.length > 0) { + const escapedFilter = this.filter.replace(/[.*+?^${}()|[\]\\]/g, '\\$&'); + pilots = pilots.filter((pilot) => { + return pilot.isEmergency || pilot.name.match(new RegExp(escapedFilter, 'i')); + }); + } + pilots.forEach((pilot) => { const distance = Math.round(getDistance(this.location, pilot.position)); distances.set(pilot.id, distance);