Skip to content

Commit be0baa4

Browse files
committed
Users animation.
1 parent 26ecd8a commit be0baa4

20 files changed

+240
-295
lines changed

README.md

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,5 @@
1+
https://yarnpkg.com/lang/en/docs/install/
2+
13
make install
24

35
make run

src/app/domain/User.ts

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,5 @@ export class User {
22
Name: String;
33
Email: String;
44
Document: String;
5-
Birthday: Date;
6-
Progress: Number;
5+
Birthdate: Date
76
}

src/app/domain/card.ts

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
export class Card {
2+
Title: String;
3+
Description: String;
4+
Link: String;
5+
}

src/app/domain/pagination.ts

Whitespace-only changes.
Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
import { trigger,animate, style, query, transition, stagger, keyframes } from '@angular/animations';
2+
3+
export const ListAnimation = trigger('list-transition', [
4+
transition('* <=> *', [
5+
query(':enter',
6+
[
7+
style({ opacity: 0, transform: 'translateY(15px)' }),
8+
stagger('120ms',
9+
animate('550ms ease-out',
10+
style({
11+
opacity: 1,
12+
transform: 'translateY(0px)'
13+
})
14+
)
15+
)
16+
],
17+
{ optional: true }
18+
),
19+
query(':leave',
20+
[
21+
animate('50ms',
22+
style({
23+
opacity: 0
24+
}))
25+
],
26+
{ optional: true}
27+
)
28+
])
29+
]);

src/app/modules/animations/slide-panel.animation.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,5 +7,5 @@ export const SlidePanelAnimation = trigger('slide-transition', [
77
state('right', style({
88
transform: 'translateX(-50%)'
99
})),
10-
transition('* => *', animate(300))
10+
transition('* => *', animate(150))
1111
])

src/app/modules/core/http-backend.interceptor.ts

Lines changed: 34 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,8 @@ import { HttpRequest, HttpResponse, HttpHandler, HttpEvent, HttpInterceptor } fr
33
import { Observable, of, throwError } from 'rxjs';
44
import { delay, mergeMap, materialize, dematerialize } from 'rxjs/operators';
55
import { Jwt } from './../../domain/Jwt';
6+
import { Card } from './../../domain/card';
7+
import { User } from './../../domain/User';
68

79
@Injectable()
810
export class HttpBackendInterceptor implements HttpInterceptor {
@@ -11,7 +13,8 @@ export class HttpBackendInterceptor implements HttpInterceptor {
1113
intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
1214
if (req.url.endsWith('/identity') ||
1315
req.url.endsWith('/users') ||
14-
req.url.endsWith('/error')) {
16+
req.url.endsWith('/error') ||
17+
req.url.endsWith('/cards')) {
1518

1619
return of(null).pipe(mergeMap(() => {
1720
if (req.url.endsWith('/identity') && req.method === 'POST') {
@@ -29,34 +32,37 @@ export class HttpBackendInterceptor implements HttpInterceptor {
2932
return of(new HttpResponse({ status: 200, body: jwt }));
3033
}
3134

35+
if (req.url.endsWith('/cards') && req.method === 'GET') {
36+
let cards: Card[] = [];
37+
38+
var card: Card = {
39+
Title: 'Card title',
40+
Description: 'Some quick example text to build on the card title and make up the bulk of the card\'s content.',
41+
Link: 'Dapibus ac facilisis in'
42+
}
43+
44+
for (let i = 0; i < 9; i++) {
45+
cards.push(card);
46+
}
47+
48+
return of(new HttpResponse({ status: 200, body: cards }));
49+
}
50+
3251
if (req.url.endsWith('/users') && req.method === 'GET') {
33-
let users = [
34-
{
35-
id: 1,
36-
email: "cecilharvey@gmail.com",
37-
name: "Cecil Harvey"
38-
},
39-
{
40-
id: 2,
41-
email: "tidusjecht@gmail.com",
42-
name: "Tidus Jecht"
43-
},
44-
{
45-
id: 3,
46-
email: "squall.leonhart@gmail.com",
47-
name: "Squall Leonhart"
48-
},
49-
{
50-
id: 4,
51-
email: "cloudstrife@gmail.com",
52-
name: "Cloud Strife"
53-
},
54-
{
55-
id: 5,
56-
email: "kaindragon@gmail.com",
57-
name: "Kain Dragon"
58-
}
59-
];
52+
let users: User[] = [];
53+
54+
var data = new Date();
55+
56+
var user: User = {
57+
Name: 'Gabriel Lucena',
58+
Email: 'gnllucena@gmail.com',
59+
Document: '023.437.673-27',
60+
Birthdate: new Date('1991-04-28T12:00:00')
61+
}
62+
63+
for (let i = 0; i < 10; i++) {
64+
users.push(user);
65+
}
6066

6167
return of(new HttpResponse({ status: 200, body: users }));
6268
}

src/app/modules/ui/breadcrumb.component.ts

Lines changed: 3 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -3,18 +3,9 @@ import { Component } from '@angular/core';
33
@Component({
44
selector: 'app-breadcrumb',
55
template: `
6-
<div class="row mb-2 ">
7-
<div class="col-12">
8-
<div class="page-title-box">
9-
<div class="page-title-right">
10-
<ol class="breadcrumb m-0">
11-
<li class="breadcrumb-item"><a href="javascript: void(0);">Hyper</a></li>
12-
<li class="breadcrumb-item"><a href="javascript: void(0);">Forms</a></li>
13-
<li class="breadcrumb-item active">Form Elements</li>
14-
</ol>
15-
</div>
16-
</div>
17-
</div>
6+
<div class="small mb-4">
7+
<a href="javascript: void(0);">home</a> >
8+
<a href="javascript: void(0);">users</a>
189
</div>
1910
`,
2011
styles: []

src/app/routes/dot/dot.module.ts

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import { NgModule } from '@angular/core';
22
import { RouterModule, Routes } from '@angular/router';
33
import { UIModule } from '../../modules/ui/.ui.module';
4+
import { DotService } from './dot.service';
45

56
export const appRoutes: Routes = [
67
{
@@ -13,6 +14,9 @@ export const appRoutes: Routes = [
1314
imports: [
1415
UIModule,
1516
RouterModule.forChild(appRoutes)
17+
],
18+
providers: [
19+
DotService
1620
]
1721
})
1822
export class DotModule { }

src/app/routes/dot/dot.service.ts

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
import { environment } from './../../../environments/environment';
2+
3+
import { Injectable } from '@angular/core';
4+
import { HttpClient } from '@angular/common/http';
5+
6+
import { Observable } from 'rxjs';
7+
import { Card } from './../../domain/card';
8+
9+
@Injectable()
10+
export class DotService {
11+
constructor(private http: HttpClient) { }
12+
13+
get(): Observable<Card[]> {
14+
return this.http.get<Card[]>(environment.server + '/cards');
15+
}
16+
}

0 commit comments

Comments
 (0)