Refactor Navbar

src/app/@core/interfaces/DocTemplate.ts

@@ -0,0 +1,17 @@
+export interface Header {
+  assistant: string;
+  documentTitle: string;
+  labCourse: string;
+  name: string;
+  organisation: string;
+  place: string;
+  preparation: string;
+}
+
+export default interface DocsTemplate {
+  header: Header;
+  humanAndEnvironmentDanger: string[];
+  rulesOfConduct: string[];
+  inCaseOfDanger: string[];
+  disposal: string[];
+}

src/app/@core/models/global.model.ts

@@ -1,8 +1,9 @@
+import { DomSanitizer, SafeResourceUrl } from '@angular/platform-browser';
 import { BehaviorSubject } from 'rxjs';
 import { Injectable } from '@angular/core';
 
-import { DomSanitizer, SafeResourceUrl } from '@angular/platform-browser';
 import { getDefaultStrings, LocalizedStrings } from '../services/i18n/i18n.interface';
+import DocsTemplate from '../interfaces/DocTemplate';
 import { Header } from '../interfaces/Header';
 import { SearchResult } from '../services/provider/provider.model';
 import { SubstanceData } from './substances.model';
@@ -58,6 +59,16 @@ export class GlobalModel {
 
     this.ghsSymbolKeys.sort();
   }
+
+  loadTemplate(docsTemplate: DocsTemplate): void {
+    this.headerSubject.next({ ...docsTemplate.header });
+    this.humanAndEnvironmentDangerSubject.next(docsTemplate.humanAndEnvironmentDanger);
+    this.rulesOfConductSubject.next(docsTemplate.rulesOfConduct);
+    this.inCaseOfDangerSubject.next(docsTemplate.inCaseOfDanger);
+    this.disposalSubject.next(docsTemplate.disposal);
+
+    this.substanceDataSubject.next([]);
+  }
 }
 
 export type GHSSymbols = Map<string, SafeResourceUrl>;

src/app/@core/modules/alert.module.ts

@@ -1,7 +1,7 @@
 import { CommonModule } from '@angular/common';
 import { NgModule } from '@angular/core';
 
-import { AlertsnackbarComponent } from '../../alertsnackbar/alertsnackbar.component';
+import { AlertsnackbarComponent } from '../../components/alertsnackbar/alertsnackbar.component';
 
 @NgModule({
   imports: [CommonModule],

src/app/menubar/menubar.component.ts → src/app/@core/services/document/document.service.ts

@@ -1,50 +1,34 @@
 import { combineLatest, Observable } from 'rxjs';
-import { Component, EventEmitter, OnInit, Output } from '@angular/core';
 import { first, map, switchMap } from 'rxjs/operators';
+import { GlobalModel } from '../../models/global.model';
+import { Injectable } from '@angular/core';
 import { MatDialog } from '@angular/material/dialog';
 
-import { AlertService } from '../@core/services/alertsnackbar/altersnackbar.service';
-import { CaBr2Document } from '../@core/services/loadSave/loadSave.model';
-import { compareArrays } from '../@core/utils/compare';
-import { DialogFilter } from '../@core/services/native/tauri.service';
-import { GlobalModel } from '../@core/models/global.model';
-import { IConfigService } from '../@core/services/config/config.interface';
-import { ILoadSaveService } from '../@core/services/loadSave/loadSave.interface';
-import { INativeService } from '../@core/services/native/native.interface';
-import { LocalizedStrings } from '../@core/services/i18n/i18n.interface';
-import Logger from '../@core/utils/logger';
-import { ManualComponent } from '../manual/manual.component';
-import { ReportBugComponent } from '../report-bug/report-bug.component';
-import { SettingsComponent } from '../settings/settings.component';
-import TEMPLATES from '../../assets/docsTemplate.json';
-import { YesNoDialogComponent } from '../yes-no-dialog/yes-no-dialog.component';
-
-const logger = new Logger('menubar');
-
-const DOCS_TEMPLATE = TEMPLATES.docsTemplate;
-
-@Component({
-  selector: 'app-menubar',
-  templateUrl: './menubar.component.html',
-  styleUrls: ['./menubar.component.scss'],
-})
-export class MenubarComponent implements OnInit {
-  @Output()
-  readonly darkModeSwitched = new EventEmitter<boolean>();
-
+import { AlertService } from '../alertsnackbar/altersnackbar.service';
+import { CaBr2Document } from '../loadSave/loadSave.model';
+import { compareArrays } from '../../utils/compare';
+import { DialogFilter } from '@tauri-apps/api/dialog';
+import DocsTemplate from '../../interfaces/DocTemplate';
+import { ILoadSaveService } from '../loadSave/loadSave.interface';
+import { INativeService } from '../native/native.interface';
+import { LocalizedStrings } from '../i18n/i18n.interface';
+import Logger from '../../utils/logger';
+import { YesNoDialogComponent } from 'src/app/components/yes-no-dialog/yes-no-dialog.component';
+
+const logger = new Logger('documentService');
+
+@Injectable()
+export default class DocumentService {
   strings!: LocalizedStrings;
 
-  programmVersion!: string;
-
   private loadFilter: DialogFilter[] = [];
   private saveFilter: DialogFilter[] = [];
 
   constructor(
-    public globals: GlobalModel,
-    private loadSaveService: ILoadSaveService,
+    private globals: GlobalModel,
     private nativeService: INativeService,
+    private loadSaveService: ILoadSaveService,
     private alertService: AlertService,
-    private configService: IConfigService,
     private dialog: MatDialog,
   ) {
     this.globals.localizedStringsObservable.subscribe((strings) => (this.strings = strings));
@@ -61,62 +45,6 @@ export class MenubarComponent implements OnInit {
     );
   }
 
-  ngOnInit(): void {
-    this.globals.headerSubject.next({ ...DOCS_TEMPLATE.header });
-    this.globals.humanAndEnvironmentDangerSubject.next(DOCS_TEMPLATE.humanAndEnvironmentDanger);
-    this.globals.rulesOfConductSubject.next(DOCS_TEMPLATE.rulesOfConduct);
-    this.globals.inCaseOfDangerSubject.next(DOCS_TEMPLATE.inCaseOfDanger);
-    this.globals.disposalSubject.next(DOCS_TEMPLATE.disposal);
-
-    this.globals.substanceDataSubject.next([]);
-
-    this.configService
-      .getProgramVersion()
-      .pipe(first())
-      .subscribe((version) => (this.programmVersion = version));
-  }
-
-  newDocument(): void {
-    this.ngOnInit();
-  }
-
-  scroll(el: HTMLElement): void {
-    el.scrollIntoView({ behavior: 'smooth' });
-  }
-
-  openMail(): void {
-    this.dialog.open(ReportBugComponent);
-  }
-
-  modelToDocument(): Observable<CaBr2Document> {
-    return combineLatest([
-      this.globals.headerObservable,
-      this.globals.substanceDataObservable,
-      this.globals.disposalObservable,
-      this.globals.humanAndEnvironmentDangerObservable,
-      this.globals.inCaseOfDangerObservable,
-      this.globals.rulesOfConductObservable,
-    ]).pipe(
-      map((value) => ({
-        header: value[0],
-        substanceData: value[1],
-        disposal: value[2],
-        humanAndEnvironmentDanger: value[3],
-        inCaseOfDanger: value[4],
-        rulesOfConduct: value[5],
-      })),
-    );
-  }
-
-  documentToModel(doc: CaBr2Document): void {
-    this.globals.headerSubject.next(doc.header);
-    this.globals.substanceDataSubject.next(doc.substanceData);
-    this.globals.disposalSubject.next(doc.disposal);
-    this.globals.humanAndEnvironmentDangerSubject.next(doc.humanAndEnvironmentDanger);
-    this.globals.inCaseOfDangerSubject.next(doc.inCaseOfDanger);
-    this.globals.rulesOfConductSubject.next(doc.rulesOfConduct);
-  }
-
   loadFile(): void {
     logger.trace('loadFile');
     this.nativeService
@@ -139,33 +67,6 @@ export class MenubarComponent implements OnInit {
       );
   }
 
-  /**
-   * Returns `true` if the `CaBr2Document has some unchecked default values
-   */
-  checkUnmodified(document: CaBr2Document): string[] {
-    const unmodified = [];
-    for (const substance of document.substanceData) {
-      if (!substance.checked) {
-        unmodified.push(substance.name.modifiedData ?? substance.name.originalData);
-      }
-    }
-    for (const section of [
-      [
-        document.humanAndEnvironmentDanger,
-        DOCS_TEMPLATE.humanAndEnvironmentDanger,
-        [this.strings.descriptions.humanAndEnvironmentDangerShort],
-      ],
-      [document.rulesOfConduct, DOCS_TEMPLATE.rulesOfConduct, [this.strings.descriptions.rulesOfConductShort]],
-      [document.inCaseOfDanger, DOCS_TEMPLATE.inCaseOfDanger, [this.strings.descriptions.inCaseOfDangerShort]],
-      [document.disposal, DOCS_TEMPLATE.disposal, [this.strings.descriptions.disposalShort]],
-    ]) {
-      if (compareArrays(section[0], section[1])) {
-        unmodified.push(section[2][0]);
-      }
-    }
-    return unmodified;
-  }
-
   saveFile(type: DialogFilter, document: CaBr2Document): void {
     // check for development, should never occur in production
     if (this.saveFilter.includes(type)) {
@@ -218,38 +119,12 @@ export class MenubarComponent implements OnInit {
       );
   }
 
-  openManualDialog(): void {
-    this.configService.getPromptHtml('gettingStarted').subscribe((html) => {
-      this.dialog.open(ManualComponent, {
-        data: {
-          content: html,
-        },
-      });
-    });
-  }
-
-  openSettingsDialog(): void {
-    const dialogRef = this.dialog.open(SettingsComponent);
-
-    dialogRef.componentInstance.darkModeSwitched.subscribe((checked: boolean) => {
-      this.darkModeSwitched.emit(checked);
-    });
-  }
-
-  exportCB2File(): void {
-    this.exportFile({ name: 'CaBr2', extensions: ['cb2'] });
-  }
-
-  exportPDFFile(): void {
-    this.exportFile({ name: 'PDF', extensions: ['pdf'] });
-  }
-
-  private exportFile(type: DialogFilter): void {
+  exportFile(type: DialogFilter, docsTemplate: DocsTemplate): void {
     logger.trace(`exportFile('${type}')`);
     this.modelToDocument()
       .pipe(first())
       .subscribe((doc) => {
-        const unmodifiedStuff = this.checkUnmodified(doc);
+        const unmodifiedStuff = this.checkUnmodified(doc, docsTemplate);
         if (unmodifiedStuff) {
           this.dialog
             .open(YesNoDialogComponent, {
@@ -270,4 +145,60 @@ export class MenubarComponent implements OnInit {
         }
       });
   }
+
+  private modelToDocument(): Observable<CaBr2Document> {
+    return combineLatest([
+      this.globals.headerObservable,
+      this.globals.substanceDataObservable,
+      this.globals.disposalObservable,
+      this.globals.humanAndEnvironmentDangerObservable,
+      this.globals.inCaseOfDangerObservable,
+      this.globals.rulesOfConductObservable,
+    ]).pipe(
+      map((value) => ({
+        header: value[0],
+        substanceData: value[1],
+        disposal: value[2],
+        humanAndEnvironmentDanger: value[3],
+        inCaseOfDanger: value[4],
+        rulesOfConduct: value[5],
+      })),
+    );
+  }
+
+  private documentToModel(doc: CaBr2Document): void {
+    this.globals.headerSubject.next(doc.header);
+    this.globals.substanceDataSubject.next(doc.substanceData);
+    this.globals.disposalSubject.next(doc.disposal);
+    this.globals.humanAndEnvironmentDangerSubject.next(doc.humanAndEnvironmentDanger);
+    this.globals.inCaseOfDangerSubject.next(doc.inCaseOfDanger);
+    this.globals.rulesOfConductSubject.next(doc.rulesOfConduct);
+  }
+
+  /**
+   * Returns `true` if the `CaBr2Document has some unchecked default values
+   */
+  private checkUnmodified(document: CaBr2Document, docsTemplate: DocsTemplate): string[] {
+    const unmodified = [];
+    for (const substance of document.substanceData) {
+      if (!substance.checked) {
+        unmodified.push(substance.name.modifiedData ?? substance.name.originalData);
+      }
+    }
+    for (const section of [
+      [
+        document.humanAndEnvironmentDanger,
+        docsTemplate.humanAndEnvironmentDanger,
+        [this.strings.descriptions.humanAndEnvironmentDangerShort],
+      ],
+      [document.rulesOfConduct, docsTemplate.rulesOfConduct, [this.strings.descriptions.rulesOfConductShort]],
+      [document.inCaseOfDanger, docsTemplate.inCaseOfDanger, [this.strings.descriptions.inCaseOfDangerShort]],
+      [document.disposal, docsTemplate.disposal, [this.strings.descriptions.disposalShort]],
+    ]) {
+      if (compareArrays(section[0], section[1])) {
+        unmodified.push(section[2][0]);
+      }
+    }
+    return unmodified;
+  }
 }

src/app/@core/services/service.module.ts

@@ -3,6 +3,7 @@ import { NgModule } from '@angular/core';
 import { BrowserService } from './native/web/browser.service';
 import { ConfigService } from './config/config.service';
 import { ConfigWebService } from './config/web/config.service';
+import DocumentService from './document/document.service';
 import { environment } from 'src/environments/environment';
 import { GlobalModel } from '../models/global.model';
 import { I18nService } from './i18n/i18n.service';
@@ -83,6 +84,7 @@ const providerFactory = (nativeService: INativeService, globals: GlobalModel): I
       useFactory: providerFactory,
       deps: [INativeService, GlobalModel],
     },
+    DocumentService,
   ],
 })
 export class ServiceModule {}

src/app/app.component.html

@@ -52,8 +52,7 @@
   }
 </style>
 
-<app-menubar (darkModeSwitched)="switchModeSink($event)"></app-menubar>
+<app-onepager (darkModeSwitched)="switchModeSink($event)"></app-onepager>
 <app-alertsnackbar></app-alertsnackbar>
-<!-- <app-header></app-header> -->
 
 <div class="version">{{ name }} {{ version }}</div>

src/app/app.component.ts

@@ -12,7 +12,7 @@ import {
 } from './@core/models/config.model';
 import { II18nService, LocalizedStrings } from './@core/services/i18n/i18n.interface';
 import { AlertService } from './@core/services/alertsnackbar/altersnackbar.service';
-import { ConsentComponent } from './consent/consent.component';
+import { ConsentComponent } from './components/consent/consent.component';
 import { GlobalModel } from './@core/models/global.model';
 import { IConfigService } from './@core/services/config/config.interface';
 import Logger from './@core/utils/logger';