From 935b723bdb91b96e3b942b07f0865513174d0b30 Mon Sep 17 00:00:00 2001
From: Braun Patrik <braun.patrik@aut.bme.hu>
Date: Mon, 23 Jan 2017 21:29:07 +0100
Subject: [PATCH] positioning small map

---
 frontend/app/gallery/gallery.component.css          |  8 ++++++--
 frontend/app/gallery/gallery.component.html         |  3 ++-
 frontend/app/gallery/map/map.gallery.component.css  |  4 ++--
 frontend/app/gallery/map/map.gallery.component.html |  8 +++++++-
 frontend/app/gallery/map/map.gallery.component.ts   | 12 +++++++++---
 5 files changed, 26 insertions(+), 9 deletions(-)

diff --git a/frontend/app/gallery/gallery.component.css b/frontend/app/gallery/gallery.component.css
index 701cea6b..dc9c0cd9 100644
--- a/frontend/app/gallery/gallery.component.css
+++ b/frontend/app/gallery/gallery.component.css
@@ -1,3 +1,7 @@
-.sebm-google-map-container {
-    height: 300px;
+gallery-map {
+    margin-right: 0;
+    margin-left: auto;
+    display: block;
+    height: 80px;
+    width: 100px;
 }
\ No newline at end of file
diff --git a/frontend/app/gallery/gallery.component.html b/frontend/app/gallery/gallery.component.html
index 74fb7fa6..bb78babe 100644
--- a/frontend/app/gallery/gallery.component.html
+++ b/frontend/app/gallery/gallery.component.html
@@ -7,9 +7,10 @@
 
     <div body class="container" style="width: 100%; padding:0" *ngIf="_galleryService.content.directory">
         <gallery-navbar [directory]="_galleryService.content.directory"></gallery-navbar>
-        <gallery-map [photos]="_galleryService.content.directory.photos"></gallery-map>
+
         <gallery-directory *ngFor="let directory of _galleryService.content.directory.directories"
                            [directory]="directory"></gallery-directory>
+        <gallery-map [photos]="_galleryService.content.directory.photos"></gallery-map>
         <gallery-grid [photos]="_galleryService.content.directory.photos" [lightbox]="lightbox"></gallery-grid>
     </div>
 
diff --git a/frontend/app/gallery/map/map.gallery.component.css b/frontend/app/gallery/map/map.gallery.component.css
index f22105e5..3e97a28b 100644
--- a/frontend/app/gallery/map/map.gallery.component.css
+++ b/frontend/app/gallery/map/map.gallery.component.css
@@ -1,4 +1,4 @@
 .sebm-google-map-container {
-    height: 150px;
-    width: 200px;
+    width: 100%;
+    height: 100%;
 }
\ No newline at end of file
diff --git a/frontend/app/gallery/map/map.gallery.component.html b/frontend/app/gallery/map/map.gallery.component.html
index b5215aca..504ceed2 100644
--- a/frontend/app/gallery/map/map.gallery.component.html
+++ b/frontend/app/gallery/map/map.gallery.component.html
@@ -1,4 +1,10 @@
-<sebm-google-map [zoom]="0">
+<sebm-google-map
+        [disableDefaultUI]="true"
+        [zoomControl]="false"
+        [streetViewControl]="false"
+        [zoom]="0"
+        [latitude]="mapCenter.latitude"
+        [longitude]="mapCenter.longitude">
     <sebm-google-map-marker
 
             *ngFor="let photo of mapPhotos"
diff --git a/frontend/app/gallery/map/map.gallery.component.ts b/frontend/app/gallery/map/map.gallery.component.ts
index ec504ce7..356600db 100644
--- a/frontend/app/gallery/map/map.gallery.component.ts
+++ b/frontend/app/gallery/map/map.gallery.component.ts
@@ -10,12 +10,14 @@ export class GalleryMapComponent implements OnChanges {
 
     @Input() photos: Array<PhotoDTO>;
 
-    mapPhotos: Array<{latitude, longitude, iconUrl}> = [];
-
+    mapPhotos: Array<{latitude: string, longitude: string, iconUrl}> = [];
+    mapCenter = {latitude: "0", longitude: "0"};
 
     //TODO: fix zooming
     ngOnChanges() {
-        this.mapPhotos = this.photos.filter(p => p.metadata.positionData.GPSData).map(p => {
+        this.mapPhotos = this.photos.filter(p => {
+            return p.metadata && p.metadata.positionData && p.metadata.positionData.GPSData;
+        }).map(p => {
             return {
                 latitude: p.metadata.positionData.GPSData.latitude,
                 longitude: p.metadata.positionData.GPSData.longitude,
@@ -23,6 +25,10 @@ export class GalleryMapComponent implements OnChanges {
             };
         });
 
+        if (this.mapPhotos.length > 0) {
+            this.mapCenter = this.mapPhotos[0];
+        }
+
 
     }
 }