From 62b2b9482e410279f7a600d5248302c68a421628 Mon Sep 17 00:00:00 2001
From: Andrii Moskalenko <av.moskalenko@csltd.com.ua>
Date: Thu, 19 Mar 2020 17:09:07 +0200
Subject: [PATCH 1/3] serverless simpleMap ready

---
 src/app/app.component.html | 24 ++++++++++++++++-----
 src/app/app.component.less | 43 +++++++++++++++++++++++++++++++++++++-
 src/app/app.component.ts   |  6 ++++++
 src/app/app.constants.ts   | 37 +++++++++++++++++++++++---------
 4 files changed, 94 insertions(+), 16 deletions(-)

diff --git a/src/app/app.component.html b/src/app/app.component.html
index 8def4fc..77dfb87 100644
--- a/src/app/app.component.html
+++ b/src/app/app.component.html
@@ -1,4 +1,7 @@
-<agm-map [fullscreenControl]="true"
+<h2>Поширення COVID-19 в Україні</h2>
+<div class="map-wrapper">
+
+    <agm-map [fullscreenControl]="true"
          (mapClick)="onMapClick($event)"
          [maxZoom]="10"
          [zoom]="6"
@@ -10,13 +13,24 @@
             <agm-marker (markerClick)="onMarkerClick($event, window)" [iconUrl]="marker.icon" [latitude]="marker.lat" [longitude]="marker.lng">
                 <agm-info-window #window>
                     <div class="info-wraper">
-                        <div>{{marker.name}}</div>
-                        <div class="cases-counter">{{marker.cases}} захворювань</div>
-                        <div *ngIf="marker.deaths" class="death-counter">{{marker.deaths}} смертей</div>
+                        <div class="region-name">{{marker.name}}</div>
+                        <div class="cases-counter">захворювань: {{marker.cases}}</div>
+                        <div *ngIf="marker.deaths" class="death-counter">смертей: {{marker.deaths}}</div>
                     </div>
                 </agm-info-window>
             </agm-marker>
 
         </ng-container>
 
-</agm-map>
+    </agm-map>
+
+    <div class="map-description">
+        <img src="assets/icons/circle-orange.png" alt="" class="src"><div>- регіон де виявили захворювання на короновірус</div>
+    </div>
+    <div class="general-info">
+        <div>Усього випадків: {{ casesAll }}</div>
+        <div>Усього смертей: {{ deathsAll }}</div>
+    </div>
+</div>
+
+
diff --git a/src/app/app.component.less b/src/app/app.component.less
index 3d02f4f..369dfc4 100644
--- a/src/app/app.component.less
+++ b/src/app/app.component.less
@@ -1,4 +1,45 @@
 agm-map {
     height: 600px;
     width: 1000px;
-  }
\ No newline at end of file
+}
+h2 {
+  text-align: center;
+  font-family: Arial, Helvetica, sans-serif;
+}
+
+img {
+  display: block;
+}
+.region-name {
+  font-weight: bold;
+  padding-bottom: 3px;
+}
+
+.death-counter {
+  font-family: Arial, Helvetica, sans-serif;
+}
+
+.cases-counter {
+  padding-bottom: 3px;
+  font-family: Arial, Helvetica, sans-serif;
+}
+
+.map-description {
+  display: grid;
+    grid-template-columns: 35px auto;
+    margin-top: 15px;
+    margin-left: 10px;
+}
+
+.map-wrapper {
+  height: 600px;
+  width: 1000px;
+  margin: auto;
+  font-family: Arial, Helvetica, sans-serif;
+}
+
+.general-info {
+  margin-top: 30px;
+  font-size: 20px;
+  line-height: 3rem;
+}
\ No newline at end of file
diff --git a/src/app/app.component.ts b/src/app/app.component.ts
index e104fb7..99dd4bc 100644
--- a/src/app/app.component.ts
+++ b/src/app/app.component.ts
@@ -11,6 +11,8 @@ export class AppComponent implements OnInit {
   lat = 48.4070118;
   lng = 32.6144772;
   markers = [];
+  casesAll = 0;
+  deathsAll = 0;
   private previous;
   constructor(private map: MapService) {
   }
@@ -19,6 +21,10 @@ export class AppComponent implements OnInit {
     this.markers = markers.map(marker => {
       return {...marker, icon: 'assets/icons/circle-orange.png'};
     });
+    this.markers.forEach(marker => {
+      if (Number(marker.cases)) { this.casesAll += marker.cases; }
+      if (Number(marker.deaths)) { this.deathsAll += marker.deaths; }
+    });
   }
 
   public onMarkerClick(e, infowindow) {
diff --git a/src/app/app.constants.ts b/src/app/app.constants.ts
index d29d617..e55bc85 100644
--- a/src/app/app.constants.ts
+++ b/src/app/app.constants.ts
@@ -1,16 +1,33 @@
 export const markers = [
-    {
-        id: 0,
-        name: 'Харківська область',
-        lat: 50.02,
-        lng: 36.14,
-        cases: 0
-    },
     {
         id: 0,
         name: 'Київська область',
         lat: 50.27,
-        lng: 30.30,
-        cases: 7
+        lng: 30.45,
+        cases: 2
+    },
+    {
+        id: 2,
+        name: 'Житомирська область',
+        lat: 50.05,
+        lng: 28.63,
+        cases: 1,
+        deaths: 1
+    },
+    {
+        id: 2,
+        name: 'Чернівецька область',
+        lat: 48.12,
+        lng: 26.05,
+        cases: 10,
+        deaths: 1
+    },
+    {
+        id: 3,
+        name: 'Донецька область',
+        lat: 47.85,
+        lng: 37.73,
+        cases: 1,
+        deaths: 0
     }
-]
\ No newline at end of file
+];

From 1970f105869b40a59a490c71c34416e346aa2860 Mon Sep 17 00:00:00 2001
From: Andrii Moskalenko <av.moskalenko@csltd.com.ua>
Date: Thu, 19 Mar 2020 17:22:44 +0200
Subject: [PATCH 2/3] build prod

---
 package.json               | 2 +-
 src/app/app.component.html | 4 ++--
 src/app/app.component.less | 1 +
 3 files changed, 4 insertions(+), 3 deletions(-)

diff --git a/package.json b/package.json
index c8c8a2d..cf84ba0 100644
--- a/package.json
+++ b/package.json
@@ -4,7 +4,7 @@
   "scripts": {
     "ng": "ng",
     "start": "ng serve",
-    "build": "ng build",
+    "build": "ng build --prod",
     "test": "ng test",
     "lint": "ng lint",
     "e2e": "ng e2e"
diff --git a/src/app/app.component.html b/src/app/app.component.html
index 77dfb87..92183d9 100644
--- a/src/app/app.component.html
+++ b/src/app/app.component.html
@@ -28,8 +28,8 @@ <h2>Поширення COVID-19 в Україні</h2>
         <img src="assets/icons/circle-orange.png" alt="" class="src"><div>- регіон де виявили захворювання на короновірус</div>
     </div>
     <div class="general-info">
-        <div>Усього випадків: {{ casesAll }}</div>
-        <div>Усього смертей: {{ deathsAll }}</div>
+        <div style="color: #aaa;">Усього випадків виявлено: {{ casesAll }}</div>
+        <div style="color: #696969;">Усього смертей: {{ deathsAll }}</div>
     </div>
 </div>
 
diff --git a/src/app/app.component.less b/src/app/app.component.less
index 369dfc4..8d4f689 100644
--- a/src/app/app.component.less
+++ b/src/app/app.component.less
@@ -5,6 +5,7 @@ agm-map {
 h2 {
   text-align: center;
   font-family: Arial, Helvetica, sans-serif;
+  color: #555;
 }
 
 img {

From 60c669cc28ddb3e8740668a76061232ea954e8f7 Mon Sep 17 00:00:00 2001
From: Andrii Moskalenko <av.moskalenko@csltd.com.ua>
Date: Thu, 19 Mar 2020 17:29:17 +0200
Subject: [PATCH 3/3] dist path changed

---
 angular.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/angular.json b/angular.json
index a6847d9..bb290ef 100644
--- a/angular.json
+++ b/angular.json
@@ -13,7 +13,7 @@
         "build": {
           "builder": "@angular-devkit/build-angular:browser",
           "options": {
-            "outputPath": "dist/corona-map",
+            "outputPath": "dist",
             "index": "src/index.html",
             "main": "src/main.ts",
             "polyfills": "src/polyfills.ts",