pages/help/help.component.ts

0001 import {Component, SecurityContext} from '@angular/core';
0002 import {ShellComponent} from "../../components/shell/shell.component";
0003 import {MatIcon} from "@angular/material/icon";
0004 import {MarkdownComponent, MarkdownModule, MARKED_OPTIONS, provideMarkdown} from "ngx-markdown";
0005 import {MatIconButton} from "@angular/material/button";
0006 import {HttpClient, provideHttpClient} from "@angular/common/http";
0007 import {MatCard, MatCardContent, MatCardTitle} from "@angular/material/card";
0008 import {MatListItem, MatNavList} from "@angular/material/list";
0009 import {NgForOf} from "@angular/common";
0010
0011 interface DocPage {
0012   title: string;
0013   path: string;
0014 }
0015
0016
0017 @Component({
0018   selector: 'app-page-help',
0019   imports: [
0020     ShellComponent,
0021     MatIcon,
0022     MarkdownComponent,
0023     MatIconButton,
0024     MatCard,
0025     MatCardContent,
0026     MatCardTitle,
0027     MatListItem,
0028     MatNavList,
0029     NgForOf,
0030   ],
0031   providers: [
0032       provideMarkdown({
0033         loader: HttpClient,
0034         sanitize: SecurityContext.NONE,
0035         markedOptions: {
0036           provide: MARKED_OPTIONS,
0037           useValue: {
0038             gfm: true,
0039             breaks: false,
0040             pedantic: false,
0041           }
0042         }
0043       })
0044   ],
0045   templateUrl: './help.component.html',
0046   styleUrl: './help.component.scss'
0047 })
0048 export class HelpComponent {
0049
0050   /**
0051    * The current Markdown file being displayed
0052    */
0053   docUrl = 'assets/docs/intro.md';
0054
0055   /**
0056    * A simple list of documentation pages to show in the left pane.
0057    * `path` should match your .md files in assets/docs folder.
0058    */
0059   docPages: DocPage[] = [
0060     { title: 'Introduction', path: 'assets/docs/intro.md' },
0061     { title: 'Installation', path: 'assets/docs/pirobird.md' },
0062     { title: 'DD4Hep plugin', path: 'assets/docs/dd4hep-plugin.md' },
0063     // ...add more as needed
0064   ];
0065
0066   /**
0067    * When a user clicks on a page, update the docUrl so <markdown> reloads it.
0068    */
0069   selectPage(page: DocPage) {
0070     this.docUrl = page.path;
0071   }
0072
0073   /**
0074    * (Optional) Suppose you also want a debug button in the header:
0075    */
0076   onDebugClick() {
0077     console.log('Debug button clicked');
0078   }
0079 }