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
  20     constructor(http:Http) {
  21         this.newactive = new EventEmitter();
  22         this.map = new google.maps.Map(document.getElementById("map"),{center: {lat:0,lng:0}, zoom:12});
  23         this.init();
  24         this.http = http;
  25         this.LEVEL = 2;
  26         this.runned = false;
  27         this.getData('?paging=false&level=2',this);
  28     }
  29
  30     setRunned(value){
  31         this.runned = value;
  32     }
  33
  34     addLevel(){
  35         this.LEVEL++;
  36     }
  37
  38     init() {
  39
  40         let initMap = this.initMap;
  41         let map = this.map;
  42         if (navigator.geolocation) {
  43             navigator.geolocation.getCurrentPosition(function (position) {
  44                     //let pos = new google.maps.LatLng(position.coords.latitude, position.coords.longitude);
  45                 let pos = {lat:10,lng:39}
  46                     initMap(pos,map);
  47                 }, function () {
  48                 //handleNoGeoLocation()
  49                 }
  50             );
  51         } else {
  52             alert("You do not support geolocation");
  53         }
  54
  55
  56     }
  57
  58
  59     initMap(location,map){
  60
  61         map.setCenter(location,3);
  62
  63
  64
  65         map.addListener('click', function (event) {
  66                 console.log(event.latlng);
  67             }
  68         );
  69
  70     }
  71
  72     logError(error) {
  73         console.error(error);
  74
  75     }
  76
  77     getData(query,instance){
  78         console.log(instance.http);
  79         instance.http.get(dhisAPI+'/api/organisationUnits'+query)
  80             .map(res => res.json())
  81             .subscribe(
  82                 res => instance.parseResult(res,instance),
  83                 error => instance.logError(error)
  84             );
  85
  86     }
  87
  88     parseResult(res,instance){
  89
  90         if(res.organisationUnits) {
  91             for (let item in res.organisationUnits) {
  92                 this.getData('/' + res.organisationUnits[item].id,this);
  93             }
  94             //liten hack
  95         }else if(!res.displayName && res.children){
  96             for (let item in res.children) {
  97                 if(res.children[item].level == instance.LEVEL){
  98                     this.getData('/' + res.children[item].id,this);
  99                 }
 100             }
 101             instance.setRunned(false);
 102         }
 103         else {
 104             this.drawPolygon(res);
 105         };
 106     }
 107     drawPolygon(item){
 108         let instance = this;
 109         let feature;
 110         let incoming: string;
 111         incoming = item.featureType.toLowerCase();
 112         switch(incoming){
 113             case "point":
 114                 feature = 'Point';
 115                 break;
 116             case "multi_polygon":
 117                 feature = 'MultiPolygon';
 118                 break;
 119              case "polygon":
 120                  feature = 'MultiPolygon';
 121                 break;
 122             default:
 123         }
 124           // TODO: test på feature og behandle type: NONE
 125         if(feature !== undefined) {
 126             let unit = {
 127                 "type": "Feature",
 128                 "geometry": {
 129                     "type": feature,
 130                     "coordinates": JSON.parse(item.coordinates)
 131                 },
 132                 "properties": {
 133                     "name": item.name,
 134                     "id": item.id,
 135
 136                 },
 137                 "style": null
 138             };
 139             if(unit.geometry.type == 'Point'){
 140                //ToDO: add en style på markeren !
 141
 142
 143             }
 144             this.map.data.addGeoJson(unit);
 145
 146             this.map.data.addListener('click', function(event) {
 147                //TODO: spør om man vil ned/opp eller se info
 148                 if(instance.runned == false){
 149                     instance.setRunned(true);
 150
 151
 152                     let id = event.feature.O.id;
 153                     console.log(id);
 154
 155                     instance.map.data.forEach(function(feature) {
 156                         instance.map.data.remove(feature);
 157                     });
 158                     instance.addLevel();
 159                     instance.getData('/' + id+'/children',instance);
 160                 }
 161
 162             });
 163
 164         }else {
 165             // ToDO:
 166             console.log("fiks meg! gi warning på topp av kart");
 167         }
 168
 169
 170     }
 171
 172
 173     createOrgUnit(){
 174         console.log('you just added a new organisation unit');
 175     }
 176
 177     update(event){
 178         this.newactive.next(event);
 179     }
 180 }
 181
 182
 183
 184
 185