inteligr8/alfresco-ng2-components
1
0
Fork 0
mirror of https://github.com/Alfresco/alfresco-ng2-components.git synced 2025-06-30 18:15:11 +00:00
Code Issues Packages Projects Releases Wiki Activity

support left/right sidebar positioning (#2575)

Browse Source
This commit is contained in:
Denys Vuika 2017-10-31 14:50:08 +00:00 committed by Eugenio Romano
parent de79e736f6
commit 32d2497fa2
5 changed files with 34 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
docs/viewer.component.md
View File

@ -56,6 +56,7 @@ Using with file url:
| allowShare | boolean | false | Toggle sharing feature |
| allowSidebar | boolean |false | Toggle sidebar feature |
| showSidebar | boolean | false | Toggles sidebar visibility. Requires `allowSidebar` to be set to `true`. |
| sidebarPosition | string | right | The position of the sidebar. Can be `left` or `right`. |
## Events

14
ng2-components/ng2-alfresco-viewer/src/components/viewer.component.html
View File

@ -91,6 +91,16 @@
</ng-container>
<div *ngIf="!isLoading" class="adf-viewer-layout">
<ng-container *ngIf="showSidebar && sidebarPosition === 'left'">
<div class="adf-viewer__sidebar adf-viewer__sidebar-left">
<ng-content select="adf-viewer-sidebar"></ng-content>
<ng-container *ngIf="!sidebar">
<!-- todo: default info drawer -->
</ng-container>
</div>
</ng-container>
<div class="adf-viewer-layout-content">
<div class="adf-viewer-content-container" [ngSwitch]="viewerType">
@ -127,8 +137,8 @@
</div>
</div>
<ng-container *ngIf="showSidebar">
<div class="adf-viewer__sidebar">
<ng-container *ngIf="showSidebar && sidebarPosition !== 'left'">
<div class="adf-viewer__sidebar adf-viewer__sidebar-right">
<ng-content select="adf-viewer-sidebar"></ng-content>
<ng-container *ngIf="!sidebar">
<!-- todo: default info drawer -->

8
ng2-components/ng2-alfresco-viewer/src/components/viewer.component.scss
View File

@ -91,13 +91,5 @@ $adf-viewer-background-color: #f5f5f5;
background-color: #fafafa;
box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.27);
border-left: 1px solid rgba(0, 0, 0, 0.07);
.mat-tab-label {
text-transform: uppercase;
}
.mat-card {
margin: 6px;
}
}
}

18
ng2-components/ng2-alfresco-viewer/src/components/viewer.component.spec.ts
View File

@ -207,6 +207,24 @@ describe('ViewerComponent', () => {
expect(customElement.querySelector('.adf-viewer-container-more-actions')).toBeDefined();
});
it('should display left sidebar', () => {
component.sidebarPosition = 'left';
fixture.detectChanges();
expect(element.querySelector('.adf-viewer__sidebar-left')).toBeDefined();
});
it('should display right sidebar', () => {
component.sidebarPosition = 'right';
fixture.detectChanges();
expect(element.querySelector('.adf-viewer__sidebar-right')).toBeDefined();
});
it('should display right sidebar as fallback', () => {
component.sidebarPosition = 'unknown-value';
fixture.detectChanges();
expect(element.querySelector('.adf-viewer__sidebar-right')).toBeDefined();
});
describe('Toolbar', () => {
it('should render default download button', () => {

3
ng2-components/ng2-alfresco-viewer/src/components/viewer.component.ts
View File

@ -88,6 +88,9 @@ export class ViewerComponent implements OnDestroy, OnChanges {
@Input()
showSidebar = false;
@Input()
sidebarPosition = 'right';
@Output()
goBack = new EventEmitter<BaseEvent<any>>();