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