Skip to content

Commit 63adf95

Browse files
author
ijz953
committed
docs: moving events to json with service
1 parent 79ebec6 commit 63adf95

File tree

5 files changed

+115
-39
lines changed

5 files changed

+115
-39
lines changed

‎projects/ngrx.io/content/marketing/events.html‎

Lines changed: 1 addition & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -2,23 +2,5 @@
22
<h1 class="banner-headline no-toc no-anchor">Events</h1>
33
</header>
44
<article>
5-
<aio-event-list [events]="[
6-
{name: 'NgColombia', url: 'http://www.ngcolombia.com', location: 'Medellín, Colombia', startDate: '09-06-2018', endDate: '09-07-2018'},
7-
{name: 'DevFestATL', url: 'http://devfestatl.com', location: 'Atlanta, Georgia', endDate: '09-22-2018'},
8-
{name: 'Framework Summit', url: 'http://frameworksummit.com', location: 'Park City, Utah', endDate: '09-22-2018'},
9-
{name: 'DevFestATL', url: 'http://devfestatl.com', location: 'Atlanta, Georgia', startDate: '10-02-2018', endDate: '10-03-2018'},
10-
{name: 'AngularMix - Use the discount code &quot;RYAN&quot; or &quot;ROBERTS&quot; to receive $50 off your registration!', url: 'http://www.angularmix.com', location: 'Orlando, Florida', startDate: '10-10-2018', endDate: '10-12-2018'},
11-
{name: 'AngularConnect', url: 'http://www.angularconnect.com', location: 'Excel, London', startDate: '11-06-2018', endDate: '11-07-2018'},
12-
{name: 'ngAtlanta', url: 'http://ng-atl.org/', location: 'Atlanta, Georgia', startDate: '01-09-2019', endDate: '01-12-2019'},
13-
{name: 'ng-India', url: 'https://www.ng-ind.com', location: 'Gurgaon, India', endDate: '02-23-2019'},
14-
{name: 'Open Source 101', url: 'https://opensource101.com/', location: 'Columbia, South Carolina', endDate: '04-18-2019'},
15-
{name: 'NG-Conf', url: 'https://www.ng-conf.org', location: 'Salt Lake City, Utah', startDate: '05-01-2019', endDate: '05-03-2019'},
16-
{name: 'ngVikings', url: 'https://ngvikings.org/', location: 'Copenhagen, Denmark', startDate: '05-26-2019', endDate: '05-28-2019'},
17-
{name: 'REFACTR.TECH', url: 'https://refactr.tech/', location: 'Atlanta, Georgia', startDate: '06-05-2019', endDate: '06-07-2019'},
18-
{name: 'AngularUP', url: 'https://angular-up.com/', location: 'Tel Aviv, Israel', endDate: '06-12-2019'},
19-
{name: 'NG-MY', url: 'https://ng-my.org/', location: 'Kuala Lumpur, Malaysia', startDate: '07-06-2019', endDate: '07-07-2019'},
20-
{name: 'ngDenver', url: 'http://angulardenver.com/', location: 'Denver, Colorado', startDate: '08-01-2019', endDate: '08-02-2019'},
21-
{name: 'AngularConnect', url: 'https://www.angularconnect.com/', location: 'London, United Kingdom', startDate: '09-19-2019', endDate: '09-20-2019'},
22-
{name: 'NG-Rome', url: 'https://ngrome.io/', location: 'Rome, Italy', endDate: '10-07-2019'}
23-
]"></aio-event-list>
5+
<aio-event-list></aio-event-list>
246
</article>

‎projects/ngrx.io/content/marketing/events.json‎

Lines changed: 59 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,59 @@
1+
[
2+
{
3+
"name": "NgColombia",
4+
"url": "http://www.ngcolombia.com",
5+
"location": "Medellín, Colombia",
6+
"startDate": "09-06-2018",
7+
"endDate": "09-07-2018"
8+
},
9+
{
10+
"name": "DevFestATL",
11+
"url": "http://devfestatl.com",
12+
"location": "Atlanta, Georgia",
13+
"endDate": "09-22-2018"
14+
},
15+
{
16+
"name": "Framework Summit",
17+
"url": "http://frameworksummit.com",
18+
"location": "Park City, Utah",
19+
"endDate": "09-22-2018"
20+
},
21+
{
22+
"name": "DevFestATL",
23+
"url": "http://devfestatl.com",
24+
"location": "Atlanta, Georgia",
25+
"startDate": "10-02-2018",
26+
"endDate": "10-03-2018"
27+
},
28+
{
29+
"name": "AngularMix - Use the discount code &quot;RYAN&quot; or &quot;ROBERTS&quot; to receive $50 off your registration!",
30+
"url": "http://www.angularmix.com",
31+
"location": "Orlando, Florida",
32+
"startDate": "10-10-2018",
33+
"endDate": "10-12-2018"
34+
},
35+
{
36+
"name": "AngularConnect", "url": "http://www.angularconnect.com", "location": "Excel, London", "startDate": "11-06-2018", "endDate": "11-07-2018"},
37+
{
38+
"name": "ngAtlanta", "url": "http://ng-atl.org/", "location": "Atlanta, Georgia", "startDate": "01-09-2019", "endDate": "01-12-2019"},
39+
{
40+
"name": "ng-India", "url": "https://www.ng-ind.com", "location": "Gurgaon, India", "endDate": "02-23-2019"},
41+
{
42+
"name": "Open Source 101", "url": "https://opensource101.com/", "location": "Columbia, South Carolina", "endDate": "04-18-2019"},
43+
{
44+
"name": "NG-Conf", "url": "https://www.ng-conf.org", "location": "Salt Lake City, Utah", "startDate": "05-01-2019", "endDate": "05-03-2019"},
45+
{
46+
"name": "ngVikings", "url": "https://ngvikings.org/", "location": "Copenhagen, Denmark", "startDate": "05-26-2019", "endDate": "05-28-2019"},
47+
{
48+
"name": "REFACTR.TECH", "url": "https://refactr.tech/", "location": "Atlanta, Georgia", "startDate": "06-05-2019", "endDate": "06-07-2019"},
49+
{
50+
"name": "AngularUP", "url": "https://angular-up.com/", "location": "Tel Aviv, Israel", "endDate": "06-12-2019"},
51+
{
52+
"name": "NG-MY", "url": "https://ng-my.org/", "location": "Kuala Lumpur, Malaysia", "startDate": "07-06-2019", "endDate": "07-07-2019"},
53+
{
54+
"name": "ngDenver", "url": "http://angulardenver.com/", "location": "Denver, Colorado", "startDate": "08-01-2019", "endDate": "08-02-2019"},
55+
{
56+
"name": "AngularConnect", "url": "https://www.angularconnect.com/", "location": "London, United Kingdom", "startDate": "09-19-2019", "endDate": "09-20-2019"},
57+
{
58+
"name": "NG-Rome", "url": "https://ngrome.io/", "location": "Rome, Italy", "endDate": "10-07-2019"}
59+
]

‎projects/ngrx.io/src/app/custom-elements/events/event-list.component.ts‎

Lines changed: 22 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
1-
import { Component, Input } from '@angular/core';
2-
import { Event, DisplayEvent } from './event.model';
1+
import { Component } from '@angular/core';
2+
import { DisplayEvent } from './event.model';
3+
import { EventService } from './event.service';
34

45
@Component({
56
selector: `aio-event-list`,
@@ -41,25 +42,10 @@ import { Event, DisplayEvent } from './event.model';
4142
`
4243
})
4344
export class EventListComponent {
44-
upcomingEvents: DisplayEvent[];
45-
pastEvents: DisplayEvent[];
45+
upcomingEvents: DisplayEvent[] = [];
46+
pastEvents: DisplayEvent[] = [];
4647
currentDate = new Date();
4748

48-
@Input() set events(value: Event[]) {
49-
const displayEvents: DisplayEvent[] = value.map(event => {
50-
const startDate = event.startDate ? new Date(event.startDate) : undefined;
51-
const endDate = new Date(event.endDate);
52-
return {
53-
...event,
54-
startDate,
55-
endDate,
56-
dateRangeString: EventListComponent.getDateRange(startDate, endDate)
57-
};
58-
});
59-
this.upcomingEvents = displayEvents.filter(event => event.endDate >= this.currentDate);
60-
this.pastEvents = displayEvents.filter(event => event.endDate < this.currentDate);
61-
}
62-
6349
/**
6450
* The date range string for the two given dates
6551
* '01-01-2019' until '01-01-2019' -> 'January 1, 2019'
@@ -89,4 +75,21 @@ export class EventListComponent {
8975
}
9076
}
9177
}
78+
79+
constructor(private eventService: EventService) {
80+
this.eventService.events.subscribe(value => {
81+
const displayEvents: DisplayEvent[] = value.map(event => {
82+
const startDate = event.startDate ? new Date(event.startDate) : undefined;
83+
const endDate = new Date(event.endDate);
84+
return {
85+
...event,
86+
startDate,
87+
endDate,
88+
dateRangeString: EventListComponent.getDateRange(startDate, endDate)
89+
};
90+
});
91+
this.upcomingEvents = displayEvents.filter(event => event.endDate >= this.currentDate);
92+
this.pastEvents = displayEvents.filter(event => event.endDate < this.currentDate);
93+
});
94+
}
9295
}

‎projects/ngrx.io/src/app/custom-elements/events/event-list.module.ts‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,13 @@ import { NgModule, Type } from '@angular/core';
22
import { CommonModule } from '@angular/common';
33
import { WithCustomElementComponent } from '../element-registry';
44
import { EventListComponent } from './event-list.component';
5+
import { EventService } from './event.service';
56

67
@NgModule({
78
imports: [ CommonModule ],
89
declarations: [ EventListComponent ],
9-
entryComponents: [ EventListComponent ]
10+
entryComponents: [ EventListComponent ],
11+
providers: [ EventService ]
1012
})
1113
export class EventListModule implements WithCustomElementComponent {
1214
customElementComponent: Type<any> = EventListComponent;

‎projects/ngrx.io/src/app/custom-elements/events/event.service.ts‎

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
import { Injectable } from '@angular/core';
2+
import { HttpClient } from '@angular/common/http';
3+
4+
import { ConnectableObservable, Observable } from 'rxjs';
5+
import { tap, publishLast } from 'rxjs/operators';
6+
7+
import { CONTENT_URL_PREFIX } from 'app/documents/document.service';
8+
import { Event } from './event.model';
9+
10+
const resourcesPath = CONTENT_URL_PREFIX + 'events.json';
11+
12+
@Injectable()
13+
export class EventService {
14+
events: Observable<Event[]>;
15+
16+
constructor(private http: HttpClient) {
17+
this.events = this.getEvents();
18+
}
19+
20+
private getEvents(): Observable<Event[]> {
21+
22+
const events = this.http.get<Event[]>(resourcesPath).pipe(
23+
tap(event => console.log('service: ' + event)),
24+
publishLast(),
25+
);
26+
27+
(events as ConnectableObservable<Event[]>).connect();
28+
return events;
29+
};
30+
}

0 commit comments

Comments
 (0)