[sibebar] added polygon
[u/erikhf/frm.git] / src / components / sidebar / sidebar.html
1 <div>
2     <div [hidden]="!active" class="form-background" style="overflow-y:auto; position:relative; float:right; ">
3         <form *ng-if="editmode" [(ng-form-model)]="form" (ng-submit)="onSubmit()" #of="form">
4             <h2>{{newObject?"Add new Organizational Unit":"Update Organizational Unit"}}</h2>
5
6             <div class="form-group">
7                 <label>Name</label>
8                 <input class="form-control" type="text" ng-control="name">
9                 <p [hidden]="name.valid || name.untouched" class="alert alert-danger">
10                     Name is required
11                 </p>
12
13             </div>
14             <div class="form-group">
15                 <label>Short Name</label>
16                 <input class="form-control" type="text" ng-control="shortName" #shortname="form">
17
18                 <p [hidden]="shortname.valid || shortname.untouched" class="alert alert-danger">
19                     Short name is required
20                 </p>
21             </div>
22
23             <div class="form-group">
24                 <label>Description</label>
25                 <textarea class="form-control" ng-control="description" rows="3"></textarea>
26             </div>
27             <div class="form-group">
28                 <label>Code</label>
29                 <input class="form-control" type="text" ng-control="code">
30             </div>
31
32             <div class="form-group">
33                 <label>Opening Date</label>
34                 <input class="form-control" type="date" ng-control="openingDate" #openingDate="form">
35
36                 <p [hidden]="openingdate.valid || openingdate.untouched" class="alert alert-danger">Opening date is required</p>
37             </div>
38             <div class="form-group">
39                 <label>Closed Date</label>
40                 <input class="form-control" type="date" ng-control="closedDate">
41             </div>
42             <div class="form-group">
43                 <label>URL</label>
44                 <input class="form-control" type="url" ng-control="url" #url="form">
45
46                 <p [hidden]="url.valid" class="alert alert-danger">The specified URL is not valid</p>
47             </div>
48             <fieldset class="form-group">
49                 <Legend>Coordinates</Legend>
50                 <div *ng-if="featureType.value == 'POINT'" class="form-group">
51                     <label>Latitude</label>
52                     <input class="form-control" type="number" ng-control="lat" #lat="form" step="any" max="90" min="-90"/>
53                     <label>Longitude</label>
54                     <input class="form-control" type="number" ng-control="lng" #lng="form" step="any" max="180" min="-180"/>
55                 </div>
56                 <div *ng-if="featureType.value == 'NONE'" class="alert alert-danger">
57                     <p>This organisation unit has no associated coordinates</p>
58                 </div>
59             </fieldset>
60
61
62             <fieldset class="form-group">
63                 <legend>Contact information</legend>
64                 <label>Contact person</label>
65                 <input class="form-control" type="text" ng-control="contactPerson"/>
66                 <label>Address</label>
67                 <input class="form-control" type="text" ng-control="address"/>
68                 <label>E-mail</label>
69                 <input class="form-control" type="email" ng-control="email"/>
70                 <label>Phone number</label>
71                 <input class="form-control" type="text" ng-control="phoneNumber"/>
72             </fieldset>
73             <button type="button" (click)="cancel()" class="btn btn-default">Cancel</button>
74             <button type="submit" [disabled]="!of.form.valid" class="btn btn-default">{{newObject? "Add":"Update"}}
75             </button>
76
77         </form>
78
79
80         <section *ng-if="!editmode">
81             <h2>Organisation Unit</h2>
82             <label for="actOrgUnitName">Name</label>
83
84             <p id="actOrgUnitName">{{(form.controls.name.value) || "[None]"}}</p>
85
86             <label for="actOrgUnitShortName">Short Name</label>
87
88             <p id="actOrgUnitShortName">{{(form.controls.shortName.value)||["None"]}}</p>
89
90             <label for="actOrgUnitDescription">Description</label>
91
92             <p id="actOrgUnitDescription">{{(form.controls.description.value)||"None"}}</p>
93
94             <label for="actOrgUnitCode">Code</label>
95
96             <p id="actOrgUnitCode">{{(form.controls.code.value)||["None"]}}</p>
97
98             <label for="actOrgUnitOpeningDate">Opening Date</label>
99
100             <p id="actOrgUnitOpeningDate">{{form.controls.openingDate.value||["None"]}}</p>
101
102             <label for="actOrgUnitClosingDate">Closed Date</label>
103
104             <p id="actOrgUnitClosingDate">{{form.controls.closedDate.value||["None"]}}</p>
105
106             <label for="actOrgUnitURL">Url</label>
107
108             <p id="actOrgUnitURL">{{(form.controls.url.value) ||["None"]}}</p>
109
110             <fieldset>
111                 <legend>Coordinates</legend>
112                 <div *ng-if="featureType.value == 'POINT'" class="form-group">
113                     <label>Latitude</label>
114                     <p>{{form.controls.lat.value}}</p>
115                     <label>Longitude</label>
116                     <p>{{form.controls.lng.value}}</p>
117                 </div>
118                 <div *ng-if="featureType.value == 'NONE'" class="alert alert-danger">
119                     <p>This organisation unit has no associated coordinates</p>
120                 </div>
121                 <div *ng-if="featureType.value == 'POLYGON' || featureType.value == 'MULTI_POLYGON'">
122                     <p>polygon</p>
123                 </div>
124
125             </fieldset>
126
127             <fieldset>
128                 <legend>Contact Information</legend>
129                 <label>Contact person</label>
130                 <p>{{form.controls.contactPerson.value || ["None"]}}</p>
131                 <label>Address</label>
132                 <p>{{form.controls.address.value || ["None"]}}</p>
133                 <label>E-mail</label>
134                 <p>{{form.controls.email.value || ["None"]}}</p>
135                 <label>Phone number</label>
136                 <p>{{form.controls.phoneNumber.vaule || ["None"]}}</p>
137             </fieldset>
138             <button class="btn btn-default" (click)="editmode = !editmode">Edit</button>
139         </section>
140
141     </div>
142 </div>