Added imperial support

FANMixco · Sep 27, 2021 · 383e80f · 383e80f
1 parent 04b7fae
commit 383e80f
Show file tree

Hide file tree

Showing 9 changed files with 111 additions and 67 deletions.
diff --git a/assets/img/amalthea.png b/assets/img/amalthea.png
diff --git a/assets/img/makemake.png b/assets/img/makemake.png
diff --git a/index.html b/index.html
@@ -35,5 +35,5 @@
 
     gtag('config', 'UA-7438484-10');
   </script>
-<script src="runtime-es2015.0dae8cbc97194c7caed4.js" type="module"></script><script src="runtime-es5.0dae8cbc97194c7caed4.js" nomodule defer></script><script src="polyfills-es5.2013f61b0c68954dc5fe.js" nomodule defer></script><script src="polyfills-es2015.6bbcfbfc206c4431c553.js" type="module"></script><script src="scripts.398eba890b2b1ad4a57f.js" defer></script><script src="main-es2015.999ab4404029898a4fba.js" type="module"></script><script src="main-es5.999ab4404029898a4fba.js" nomodule defer></script></body>
+<script src="runtime-es2015.0dae8cbc97194c7caed4.js" type="module"></script><script src="runtime-es5.0dae8cbc97194c7caed4.js" nomodule defer></script><script src="polyfills-es5.2013f61b0c68954dc5fe.js" nomodule defer></script><script src="polyfills-es2015.6bbcfbfc206c4431c553.js" type="module"></script><script src="scripts.398eba890b2b1ad4a57f.js" defer></script><script src="main-es2015.9deec87b0a2a0641f720.js" type="module"></script><script src="main-es5.9deec87b0a2a0641f720.js" nomodule defer></script></body>
 </html>
diff --git a/main-es2015.999ab4404029898a4fba.js → main-es2015.9deec87b0a2a0641f720.js b/main-es2015.999ab4404029898a4fba.js → main-es2015.9deec87b0a2a0641f720.js
diff --git a/main-es5.999ab4404029898a4fba.js → main-es5.9deec87b0a2a0641f720.js b/main-es5.999ab4404029898a4fba.js → main-es5.9deec87b0a2a0641f720.js
diff --git a/source_code/src/app/app.component.html b/source_code/src/app/app.component.html
@@ -4,6 +4,6 @@
 
 <app-footer [hidden]="!status"></app-footer>
 
-<app-toasts></app-toasts>
+<app-toasts [hidden]="!noMessage"></app-toasts>
 
 <router-outlet></router-outlet>
diff --git a/source_code/src/app/app.component.ts b/source_code/src/app/app.component.ts
@@ -13,12 +13,14 @@ export class AppComponent {
   title = 'GNow';
   localStorage:LocalStorage = new LocalStorage();
   status: boolean;
+  noMessage: boolean;
 
   constructor(public toastService: ToastService, private route: ActivatedRoute) {
     this.getFirstRun();
 
     this.route.queryParams.subscribe(params => {
       this.status = params['isApp'] == "true" ? false : true;
+      this.noMessage = params['noMessage'] == "true" ? false : true;
     });
   }
 

diff --git a/source_code/src/app/classes/gravity.ts b/source_code/src/app/classes/gravity.ts
@@ -16,7 +16,7 @@ export class Gravity {
     return jsonResult;
   }
 
-  public GetGravity(lat : number, alt: number, isMap: boolean = true, isImperial:boolean =false):number {
+  public GetGravity(lat : number, alt: number, isMap: boolean = true, isImperial:boolean = false):number {
     if (!isMap) {
       if (lat < -90 || lat > 90) {
         return WrongValues.Latitude;

diff --git a/source_code/src/app/osm-map/osm-map.component.ts b/source_code/src/app/osm-map/osm-map.component.ts
@@ -1,10 +1,10 @@
-import { Component, OnInit, HostListener, Input, Injectable } from '@angular/core';
+import { Component, OnInit, HostListener } from '@angular/core';
 import { Gravity } from '../classes/gravity';
 import { OsmMessageServiceService } from '../services/osm-message-service.service';
 import { OsmLocation } from '../classes/osm-location';
 import { Observable } from 'rxjs';
 import { TranslateService } from '@ngx-translate/core';
-import { ActivatedRoute } from '@angular/router';
+import { ActivatedRoute, Router } from '@angular/router';
 
 // declare variable
 declare let L;
@@ -26,8 +26,10 @@ export class OsmMapComponent implements OnInit {
   currentLocation: Observable<OsmLocation>;
   osmLocationSubject$ = this.service.osmLocationSubject$;
   status: boolean = false;
+  defaultUnits:string = 'm/s²';
+  newLoc: number[];
 
-  constructor(private service: OsmMessageServiceService, private translateService: TranslateService, private route: ActivatedRoute) { }
+  constructor(private service: OsmMessageServiceService, private translateService: TranslateService, private route: ActivatedRoute, private router: Router) { }
 
   @HostListener('window:resize')
   onWindowResize() {
@@ -42,78 +44,118 @@ export class OsmMapComponent implements OnInit {
     this.mapHeight = mapHeight;
   }
 
-  setNewMarker(loc, translations){
-    new Gravity().getAltitude(parseFloat(loc[0]),parseFloat(loc[1])).then(function(result){
-      let markerIcon = new L.DivIcon({
-        className: 'my-div-icon',
-        html: `<img style="height:32px;width:23.5px" class="my-div-image" src="assets/img/Map_pin_icon.svg"/>
-                  <span class="my-div-span">${new Gravity().GetGravity(result.elevations[0].lat, result.elevations[0].elevation).toFixed(4)}m/s²</span>`
-      });
-      new L.marker(loc, { icon: markerIcon }).bindTooltip(`${translations.Latitude}: ${result.elevations[0].lat.toFixed(2)}°, ${translations.Longitude}: ${result.elevations[0].lon.toFixed(2)}°, ${translations.Altitude}: ${result.elevations[0].elevation}m`).addTo(OsmMapComponent.map);
-    });
-  }
+  async setNewMarker(loc, translations){
+    let result = await new Gravity().getAltitude(parseFloat(loc[0]),parseFloat(loc[1]));
 
-  ngOnInit() {
-    this.route.queryParams.subscribe(params => {
-      if (params['isApp']) {
-        this.status = params['isApp'] == "true" ? true : false;
-      }
-    });
+    let isImperial = localStorage.getItem('isMetric') == "true" ? false : true;
 
-    this.service.osmLocationSubject$.subscribe(value => { 
-      if (value.lat != undefined && value.lon != undefined){
-        this.setNewMarker([value.lat,value.lon], this.translateService.store.translations[`${this.translateService.defaultLang}`]); 
-        OsmMapComponent.map.setView([value.lat,value.lon], 4);
-      }
-    });
-
-    let curLocation = [];
-    //El Salvador
-    curLocation = [13.905190, -89.500206];      
-
-    OsmMapComponent.map = L.map('map').setView(curLocation, 4);
-
-    L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
-      attribution: '© <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
-    }).addTo(OsmMapComponent.map);
-
-    L.control.locate().addTo(OsmMapComponent.map);
-    OsmMapComponent.map.attributionControl.setPrefix(false);
-
-    let markerIcon = L.icon({
-      iconUrl: 'assets/img/Map_pin_icon_green.svg',
-      iconSize: [94 / 3, 128 / 3], // size of the icon
+    let markerIcon = new L.DivIcon({
+      className: 'my-div-icon',
+      html: `<img style="height:32px;width:23.5px" class="my-div-image" src="assets/img/Map_pin_icon.svg"/>
+                <span class="my-div-span">${new Gravity().GetGravity(result.elevations[0].lat, result.elevations[0].elevation, true, isImperial).toFixed(4)}${this.defaultUnits}</span>`
     });
+    new L.marker(loc, { icon: markerIcon }).bindTooltip(`${translations.Latitude}: ${result.elevations[0].lat.toFixed(2)}°, ${translations.Longitude}: ${result.elevations[0].lon.toFixed(2)}°, ${translations.Altitude}: ${result.elevations[0].elevation}m`).addTo(OsmMapComponent.map);
+  }
 
-    let marker = new L.marker(curLocation, {
-      icon: markerIcon,
-      draggable: 'true'
+  ngOnInit() {
+    this.router.events
+      .subscribe(e => {
+        if (e.constructor.name === 'NavigationEnd' && this.router.navigated) {
+          this.route.queryParams.subscribe(params => {
+
+            let isDraggable = true;
+            let isMetric = true;
+
+            if (params['isApp']) {
+              this.status = params['isApp'] == "true" ? true : false;
+            }
+            if (params['isMetric']) {
+              isMetric = params['isMetric'] == "true" ? true : false;
+              if (!isMetric) {
+                this.defaultUnits = 'ft/s²';
+              }
+            }
+            if (params['newLoc']) {
+              this.newLoc = params['newLoc'].split(',').map(Number);
+            }
+
+            localStorage.setItem('isMetric', `${isMetric}`);
+            localStorage.setItem('defaultUnits', this.defaultUnits);
+
+            this.service.osmLocationSubject$.subscribe(value => { 
+              if (value.lat != undefined && value.lon != undefined){
+                this.setNewMarker([value.lat,value.lon], this.translateService.store.translations[`${this.translateService.defaultLang}`]); 
+                OsmMapComponent.map.setView([value.lat,value.lon], 4);
+              }
+            });
+
+            let curLocation = [];
+
+            if (this.newLoc) {
+              curLocation = [this.newLoc[0], this.newLoc[1]];
+              isDraggable = false;
+
+              let isImperial = isMetric ? false : true;
+
+              new Gravity().getAltitude(this.newLoc[0], this.newLoc[1]).then(function(result){
+                return new Gravity().GetGravity(result.elevations[0].lat, result.elevations[0].elevation, true, isImperial).toFixed(2);
+              }).then(gResult =>{
+                this.gravityResult = gResult;
+                document.getElementById("lblGravity").innerHTML = `${gResult}`;
+                document.getElementById("lblGUnit").innerHTML = this.defaultUnits;
+              });
+            }
+            else {
+              //El Salvador
+              curLocation = [13.905190, -89.500206];
+            }
+
+            OsmMapComponent.map = L.map('map').setView(curLocation, 4);
+
+            L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
+              attribution: '© <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
+            }).addTo(OsmMapComponent.map);
+
+            L.control.locate().addTo(OsmMapComponent.map);
+            OsmMapComponent.map.attributionControl.setPrefix(false);
+
+            let markerIcon = L.icon({
+              iconUrl: 'assets/img/Map_pin_icon_green.svg',
+              iconSize: [94 / 3, 128 / 3], // size of the icon
+            });
+
+            let marker = new L.marker(curLocation, {
+              icon: markerIcon,
+              draggable: isDraggable
+            });
+
+            marker.on('dragend', this.dragMarker);
+
+            OsmMapComponent.map.addLayer(marker);
+
+            OsmMapComponent.map.on('click', e => this.setNewMarker([e.latlng.lat, e.latlng.lng], this.translateService.store.translations[`${this.translateService.defaultLang}`]));
+
+            OsmMapComponent.map.on('locationfound', e => this.setNewMarker([e.latlng.lat, e.latlng.lng], this.translateService.store.translations[`${this.translateService.defaultLang}`]));
+            this.resizeMap();
+          });
+        }
     });
-
-    marker.on('dragend', this.dragMarker);
-
-    OsmMapComponent.map.addLayer(marker);
-
-    OsmMapComponent.map.on('click', e => this.setNewMarker([e.latlng.lat, e.latlng.lng], this.translateService.store.translations[`${this.translateService.defaultLang}`]));
-
-    OsmMapComponent.map.on('locationfound', e => this.setNewMarker([e.latlng.lat, e.latlng.lng], this.translateService.store.translations[`${this.translateService.defaultLang}`]));
-    this.resizeMap();
   }
 
-  dragMarker(event:any) {
+  async dragMarker(event:any) {
     // @ts-ignore
     let position = this.getLatLng();
     // @ts-ignore
     this.setLatLng(position, {
       draggable: 'true'
     }).bindPopup(position).update();
 
-    new Gravity().getAltitude(position.lat,position.lng).then(function(result){
-      return new Gravity().GetGravity(result.elevations[0].lat, result.elevations[0].elevation).toFixed(2);
-    }).then(gResult =>{
-      this.gravityResult = gResult;
-      document.getElementById("lblGravity").innerHTML = `${gResult}`;
-      document.getElementById("lblGUnit").innerHTML = `m/s²`;
-    });
+    let isImperial = localStorage.getItem('isMetric') == "true" ? false : true;
+
+    let result = await new Gravity().getAltitude(position.lat, position.lng);
+    let gResult = new Gravity().GetGravity(result.elevations[0].lat, result.elevations[0].elevation, true, isImperial).toFixed(2);
+
+    document.getElementById("lblGravity").innerHTML = `${gResult}`;
+    document.getElementById("lblGUnit").innerHTML = localStorage.getItem('defaultUnits');
   }
 }