Skip to content

Commit 802992b

Browse files
FawzyMokhtarFawzyMokhtar
committed
Fetch docs data
1 parent 8f8bb3c commit 802992b

33 files changed

Lines changed: 559 additions & 203 deletions

‎package.json‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -21,8 +21,10 @@
2121
"@angular/platform-browser": "~8.2.0",
2222
"@angular/platform-browser-dynamic": "~8.2.0",
2323
"@angular/router": "^8.2.0",
24+
"@types/lodash": "^4.14.136",
2425
"bootstrap": "^4.3.1",
2526
"font-awesome": "^4.7.0",
27+
"lodash": "^4.17.15",
2628
"rxjs": "~6.4.0",
2729
"tslib": "^1.10.0",
2830
"zone.js": "~0.9.1"

‎src/app/main/components/navigator/navigator.component.html‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,10 @@
11
<div class="doc-prev-next">
2-
<a class="doc-prev button" routerLink="/">
2+
<a *ngIf="previous" [routerLink]="['/docs', version.version, previous.id]" class="doc-prev button">
33
<span>← </span>
4-
<span>Previous</span>
4+
<span>{{previous.title}}</span>
55
</a>
6-
<a class="doc-next button" routerLink="/">
7-
<span>Next</span>
6+
<a *ngIf="next" [routerLink]="['/docs', version.version, next.id]" class="doc-next button">
7+
<span>{{next.title}}</span>
88
<span> →</span>
99
</a>
1010
</div>

‎src/app/main/components/navigator/navigator.component.ts‎

Lines changed: 22 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,30 @@
1-
import { Component, OnInit } from "@angular/core";
1+
import {Component, Input} from "@angular/core";
2+
import {DocumentationVersion, Post} from "../../models";
3+
import * as _ from "lodash";
24

35
@Component({
46
selector: "app-navigator",
57
templateUrl: "./navigator.component.html",
68
styleUrls: ["./navigator.component.sass"]
79
})
810
export class NavigatorComponent {
11+
12+
private previous: Post;
13+
private next: Post;
14+
private version: DocumentationVersion;
15+
16+
@Input() set data(data: {version: DocumentationVersion, post: Post}) {
17+
18+
if (data) {
19+
const posts = _.flatMap(data.version.groups, group => group.posts);
20+
const postIndex = posts.findIndex(post => post.id === data.post.id);
21+
22+
this.previous = posts[postIndex - 1];
23+
this.next = posts[postIndex + 1];
24+
25+
this.version = data.version;
26+
}
27+
28+
}
29+
930
}

‎src/app/main/components/post/post.component.html‎

Lines changed: 8 additions & 165 deletions
Original file line numberDiff line numberDiff line change
@@ -1,174 +1,17 @@
11
<div class="post">
22
<header class="post-header">
3-
<h1 class="post-header-text">Section 1</h1>
3+
<h1 class="post-header-text">{{post.title}}</h1>
44
<a class="edit-button button" routerLink="/">
55
<i class="fa fa-pencil"></i>
66
Edit
77
</a>
88
</header>
9-
<article>
10-
<h1 id="section1">Section 1 anchor.......</h1>
11-
<br>
12-
Some documentation.......
13-
<br>
14-
Some documentation.......
15-
<br>
16-
Some documentation.......
17-
<br>
18-
Some documentation.......
19-
<br>
20-
Some documentation.......
21-
<br>
22-
Some documentation.......
23-
<br>
24-
Some documentation.......
25-
<br>
26-
Some documentation.......
27-
<br>
28-
Some documentation.......
29-
<br>
30-
Some documentation.......
31-
<br>
32-
Some documentation.......
33-
<br>
34-
Some documentation.......
35-
<br>
36-
Some documentation.......
37-
<br>
38-
Some documentation.......
39-
<br>
40-
Some documentation.......
41-
<br>
42-
Some documentation.......
43-
<br>
44-
Some documentation.......
45-
<br>
46-
Some documentation.......
47-
<br>
48-
Some documentation.......
49-
<br>
50-
Some documentation.......
51-
<br>
52-
Some documentation.......
53-
<br>
54-
Some documentation.......
55-
<br>
56-
Some documentation.......
57-
<br>
58-
Some documentation.......
59-
<br>
60-
Some documentation.......
61-
<br>
62-
Some documentation.......
63-
<br>
64-
<h1 id="section2">Section 2 anchor.......</h1>
65-
Section 2 anchor.......
66-
<br>
67-
Some documentation.......
68-
<br>
69-
Some documentation.......
70-
<br>
71-
Some documentation.......
72-
<br>
73-
Some documentation.......
74-
<br>
75-
Some documentation.......
76-
<br>
77-
Some documentation.......
78-
<br>
79-
Some documentation.......
80-
<br>
81-
Some documentation.......
82-
<br>
83-
Some documentation.......
84-
<br>
85-
Some documentation.......
86-
<br>
87-
Some documentation.......
88-
<br>
89-
Some documentation.......
90-
<br>
91-
Some documentation.......
92-
<br>
93-
Some documentation.......
94-
<br>
95-
Some documentation.......
96-
<br>
97-
Some documentation.......
98-
<br>
99-
Some documentation.......
100-
<br>
101-
Some documentation.......
102-
<br>
103-
Some documentation.......
104-
<br>
105-
Some documentation.......
106-
<br>
107-
Some documentation.......
108-
<br>
109-
Some documentation.......
110-
<br>
111-
Some documentation.......
112-
<br>
113-
Some documentation.......
114-
<br>
115-
Some documentation.......
116-
<br>
117-
Some documentation.......
118-
<br>
119-
<h1 id="section3">Section 3 anchor</h1>
120-
Section 3 anchor.......
121-
<br>
122-
Some documentation.......
123-
<br>
124-
Some documentation.......
125-
<br>
126-
Some documentation.......
127-
<br>
128-
Some documentation.......
129-
<br>
130-
Some documentation.......
131-
<br>
132-
Some documentation.......
133-
<br>
134-
Some documentation.......
135-
<br>
136-
Some documentation.......
137-
<br>
138-
Some documentation.......
139-
<br>
140-
Some documentation.......
141-
<br>
142-
Some documentation.......
143-
<br>
144-
Some documentation.......
145-
<br>
146-
Some documentation.......
147-
<br>
148-
Some documentation.......
149-
<br>
150-
Some documentation.......
151-
<br>
152-
Some documentation.......
153-
<br>
154-
Some documentation.......
155-
<br>
156-
Some documentation.......
157-
<br>
158-
Some documentation.......
159-
<br>
160-
Some documentation.......
161-
<br>
162-
Some documentation.......
163-
<br>
164-
Some documentation.......
165-
<br>
166-
Some documentation.......
167-
<br>
168-
Some documentation.......
169-
<br>
170-
Some documentation.......
171-
<br>
172-
Some documentation.......
9+
<article id="post-article">
10+
<template *ngIf="post.fileName | post:version.version | async; let html" dynamic-component
11+
[componentContext]="self" [componentModules]="dynamicExtraModules" [componentTemplate]="html">
12+
</template>
17313
</article>
14+
<!-- <article id="post-article">
15+
{{post.fileName | post:version.version | async}}
16+
</article> -->
17417
</div>

‎src/app/main/components/post/post.component.ts‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,12 @@
1-
import { Component, OnInit } from "@angular/core";
1+
import {Component, Input} from "@angular/core";
2+
import {Post, DocumentationVersion} from "../../models";
23

34
@Component({
45
selector: "app-post",
56
templateUrl: "./post.component.html",
67
styleUrls: ["./post.component.sass"]
78
})
89
export class PostComponent {
10+
@Input() post: Post;
11+
@Input() version: DocumentationVersion;
912
}

‎src/app/main/components/section-nav/section-nav.component.html‎

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,13 @@
11
<div class="section-nav">
22
<nav class="navbar">
33
<div class="nav-item">
4-
<a routerLink="/" [class.active]="(activeSection | async) === 'section1'" fragment="section1"
5-
class="nav-link" (click)="onSectionClick('section1')">Section 1.1</a>
6-
<a routerLink="/" [class.active]="(activeSection | async) === 'section2'" fragment="section2"
4+
<a *ngFor="let section of post.sections" [routerLink]="['/docs', version.version, post.id]"
5+
[class.active]="(activeSection | async) === section.id" [fragment]="section.id" class="nav-link"
6+
(click)="onSectionClick(section.id)">{{section.title}}</a>
7+
<!-- <a routerLink="/" [class.active]="(activeSection | async) === 'section2'" fragment="section2"
78
class="nav-link" (click)="onSectionClick('section2')">Section 1.2</a>
89
<a routerLink="/" [class.active]="(activeSection | async) === 'section3'" fragment="section3"
9-
class="nav-link" (click)="onSectionClick('section3')">Section 1.3</a>
10+
class="nav-link" (click)="onSectionClick('section3')">Section 1.3</a> -->
1011
</div>
1112
</nav>
1213
</div>

‎src/app/main/components/section-nav/section-nav.component.ts‎

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
1-
import {Component} from "@angular/core";
1+
import {Component, Input} from "@angular/core";
22
import {ActivatedRoute} from "@angular/router";
33
import {share} from "rxjs/operators";
4+
import {Post, DocumentationVersion} from "../../models";
45

56
@Component({
67
selector: "app-section-nav",
@@ -10,6 +11,10 @@ import {share} from "rxjs/operators";
1011
export class SectionNavComponent {
1112

1213
activeSection = this.route.fragment.pipe(share());
14+
15+
@Input() post: Post;
16+
@Input() version: DocumentationVersion;
17+
1318
constructor (public route: ActivatedRoute) {}
1419

1520
// Use this method to scroll manually to a given html element id

‎src/app/main/components/side-nav/side-nav.component.html‎

Lines changed: 8 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,16 @@
11
<div class="side-nav collapsed" id="side-nav">
22
<nav class="navbar">
3-
<div class="nav-item">
3+
<div *ngFor="let group of version.groups" class="nav-item">
44
<h3 class="section-title">
55
<i class="fa fa-leanpub"></i>
6-
Section 1
6+
{{group.title}}
77
</h3>
8-
<a class="nav-link" routerLink="/" routerLinkActive="active">Link 1</a>
9-
<a class="nav-link" routerLink="/link1" routerLinkActive="active">Link 2</a>
10-
<a class="nav-link" routerLink="/link1" routerLinkActive="active">Link 3</a>
8+
<a *ngFor="let post of group.posts" [routerLink]="['/docs', version.version, post.id]"
9+
routerLinkActive="active" class="nav-link">
10+
{{post.title}}
11+
</a>
1112
</div>
12-
<div class="nav-item">
13+
<!-- <div class="nav-item">
1314
<h3 class="section-title">
1415
<i class="fa fa-leanpub"></i>
1516
Section 2
@@ -71,6 +72,6 @@ <h3 class="section-title">
7172
<a class="nav-link" routerLink="/link1" routerLinkActive="active">Link 1</a>
7273
<a class="nav-link" routerLink="/link1" routerLinkActive="active">Link 2</a>
7374
<a class="nav-link" routerLink="/link1" routerLinkActive="active">Link 3</a>
74-
</div>
75+
</div> -->
7576
</nav>
7677
</div>

‎src/app/main/components/side-nav/side-nav.component.ts‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,12 @@
1-
import { Component, OnInit } from "@angular/core";
1+
import {Component, Input} from "@angular/core";
2+
import {DocumentationVersion} from "../../models";
23

34
@Component({
45
selector: "app-side-nav",
56
templateUrl: "./side-nav.component.html",
67
styleUrls: ["./side-nav.component.sass"]
78
})
89
export class SideNavComponent {
10+
11+
@Input() version: DocumentationVersion;
912
}

‎src/app/main/containers/layout/layout.component.html‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,30 +1,30 @@
11
<div class="body-wrapper">
2-
<div class="container-fluid">
2+
<div *ngIf="version$ | async; let version" class="container-fluid">
33

44
<!-- Top Nav -->
55
<app-top-nav></app-top-nav>
66
<!-- End Top Nav -->
77

88
<div class="main-content d-flex flex-direction-row" id="main-content">
99
<!-- Side Nav -->
10-
<app-side-nav></app-side-nav>
10+
<app-side-nav [version]="version"></app-side-nav>
1111
<!-- EndSide Nav -->
1212

1313
<!-- Content Wrapper -->
14-
<div class="content-wrapper">
14+
<div *ngIf="post$ | async let post" class="content-wrapper">
1515

1616
<!-- Post -->
17-
<app-post></app-post>
17+
<app-post [post]="post" [version]="version"></app-post>
1818
<!-- End Post -->
1919

2020
<!-- Post Navigator -->
21-
<app-navigator></app-navigator>
21+
<app-navigator [data]="{ version: version, post: post }"></app-navigator>
2222
<!-- End Post Navigator -->
2323
</div>
2424
<!-- End Content Wrapper -->
2525

2626
<!-- Section Nav -->
27-
<app-section-nav></app-section-nav>
27+
<app-section-nav *ngIf="post$ | async let post" [post]="post" [version]="version"></app-section-nav>
2828
<!-- Section Nav -->
2929
</div>
3030

0 commit comments

Comments
 (0)