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