91 lines
2.7 KiB
TypeScript
91 lines
2.7 KiB
TypeScript
import { Component, OnInit, OnDestroy, HostListener } from "@angular/core";
|
|
import { ActivatedRoute, UrlSegment, Params, Router } from "@angular/router";
|
|
import { map } from "rxjs/operators";
|
|
import { DocumentFetchService } from "../services/document-fetch.service";
|
|
import { DocumentData } from "../symbols/DocumentData";
|
|
import { MarkdownService } from "ngx-markdown";
|
|
import { CurrentDocumentService } from "../services/current-document.service";
|
|
import { combineLatest } from "rxjs";
|
|
import { fwlinkMapper } from "../fwlink-mapper";
|
|
import { isObject, isString } from "util";
|
|
|
|
@Component({
|
|
selector: "app-article",
|
|
templateUrl: "./article.component.html",
|
|
styleUrls: ["./article.component.scss"]
|
|
})
|
|
export class ArticleComponent implements OnInit, OnDestroy {
|
|
|
|
public documentData: DocumentData;
|
|
|
|
constructor(
|
|
private activatedRoute: ActivatedRoute,
|
|
private documentFetcher: DocumentFetchService,
|
|
private markdownService: MarkdownService,
|
|
private currentDocumentService: CurrentDocumentService,
|
|
private router: Router
|
|
) { }
|
|
|
|
ngOnInit() {
|
|
const urlEvent = this.activatedRoute.url
|
|
.pipe(map((urlSegments: UrlSegment[]) => urlSegments.map(urlSegment => urlSegment.path).join("/")));
|
|
|
|
const dataEvent = this.activatedRoute.data
|
|
.pipe(map(data => {
|
|
return {
|
|
resolveUrlPaths: data.resolveUrlPaths === true,
|
|
notFound: data.notFound === true
|
|
};
|
|
}));
|
|
|
|
const queryEvent = this.activatedRoute.queryParams
|
|
.pipe(map((params: Params) => isString(params.page) ? params.page : params.p));
|
|
|
|
combineLatest(urlEvent, dataEvent, queryEvent)
|
|
.pipe(map((combined) => {
|
|
return {
|
|
url: combined[0],
|
|
queryPage: combined[2],
|
|
resolveUrlPaths: combined[1].resolveUrlPaths,
|
|
notFound: combined[1].notFound,
|
|
};
|
|
}))
|
|
.subscribe(async (data) => {
|
|
let resolvedUrl: string;
|
|
if (!data.notFound) {
|
|
if (data.resolveUrlPaths) {
|
|
resolvedUrl = fwlinkMapper(data.queryPage);
|
|
} else {
|
|
if ((isString(data.url) && data.url.length === 0 || !isString(data.url)) && isString(data.queryPage) && data.queryPage.length > 0) {
|
|
resolvedUrl = data.queryPage;
|
|
} else {
|
|
resolvedUrl = data.url;
|
|
}
|
|
}
|
|
} else {
|
|
resolvedUrl = "404";
|
|
}
|
|
const docData: DocumentData = await this.documentFetcher.fetch(resolvedUrl);
|
|
this.documentData = docData;
|
|
this.currentDocumentService.setCurrentDocument(docData);
|
|
});
|
|
|
|
}
|
|
|
|
ngOnDestroy() {
|
|
this.currentDocumentService.setCurrentDocument(null);
|
|
}
|
|
|
|
@HostListener("click", ["$event"])
|
|
public onClick(e: Event) {
|
|
if (isObject(e.target)) {
|
|
const target = e.target as HTMLLinkElement;
|
|
if (isString(target.dataset.routerlink)) {
|
|
e.preventDefault();
|
|
this.router.navigateByUrl(target.dataset.routerlink);
|
|
}
|
|
}
|
|
}
|
|
|
|
}
|