[sibebar] added polygon
[u/erikhf/frm.git] / src / components / sidebar / sidebar.ts
CommitLineData
fa052229 1import {Component, NgFor, NgIf, EventEmitter, NgModel, Control, ControlGroup, ControlArray, Validators, FormBuilder, CORE_DIRECTIVES,FORM_DIRECTIVES} from 'angular2/angular2';
9bdb78d0 2import {Http, Headers} from 'angular2/http';
ebe03648 3
ebaf2f58 4declare var zone: Zone;
ebe03648
EHF
5
6@Component({
7 selector: 'mou-sidebar',
9bdb78d0 8 directives: [CORE_DIRECTIVES, FORM_DIRECTIVES, NgFor, NgModel, NgIf],
fa052229 9 events: ['tempmarker'],
9bdb78d0
EHF
10 templateUrl: './components/sidebar/sidebar.html',
11 styles: [`
8c91a910 12 .ng-valid.ng-dirty {
9bdb78d0
EHF
13 border-left: 5px solid #42A948; /* green */
14 }
15 .ng-invalid {
16 border-left: 5px solid #a94442; /* red */
17 }
8c91a910
EHF
18 .form-background {
19 padding: 10px;
20 background: white;
f800869b
EHF
21 width: 100%;
22 float: right;
23 height: 100vh;
24 z-index: 5;
8c91a910 25 }
9bdb78d0 26 `]
ebe03648 27})
8c91a910 28
ebe03648 29export class Sidebar {
fa052229 30
8c91a910 31 form: ControlGroup;
9bdb78d0 32 http:Http;
8c91a910 33 newObject: boolean;
9bdb78d0 34 editmode:boolean;
ebaf2f58 35 active: boolean;
59ab0e7a 36 coordinatePoint: boolean;
8c91a910
EHF
37
38 id: Control = new Control("");
39 name: Control = new Control("", Validators.required);
40 shortName: Control = new Control("",Validators.required);
41 description: Control = new Control("");
42 code: Control = new Control("");
43 openingDate: Control = new Control("",Validators.required);
44 closedDate: Control = new Control("");
45 url: Control = new Control("");
46 lat: Control = new Control("");
47 lng: Control = new Control("");
48 parent: Control = new Control("");
49 contactPerson: Control = new Control("");
50 address: Control = new Control("");
51 email: Control = new Control("");
52 phoneNumber: Control = new Control("");
6a4e2ca7 53 featureType: Control = new Control("");
f03b7890 54 coordinates: Control = new Control("");
8c91a910
EHF
55
56
57 constructor(http:Http, fb: FormBuilder) {
ebe03648 58 this.http = http;
9ce2e2a9 59 this.editmode = false;
ebaf2f58 60 this.active = false;
59ab0e7a 61 this.coordinatePoint = false;
fa052229 62 this.tempmarker = new EventEmitter();
59ab0e7a 63
8c91a910
EHF
64 this.form = fb.group({
65 "id": this.id,
66 "name": this.name,
67 "shortName": this.shortName,
68 "description": this.description,
69 "code": this.code,
70 "openingDate": this.openingDate,
71 "closedDate": this.closedDate,
72 "url": this.url,
73 "lat": this.lat,
74 "lng": this.lng,
75 "parent": this.parent,
76 "contactPerson": this.contactPerson,
77 "address": this.address,
78 "email": this.email,
6a4e2ca7 79 "phoneNumber": this.phoneNumber,
f03b7890
EHF
80 "featureType": this.featureType,
81 "coordinates": this.coordinates
8c91a910 82 });
fa052229
EHF
83 let instance = this;
84 this.lat.valueChanges.observer({
85 next: (value) => {
86 if(instance.lng.value && value) {
87 let pos = {lat: value, lng: instance.lng.value};
88 this.tempmarker.next(pos);
89 }
90 }
91 });
92 this.lng.valueChanges.observer({
93 next: (value) => {
94 if(instance.lat.value && value) {
95 let pos = {lat: instance.lat.value, lng: value};
96 this.tempmarker.next(pos);
97 }
98 }
99 });
c1cf798d
EHF
100 }
101
9bdb78d0 102 update(orgunitId) {
f800869b 103 console.log("Skjer det noe her? ");
ebaf2f58 104 this.active = true;
8c91a910 105 this.newObject = false;
c1cf798d
EHF
106 this.http.get(dhisAPI + "/api/organisationUnits/" + orgunitId)
107 .map(res => res.json())
8c91a910 108 .subscribe(res => this.updateValues(res))
ebe03648 109 }
9ce2e2a9 110
8c91a910 111 updateValues(res){
59ab0e7a 112
8c91a910
EHF
113 for(control in this.form.controls){
114 if(res[control] !== undefined) {
115 this.form.controls[control].updateValue(res[control]);
116 }
117 else
118 this.form.controls[control].updateValue("");
119 }
59ab0e7a 120
531b0170
EHF
121 // Date fix:
122 if(res["openingDate"]){
123 this.form.controls["openingDate"].updateValue((new Date(res["openingDate"].substring(0,10))).toISOString().substring(0,10));
124 }
125 if(res["closedDate"]){
126 this.form.controls["closedDate"].updateValue((new Date(res["closedDate"].substring(0,10))).toISOString().substring(0,10));
127 }
128
59ab0e7a
EHF
129 if(res.featureType === "POINT"){
130 this.coordinatePoint = true;
131 let coord = new Object();
132 coord = JSON.parse(res["coordinates"]);
133 this.form.controls.lat.updateValue(coord[0]);
134 this.form.controls.lng.updateValue(coord[1]);
135 }
136 else{
137 this.coordinatePoint = false;
138 }
8c91a910 139 }
59ab0e7a
EHF
140
141
142
9bdb78d0
EHF
143 onSubmit() {
144 this.editmode = false;
145
146 let headers = new Headers();
147 headers.append('Accept', 'application/json');
59ab0e7a 148
9bdb78d0
EHF
149 headers.append('Content-Type', 'application/json');
150
8c91a910
EHF
151 let jsonObject = this.form.value;
152
153 $.each(jsonObject, function(key, value){
154 if (value === "" || value === null){
155 delete jsonObject[key];
156 }
157 });
158
531b0170
EHF
159 jsonObject.openingDate = (new Date(this.form.value.openingDate)).toISOString();
160
161 if(this.form.value.closedDate){
162 jsonObject.closedDate = (new Date(this.form.value.closedDate)).toISOString();
163 }
8c91a910
EHF
164
165
166 console.log(this.form.value);
167
168 if (this.newObject) {
169 jsonObject.parent = {};
170 jsonObject.parent.id = this.form.controls.parent.value;
171 jsonObject.featureType="POINT";
172 jsonObject.coordinates="[" + this.form.controls.lat.value + ","+this.form.controls.lng.value+"]";
173 delete jsonObject["lat"];
174 delete jsonObject["lng"];
175 this.http.post(dhisAPI + "/api/organisationUnits/", JSON.stringify(jsonObject), {
9bdb78d0
EHF
176 headers: headers
177 })
178 .map(res => res.json())
179 .subscribe(res => console.log(res));
59ab0e7a
EHF
180 }else {
181 this.http.put(dhisAPI + "/api/organisationUnits/" + this.form.controls.id.value, JSON.stringify(jsonObject), {
182 headers: headers
183 })
184 .map(res => res.json())
185 .subscribe(res => console.log(res));
9bdb78d0
EHF
186 }
187
9ce2e2a9 188 }
57c243b6
EHF
189
190 cancel(){
191 this.editmode = false;
57c243b6 192 }
ebaf2f58 193
fa052229 194
8c91a910 195 add(data){
59ab0e7a 196 this.coordinatePoint = true;
8c91a910 197 this.newObject=true;
59ab0e7a 198 this.active = true;
ebaf2f58 199 this.editmode = true;
8c91a910 200
fa052229
EHF
201 for(control in this.form.controls){
202 this.form.controls[control].updateValue("");
203 }
204
8c91a910
EHF
205 this.form.controls.lat.updateValue(data.location.lat);
206 this.form.controls.lng.updateValue(data.location.lng);
207 this.form.controls.parent.updateValue(data.parent);
208
ebaf2f58 209 }
ebe03648
EHF
210}
211