inteligr8/alfresco-content-app
1
0
Fork 0
mirror of https://github.com/Alfresco/alfresco-content-app.git synced 2025-07-31 17:38:28 +00:00
Code Issues Packages Projects Releases Wiki Activity

[ACA-1440] use ADF Header component (#508)

Browse Source 
* [ACA-1440] use ADF HEADER component

* moved style to theme

* removed ACA HeaderComponent

* remove aca header component theme

* Update layout.component.html

* update app header locator
This commit is contained in:
Suzana Dirla
2018-07-17 08:38:36 +03:00
committed by Cilibiu Bogdan
parent 51af2071c2
commit 5d8a9057bc
10 changed files with 53 additions and 236 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
src/app/components/header/header.component.html
View File

@@ -1,24 +0,0 @@
<adf-toolbar class="app-menu" [style.background-color]="headerColor$ | async" role="heading" aria-level="1">
<adf-toolbar-title>
<button
title="{{ 'APP.ACTIONS.TOGGLE-SIDENAV' | translate }}"
mat-icon-button
(click)="toggleMenu()">
<mat-icon>menu</mat-icon>
</button>
<a class="app-menu__title"
title="{{ appName$ | async }}"
[routerLink]="[ '/' ]">
<img [src]="logo$ | async" alt="{{ appName$ | async }}" />
</a>
</adf-toolbar-title>
<div class="adf-toolbar--spacer"></div>
<aca-search-input></aca-search-input>
<adf-toolbar-divider></adf-toolbar-divider>
<aca-current-user></aca-current-user>
</adf-toolbar>

88
src/app/components/header/header.component.spec.ts
View File

@@ -1,88 +0,0 @@
/*!
* @license
* Alfresco Example Content Application
*
* Copyright (C) 2005 - 2018 Alfresco Software Limited
*
* This file is part of the Alfresco Example Content Application.
* If the software was purchased under a paid Alfresco license, the terms of
* the paid license agreement will prevail. Otherwise, the software is
* provided under the following open source license terms:
*
* The Alfresco Example Content Application is free software: you can redistribute it and/or modify
* it under the terms of the GNU Lesser General Public License as published by
* the Free Software Foundation, either version 3 of the License, or
* (at your option) any later version.
*
* The Alfresco Example Content Application 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 Lesser General Public License for more details.
*
* You should have received a copy of the GNU Lesser General Public License
* along with Alfresco. If not, see <http://www.gnu.org/licenses/>.
*/
import { AppConfigService } from '@alfresco/adf-core';
import { NO_ERRORS_SCHEMA } from '@angular/core';
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { Store } from '@ngrx/store';
import { SetAppNameAction, SetHeaderColorAction } from '../../store/actions';
import { AppStore } from '../../store/states/app.state';
import { AppTestingModule } from '../../testing/app-testing.module';
import { HeaderComponent } from './header.component';
describe('HeaderComponent', () => {
let fixture: ComponentFixture<HeaderComponent>;
let component: HeaderComponent;
let appConfigService: AppConfigService;
let store: Store<AppStore>;
beforeEach(() => {
TestBed.configureTestingModule({
imports: [ AppTestingModule ],
declarations: [
HeaderComponent
],
schemas: [ NO_ERRORS_SCHEMA ]
});
store = TestBed.get(Store);
store.dispatch(new SetAppNameAction('app-name'));
store.dispatch(new SetHeaderColorAction('some-color'));
fixture = TestBed.createComponent(HeaderComponent);
component = fixture.componentInstance;
appConfigService = TestBed.get(AppConfigService);
spyOn(appConfigService, 'get').and.callFake((val) => {
if (val === 'application.name') {
return 'app-name';
}
if (val === 'headerColor') {
return 'some-color';
}
if (val === 'application.logo') {
return '';
}
});
fixture.detectChanges();
});
it('it should set application name', done => {
component.appName$.subscribe(val => {
expect(val).toBe('app-name');
done();
});
});
it('it should set header background color', done => {
component.headerColor$.subscribe(val => {
expect(val).toBe('some-color');
done();
});
});
});

59
src/app/components/header/header.component.theme.scss
View File

@@ -1,59 +0,0 @@
@mixin aca-header-theme($theme) {
$background: map-get($theme, background);
$app-menu-height: 64px;
.aca-header {
.app-menu {
height: $app-menu-height;
&.adf-toolbar {
.mat-toolbar {
background-color: inherit;
font-family: inherit;
min-height: $app-menu-height;
height: $app-menu-height;
.mat-toolbar-layout {
height: $app-menu-height;
.mat-toolbar-row {
height: $app-menu-height;
}
}
}
.adf-toolbar-divider {
margin-left: 5px;
margin-right: 5px;
& > div {
background-color: mat-color($background, card);
}
}
.adf-toolbar-title {
color: mat-color($background, card);
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
}
}
.app-menu__title {
width: 100px;
height: 50px;
margin-left: 40px;
display: flex;
justify-content: center;
align-items: stretch;
&> img {
width: 100%;
object-fit: contain;
}
}
}
}
}

54
src/app/components/header/header.component.ts
View File

@@ -1,54 +0,0 @@
/*!
* @license
* Alfresco Example Content Application
*
* Copyright (C) 2005 - 2018 Alfresco Software Limited
*
* This file is part of the Alfresco Example Content Application.
* If the software was purchased under a paid Alfresco license, the terms of
* the paid license agreement will prevail. Otherwise, the software is
* provided under the following open source license terms:
*
* The Alfresco Example Content Application is free software: you can redistribute it and/or modify
* it under the terms of the GNU Lesser General Public License as published by
* the Free Software Foundation, either version 3 of the License, or
* (at your option) any later version.
*
* The Alfresco Example Content Application 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 Lesser General Public License for more details.
*
* You should have received a copy of the GNU Lesser General Public License
* along with Alfresco. If not, see <http://www.gnu.org/licenses/>.
*/
import { Component, Output, EventEmitter, ViewEncapsulation } from '@angular/core';
import { Store } from '@ngrx/store';
import { Observable } from 'rxjs/Rx';
import { AppStore } from '../../store/states/app.state';
import { selectHeaderColor, selectAppName, selectLogoPath } from '../../store/selectors/app.selectors';
@Component({
selector: 'aca-header',
templateUrl: './header.component.html',
encapsulation: ViewEncapsulation.None,
host: { class: 'aca-header' }
})
export class HeaderComponent {
@Output() menu: EventEmitter<any> = new EventEmitter<any>();
appName$: Observable<string>;
headerColor$: Observable<string>;
logo$: Observable<string>;
constructor(store: Store<AppStore>) {
this.headerColor$ = store.select(selectHeaderColor);
this.appName$ = store.select(selectAppName);
this.logo$ = store.select(selectLogoPath);
}
toggleMenu() {
this.menu.emit();
}
}