[ADF-4227] Sidenav Layout - support direction (#4583)

* basic ui direction service

* direction property

* demo shell integration

* move the direction in up sidenav layout to allow also the header to reorganize
use the configuration editor to change rtl ltr
add documenation

* Update app.component.html

* fix unit tests

* fix overlay viewer e2e

* fix e2e
This commit is contained in:
Cilibiu Bogdan
2019-04-25 02:48:41 +03:00
committed by Eugenio Romano
parent 83cb98f435
commit 3b83539b13
13 changed files with 124 additions and 97 deletions

View File

@@ -1,4 +1,4 @@
<div [dir]="textOrientation" class="adf-demo-app-container" >
<div class="adf-demo-app-container">
<router-outlet></router-outlet>
<router-outlet name="overlay"></router-outlet>
</div>

View File

@@ -17,7 +17,6 @@
import { Component, ViewEncapsulation, OnInit } from '@angular/core';
import {
UserPreferencesService,
AuthenticationService,
AlfrescoApiService,
PageTitleService
@@ -33,24 +32,15 @@ import { MatDialog } from '@angular/material';
})
export class AppComponent implements OnInit {
textOrientation: string = 'ltr';
constructor(private pageTitleService: PageTitleService,
private alfrescoApiService: AlfrescoApiService,
private authenticationService: AuthenticationService,
private userPreferencesService: UserPreferencesService,
private router: Router,
private dialogRef: MatDialog) {
this.userPreferencesService.set('textOrientation', this.textOrientation);
}
ngOnInit() {
this.userPreferencesService.select('textOrientation').subscribe((textOrientation) => {
this.textOrientation = textOrientation;
});
this.pageTitleService.setTitle('title');
this.alfrescoApiService.getInstance().on('error', (error) => {

View File

@@ -85,67 +85,61 @@ export const appRoutes: Routes = [
]
},
{ path: 'preview/s/:id', component: SharedLinkViewComponent },
{
path: 'breadcrumb',
canActivate: [AuthGuardEcm],
component: AppLayoutComponent,
loadChildren: 'app/components/breadcrumb-demo/breadcrumb-demo.module#AppBreadcrumbModule'
},
{
path: 'notifications',
component: AppLayoutComponent,
children: [
{
path: '',
loadChildren: 'app/components/notifications/notifications.module#AppNotificationsModule'
}
]
},
{
path: 'config-editor',
component: AppLayoutComponent,
children: [
{
path: '',
loadChildren: 'app/components/config-editor/config-editor.module#AppConfigEditorModule'
}
]
},
{
path: 'card-view',
component: AppLayoutComponent,
children: [
{
path: '',
loadChildren: 'app/components/card-view/card-view.module#AppCardViewModule'
}
]
},
{
path: 'sites',
component: AppLayoutComponent,
children: [
{
path: '',
loadChildren: 'app/components/sites/sites.module#SitesModule'
}
]
},
{
path: 'header-data',
component: AppLayoutComponent,
children: [
{
path: '',
loadChildren: 'app/components/header-data/header-data.module#AppHeaderDataModule'
}
]
},
{
path: '',
component: AppLayoutComponent,
canActivate: [AuthGuard],
children: [
{
path: 'breadcrumb',
canActivate: [AuthGuardEcm],
loadChildren: 'app/components/breadcrumb-demo/breadcrumb-demo.module#AppBreadcrumbModule'
},
{
path: 'notifications',
children: [
{
path: '',
loadChildren: 'app/components/notifications/notifications.module#AppNotificationsModule'
}
]
},
{
path: 'config-editor',
children: [
{
path: '',
loadChildren: 'app/components/config-editor/config-editor.module#AppConfigEditorModule'
}
]
},
{
path: 'card-view',
children: [
{
path: '',
loadChildren: 'app/components/card-view/card-view.module#AppCardViewModule'
}
]
},
{
path: 'sites',
children: [
{
path: '',
loadChildren: 'app/components/sites/sites.module#SitesModule'
}
]
},
{
path: 'header-data',
children: [
{
path: '',
loadChildren: 'app/components/header-data/header-data.module#AppHeaderDataModule'
}
]
},
{
path: '',
component: HomeComponent

View File

@@ -1,4 +1,4 @@
<adf-sidenav-layout [sidenavMin]="70" [sidenavMax]="220" [stepOver]="780" [hideSidenav]="hideSidenav"
<adf-sidenav-layout [sidenavMin]="70" [sidenavMax]="220" [stepOver]="780" [hideSidenav]="hideSidenav" [direction]="direction"
[expandedSidenav]="expandedSidenav" (expanded)="setState($event)" [position]="position">
<adf-sidenav-layout-header>

View File

@@ -84,6 +84,7 @@ export class AppLayoutComponent implements OnInit {
expandedSidenav = false;
position = 'start';
direction = 'ltr';
hideSidenav = false;
showMenu = true;
@@ -113,16 +114,23 @@ export class AppLayoutComponent implements OnInit {
this.headerService.tooltip.subscribe((tooltip) => this.tooltip = tooltip);
this.headerService.position.subscribe((position) => this.position = position);
this.headerService.hideSidenav.subscribe((hideSidenav) => this.hideSidenav = hideSidenav);
this.userPreferencesService.select('textOrientation').subscribe((textOrientation) => {
this.direction = textOrientation;
});
}
constructor(
private userPreferences: UserPreferencesService,
private config: AppConfigService,
private alfrescoApiService: AlfrescoApiService,
private userPreferencesService: UserPreferencesService,
private headerService: HeaderDataService) {
if (this.alfrescoApiService.getInstance().isOauthConfiguration()) {
this.enableRedirect = false;
}
this.userPreferencesService.set('textOrientation', this.direction);
}
setState(state) {