inteligr8/alfresco-ng2-components
1
0
Fork 0
mirror of https://github.com/Alfresco/alfresco-ng2-components.git synced 2025-07-24 17:32:15 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge branch 'development' into next-release-3.2.0

Browse Source
This commit is contained in:
Eugenio Romano
2019-03-27 14:30:33 +00:00
committed by Eugenio Romano
parent 1ecbf25030 3b53184598
commit b35fb4df93
120 changed files with 1583 additions and 13770 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
lib/core/card-view/components/card-view-mapitem/card-view-mapitem.component.scss
View File

@@ -1,5 +1,5 @@
.adf {
&-mapitem-clickable-value {
cursor: pointer;
cursor: pointer !important;
}
}

11
lib/core/card-view/components/card-view-textitem/card-view-textitem.component.html
View File

@@ -5,12 +5,11 @@
<span *ngIf="showProperty()" class="adf-textitem-ellipsis">{{ property.displayValue }}</span>
</span>
<ng-template #elseBlock>
<div class="adf-textitem-clickable" (click)="clicked()" fxLayout="row" fxLayoutAlign="space-between center">
<span class="adf-textitem-clickable-value" [attr.data-automation-id]="'card-textitem-value-' + property.key">
<span *ngIf="showProperty(); else elseEmptyValueBlock">{{ property.displayValue }}</span>
</span>
<mat-icon *ngIf="hasIcon()" fxFlex="0 0 auto" [attr.data-automation-id]="'card-textitem-edit-icon-' + property.icon" class="adf-textitem-icon">{{ property.icon }}</mat-icon>
</div>
<div class="adf-textitem-clickable" (click)="clicked()" fxLayout="row" fxLayoutAlign="space-between center">
<span class="adf-textitem-clickable-value" [attr.data-automation-id]="'card-textitem-value-' + property.key">
<span *ngIf="showProperty(); else elseEmptyValueBlock">{{ property.displayValue }}</span>
</span>
</div>
</ng-template>
</span>
<span *ngIf="isEditable()">

6
lib/core/card-view/components/card-view-textitem/card-view-textitem.component.scss
View File

@@ -17,7 +17,7 @@
}
&-textitem-readonly {
cursor: pointer;
cursor: pointer !important;
&:hover mat-icon {
opacity: 1;
@@ -31,7 +31,7 @@
}
&-textitem-clickable-value {
cursor: pointer;
cursor: pointer !important;
color: mat-color($primary);
}
@@ -42,7 +42,7 @@
mat-icon:not(.adf-button-disabled):hover {
opacity: 1;
cursor: pointer;
cursor: pointer !important;;
}
mat-form-field {

45
lib/core/card-view/components/card-view-textitem/card-view-textitem.component.spec.ts
View File

@@ -157,7 +157,24 @@ describe('CardViewTextItemComponent', () => {
expect(value.nativeElement.innerText.trim()).toBe('FAKE-DEFAULT-KEY');
});
it('should render the edit icon in case of clickable true and icon defined', () => {
it('should render the edit icon in case of clickable true and editable true', () => {
component.property = new CardViewTextItemModel({
label: 'Text label',
value: '',
key: 'textkey',
default: 'FAKE-DEFAULT-KEY',
clickable: true,
editable: true,
icon: 'FAKE-ICON'
});
fixture.detectChanges();
const value = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-edit-icon-${component.property.icon}"]`));
expect(value).not.toBeNull();
expect(value.nativeElement.innerText.trim()).toBe('FAKE-ICON');
});
it('should not render the edit icon in case of clickable true and icon defined', () => {
component.property = new CardViewTextItemModel({
label: 'Text label',
value: '',
@@ -168,8 +185,8 @@ describe('CardViewTextItemComponent', () => {
});
fixture.detectChanges();
const value = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-edit-icon-${component.property.icon}"]`));
expect(value).not.toBeNull();
let value = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-edit-icon-${component.property.icon}"]`));
expect(value).toBeNull();
expect(value.nativeElement.innerText.trim()).toBe('FAKE-ICON');
});
@@ -307,6 +324,28 @@ describe('CardViewTextItemComponent', () => {
});
}));
it('should render the default as value if the value is empty, clickable is false and displayEmpty is true', (done) => {
let functionTestClick = () => {
done();
};
component.property = new CardViewTextItemModel({
label: 'Text label',
value: '',
key: 'textkey',
default: 'FAKE-DEFAULT-KEY',
clickable: true,
clickCallBack: () => {
functionTestClick();
}
});
component.displayEmpty = true;
fixture.detectChanges();
const value = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-value-${component.property.key}"]`));
value.nativeElement.click();
});
it('should trigger an update event on the CardViewUpdateService [integration]', (done) => {
component.inEdit = false;
component.property.isValid = () => true;

8
lib/core/card-view/components/card-view-textitem/card-view-textitem.component.ts
View File

@@ -57,7 +57,7 @@ export class CardViewTextItemComponent implements OnChanges {
}
isClickable(): boolean {
return this.property.clickable;
return !!this.property.clickable;
}
hasIcon(): boolean {
@@ -97,6 +97,10 @@ export class CardViewTextItemComponent implements OnChanges {
}
clicked(): void {
this.cardViewUpdateService.clicked(this.property);
if (typeof this.property.clickCallBack === 'function') {
this.property.clickCallBack();
} else {
this.cardViewUpdateService.clicked(this.property);
}
}
}

2
lib/core/card-view/interfaces/card-view-item-properties.interface.ts
View File

@@ -23,7 +23,7 @@ export interface CardViewItemProperties {
key: any;
default?: any;
editable?: boolean;
clickable?: boolean;
clickable?: any;
icon?: string;
validators?: CardViewItemValidator[];
data?: any;

1
lib/core/card-view/interfaces/card-view-textitem-properties.interface.ts
View File

@@ -21,4 +21,5 @@ import { CardViewTextItemPipeProperty } from './card-view-textitem-pipe-property
export interface CardViewTextItemProperties extends CardViewItemProperties {
multiline?: boolean;
pipes?: CardViewTextItemPipeProperty[];
clickCallBack?: any;
}

4
lib/core/card-view/models/card-view-textitem.model.ts
View File

@@ -24,11 +24,13 @@ export class CardViewTextItemModel extends CardViewBaseItemModel implements Card
type: string = 'text';
multiline?: boolean;
pipes?: CardViewTextItemPipeProperty[];
clickCallBack?: any;
constructor(cardViewTextItemProperties: CardViewTextItemProperties) {
super(cardViewTextItemProperties);
this.multiline = !!cardViewTextItemProperties.multiline ;
this.multiline = !!cardViewTextItemProperties.multiline;
this.pipes = cardViewTextItemProperties.pipes || [];
this.clickCallBack = cardViewTextItemProperties.clickCallBack ? cardViewTextItemProperties.clickCallBack : null;
}
get displayValue() {

10
lib/core/datatable/components/datatable/datatable.component.html
View File

@@ -160,10 +160,12 @@
</ng-container>
</div>
<div *ngIf="col.template" class="adf-datatable-cell-container">
<ng-container
[ngTemplateOutlet]="col.template"
[ngTemplateOutletContext]="{ $implicit: { data: data, row: row, col: col }, value: data.getValue(row, col) }">
</ng-container>
<div class="adf-cell-value">
<ng-container
[ngTemplateOutlet]="col.template"
[ngTemplateOutletContext]="{ $implicit: { data: data, row: row, col: col }, value: data.getValue(row, col) }">
</ng-container>
</div>
</div>
</div>

17
lib/core/datatable/components/datatable/datatable.component.scss
View File

@@ -332,6 +332,11 @@
text-overflow: ellipsis;
word-break: break-all;
}
&:focus {
outline-offset: -1px;
outline: #448aff solid 1px;
}
}
.adf-cell-value {
@@ -466,17 +471,13 @@
/* mobile phone */
@media all and (max-width: 768px) {
.adf-desktop-only {
display: none;
}
.adf-sticky-header {
width: 100%;
display: none !important;
}
}
@media (max-device-width: 768px) {
.adf-desktop-only {
display: none;
display: none !important;
}
}
@@ -496,6 +497,8 @@
.adf-sticky-header {
border-top: 0;
max-width: calc(100% - 0.2em);
.adf-datatable-header {
position: absolute;
background-color: mat-color($background, card);
@@ -503,7 +506,7 @@
z-index: 10;
border-top: $data-table-dividers;
border-bottom: $data-table-dividers;
width: calc(100% - 16em);
width: calc(100% - 17.4em);
}
.adf-datatable-body {

15
lib/core/info-drawer/info-drawer.component.html
View File

@@ -8,13 +8,14 @@
<ng-template #tabLayout>
<mat-tab-group [(selectedIndex)]="selectedIndex" class="adf-info-drawer-tabs" (selectedTabChange)="onTabChange($event)">
<mat-tab *ngFor="let contentBlock of contentBlocks" [label]="contentBlock.label" class="adf-info-drawer-tab">
<ng-container *ngIf="contentBlock.icon">
<ng-template mat-tab-label>
<mat-icon>{{ contentBlock.icon }}</mat-icon>
<span *ngIf="contentBlock.label">{{ contentBlock.label }}</span>
</ng-template>
</ng-container>
<mat-tab *ngFor="let contentBlock of contentBlocks"
[label]="contentBlock.label"
class="adf-info-drawer-tab">
<ng-template mat-tab-label>
<mat-icon *ngIf="contentBlock.icon">{{ contentBlock.icon }}</mat-icon>
<span *ngIf="contentBlock.label">{{ contentBlock.label }}</span>
</ng-template>
<ng-container *ngTemplateOutlet="contentBlock.content"></ng-container>
</mat-tab>

5
lib/core/info-drawer/info-drawer.component.scss
View File

@@ -1,7 +1,12 @@
.adf {
&-info-drawer {
display: block;
.mat-tab-label {
min-width: 0;
}
& &-layout {
&-content {

2
lib/core/settings/host-settings.component.html
View File

@@ -125,7 +125,7 @@
<mat-form-field class="adf-full-width" floatLabel="Redirect Uri Logout">
<mat-label>{{ 'CORE.HOST_SETTINGS.REDIRECT_LOGOUT'| translate }}</mat-label>
<input matInput placeholder="{{ 'CORE.HOST_SETTINGS.REDIRECT_LOGOUT'| translate }}"
<input id="logout-url" matInput placeholder="{{ 'CORE.HOST_SETTINGS.REDIRECT_LOGOUT'| translate }}"
name="redirectUriLogout" formControlName="redirectUriLogout">
</mat-form-field>
</div>

65
lib/core/viewer/components/pdfViewer.component.spec.ts
View File

@@ -16,7 +16,7 @@
*/
import { Component, SimpleChange, ViewChild } from '@angular/core';
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { ComponentFixture, TestBed, fakeAsync, tick } from '@angular/core/testing';
import { EventMock } from '../../mock/event.mock';
import { RenderingQueueServices } from '../services/rendering-queue.services';
import { PdfViewerComponent } from './pdfViewer.component';
@@ -98,7 +98,7 @@ class BlobTestComponent {
}
createFakeBlob(): Blob {
const pdfData = atob(
let pdfData = atob(
'JVBERi0xLjcKCjEgMCBvYmogICUgZW50cnkgcG9pbnQKPDwKICAvVHlwZSAvQ2F0YWxvZwog' +
'IC9QYWdlcyAyIDAgUgo+PgplbmRvYmoKCjIgMCBvYmoKPDwKICAvVHlwZSAvUGFnZXMKICAv' +
'TWVkaWFCb3ggWyAwIDAgMjAwIDIwMCBdCiAgL0NvdW50IDEKICAvS2lkcyBbIDMgMCBSIF0K' +
@@ -137,7 +137,12 @@ describe('Test PdfViewer component', () => {
],
providers: [
{ provide: TranslationService, useClass: TranslationMock },
{ provide: MatDialog, useValue: { open: () => {} } },
{
provide: MatDialog, useValue: {
open: () => {
}
}
},
RenderingQueueServices
]
});
@@ -201,14 +206,16 @@ describe('Test PdfViewer component', () => {
document.body.removeChild(elementUrlTestComponent);
});
it('should Canvas be present', (done) => {
it('should Canvas be present', fakeAsync(() => {
fixtureUrlTestComponent.detectChanges();
tick(250);
fixtureUrlTestComponent.whenStable().then(() => {
expect(elementUrlTestComponent.querySelector('.adf-pdfViewer')).not.toBeNull();
expect(elementUrlTestComponent.querySelector('.adf-viewer-pdf-viewer')).not.toBeNull();
done();
});
}, 5000);
}));
it('should Next an Previous Buttons be present', (done) => {
fixtureUrlTestComponent.detectChanges();
@@ -350,7 +357,7 @@ describe('Test PdfViewer component', () => {
}, 5000);
it('should nextPage move to the next page', (done) => {
const nextPageButton: any = elementUrlTestComponent.querySelector('#viewer-next-page-button');
let nextPageButton: any = elementUrlTestComponent.querySelector('#viewer-next-page-button');
nextPageButton.click();
fixtureUrlTestComponent.detectChanges();
@@ -391,8 +398,8 @@ describe('Test PdfViewer component', () => {
}, 5000);
it('should previous page move to the previous page', (done) => {
const previousPageButton: any = elementUrlTestComponent.querySelector('#viewer-previous-page-button');
const nextPageButton: any = elementUrlTestComponent.querySelector('#viewer-next-page-button');
let previousPageButton: any = elementUrlTestComponent.querySelector('#viewer-previous-page-button');
let nextPageButton: any = elementUrlTestComponent.querySelector('#viewer-next-page-button');
nextPageButton.click();
nextPageButton.click();
@@ -427,35 +434,49 @@ describe('Test PdfViewer component', () => {
describe('Zoom', () => {
it('should zoom in increment the scale value', () => {
const zoomInButton: any = elementUrlTestComponent.querySelector('#viewer-zoom-in-button');
it('should zoom in increment the scale value', fakeAsync(() => {
spyOn(componentUrlTestComponent.pdfViewerComponent.pdfViewer, 'forceRendering').and.callFake(() => {
});
const zoomBefore = componentUrlTestComponent.pdfViewerComponent.currentScale;
let zoomInButton: any = elementUrlTestComponent.querySelector('#viewer-zoom-in-button');
tick(250);
let zoomBefore = componentUrlTestComponent.pdfViewerComponent.currentScale;
zoomInButton.click();
expect(componentUrlTestComponent.pdfViewerComponent.currentScaleMode).toBe('auto');
const currentZoom = componentUrlTestComponent.pdfViewerComponent.currentScale;
let currentZoom = componentUrlTestComponent.pdfViewerComponent.currentScale;
expect(zoomBefore < currentZoom).toBe(true);
}, 5000);
}));
it('should zoom out decrement the scale value', () => {
const zoomOutButton: any = elementUrlTestComponent.querySelector('#viewer-zoom-out-button');
it('should zoom out decrement the scale value', fakeAsync(() => {
spyOn(componentUrlTestComponent.pdfViewerComponent.pdfViewer, 'forceRendering').and.callFake(() => {
});
let zoomOutButton: any = elementUrlTestComponent.querySelector('#viewer-zoom-out-button');
const zoomBefore = componentUrlTestComponent.pdfViewerComponent.currentScale;
tick(250);
let zoomBefore = componentUrlTestComponent.pdfViewerComponent.currentScale;
zoomOutButton.click();
expect(componentUrlTestComponent.pdfViewerComponent.currentScaleMode).toBe('auto');
const currentZoom = componentUrlTestComponent.pdfViewerComponent.currentScale;
let currentZoom = componentUrlTestComponent.pdfViewerComponent.currentScale;
expect(zoomBefore > currentZoom).toBe(true);
}, 5000);
}));
it('should it-in button toggle page-fit and auto scale mode', () => {
const itPage: any = elementUrlTestComponent.querySelector('#viewer-scale-page-button');
it('should it-in button toggle page-fit and auto scale mode', fakeAsync(() => {
spyOn(componentUrlTestComponent.pdfViewerComponent.pdfViewer, 'forceRendering').and.callFake(() => {
});
let itPage: any = elementUrlTestComponent.querySelector('#viewer-scale-page-button');
tick(250);
expect(componentUrlTestComponent.pdfViewerComponent.currentScaleMode).toBe('auto');
itPage.click();
expect(componentUrlTestComponent.pdfViewerComponent.currentScaleMode).toBe('page-fit');
itPage.click();
expect(componentUrlTestComponent.pdfViewerComponent.currentScaleMode).toBe('auto');
}, 5000);
}));
});
describe('Resize interaction', () => {

16
lib/core/viewer/components/pdfViewer.component.ts
View File

@@ -297,15 +297,17 @@ export class PdfViewerComponent implements OnChanges, OnDestroy {
* @param newScale - new scale page
*/
setScaleUpdatePages(newScale: number) {
if (!this.isSameScale(this.currentScale, newScale)) {
this.currentScale = newScale;
if (this.pdfViewer) {
if (!this.isSameScale(this.currentScale, newScale)) {
this.currentScale = newScale;
this.pdfViewer._pages.forEach(function (currentPage) {
currentPage.update(newScale);
});
this.pdfViewer._pages.forEach(function (currentPage) {
currentPage.update(newScale);
});
}
this.pdfViewer.update();
}
this.pdfViewer.update();
}
/**