diff --git a/src/app/adjectives.ts b/src/app/adjectives.ts new file mode 100644 index 0000000..b470cd0 --- /dev/null +++ b/src/app/adjectives.ts @@ -0,0 +1,19 @@ +export const Adjectives = [ + 'strict', + 'poor', + 'old', + 'hot', + 'huge', + 'scared', + 'large', + 'tall', + 'antique', + 'complete', + 'offbeat', + 'selective', + 'unknown', + 'unwilling', + 'lively', + 'nebulous', + 'deranged' +]; diff --git a/src/app/models/mapSymbol.ts b/src/app/models/mapSymbol.ts index 60a55be..299c6ae 100644 --- a/src/app/models/mapSymbol.ts +++ b/src/app/models/mapSymbol.ts @@ -5,7 +5,7 @@ export interface LatLng { export interface MapData { circles?: Circle[]; - locations?: {latlng: LatLng, name: string}[]; + locations?: Marker[]; markers?: Marker[]; measurements?: Measurement[]; polygons?: Polygon[]; diff --git a/src/app/nounes.ts b/src/app/nounes.ts new file mode 100644 index 0000000..37924a4 --- /dev/null +++ b/src/app/nounes.ts @@ -0,0 +1,52 @@ +export const Nouns = [ + 'area', + 'book', + 'business', + 'case', + 'child', + 'company', + 'country', + 'day', + 'eye', + 'fact', + 'family', + 'government', + 'group', + 'hand', + 'home', + 'job', + 'life', + 'lot', + 'man', + 'money', + 'month', + 'mother', + 'Mr', + 'night', + 'number', + 'part', + 'people', + 'place', + 'point', + 'problem', + 'program', + 'question', + 'right', + 'room', + 'school', + 'state', + 'story', + 'student', + 'study', + 'system', + 'thing', + 'time', + 'water', + 'way', + 'week', + 'woman', + 'word', + 'work', + 'world', + 'year', +]; diff --git a/src/app/services/sync.service.ts b/src/app/services/sync.service.ts index f02c8ce..432f7e8 100644 --- a/src/app/services/sync.service.ts +++ b/src/app/services/sync.service.ts @@ -12,9 +12,10 @@ export class SyncService { private changed = false; private collection: AngularFirestoreCollection; private mapSub: Subscription; + private name: string; private saveRate = 5_000; - mapSymbols = new BehaviorSubject(null); + mapSymbols = new BehaviorSubject({}); constructor(private db: AngularFirestore) { this.collection = this.db.collection('Maps'); @@ -48,6 +49,18 @@ export class SyncService { this.changed = true; } + addMyLocation(location: Marker) { + let map = this.mapSymbols.value; + if(!map.locations) map.locations = []; + let markForSave = this.name == null; + this.name = location.label; + map.locations = map.locations.filter(l => l.label != location.label); + map.locations.push(location); + this.mapSymbols.next(map); + this.changed = true; + if(markForSave) this.save(); + } + addPolygon(polygon: Polygon) { let map = this.mapSymbols.value; if(!map.polygons) map.polygons = []; @@ -75,6 +88,7 @@ export class SyncService { delete(...symbols) { let map = this.mapSymbols.value; if(map.circles) symbols.forEach(s => map.circles = map.circles.filter(c => !_.isEqual(s, c))); + if(map.locations) symbols.forEach(s => map.locations = map.locations.filter(m => !_.isEqual(s, m))); if(map.markers) symbols.forEach(s => map.markers = map.markers.filter(m => !_.isEqual(s, m))); if(map.measurements) symbols.forEach(s => map.measurements = map.measurements.filter(m => !_.isEqual(s, m))); if(map.polygons) symbols.forEach(s => map.polygons = map.polygons.filter(p => !_.isEqual(s , p))); @@ -98,6 +112,14 @@ export class SyncService { setInterval(() => this.save(), this.saveRate); } + removeMyLocation() { + let map = this.mapSymbols.value; + if(map.locations) map.locations = map.locations.filter(l => l.label != this.name); + this.name = null; + this.changed = true; + this.save(); + } + save() { if(this.code && this.mapSymbols.value && this.changed) { this.collection.doc(this.code).set(this.mapSymbols.value); diff --git a/src/app/views/map/map.component.ts b/src/app/views/map/map.component.ts index 1cc5a5f..3a01991 100644 --- a/src/app/views/map/map.component.ts +++ b/src/app/views/map/map.component.ts @@ -1,4 +1,4 @@ -import {Component, isDevMode, OnInit} from "@angular/core"; +import {Component, HostListener, isDevMode, OnDestroy, OnInit} from "@angular/core"; import {PhysicsService} from "../../services/physics.service"; import {filter, finalize, flatMap, skip, take} from "rxjs/operators"; import {MatBottomSheet, MatSnackBar} from "@angular/material"; @@ -13,6 +13,8 @@ import {DimensionsDialogComponent} from "../../components/dimensionsDialog/dimen import {MatDialog} from "@angular/material/dialog"; import {SyncService} from "../../services/sync.service"; import {MapData, Marker} from "../../models/mapSymbol"; +import {Adjectives} from "../../adjectives"; +import {Nouns} from "../../nounes"; declare const L; @@ -22,11 +24,12 @@ declare const L; styleUrls: ['map.component.scss'], animations: [flyInRight, flyOutRight] }) -export class MapComponent implements OnInit { +export class MapComponent implements OnDestroy, OnInit { code: string; drawColor = '#ff4141'; isNaN = isNaN; map: MapService; + name: string; polygon: any; position; positionMarker = {arrow: null, circle: null}; @@ -198,13 +201,20 @@ export class MapComponent implements OnInit { }) } + @HostListener('window:beforeunload', ['$event']) + ngOnDestroy(): void { + this.syncService.removeMyLocation(); + } + ngOnInit() { + this.name = Adjectives[Math.round(Math.random() * Adjectives.length)] + ' ' + Nouns[Math.round(Math.random() * Nouns.length)]; this.map = new MapService('map'); // Handle drawing the map after updates this.syncService.mapSymbols.pipe(filter(s => !!s)).subscribe((map: MapData) => { this.map.deleteAll(); if (map.circles) map.circles.forEach(c => this.map.newCircle(c)); + if (map.locations) map.locations.filter(l => l.label != this.name).forEach(l => this.map.newMarker(l)); if (map.markers) map.markers.forEach(m => this.map.newMarker(m)); if (map.measurements) map.measurements.forEach(m => this.map.newMeasurement(m)); if (map.polygons) map.polygons.forEach(p => this.map.newPolygon(p)); @@ -227,11 +237,14 @@ export class MapComponent implements OnInit { } }); + + // Display location this.physicsService.info.pipe(filter(coord => !!coord)).subscribe(pos => { if (!this.position) this.center({lat: pos.latitude, lng: pos.longitude}); if (this.positionMarker.arrow) this.map.delete(this.positionMarker.arrow); if (this.positionMarker.circle) this.map.delete(this.positionMarker.circle); + this.syncService.addMyLocation({latlng: {lat: pos.latitude, lng: pos.longitude}, label: this.name}); this.positionMarker.arrow = this.map.newMarker({ latlng: {lat: pos.latitude, lng: pos.longitude}, noSelect: true,