Skip to content

Commit

Permalink
refactor: create MapView service AB#23655
Browse files Browse the repository at this point in the history
  • Loading branch information
arsforza committed Sep 21, 2023
1 parent 1bc7971 commit e5c1c8b
Show file tree
Hide file tree
Showing 5 changed files with 132 additions and 32 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -15,13 +15,15 @@
<ion-label color="ibf-black"
><ion-text
><strong>{{
getAggregatesHeader().headerLabel
getAggregatesHeader(mapView | async).headerLabel
}}</strong></ion-text
></ion-label
>
<ion-label color="ibf-black"
><ion-text
[innerHTML]="getAggregatesHeader().subHeaderLabel"
[innerHTML]="
getAggregatesHeader(mapView | async).subHeaderLabel
"
></ion-text
></ion-label> </ion-col
>`
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ import {
} from '@angular/core';
import { PopoverController } from '@ionic/angular';
import { TranslateService } from '@ngx-translate/core';
import { Subscription } from 'rxjs';
import { Observable, Subscription } from 'rxjs';
import {
AnalyticsEvent,
AnalyticsPage,
Expand All @@ -25,14 +25,10 @@ import { IbfLayerName } from 'src/app/types/ibf-layer';
import { Indicator, NumberFormat } from 'src/app/types/indicator-group';
import { DisasterTypeService } from '../../services/disaster-type.service';
import { EapActionsService } from '../../services/eap-actions.service';
import { MapViewService } from '../../services/map-view.service';
import { MapView } from '../../types/map-view';
import { TriggeredArea } from '../../types/triggered-area';
import { LayerControlInfoPopoverComponent } from '../layer-control-info-popover/layer-control-info-popover.component';

enum MapView {
national = 'national',
event = 'event',
adminArea = 'admin-area',
}
@Component({
selector: 'app-aggregates',
templateUrl: './aggregates.component.html',
Expand Down Expand Up @@ -60,6 +56,7 @@ export class AggregatesComponent implements OnInit, OnDestroy {
private allPrefix: string;

public eventState: EventState;
public mapView: Observable<MapView>;

private indicatorSubscription: Subscription;
private countrySubscription: Subscription;
Expand All @@ -83,6 +80,7 @@ export class AggregatesComponent implements OnInit, OnDestroy {
private translateService: TranslateService,
private analyticsService: AnalyticsService,
private eapActionsService: EapActionsService,
private mapViewService: MapViewService,
) {
this.initialEventStateSubscription = this.eventService
.getInitialEventStateSubscription()
Expand Down Expand Up @@ -121,6 +119,8 @@ export class AggregatesComponent implements OnInit, OnDestroy {
this.eapActionSubscription = this.eapActionsService
.getTriggeredAreas()
.subscribe(this.onTriggeredAreasChange);

this.mapView = this.mapViewService.getMapViewSubscription();
}

ngOnDestroy() {
Expand Down Expand Up @@ -241,7 +241,7 @@ export class AggregatesComponent implements OnInit, OnDestroy {
);
}

public getAggregatesHeader() {
public getAggregatesHeader(mapView: MapView) {
const disasterTypeLabel = `${this.disasterType?.label
?.charAt(0)
.toUpperCase()}${this.disasterType?.label?.substring(1)}`;
Expand Down Expand Up @@ -275,8 +275,8 @@ export class AggregatesComponent implements OnInit, OnDestroy {
};

return {
headerLabel: header[this.getMapView()],
subHeaderLabel: subHeader[this.getMapView()],
headerLabel: header[mapView],
subHeaderLabel: subHeader[mapView],
};
}

Expand Down Expand Up @@ -397,26 +397,6 @@ export class AggregatesComponent implements OnInit, OnDestroy {
this.aggregatesPlaceCodes = filtered.map((a) => a.placeCode);
};

public getMapView(): MapView {
if (!this.eventState?.event && this.placeCodeHover) {
return MapView.adminArea;
}

if (!this.eventState || !this.eventState.event) {
return MapView.national;
}

if (this.eventState.event && !this.placeCode && !this.placeCodeHover) {
return this.eventHasName() ? MapView.event : MapView.national;
}

if (this.placeCode || this.placeCodeHover) {
return MapView.adminArea;
}

return MapView.national;
}

public eventHasName(): boolean {
if (
!this.eventState ||
Expand Down
15 changes: 15 additions & 0 deletions interfaces/IBF-dashboard/src/app/services/map-view.service.spec.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,15 @@
import { TestBed } from '@angular/core/testing';
import { MapViewService } from './map-view.service';

describe('MapViewService', () => {
let service: MapViewService;

beforeEach(() => {
TestBed.configureTestingModule({});
service = TestBed.inject(MapViewService);
});

it('should be created', () => {
expect(service).toBeTruthy();
});
});
98 changes: 98 additions & 0 deletions interfaces/IBF-dashboard/src/app/services/map-view.service.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,98 @@
import { Injectable } from '@angular/core';
import { BehaviorSubject, Observable } from 'rxjs';
import { PlaceCode } from '../models/place-code.model';
import { EventState } from '../types/event-state';
import { MapView } from '../types/map-view';
import { EventService } from './event.service';
import { PlaceCodeService } from './place-code.service';

@Injectable({
providedIn: 'root',
})
export class MapViewService {
private mapViewSubject = new BehaviorSubject<MapView>(null);
private mapView: MapView;

private eventState: EventState;
private placeCode: PlaceCode;
private placeCodeHover: PlaceCode;

constructor(
private eventService: EventService,
private placeCodeService: PlaceCodeService,
) {
this.eventService
.getInitialEventStateSubscription()
.subscribe(this.onEventStateChange);
this.eventService
.getManualEventStateSubscription()
.subscribe(this.onEventStateChange);
this.placeCodeService
.getPlaceCodeSubscription()
.subscribe(this.onPlacecodeChange);
this.placeCodeService
.getPlaceCodeHoverSubscription()
.subscribe(this.onPlacecodeHoverChange);
}

private setMapView(view: MapView) {
this.mapView = view;
this.mapViewSubject.next(this.mapView);
}

private updateMapView() {
if (!this.eventState?.event && this.placeCodeHover) {
this.setMapView(MapView.adminArea);
return;
}

if (!this.eventState || !this.eventState.event) {
this.setMapView(MapView.national);
return;
}

if (this.eventState.event && !this.placeCode && !this.placeCodeHover) {
this.eventHasName()
? this.setMapView(MapView.event)
: this.setMapView(MapView.national);
return;
}

if (this.placeCode || this.placeCodeHover) {
this.setMapView(MapView.adminArea);
return;
}

this.setMapView(MapView.national);
}

public getMapViewSubscription(): Observable<MapView> {
return this.mapViewSubject.asObservable();
}

private onEventStateChange = (eventState: EventState) => {
this.eventState = eventState;
this.updateMapView();
};

private onPlacecodeChange = (pc: PlaceCode) => {
this.placeCode = pc;
this.updateMapView();
};
private onPlacecodeHoverChange = (pc: PlaceCode) => {
this.placeCodeHover = pc;
this.updateMapView();
};

private eventHasName(): boolean {
if (
!this.eventState ||
!this.eventState.event ||
!this.eventState.event.eventName
) {
return false;
}

return true;
}
}
5 changes: 5 additions & 0 deletions interfaces/IBF-dashboard/src/app/types/map-view.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
export enum MapView {
national = 'national',
event = 'event',
adminArea = 'admin-area',
}

0 comments on commit e5c1c8b

Please sign in to comment.