Map position is updated live

diff --git a/src/components/app.html b/src/components/app.html
index c79e1f5d1b8a6a88820f73e9ca955876db022cfd..180fc53b2ef88d6c68e473aadfd7cd819eeb94d3 100644 (file)
--- a/src/components/app.html
+++ b/src/components/app.html
@@ -6,7 +6,7 @@
             <mou-map (newactive)="sidebar.update($event)" (neworg)="sidebar.add($event)"#map></mou-map>
         </div>
         <div class="col-md-4">
-            <mou-sidebar #sidebar></mou-sidebar>
+            <mou-sidebar (tempmarker)="map.tempMarker($event)" #sidebar></mou-sidebar>
         </div>
     </div>
 </div>

diff --git a/src/components/map/map.ts b/src/components/map/map.ts
index 8527eeb0d0f24102e62d5c63ac0b773a1aad3ce9..3c56d26de94f5267e1e11682632fd7454db28669 100644 (file)
--- a/src/components/map/map.ts
+++ b/src/components/map/map.ts
@@ -320,26 +320,6 @@ export class Map {
         let pos = this.getcurrentPos();
         let lat = pos.lat();
         let lng = pos.lng();
-        let map = this.map;
-
-
-
-          var
-         marker = new google.maps.Marker({
-         position: pos,
-         map: map,
-         title: 'newOrg',
-         icon: {
-         path: google.maps.SymbolPath.CIRCLE,
-         scale: 3
-         }
-         });
-         this
-         .
-         currentMarker = marker;
-         marker
-         .
-         setMap(map);
 
         let parent = this.getParent();
 
@@ -352,7 +332,7 @@ export class Map {
     }
 
     update(event) {
-        this.neworg.next(event);
+        this.newactive.next(event);
         let map = this.getMap();
         let http = this.getHttp();
 
@@ -373,6 +353,23 @@ export class Map {
 
     }
 
+
+    tempMarker(pos) {
+        let map = this.map;
+        if(this.currentMarker)
+            this.currentMarker.setMap(null);
+
+        this.currentMarker = new google.maps.Marker({
+            position: pos,
+            map: map,
+            title: 'neworg',
+            icon: {
+                path: google.maps.SymbolPath.CIRCLE,
+                scale: 3
+            }
+        });
+        this.currentMarker.setMap(map);
+    }
 }
 
 

diff --git a/src/components/sidebar/sidebar.ts b/src/components/sidebar/sidebar.ts
index 15d8845477c386ecc88adc49cfd8943c511eada5..46956f1a1ee1c1dc503b9150f9913520e20ccc70 100644 (file)
--- a/src/components/sidebar/sidebar.ts
+++ b/src/components/sidebar/sidebar.ts
@@ -1,4 +1,4 @@
-import {Component, NgFor, NgIf, NgModel, Control, ControlGroup, ControlArray, Validators, FormBuilder, CORE_DIRECTIVES,FORM_DIRECTIVES} from 'angular2/angular2';
+import {Component, NgFor, NgIf, EventEmitter, NgModel, Control, ControlGroup, ControlArray, Validators, FormBuilder, CORE_DIRECTIVES,FORM_DIRECTIVES} from 'angular2/angular2';
 import {Http, Headers} from 'angular2/http';
 
 declare var zone: Zone;
@@ -6,6 +6,7 @@ declare var zone: Zone;
 @Component({
     selector: 'mou-sidebar',
     directives: [CORE_DIRECTIVES, FORM_DIRECTIVES, NgFor, NgModel, NgIf],
+    events: ['tempmarker'],
     templateUrl: './components/sidebar/sidebar.html',
     styles: [`
         .ng-valid.ng-dirty {
@@ -22,6 +23,7 @@ declare var zone: Zone;
 })
 
 export class Sidebar {
+
     form: ControlGroup;
     http:Http;
     newObject: boolean;
@@ -51,6 +53,7 @@ export class Sidebar {
         this.editmode = false;
         this.active = false;
         this.coordinatePoint = false;
+        this.tempmarker = new EventEmitter();
 
         this.form = fb.group({
             "id": this.id,
@@ -69,6 +72,23 @@ export class Sidebar {
             "email": this.email,
             "phoneNumber": this.phoneNumber
         });
+        let instance = this;
+        this.lat.valueChanges.observer({
+            next: (value) => {
+                if(instance.lng.value && value) {
+                    let pos = {lat: value, lng: instance.lng.value};
+                    this.tempmarker.next(pos);
+                }
+            }
+        });
+        this.lng.valueChanges.observer({
+            next: (value) => {
+                if(instance.lat.value && value) {
+                    let pos = {lat: instance.lat.value, lng: value};
+                    this.tempmarker.next(pos);
+                }
+            }
+        });
     }
 
     update(orgunitId) {
@@ -149,12 +169,17 @@ export class Sidebar {
         this.editmode = false;
     }
 
+
     add(data){
         this.coordinatePoint = true;
         this.newObject=true;
         this.active = true;
         this.editmode = true;
 
+        for(control in this.form.controls){
+            this.form.controls[control].updateValue("");
+        }
+
         this.form.controls.lat.updateValue(data.location.lat);
         this.form.controls.lng.updateValue(data.location.lng);
         this.form.controls.parent.updateValue(data.parent);