Skip to content

Commit fba3982

Browse files
committed
Ask for more shelter info while adding shelter
1 parent fcaeed8 commit fba3982

File tree

13 files changed

+281
-77
lines changed

13 files changed

+281
-77
lines changed

client/src/app/_helpers/error.interceptor.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -13,8 +13,8 @@ export class ErrorInterceptor implements HttpInterceptor {
1313
return next.handle(request).pipe(catchError(err => {
1414
if (err.status === 401) {
1515
// auto logout if 401 response returned from api
16-
this.authService.logout();
17-
location.reload(true);
16+
// this.authService.logout();
17+
// location.reload(true);
1818
}
1919

2020
return throwError(err);

client/src/app/_services/shelters.service.ts

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -60,4 +60,17 @@ export class SheltersService {
6060
`${this.apiBaseUrl}/users/request`
6161
);
6262
}
63+
64+
// public getHospitalDetails(lngLat, distance): Observable<any> {
65+
// return this.http.get(
66+
// `https://dev.virtualearth.net/REST/v1/LocalSearch/`,
67+
// {
68+
// params: {
69+
// 'query': 'hospital',
70+
// 'userLocation': lngLat,
71+
// 'key': environment.bingMapsAPIKey
72+
// }
73+
// }
74+
// );
75+
// }
6376
}

client/src/app/home/home.component.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ export class HomeComponent implements AfterViewInit {
2424

2525
var map = new mapboxgl.Map({
2626
container: 'map',
27-
style: 'mapbox://styles/mapbox/navigation-guidance-night-v4',
27+
style: 'mapbox://styles/mapbox/satellite-streets-v10',
2828
center: [72.914294, 19.130722],
2929
zoom: 12
3030
});

client/src/app/shelters/add-shelter/add-shelter.component.html

Lines changed: 163 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -2,58 +2,180 @@
22
<div class="section">
33
<form #shelterForm="ngForm" (submit)="addShelter()">
44
<div class="columns">
5-
<div class="column">
6-
<div class="field">
7-
<label class="label">Name</label>
8-
<div class="control">
9-
<input class="input" type="text" placeholder="Name" [(ngModel)]="shelter.name" name="name" required>
5+
<div class="column is-1">
6+
<ul class="steps is-vertical">
7+
<li class="steps-segment" [ngClass]="{'is-active': shelterDetailsTab === 0}">
8+
<span class="steps-marker"></span>
9+
</li>
10+
<li class="steps-segment" [ngClass]="{'is-active': shelterDetailsTab === 1}">
11+
<span class="steps-marker"></span>
12+
</li>
13+
</ul>
14+
</div>
15+
<div class="column" *ngIf="shelterDetailsTab === 0">
16+
<div class="columns">
17+
<div class="column">
18+
<div class="field">
19+
<label class="label">Shelter Name</label>
20+
<div class="control">
21+
<input class="input" type="text" placeholder="Shelter Name" [(ngModel)]="shelter.name" name="name" required>
22+
</div>
23+
</div>
1024
</div>
1125
</div>
12-
</div>
13-
</div>
14-
<div class="columns">
15-
<div class="column">
16-
<div class="field">
17-
<label class="label">Contact Number</label>
18-
<div class="control">
19-
<input class="input" type="text" placeholder="Contact Number" [(ngModel)]="shelter.contact" name="contact"
20-
required>
26+
<div class="columns">
27+
<div class="column">
28+
<div class="field">
29+
<label class="label">Contact Number</label>
30+
<div class="control">
31+
<input class="input" type="text" placeholder="Contact Number" [(ngModel)]="shelter.contact" name="contact"
32+
required>
33+
</div>
34+
</div>
2135
</div>
2236
</div>
23-
</div>
24-
</div>
25-
<div class="columns">
26-
<div class="column">
27-
<div class="field">
28-
<label class="label">Address</label>
29-
<div class="control">
30-
<input class="input" type="text" placeholder="Address" [(ngModel)]="shelter.address" name="address"
31-
required>
37+
<div class="columns">
38+
<div class="column">
39+
<div class="field">
40+
<label class="label">Address</label>
41+
<div class="control">
42+
<input class="input" type="text" placeholder="Address" [(ngModel)]="shelter.address" name="address"
43+
required>
44+
</div>
45+
</div>
46+
</div>
47+
</div>
48+
<div class="columns">
49+
<div class="column">
50+
<div class="field">
51+
<label class="label">City</label>
52+
<div class="control">
53+
<input class="input" type="text" placeholder="City" [(ngModel)]="shelter.city" name="city" required>
54+
</div>
55+
</div>
56+
</div>
57+
</div>
58+
<div class="columns">
59+
<div class="column">
60+
<div class="field">
61+
<label class="label">State</label>
62+
<div class="control">
63+
<input class="input" type="text" placeholder="State" [(ngModel)]="shelter.state" name="state"
64+
required>
65+
</div>
66+
</div>
67+
</div>
68+
</div>
69+
<div class="columns">
70+
<div class="column">
71+
<div class="field">
72+
<label class="label">Zip Code</label>
73+
<div class="control">
74+
<input class="input" type="text" placeholder="Zip Code" [(ngModel)]="shelter.zipcode" name="zipcode"
75+
required>
76+
</div>
77+
</div>
3278
</div>
3379
</div>
3480
</div>
35-
</div>
36-
<div class="columns">
37-
<div class="column">
38-
<div class="field">
39-
<label class="label">City</label>
40-
<div class="control">
41-
<input class="input" type="text" placeholder="City" [(ngModel)]="shelter.city" name="city" required>
81+
<div class="column" *ngIf="shelterDetailsTab === 1">
82+
<div class="columns">
83+
<div class="column">
84+
<div class="field">
85+
<label class="label">Property Type <span *ngIf="shelter.propertyType" (click)="shelter.propertyType = null"
86+
class="is-size-6 has-text-info is-pulled-right">clear</span></label>
87+
<div class="control radio-group">
88+
<input class="is-checkradio" type="radio" id="property-type-public" value="0" [(ngModel)]="shelter.propertyType"
89+
name="propertyType">
90+
<label for="property-type-public">Public</label>
91+
<input class="is-checkradio" type="radio" id="property-type-private" value="1" [(ngModel)]="shelter.propertyType"
92+
name="propertyType">
93+
<label for="property-type-private">Private</label>
94+
</div>
95+
</div>
96+
</div>
97+
</div>
98+
99+
<div class="columns">
100+
<div class="column">
101+
<div class="field">
102+
<label class="label">Infant Friendly? <span *ngIf="shelter.infantFriendly" (click)="shelter.infantFriendly = null"
103+
class="is-size-6 has-text-info is-pulled-right">clear</span></label>
104+
<div class="control radio-group">
105+
<input class="is-checkradio" type="radio" id="infant-friendly-yes" value="1" [(ngModel)]="shelter.infantFriendly"
106+
name="infantFriendly">
107+
<label for="infant-friendly-yes">Yes</label>
108+
<input class="is-checkradio" type="radio" id="infant-friendly-no" value="0" [(ngModel)]="shelter.infantFriendly"
109+
name="infantFriendly">
110+
<label for="infant-friendly-no">No</label>
111+
</div>
112+
</div>
113+
</div>
114+
</div>
115+
116+
<div class="columns">
117+
<div class="column">
118+
<div class="field">
119+
<label class="label">Elder Friendly? <span *ngIf="shelter.elderFriendly" (click)="shelter.elderFriendly = null"
120+
class="is-size-6 has-text-info is-pulled-right">clear</span></label>
121+
<div class="control radio-group">
122+
<input class="is-checkradio" type="radio" id="elder-friendly-yes" value="1" [(ngModel)]="shelter.elderFriendly"
123+
name="elderFriendly">
124+
<label for="elder-friendly-yes">Yes</label>
125+
<input class="is-checkradio" type="radio" id="elder-friendly-no" value="0" [(ngModel)]="shelter.elderFriendly"
126+
name="elderFriendly">
127+
<label for="elder-friendly-no">No</label>
128+
</div>
129+
</div>
130+
</div>
131+
</div>
132+
133+
<div class="columns">
134+
<div class="column">
135+
<div class="field">
136+
<label class="label">Are you living with your family? <span *ngIf="shelter.family" (click)="shelter.family = null"
137+
class="is-size-6 has-text-info is-pulled-right">clear</span></label>
138+
<div class="control radio-group">
139+
<input class="is-checkradio" type="radio" id="family-yes" value="1" [(ngModel)]="shelter.family" name="family">
140+
<label for="family-yes">Yes</label>
141+
<input class="is-checkradio" type="radio" id="family-no" value="0" [(ngModel)]="shelter.family" name="family">
142+
<label for="family-no">No</label>
143+
</div>
144+
</div>
145+
</div>
146+
</div>
147+
148+
<div class="columns" *ngIf="shelter.family === '1'">
149+
<div class="column">
150+
<div class="field">
151+
<label class="label">Age range of family members <span *ngIf="shelter.familyAgeMin || shelter.familyAgeMax" (click)="shelter.familyAgeMin = null; shelter.familyAgeMax = null"
152+
class="is-size-6 has-text-info is-pulled-right">clear</span></label>
153+
154+
<div class="control">
155+
<div class="columns">
156+
<div class="column is-2">
157+
<input class="input" type="number" placeholder="Min" [(ngModel)]="shelter.familyAgeMin" name="familyAgeMin">
158+
</div>
159+
<div class="column is-2">
160+
<input class="input" type="number" placeholder="Max" [(ngModel)]="shelter.familyAgeMax" name="familyAgeMax">
161+
</div>
162+
</div>
163+
</div>
164+
</div>
42165
</div>
43166
</div>
44167
</div>
45168
</div>
46-
<div class="columns">
169+
170+
<div class="columns has-text-centered">
47171
<div class="column">
48-
<div class="field">
49-
<label class="label">State</label>
50-
<div class="control">
51-
<input class="input" type="text" placeholder="State" [(ngModel)]="shelter.state" name="state"
52-
required>
53-
</div>
54-
</div>
172+
<button type="button" class="button is-primary" (click)="changeAddShelterTab(-1)" [disabled]="shelterDetailsTab == 0">Previous</button>
173+
</div>
174+
<div class="column">
175+
<button type="button" class="button is-primary" (click)="changeAddShelterTab(1)" [disabled]="shelterDetailsTab == 1">Next</button>
55176
</div>
56177
</div>
178+
57179
<div class="columns">
58180
<div class="column">
59181
<div class="field">
@@ -68,10 +190,11 @@
68190
<div class="columns">
69191
<div class="column">
70192
<div class="field">
71-
<button class="button is-primary is-outlined" [disabled]="!shelterForm.form.valid">Add Shelter</button>
193+
<button class="button is-primary is-outlined" [disabled]="!shelterForm.form.valid" type="submit">Add
194+
Shelter</button>
72195
</div>
73196
</div>
74197
</div>
75198
</form>
76199
</div>
77-
</div>
200+
</div>

client/src/app/shelters/add-shelter/add-shelter.component.ts

Lines changed: 12 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,16 @@ import * as $ from 'jquery';
1414
})
1515
export class AddShelterComponent implements AfterViewInit {
1616
mapboxAccessToken = environment.mapboxAccessToken;
17-
shelter = new Shelter('', '', '', '', '', '');
17+
shelter = new Shelter('', '', '', '', '', '', '', null, null, null, false, null, null, null, null);
18+
19+
shelterDetailsTab = 0;
20+
21+
changeAddShelterTab(x) {
22+
this.shelterDetailsTab += x;
23+
24+
if (this.shelterDetailsTab < 0) this.shelterDetailsTab = 0;
25+
if (this.shelterDetailsTab > 1) this.shelterDetailsTab = 1;
26+
}
1827

1928
addShelter() {
2029
this.shelter.lngLat = $('#lnglat').val();
@@ -24,6 +33,8 @@ export class AddShelterComponent implements AfterViewInit {
2433
return;
2534
}
2635

36+
console.log(this.shelter);
37+
2738
this.shelterService.addShelter(this.shelter)
2839
.subscribe(
2940
(res) => this.alertService.success('Shelter successfully added'),
Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
.shelter-danger {
2+
background: #FF416C; /* fallback for old browsers */
3+
background: -webkit-linear-gradient(to right, #FF4B2B, #FF416C); /* Chrome 10-25, Safari 5.1-6 */
4+
background: linear-gradient(to right, #FF4B2B, #FF416C); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
5+
}
6+
7+
.shelter-safe {
8+
background: #11998e; /* fallback for old browsers */
9+
background: -webkit-linear-gradient(to right, #38ef7d, #11998e); /* Chrome 10-25, Safari 5.1-6 */
10+
background: linear-gradient(to right, #38ef7d, #11998e); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
11+
}
12+
13+
.shelter-warning {
14+
background: #fceabb; /* fallback for old browsers */
15+
background: -webkit-linear-gradient(to right, #f8b500, #fceabb); /* Chrome 10-25, Safari 5.1-6 */
16+
background: linear-gradient(to right, #f8b500, #fceabb); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
17+
}
18+
19+
.shelter-status-info {
20+
width: 10px;
21+
height: 100%;
22+
}
23+
24+
.show-more-info {
25+
padding-top: 50px;
26+
}

0 commit comments

Comments
 (0)