From e58705f0d796b9cb86a25ee80f5134b11127238b Mon Sep 17 00:00:00 2001 From: Bertrand Zuchuat Date: Fri, 13 Dec 2019 10:18:58 +0100 Subject: [PATCH] service: add new service to personalized title and meta html * Adds service for title and meta html. * Adds new parameter prefixWindow on config. * Implements this service on ng-core-tester. Co-Authored-by: Bertrand Zuchuat --- .../src/app/app-config.service.ts | 1 + .../src/app/app-routing.module.ts | 1 + .../ng-core-tester/src/app/app.component.ts | 11 ++- .../document/detail/detail.component.ts | 4 + .../record/document/document.component.html | 18 +++- .../app/record/document/document.component.ts | 35 ++++++- .../src/environments/environment.prod.ts | 1 + .../src/environments/environment.ts | 1 + .../ng-core/src/lib/core-config.service.ts | 2 + projects/rero/ng-core/src/lib/core.module.ts | 2 +- .../lib/service/title-meta.service.spec.ts | 53 +++++++++++ .../src/lib/service/title-meta.service.ts | 95 +++++++++++++++++++ projects/rero/ng-core/src/public-api.ts | 1 + 13 files changed, 219 insertions(+), 6 deletions(-) create mode 100644 projects/rero/ng-core/src/lib/service/title-meta.service.spec.ts create mode 100644 projects/rero/ng-core/src/lib/service/title-meta.service.ts diff --git a/projects/ng-core-tester/src/app/app-config.service.ts b/projects/ng-core-tester/src/app/app-config.service.ts index a321d62d..aa5f42c3 100644 --- a/projects/ng-core-tester/src/app/app-config.service.ts +++ b/projects/ng-core-tester/src/app/app-config.service.ts @@ -10,6 +10,7 @@ export class AppConfigService extends CoreConfigService { constructor() { super(); this.production = false; + this.prefixWindow = environment.prefixWindow; this.apiBaseUrl = 'https://localhost:5000'; this.schemaFormEndpoint = '/api/schemaform'; this.$refPrefix = environment.$refPrefix; diff --git a/projects/ng-core-tester/src/app/app-routing.module.ts b/projects/ng-core-tester/src/app/app-routing.module.ts index ea7625a2..42e98b51 100644 --- a/projects/ng-core-tester/src/app/app-routing.module.ts +++ b/projects/ng-core-tester/src/app/app-routing.module.ts @@ -170,6 +170,7 @@ const routes: Routes = [ key: 'documents', label: 'Documents', component: DocumentComponent, + detailComponent: DetailComponent, aggregationsOrder: aggrDocumentOrder, aggregationsExpand: aggrDocumentExpand, aggregationsBucketSize: aggrBucketSize, diff --git a/projects/ng-core-tester/src/app/app.component.ts b/projects/ng-core-tester/src/app/app.component.ts index e8818277..3af7461b 100644 --- a/projects/ng-core-tester/src/app/app.component.ts +++ b/projects/ng-core-tester/src/app/app.component.ts @@ -16,7 +16,7 @@ */ import { Component, OnInit } from '@angular/core'; import { TranslateService } from '@ngx-translate/core'; -import { CoreConfigService } from '@rero/ng-core'; +import { CoreConfigService, TitleMetaService } from '@rero/ng-core'; @Component({ @@ -82,7 +82,8 @@ export class AppComponent implements OnInit { constructor( private translateService: TranslateService, - private configService: CoreConfigService + private configService: CoreConfigService, + private titleMetaService: TitleMetaService ) { } @@ -97,6 +98,12 @@ export class AppComponent implements OnInit { } this.languagesMenu.entries.push(data); } + // Set default title window when application start + const prefix = this.configService.prefixWindow; + if (prefix) { + this.titleMetaService.setPrefix(prefix); + } + this.titleMetaService.setTitle('Welcome'); } changeLang(item) { diff --git a/projects/ng-core-tester/src/app/record/document/detail/detail.component.ts b/projects/ng-core-tester/src/app/record/document/detail/detail.component.ts index ef4ac667..2a683a0a 100644 --- a/projects/ng-core-tester/src/app/record/document/detail/detail.component.ts +++ b/projects/ng-core-tester/src/app/record/document/detail/detail.component.ts @@ -17,6 +17,7 @@ import { Component, OnInit } from '@angular/core'; import { Observable } from 'rxjs'; +import { TitleMetaService } from '@rero/ng-core'; import { DetailRecord } from '@rero/ng-core/lib/record/detail/view/detail-record'; @Component({ @@ -33,7 +34,10 @@ export class DetailComponent implements DetailRecord, OnInit { /** Record data */ record: any; + constructor(private titleMetaService: TitleMetaService) { } + ngOnInit(): void { + this.titleMetaService.setTitle('Detail of ' + this.type); this.record$.subscribe((record) => { this.record = record; }); diff --git a/projects/ng-core-tester/src/app/record/document/document.component.html b/projects/ng-core-tester/src/app/record/document/document.component.html index 36294adc..9a22db94 100644 --- a/projects/ng-core-tester/src/app/record/document/document.component.html +++ b/projects/ng-core-tester/src/app/record/document/document.component.html @@ -1,3 +1,19 @@ +
@@ -16,4 +32,4 @@

{{ author.name }}

-
{{ record.metadata.abstracts[0].value | truncateText:30 }}
\ No newline at end of file +
{{ record.metadata.abstracts[0].value | truncateText:30 }}
diff --git a/projects/ng-core-tester/src/app/record/document/document.component.ts b/projects/ng-core-tester/src/app/record/document/document.component.ts index dfa68cad..746efd51 100644 --- a/projects/ng-core-tester/src/app/record/document/document.component.ts +++ b/projects/ng-core-tester/src/app/record/document/document.component.ts @@ -1,10 +1,28 @@ +/* + * Invenio angular core + * Copyright (C) 2019 RERO + * + * This program is free software: you can redistribute it and/or modify + * it under the terms of the GNU Affero General Public License as published by + * the Free Software Foundation, version 3 of the License. + * + * This program is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + * GNU Affero General Public License for more details. + * + * You should have received a copy of the GNU Affero General Public License + * along with this program. If not, see . + */ import { Component, OnInit, Input } from '@angular/core'; -import { ResultItem } from '@rero/ng-core'; +import { ResultItem, TitleMetaService } from '@rero/ng-core'; @Component({ templateUrl: './document.component.html' }) -export class DocumentComponent implements ResultItem { + +export class DocumentComponent implements OnInit, ResultItem { + @Input() record: any; @@ -13,4 +31,17 @@ export class DocumentComponent implements ResultItem { @Input() detailUrl: { link: string, external: boolean }; + + /** + * Constructor + * @param titleMetaService - TitleMetaService + */ + constructor(private titleMetaService: TitleMetaService) { } + + /** + * On Init + */ + ngOnInit(): void { + this.titleMetaService.setTitle(this.type); + } } diff --git a/projects/ng-core-tester/src/environments/environment.prod.ts b/projects/ng-core-tester/src/environments/environment.prod.ts index cd50e9e7..f5993eb4 100644 --- a/projects/ng-core-tester/src/environments/environment.prod.ts +++ b/projects/ng-core-tester/src/environments/environment.prod.ts @@ -16,6 +16,7 @@ */ export const environment = { production: true, + prefixWindow: 'NG CORE TESTER', apiBaseUrl: 'https://localhost:5000', $refPrefix: 'https://sonar.ch', languages: ['fr', 'de', 'it', 'en'], diff --git a/projects/ng-core-tester/src/environments/environment.ts b/projects/ng-core-tester/src/environments/environment.ts index 0429648d..8bd2e4d2 100644 --- a/projects/ng-core-tester/src/environments/environment.ts +++ b/projects/ng-core-tester/src/environments/environment.ts @@ -21,6 +21,7 @@ export const environment = { production: false, + prefixWindow: 'NG CORE TESTER', apiBaseUrl: 'https://localhost:5000', $refPrefix: 'https://sonar.ch', languages: ['fr', 'de', 'it', 'en'], diff --git a/projects/rero/ng-core/src/lib/core-config.service.ts b/projects/rero/ng-core/src/lib/core-config.service.ts index f858fbcd..519383ef 100644 --- a/projects/rero/ng-core/src/lib/core-config.service.ts +++ b/projects/rero/ng-core/src/lib/core-config.service.ts @@ -18,6 +18,7 @@ import { Injectable } from '@angular/core'; export interface Config { production?: boolean; + prefixWindow?: string; apiBaseUrl?: string; apiEndpointPrefix?: string; $refPrefix: string; @@ -37,6 +38,7 @@ export interface Config { }) export class CoreConfigService implements Config { production = false; + prefixWindow = undefined; apiBaseUrl = ''; apiEndpointPrefix = '/api'; schemaFormEndpoint = '/api/schemaform'; diff --git a/projects/rero/ng-core/src/lib/core.module.ts b/projects/rero/ng-core/src/lib/core.module.ts index f5f6e790..7d53a740 100644 --- a/projects/rero/ng-core/src/lib/core.module.ts +++ b/projects/rero/ng-core/src/lib/core.module.ts @@ -77,4 +77,4 @@ import { TranslateLanguagePipe } from './translate/translate-language.pipe'; ], entryComponents: [DialogComponent] }) -export class CoreModule {} +export class CoreModule { } diff --git a/projects/rero/ng-core/src/lib/service/title-meta.service.spec.ts b/projects/rero/ng-core/src/lib/service/title-meta.service.spec.ts new file mode 100644 index 00000000..b4b6d0fc --- /dev/null +++ b/projects/rero/ng-core/src/lib/service/title-meta.service.spec.ts @@ -0,0 +1,53 @@ +/* + * Invenio angular core + * Copyright (C) 2019 RERO + * + * This program is free software: you can redistribute it and/or modify + * it under the terms of the GNU Affero General Public License as published by + * the Free Software Foundation, version 3 of the License. + * + * This program is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + * GNU Affero General Public License for more details. + * + * You should have received a copy of the GNU Affero General Public License + * along with this program. If not, see . + */ +import { TestBed } from '@angular/core/testing'; + +import { TitleMetaService } from './title-meta.service'; +import { TranslateModule, TranslateLoader, TranslateFakeLoader } from '@ngx-translate/core'; + +describe('TitleMetaService', () => { + beforeEach(() => TestBed.configureTestingModule({ + imports: [ + TranslateModule.forRoot({ + loader: { provide: TranslateLoader, useClass: TranslateFakeLoader } + }) + ] + })); + + it('should be created', () => { + const service: TitleMetaService = TestBed.get(TitleMetaService); + expect(service).toBeTruthy(); + }); + + it('should be set title', () => { + const service: TitleMetaService = TestBed.get(TitleMetaService); + service.setTitle('my title'); + expect(service.getTitle()).toEqual('my title'); + }); + + it('should be set title with prefix', () => { + const service: TitleMetaService = TestBed.get(TitleMetaService); + service.setPrefix('my app').setTitle('my title'); + expect(service.getTitle()).toEqual('my app: my title'); + }); + + it('should be set title', () => { + const service: TitleMetaService = TestBed.get(TitleMetaService); + service.setMeta('description', 'my description'); + expect(service.getMeta('name=description').content).toEqual('my description'); + }); +}); diff --git a/projects/rero/ng-core/src/lib/service/title-meta.service.ts b/projects/rero/ng-core/src/lib/service/title-meta.service.ts new file mode 100644 index 00000000..f60fc6e0 --- /dev/null +++ b/projects/rero/ng-core/src/lib/service/title-meta.service.ts @@ -0,0 +1,95 @@ +/* + * Invenio angular core + * Copyright (C) 2019 RERO + * + * This program is free software: you can redistribute it and/or modify + * it under the terms of the GNU Affero General Public License as published by + * the Free Software Foundation, version 3 of the License. + * + * This program is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + * GNU Affero General Public License for more details. + * + * You should have received a copy of the GNU Affero General Public License + * along with this program. If not, see . + */ +import { Injectable } from '@angular/core'; +import { Title, Meta } from '@angular/platform-browser'; +import { TranslateService } from '@ngx-translate/core'; + +@Injectable({ + providedIn: 'root' +}) +export class TitleMetaService { + + private _prefix = null; + + /** + * Constructor + * @param titleService - Title + * @param metaService - Meta + * @param translateService - TranslateService + */ + constructor( + private titleService: Title, + private metaService: Meta, + private translateService: TranslateService + ) { } + + /** + * Prefix of title window + * @param prefix - string + * @return this + */ + setPrefix(prefix?: string) { + this._prefix = this.translateService.instant(prefix); + + return this; + } + + /** + * Title window + * @param title - sting + * @return this + */ + setTitle(title: string) { + let pageTitle = ''; + if (this._prefix !== null) { + pageTitle += this._prefix + ': '; + } + pageTitle += this.translateService.instant(title); + this.titleService.setTitle(pageTitle); + + return this; + } + + /** + * Get Title + * @return string + */ + getTitle() { + return this.titleService.getTitle(); + } + + /** + * Meta window + * @param name - string + * @param content - string + * @return this + */ + setMeta(name: string, content: string) { + this.metaService.updateTag({name, content}); + + return this; + } + + /** + * Get Meta with its name + * @param name - string + * @return string + */ + getMeta(name: string) { + return this.metaService.getTag(name); + } +} diff --git a/projects/rero/ng-core/src/public-api.ts b/projects/rero/ng-core/src/public-api.ts index 07b95917..89d49fa9 100644 --- a/projects/rero/ng-core/src/public-api.ts +++ b/projects/rero/ng-core/src/public-api.ts @@ -37,3 +37,4 @@ export * from './lib/translate/translate-language.service'; export * from './lib/record/action-status'; export * from './lib/record/autocomplete/autocomplete.component'; export * from './lib/record/editor/bootstrap4-framework/custombootstrap4-framework'; +export * from './lib/service/title-meta.service';