Refactors control center for traffic lights

This commit is contained in:
David Eder 2021-06-13 18:32:29 +02:00
parent 67b74e93c5
commit a31f330663
4 changed files with 65 additions and 32 deletions

View File

@ -1,4 +1,5 @@
<agm-map disableDefaultUI="true" id="map" #map [zoom]="zoom" [latitude]="center.lat" [longitude]="center.lng"> <agm-map disableDefaultUI="true" id="map" #map [zoom]="zoom" [latitude]="center.lat" [longitude]="center.lng">
<agm-marker (markerClick)="openInfoWindow(m.value.carEntity.vin)" [openInfoWindow]="true" <agm-marker (markerClick)="openInfoWindow(m.value.carEntity.vin)" [openInfoWindow]="true"
*ngFor="let m of car_markers | keyvalue" [iconUrl]="getIconUrlCar(m.value.carEvent.near_crash_event)" *ngFor="let m of car_markers | keyvalue" [iconUrl]="getIconUrlCar(m.value.carEvent.near_crash_event)"
[latitude]="m.value.carEvent.gps_location.latitude" [longitude]="m.value.carEvent.gps_location.longitude" [animation]="(m.value.carEvent.near_crash_event)?'BOUNCE':''"> [latitude]="m.value.carEvent.gps_location.latitude" [longitude]="m.value.carEvent.gps_location.longitude" [animation]="(m.value.carEvent.near_crash_event)?'BOUNCE':''">
@ -13,14 +14,16 @@
<p>NCE: {{m.value.carEvent.near_crash_event}}</p> <p>NCE: {{m.value.carEvent.near_crash_event}}</p>
</agm-info-window> </agm-info-window>
</agm-marker> </agm-marker>
<agm-marker *ngFor="let m of traffic_light_markers | keyvalue" [iconUrl]="m.value.iconUrl"
[latitude]="m.value.lat" [longitude]="m.value.lng"> <agm-marker *ngFor="let m of traffic_light_markers | keyvalue" [iconUrl]="trafficLightToImage(m.value.trafficLightEvent.color)"
[latitude]="m.value.trafficLightEntity.location[1]" [longitude]="m.value.trafficLightEntity.location[0]">
<agm-info-window> <agm-info-window>
<p>Id: {{m.value.id}}</p> <p>Id: {{m.value.trafficLightEntity.id}}</p>
<p>Switching Time: {{m.value.switchingTime}}</p> <p>Switching Time: {{m.value.trafficLightEntity.switchingTime}}</p>
<p>Range: {{m.value.range}}</p> <p>Range: {{m.value.trafficLightEntity.range}}</p>
<p>Color: {{m.value.color}}</p> <p>Color: {{m.value.trafficLightEvent.color}}</p>
<p>Last Switch: {{m.value.last_switch}}</p> <p>Last Switch: {{m.value.trafficLightEvent.last_switch}}</p>
</agm-info-window> </agm-info-window>
</agm-marker> </agm-marker>
</agm-map> </agm-map>

View File

@ -4,7 +4,13 @@ import {RestService} from '../../services/rest.service';
import {NGXLogger} from 'ngx-logger'; import {NGXLogger} from 'ngx-logger';
import {interval, Subscription} from 'rxjs'; import {interval, Subscription} from 'rxjs';
import {startWith, switchMap} from 'rxjs/operators'; import {startWith, switchMap} from 'rxjs/operators';
import {Car, CarEntity, CarEvent, GeoCoordinates} from '../../interfaces/interface'; import {
Car,
CarEntity,
CarEvent,
GeoCoordinates, TrafficLight,
TrafficLightEntity, TrafficLightEvent
} from '../../interfaces/interface';
@Component({ @Component({
selector: 'app-landing', selector: 'app-landing',
@ -70,13 +76,10 @@ export class LandingComponent implements OnInit {
switchMap(() => this.restService.getTrafficLightEvents(tlid)) switchMap(() => this.restService.getTrafficLightEvents(tlid))
).subscribe( ).subscribe(
(data: any) => { (data: any) => {
const traffic_light_event = data.body['cursor']; const trafficLightEvent = data.body as TrafficLightEvent;
const traffic_light = this.traffic_light_markers.get(traffic_light_event['tlid']); const trafficLight = this.traffic_light_markers.get(tlid) as TrafficLight;
traffic_light['color'] = traffic_light_event['color']; trafficLight.trafficLightEvent = trafficLightEvent;
traffic_light['last_switch'] = traffic_light_event['last_switch']; this.traffic_light_markers.set(tlid, trafficLight);
traffic_light['iconUrl'] = this.trafficLightToImage(traffic_light['color']);
this.traffic_light_markers.set(traffic_light_event['tlid'], traffic_light);
}, },
err => this.logger.error(err), err => this.logger.error(err),
() => { () => {
@ -87,19 +90,21 @@ export class LandingComponent implements OnInit {
getTrafficLights() { getTrafficLights() {
this.restService.getTrafficLights().subscribe( this.restService.getTrafficLights().subscribe(
(data: any) => { (data: TrafficLightEntity[]) => {
for (const traffic_light of data['cursor']) { for (const trafficLightEntity of data) {
traffic_light['iconUrl'] = this.trafficLightToImage(traffic_light['color']);
traffic_light['lat'] = traffic_light['location'][1]; const trafficLight: TrafficLight = {
traffic_light['lng'] = traffic_light['location'][0]; trafficLightEntity: trafficLightEntity,
this.traffic_light_markers.set(traffic_light['id'], traffic_light); trafficLightEvent: this.getEmptyTrafficLightEvent()
};
this.traffic_light_markers.set(trafficLightEntity['id'], trafficLight);
} }
}, },
err => this.logger.error(err), err => this.logger.error(err),
() => { () => {
this.logger.debug('loaded traffic lights'); this.logger.debug('loaded traffic lights');
for (const value of this.traffic_light_markers.values()) { for (const value of this.traffic_light_markers.values()) {
this.getTrafficLightEvents(value['id']); this.getTrafficLightEvents(value.trafficLightEntity['id']);
} }
} }
); );
@ -109,12 +114,10 @@ export class LandingComponent implements OnInit {
this.restService.getCars().subscribe( this.restService.getCars().subscribe(
(data: CarEntity[]) => { (data: CarEntity[]) => {
for (const carEntity of data) { for (const carEntity of data) {
const car: Car = { const car: Car = {
carEntity: carEntity, carEntity: carEntity,
carEvent: this.getEmptyCarEvent() carEvent: this.getEmptyCarEvent()
}; };
car.carEntity = carEntity;
this.car_markers.set(carEntity['vin'], car); this.car_markers.set(carEntity['vin'], car);
} }
}, },
@ -129,7 +132,7 @@ export class LandingComponent implements OnInit {
} }
private trafficLightToImage(trafficLight) { trafficLightToImage(trafficLight) {
return (trafficLight === 'RED') ? this.TL_RED_IMAGE : this.TL_GREEN_IMAGE; return (trafficLight === 'RED') ? this.TL_RED_IMAGE : this.TL_GREEN_IMAGE;
} }
@ -161,18 +164,26 @@ export class LandingComponent implements OnInit {
audio.play(); audio.play();
} }
private getEmptyCarEvent() { private getEmptyGeoCoordinates(): GeoCoordinates {
const geoCoordinates = { return {
latitude: 0, latitude: 0,
longitude: 0 longitude: 0
}; };
}
const carEvent = { private getEmptyCarEvent(): CarEvent {
return {
near_crash_event: false, near_crash_event: false,
gps_location: geoCoordinates, gps_location: this.getEmptyGeoCoordinates(),
timestamp: '' timestamp: ''
}; };
}
return carEvent; private getEmptyTrafficLightEvent(): TrafficLightEvent {
return {
last_switch: 0,
color: '',
tlid: 0
};
} }
} }

View File

@ -27,3 +27,22 @@ export interface Car {
carEntity: CarEntity; carEntity: CarEntity;
carEvent: CarEvent; carEvent: CarEvent;
} }
export interface TrafficLightEntity {
id: Number;
location: Number[];
range: Number;
switchingTime: Number;
color: String;
}
export interface TrafficLightEvent {
last_switch: Number;
color: String;
tlid: Number;
}
export interface TrafficLight {
trafficLightEntity: TrafficLightEntity;
trafficLightEvent: TrafficLightEvent;
}

View File

@ -39,7 +39,7 @@ def get_traffic_light_events():
print("Is the EVENT_STORE_URL running and reachable?") print("Is the EVENT_STORE_URL running and reachable?")
raise e raise e
return json_util.dumps({'cursor': traffic_lights}) return json_util.dumps(traffic_lights)
@app.route('/api/v1/resources/cars', methods=['GET']) @app.route('/api/v1/resources/cars', methods=['GET'])
@ -65,7 +65,7 @@ def get_traffic_lights():
print("Is the entity_ident_server running and reachable?") print("Is the entity_ident_server running and reachable?")
raise e raise e
return json_util.dumps({'cursor': traffic_lights}) return json_util.dumps(traffic_lights)
if __name__ == '__main__': if __name__ == '__main__':