[AddOrgUnit] made a cool marker
[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
dd095993 15 map:Object;
6ced1bc7 16 http: Http;
a8451d12
JHR
17 parent: Object;
18 currentPos = Object;
dd095993
JHR
19
20 constructor(http:Http) {
7ee898bc 21 this.newactive = new EventEmitter();
a8451d12 22 this.newOrg = new EventEmitter();
6ced1bc7
JHR
23 this.map = new google.maps.Map(document.getElementById("map"),{center: {lat:0,lng:0}, zoom:12});
24 this.init();
25 this.http = http;
a8451d12
JHR
26 this.parent = null;
27 this.currentPos = null;
28 // this.getData('?paging=false&level=2',this);
29 this.getData('?paging=false&level=3',this);
30 }
31 setParent(id){
32 this.parent=id;
33 }
34 getParent(){
35 return this.parent;
36 }
6ced1bc7 37
a8451d12
JHR
38 setcurrentPos(latlng){
39 this.currentPos = latlng;
40 }
41 getcurrentPos(){
42 return this.currentPos;
1e6ce2f5
EHF
43 }
44
a2d7d6b4 45
6ced1bc7 46 init() {
a2d7d6b4 47
6ced1bc7 48 let initMap = this.initMap;
6ced1bc7 49 let map = this.map;
dd095993
JHR
50 if (navigator.geolocation) {
51 navigator.geolocation.getCurrentPosition(function (position) {
a8451d12
JHR
52 // let pos = new google.maps.LatLng(position.coords.latitude, position.coords.longitude);
53 let pos = {lat: 9.1, lng: -10.6};
30593bb6 54 initMap(pos,map);
dd095993 55 }, function () {
bbee9db0 56 //handleNoGeoLocation()
dd095993
JHR
57 }
58 );
59 } else {
60 alert("You do not support geolocation");
61 }
a2d7d6b4 62
cdcaf46c 63
a2d7d6b4
JHR
64 }
65
dd095993 66
30593bb6 67 initMap(location,map){
6ced1bc7 68
a8451d12
JHR
69 map.setCenter(location,3);
70
71
72 let infowindow = new google.maps.InfoWindow({
73 content: '<div>Add an OrganisationUnit here ? <button (click)="addUnit(location)">Yes</button> <button (click)="clear()">NO</button>'
74 });
75 map.addListener('click', function (e) {
76 this.setcurrentPos(e.latLng);
77 var marker = new google.maps.Marker({
78 position: e.latLng,
79 map: map,
80 title: 'newOrg',
81 icon: {
82 path: google.maps.SymbolPath.CIRCLE,
83 scale: 5
84 }
85
86 });
87 marker.setMap(map);
6ced1bc7 88
a8451d12 89 infowindow.open(map, marker);
6ced1bc7 90
dd095993 91
30593bb6 92 console.log("jule husker");
a8451d12
JHR
93 console.log("Nå er parent og location sånn:" + this.getParent()+ " og "+ this.getcurrentPos());
94
95
96
97
6ced1bc7
JHR
98 }
99 );
100
101 }
102
a2d7d6b4
JHR
103 logError(error) {
104 console.error(error);
105
cb2c4ba8 106 }
28765058 107
c7e8b786
EHF
108 getData(query,instance){
109 console.log(instance.http);
110 instance.http.get(dhisAPI+'/api/organisationUnits'+query)
6ced1bc7
JHR
111 .map(res => res.json())
112 .subscribe(
c7e8b786
EHF
113 res => instance.parseResult(res),
114 error => instance.logError(error)
6ced1bc7
JHR
115 );
116
117 }
118
119 parseResult(res){
120
121 if(res.organisationUnits) {
122 for (let item in res.organisationUnits) {
c7e8b786 123 this.getData('/' + res.organisationUnits[item].id,this);
6ced1bc7 124 }
0a4273ac
JHR
125 //liten hack
126 }//else if(res.name != false){
127 // for (let item in res.children) {
128 // this.getData('/' + res.children[item].id,this);
129 //}
130 //}
131 else {
6ced1bc7
JHR
132
133 this.drawPolygon(res);};
134 }
135 drawPolygon(item){
c7e8b786 136 let instance = this;
1f8c27ee
JHR
137 let feature;
138 let incoming: string;
139 incoming = item.featureType.toLowerCase();
140 switch(incoming){
141 case "point":
142 feature = 'Point';
143 break;
144 case "multi_polygon":
145 feature = 'MultiPolygon';
146 break;
147 case "polygon":
148 feature = 'MultiPolygon';
149 break;
150 default:
151 }
152 // TODO: test på feature og behandle type: NONE
153 if(feature !== undefined) {
154 let unit = {
155 "type": "Feature",
156 "geometry": {
157 "type": feature,
158 "coordinates": JSON.parse(item.coordinates)
159 },
160 "properties": {
161 "name": item.name,
162 "id": item.id
163 }
164 };
165 this.map.data.addGeoJson(unit);
c7e8b786 166
1f8c27ee 167 this.map.data.addListener('click', function(event) {
bbee9db0 168 //TODO: spør om man vil ned/opp eller se info
1f8c27ee 169
bbee9db0 170 let id = event.feature.O.id;
a8451d12 171 instance.setParent(id);
bbee9db0
JHR
172 console.log(id);
173
0a4273ac
JHR
174 instance.map.data.forEach(function(feature) {
175 instance.map.data.remove(feature);
176 });
177 // instance.getData('/' + id+'/children',instance);
c7e8b786 178 instance.getData('/' + id,instance);
6ced1bc7 179
bbee9db0 180 });
0a4273ac 181
bbee9db0 182
1f8c27ee
JHR
183 }else {
184 // ToDO:
185 console.log("fiks meg! gi warning på topp av kart");
186 }
6ced1bc7 187
6ced1bc7
JHR
188
189 }
190
a8451d12
JHR
191 addUnit(){
192 console.log("Inne i Add funksjonen");
193 let parent = this.getParent();
194 let pos = this.getcurrentPos;
195 let event = {pos,parent};
196 this.newOrg.next(event);
197
198 }
dd095993 199
a8451d12
JHR
200 drawCircle(){
201 return new ol.style.Circle({
202 radius: 5,
203 fill: null,
204 stroke: new ol.style.Stroke({color: 'red', width: 1})
205 });
6ced1bc7 206 }
dd095993 207
7ee898bc
EHF
208 update(event){
209 this.newactive.next(event);
210 }
6ced1bc7 211}
dd095993 212
dd095993
JHR
213
214
215
216