adb9ac0e2c3f5da1e685f01e9204003244b37eb4
[u/erikhf/frm.git] / src / components / map / map.ts
1 import {Component, EventEmitter,CORE_DIRECTIVES,} from 'angular2/angular2';
2 import {Headers, Http} from 'angular2/http';
3
4
5 @Component({
6     selector: 'mou-map',
7     directives: [CORE_DIRECTIVES],
8     events: ['newactive'],
9     templateUrl: './components/map/map.html'
10 })
11
12
13 export class Map {
14
15     map:Object;
16     http:Http;
17     LEVEL:number;
18     runned:boolean;
19     parent:Object;
20     currentPos:Object;
21     uprunned:boolean;
22
23     constructor(http:Http) {
24         this.newactive = new EventEmitter();
25         this.newOrg = new EventEmitter();
26         this.map = new google.maps.Map(document.getElementById("map"), {center: {lat: 0, lng: 0}, zoom: 12});
27         this.init();
28         this.http = http;
29         this.LEVEL = 2;
30         this.runned = false;
31         this.getData('?paging=false&level=2', this);
32         this.parent = null;
33         this.currentPos = null;
34         this.uprunned = false;
35
36     }
37
38     getMap() {
39         return this.map;
40     }
41
42     getHttp() {
43         return this.http;
44     }
45
46     setcurrentPos(latlng) {
47         this.currentPos = latlng;
48     }
49
50     getcurrentPos() {
51         return this.currentPos;
52     }
53
54     setParent(id) {
55         this.parent = id;
56     }
57
58     getParent() {
59         return this.parent;
60     }
61
62     setRunned(value) {
63         this.runned = value;
64     }
65
66     setupRunned(value) {
67         this.uprunned = value;
68     }
69
70     setLevel(value) {
71         this.LEVEL = value;
72     }
73
74     addLevel() {
75         this.LEVEL++;
76     }
77
78     upLevel() {
79         this.LEVEL--;
80     }
81
82     init() {
83
84         let map = this.map;
85         let pos = {lat: 9.1, lng: -10.6};
86
87         map.setCenter(pos, 12);
88     }
89
90     logError(error) {
91         console.error(error);
92
93     }
94
95     getData(query, instance, isParent) {
96         console.log("hoi");
97         instance.http.get(dhisAPI + '/api/organisationUnits' + query)
98             .map(res => res.json())
99             .subscribe(
100                 res => instance.parseResult(res, instance, isParent),
101                 error => instance.logError(error)
102             );
103     }
104
105     parseResult(res, instance, isParent) {
106         console.log(res);
107
108
109         if (isParent) {
110             instance.setParent(res.parent.id);
111             instance.getData('/' + res.parent.id + '/children', instance, false);
112         }
113         else {
114             if (res.organisationUnits) {
115                 for (let item in res.organisationUnits) {
116                     this.getData('/' + res.organisationUnits[item].id, this);
117
118                 }
119                 instance.setupRunned(false);
120                 instance.setRunned(false);
121             } else if (!res.displayName && res.children) {
122                 console.log("children");
123                 for (let item in res.children) {
124                     console.log(res.children[item].level + " og " + instance.LEVEL);
125                     if (res.children[item].level == instance.LEVEL) {
126                         this.getData('/' + res.children[item].id, this);
127                     }
128                 }
129                 instance.setRunned(false);
130                 instance.setupRunned(false);
131             }
132             else {
133                 console.log("jeei");
134                 this.drawPolygon(res, instance);
135             }
136         }
137     }
138
139     drawPolygon(item, instance) {
140         let bounds = new google.maps.LatLngBounds();
141         let feature;
142         let incoming:string;
143         incoming = item.featureType.toLowerCase();
144         switch (incoming) {
145             case "point":
146                 feature = 'Point';
147                 break;
148             case "multi_polygon":
149                 feature = 'MultiPolygon';
150                 break;
151             case "polygon":
152                 feature = 'MultiPolygon';
153                 break;
154             default:
155         }
156         // TODO: test på feature og behandle type: NONE
157         if (feature !== undefined) {
158             let unit = {
159                 "type": "Feature",
160                 "geometry": {
161                     "type": feature,
162                     "coordinates": JSON.parse(item.coordinates)
163                 },
164                 "properties": {
165                     "name": item.name,
166                     "id": item.id,
167                     "color": "yellow",
168                 }
169             };
170             if (unit.geometry.type == 'Point') {
171                 //ToDO: add en style på markeren !
172
173             }
174
175             this.map.data.addGeoJson(unit);
176
177             this.map.data.addListener('click', function (event) {
178
179                 console.log("klikket " + instance.runned + " og " + instance.LEVEL + " og " + event.feature.O.id);
180
181                 //TODO: spør om man vil ned/opp eller se info
182                 //TODO: finne liste over alle levels slike at man ikke har hardkodet inn < 4 !!
183
184                 if (instance.runned == false && instance.LEVEL < 4) {
185                     instance.setRunned(true);
186
187                     let infowindow = new google.maps.InfoWindow({
188                         //TODO: Style this
189                         content: '<div> <button >DrillUP</button>' +
190                         ' <button ">DrillDOWN</button>' +
191                         '<button ">SEEINFO</button></div>'
192                     });
193
194                     infowindow.setPosition(event.latlng);
195                     // infowindow.open(instance.map);
196
197                     let id = event.feature.O.id;
198                     instance.setParent(id);
199                     console.log(id);
200
201                     instance.map.data.forEach(function (feature) {
202                         if (!(feature.O.id == id && instance.LEVEL == 3)) {
203                             instance.map.data.remove(feature);
204
205                         }
206                     });
207
208                     instance.addLevel();
209
210                     instance.getData('/' + id + '/children', instance);
211                 } else if (instance.runned == false && instance.LEVEL >= 4) {
212                     instance.setRunned(true);
213                     let infowindowNew = new google.maps.InfoWindow({
214                         //TODO: Style this
215                         content: '<div>Du you want to add a new OrgUnit here ?    <button onclick="myFunction()">Yes</button></div>'
216                     });
217                     instance.setcurrentPos(event.latLng);
218
219                     var marker = new google.maps.Marker({
220                         position: event.latLng,
221                         map: instance.map,
222                         title: 'newOrg',
223                         icon: {
224                             path: google.maps.SymbolPath.CIRCLE,
225                             scale: 5
226                         }
227
228                     });
229
230                     marker.setMap(instance.map);
231
232                     infowindowNew.open(instance.map, marker);
233
234                     infowindowNew.addListener('closeclick', function (e) {
235                         instance.setRunned(false);
236                         marker.setMap(null);
237                     });
238
239                     instance.addUnit();
240
241
242                 }
243
244
245             });
246
247
248             this.map.data.addListener('rightclick', function (event) {
249                 if (instance.uprunned == false) {
250                     instance.setupRunned(true);
251
252                     instance.upLevel();
253
254                     if (instance.LEVEL > 1) {
255                         instance.map.data.forEach(function (feature) {
256                             instance.map.data.remove(feature);
257                         });
258
259                         let parent = instance.getParent();
260                         instance.getData('/' + parent, instance, true);
261                     }
262                     else {
263                         instance.addLevel();
264                         instance.setupRunned(true);
265                         //TODO skriv en warning om at man ikke kan gå opp
266
267                     }
268
269                 }
270             });
271
272
273         } else {
274             // ToDO:
275             console.log("fiks meg! gi warning på topp av kart");
276         }
277
278
279     }
280
281     addUnit() {
282         let parent = this.getParent();
283         let pos = this.getcurrentPos();
284         let lat = pos.lat();
285         let lng = pos.lng()
286         let location = {lat: lat, lng: lng};
287         let event = {location, parent};
288         this.newOrg.next(event);
289     }
290
291     //TODO slett denne når popup er klar !
292     myFunction() {
293         console.log("Inne i myfunksjonen");
294     }
295
296     update(event) {
297         this.newactive.next(event);
298         let getResult = Object;
299         let test = this.getMap();
300         let http = this.getHttp();
301
302         test.data.forEach(function (feature) {
303             test.data.remove(feature);
304         });
305         http.get(dhisAPI + '/api/organisationUnits/' + event)
306             .map(res => res.json())
307             .subscribe(
308                 res=> this.mapUpdate(res, this)
309             );
310     }
311
312     mapUpdate(res, instance) {
313         this.setLevel(res.level);
314         this.setParent(res.parent.id);
315         this.drawPolygon(res, instance);
316
317     }
318
319 }
320
321
322
323
324