Skip to content

Commit 81f3474

Browse files
rohitrprohitrp
committed
Fix ip lookup and add loader
1 parent f472264 commit 81f3474

File tree

16 files changed

+174
-14
lines changed

16 files changed

+174
-14
lines changed

‎client/package-lock.json‎

Lines changed: 8 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎client/package.json‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -29,6 +29,7 @@
2929
"core-js": "^2.5.4",
3030
"jquery": "^3.3.1",
3131
"mapbox-gl": "^0.50.0",
32+
"ng-http-loader": "^5.0.0",
3233
"noty": "^3.2.0-beta",
3334
"rxjs": "~6.2.0",
3435
"zone.js": "~0.8.26"

‎client/src/app/app.component.html‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,5 @@
1+
<ng-http-loader [entryComponent]="loader"></ng-http-loader>
2+
13
<div id="container">
24
<div id="navbar">
35
<app-navbar></app-navbar>

‎client/src/app/app.component.ts‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import { Component } from '@angular/core';
22
import { SEOService } from './_services/seo.service';
33
import { AuthService } from './_services/auth.service';
4+
import { LoaderComponent } from './loader/loader.component';
45

56
@Component({
67
selector: 'app-root',
@@ -12,6 +13,7 @@ export class AppComponent {
1213
user: any;
1314
otp: any;
1415
otpGenerated = false;
16+
loader = LoaderComponent;
1517

1618
constructor(
1719
private seoService: SEOService,

‎client/src/app/app.module.ts‎

Lines changed: 10 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,8 @@ import { AddShelterComponent } from './shelters/add-shelter/add-shelter.componen
2020
import { ShelterCardComponent } from './shelters/shelter-card/shelter-card.component';
2121
import { RequestShelterComponent } from './request-shelter/request-shelter.component';
2222
import { ShelterInfoComponent } from './shelters/shelter-info/shelter-info.component';
23+
import { NgHttpLoaderModule } from 'ng-http-loader';
24+
import { LoaderComponent } from './loader/loader.component';
2325

2426
export function tokenGetter() {
2527
const user = JSON.parse(localStorage.getItem('user'));
@@ -38,7 +40,8 @@ export function tokenGetter() {
3840
AddShelterComponent,
3941
ShelterCardComponent,
4042
RequestShelterComponent,
41-
ShelterInfoComponent
43+
ShelterInfoComponent,
44+
LoaderComponent
4245
],
4346
imports: [
4447
BrowserModule,
@@ -51,13 +54,17 @@ export function tokenGetter() {
5154
}
5255
}),
5356
AppRoutingModule,
54-
FormsModule
57+
FormsModule,
58+
NgHttpLoaderModule.forRoot(),
5559
],
5660
providers: [
5761
{ provide: HTTP_INTERCEPTORS, useClass: ErrorInterceptor, multi: true },
5862
AuthGuard,
5963
AlertService
6064
],
61-
bootstrap: [AppComponent]
65+
bootstrap: [AppComponent],
66+
entryComponents: [
67+
LoaderComponent
68+
]
6269
})
6370
export class AppModule { }

‎client/src/app/loader/loader.component.css‎

Lines changed: 84 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,84 @@
1+
*, *:before, *:after {
2+
box-sizing: border-box;
3+
position: relative;
4+
}
5+
6+
svg {
7+
display: block;
8+
margin: 0;
9+
padding: 0;
10+
}
11+
12+
html, body {
13+
width: 100%;
14+
height: 100%;
15+
margin: 0;
16+
padding: 0;
17+
display: flex;
18+
align-items: center;
19+
justify-content: center;
20+
background-color: #FFF;
21+
}
22+
23+
.spinner {
24+
width: 66px;
25+
height: 66px;
26+
animation: contanim 2s linear infinite;
27+
}
28+
29+
svg {
30+
width: 100%;
31+
height: 100%;
32+
left: 0;
33+
top: 0;
34+
position: absolute;
35+
transform: rotate(-90deg);
36+
}
37+
svg:nth-child(1) circle {
38+
stroke: #84EBBD;
39+
stroke-dasharray: 1, 300;
40+
stroke-dashoffset: 0;
41+
animation: strokeanim 3s calc(.2s * (1)) ease infinite;
42+
transform-origin: center center;
43+
}
44+
svg:nth-child(2) circle {
45+
stroke: #4977EC;
46+
stroke-dasharray: 1, 300;
47+
stroke-dashoffset: 0;
48+
animation: strokeanim 3s calc(.2s * (2)) ease infinite;
49+
transform-origin: center center;
50+
}
51+
svg:nth-child(3) circle {
52+
stroke: #F6BB67;
53+
stroke-dasharray: 1, 300;
54+
stroke-dashoffset: 0;
55+
animation: strokeanim 3s calc(.2s * (3)) ease infinite;
56+
transform-origin: center center;
57+
}
58+
svg:nth-child(4) circle {
59+
stroke: #333841;
60+
stroke-dasharray: 1, 300;
61+
stroke-dashoffset: 0;
62+
animation: strokeanim 3s calc(.2s * (4)) ease infinite;
63+
transform-origin: center center;
64+
}
65+
66+
@keyframes strokeanim {
67+
0% {
68+
stroke-dasharray: 1, 300;
69+
stroke-dashoffset: 0;
70+
}
71+
50% {
72+
stroke-dasharray: 120, 300;
73+
stroke-dashoffset: -58.548324585;
74+
}
75+
100% {
76+
stroke-dasharray: 120, 300;
77+
stroke-dashoffset: -175.6449737549;
78+
}
79+
}
80+
@keyframes contanim {
81+
100% {
82+
transform: rotate(360deg);
83+
}
84+
}

‎client/src/app/loader/loader.component.html‎

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
<div class="spinner">
2+
<svg viewBox="0 0 66 66" xmlns="http://www.w3.org/2000/svg">
3+
<circle class="length" fill="none" stroke-width="8" stroke-linecap="round" cx="33" cy="33" r="28"></circle>
4+
</svg>
5+
<svg viewBox="0 0 66 66" xmlns="http://www.w3.org/2000/svg">
6+
<circle fill="none" stroke-width="8" stroke-linecap="round" cx="33" cy="33" r="28"></circle>
7+
</svg>
8+
<svg viewBox="0 0 66 66" xmlns="http://www.w3.org/2000/svg">
9+
<circle fill="none" stroke-width="8" stroke-linecap="round" cx="33" cy="33" r="28"></circle>
10+
</svg>
11+
<svg viewBox="0 0 66 66" xmlns="http://www.w3.org/2000/svg">
12+
<circle fill="none" stroke-width="8" stroke-linecap="round" cx="33" cy="33" r="28"></circle>
13+
</svg>
14+
</div>

‎client/src/app/loader/loader.component.spec.ts‎

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
2+
3+
import { LoaderComponent } from './loader.component';
4+
5+
describe('LoaderComponent', () => {
6+
let component: LoaderComponent;
7+
let fixture: ComponentFixture<LoaderComponent>;
8+
9+
beforeEach(async(() => {
10+
TestBed.configureTestingModule({
11+
declarations: [ LoaderComponent ]
12+
})
13+
.compileComponents();
14+
}));
15+
16+
beforeEach(() => {
17+
fixture = TestBed.createComponent(LoaderComponent);
18+
component = fixture.componentInstance;
19+
fixture.detectChanges();
20+
});
21+
22+
it('should create', () => {
23+
expect(component).toBeTruthy();
24+
});
25+
});

‎client/src/app/loader/loader.component.ts‎

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
import { Component, OnInit } from '@angular/core';
2+
3+
@Component({
4+
selector: 'app-loader',
5+
templateUrl: './loader.component.html',
6+
styleUrls: ['./loader.component.css']
7+
})
8+
export class LoaderComponent implements OnInit {
9+
10+
constructor() { }
11+
12+
ngOnInit() {
13+
}
14+
15+
}

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

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ import * as $ from 'jquery';
1414
})
1515
export class AddShelterComponent implements AfterViewInit {
1616
mapboxAccessToken = environment.mapboxAccessToken;
17-
shelter = new Shelter('', '', '', '', '', '', '', null, null, null, false, null, null, null, null);
17+
shelter = new Shelter('', '', '', '', '', '', '', null, null, null, false, null, null, null, null, false);
1818

1919
shelterDetailsTab = 0;
2020

0 commit comments

Comments
 (0)