mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2025-05-26 17:24:56 +00:00
Merge pull request #694 from Alfresco/dev-eromano-viewerPerformance
hide the documentlist during the show of a file
This commit is contained in:
Maurizio Vitale
GitHub
commit
3d2e391b63
@ -1,196 +1,200 @@
|
|||||||
<div class="container">
|
<div *ngIf="!fileShowed">
|
||||||
<alfresco-upload-drag-area
|
<div class="container">
|
||||||
[showUploadDialog]="true"
|
<alfresco-upload-drag-area
|
||||||
[currentFolderPath]="currentPath"
|
[showUploadDialog]="true"
|
||||||
[uploaddirectory]=""
|
|
||||||
[versioning] = "versioning"
|
|
||||||
(onSuccess)="documentList.reload()">
|
|
||||||
<alfresco-document-list-breadcrumb
|
|
||||||
[currentFolderPath]="currentPath"
|
|
||||||
[target]="documentList">
|
|
||||||
</alfresco-document-list-breadcrumb>
|
|
||||||
<alfresco-document-list
|
|
||||||
#documentList
|
|
||||||
[currentFolderPath]="currentPath"
|
[currentFolderPath]="currentPath"
|
||||||
[contextMenuActions]="true"
|
[uploaddirectory]=""
|
||||||
[contentActions]="true"
|
[versioning] = "versioning"
|
||||||
(preview)="showFile($event)"
|
(onSuccess)="documentList.reload()">
|
||||||
(folderChange)="onFolderChanged($event)">
|
<alfresco-document-list-breadcrumb
|
||||||
<!--
|
[currentFolderPath]="currentPath"
|
||||||
<empty-folder-content>
|
[target]="documentList">
|
||||||
<template>
|
</alfresco-document-list-breadcrumb>
|
||||||
<h1>Sorry, no content here</h1>
|
<alfresco-document-list
|
||||||
</template>
|
#documentList
|
||||||
</empty-folder-content>
|
[currentFolderPath]="currentPath"
|
||||||
-->
|
[contextMenuActions]="true"
|
||||||
<content-columns>
|
[contentActions]="true"
|
||||||
<content-column key="$thumbnail" type="image"></content-column>
|
(preview)="showFile($event)"
|
||||||
<content-column
|
(folderChange)="onFolderChanged($event)">
|
||||||
title="{{'DOCUMENT_LIST.COLUMNS.DISPLAY_NAME' | translate}}"
|
|
||||||
key="name"
|
|
||||||
sortable="true"
|
|
||||||
class="full-width ellipsis-cell">
|
|
||||||
</content-column>
|
|
||||||
<!--
|
<!--
|
||||||
<content-column
|
<empty-folder-content>
|
||||||
title="Type"
|
<template>
|
||||||
source="content.mimeType">
|
<h1>Sorry, no content here</h1>
|
||||||
</content-column>
|
</template>
|
||||||
|
</empty-folder-content>
|
||||||
-->
|
-->
|
||||||
<content-column
|
<content-columns>
|
||||||
title="{{'DOCUMENT_LIST.COLUMNS.CREATED_BY' | translate}}"
|
<content-column key="$thumbnail" type="image"></content-column>
|
||||||
key="createdByUser.displayName"
|
<content-column
|
||||||
sortable="true"
|
title="{{'DOCUMENT_LIST.COLUMNS.DISPLAY_NAME' | translate}}"
|
||||||
class="desktop-only">
|
key="name"
|
||||||
</content-column>
|
sortable="true"
|
||||||
<content-column
|
class="full-width ellipsis-cell">
|
||||||
title="{{'DOCUMENT_LIST.COLUMNS.CREATED_ON' | translate}}"
|
</content-column>
|
||||||
key="createdAt"
|
<!--
|
||||||
type="date"
|
<content-column
|
||||||
format="medium"
|
title="Type"
|
||||||
sortable="true"
|
source="content.mimeType">
|
||||||
class="desktop-only">
|
</content-column>
|
||||||
</content-column>
|
-->
|
||||||
</content-columns>
|
<content-column
|
||||||
|
title="{{'DOCUMENT_LIST.COLUMNS.CREATED_BY' | translate}}"
|
||||||
|
key="createdByUser.displayName"
|
||||||
|
sortable="true"
|
||||||
|
class="desktop-only">
|
||||||
|
</content-column>
|
||||||
|
<content-column
|
||||||
|
title="{{'DOCUMENT_LIST.COLUMNS.CREATED_ON' | translate}}"
|
||||||
|
key="createdAt"
|
||||||
|
type="date"
|
||||||
|
format="medium"
|
||||||
|
sortable="true"
|
||||||
|
class="desktop-only">
|
||||||
|
</content-column>
|
||||||
|
</content-columns>
|
||||||
|
|
||||||
<content-actions>
|
<content-actions>
|
||||||
<!-- folder actions -->
|
<!-- folder actions -->
|
||||||
<content-action
|
<content-action
|
||||||
target="folder"
|
target="folder"
|
||||||
title="{{'DOCUMENT_LIST.ACTIONS.FOLDER.SYSTEM_1' | translate}}"
|
title="{{'DOCUMENT_LIST.ACTIONS.FOLDER.SYSTEM_1' | translate}}"
|
||||||
handler="system1">
|
handler="system1">
|
||||||
</content-action>
|
</content-action>
|
||||||
<content-action
|
<content-action
|
||||||
target="folder"
|
target="folder"
|
||||||
title="{{'DOCUMENT_LIST.ACTIONS.FOLDER.CUSTOM' | translate}}"
|
title="{{'DOCUMENT_LIST.ACTIONS.FOLDER.CUSTOM' | translate}}"
|
||||||
(execute)="myFolderAction1($event)">
|
(execute)="myFolderAction1($event)">
|
||||||
</content-action>
|
</content-action>
|
||||||
<content-action
|
<content-action
|
||||||
target="folder"
|
target="folder"
|
||||||
title="{{'DOCUMENT_LIST.ACTIONS.FOLDER.DELETE' | translate}}"
|
title="{{'DOCUMENT_LIST.ACTIONS.FOLDER.DELETE' | translate}}"
|
||||||
handler="delete">
|
handler="delete">
|
||||||
</content-action>
|
</content-action>
|
||||||
<!-- document actions -->
|
<!-- document actions -->
|
||||||
<content-action
|
<content-action
|
||||||
target="document"
|
target="document"
|
||||||
title="{{'DOCUMENT_LIST.ACTIONS.DOCUMENT.DOWNLOAD' | translate}}"
|
title="{{'DOCUMENT_LIST.ACTIONS.DOCUMENT.DOWNLOAD' | translate}}"
|
||||||
handler="download">
|
handler="download">
|
||||||
</content-action>
|
</content-action>
|
||||||
<content-action
|
<content-action
|
||||||
target="document"
|
target="document"
|
||||||
title="{{'DOCUMENT_LIST.ACTIONS.DOCUMENT.SYSTEM_2' | translate}}"
|
title="{{'DOCUMENT_LIST.ACTIONS.DOCUMENT.SYSTEM_2' | translate}}"
|
||||||
handler="system2">
|
handler="system2">
|
||||||
</content-action>
|
</content-action>
|
||||||
<content-action
|
<content-action
|
||||||
target="document"
|
target="document"
|
||||||
title="{{'DOCUMENT_LIST.ACTIONS.DOCUMENT.CUSTOM' | translate}}"
|
title="{{'DOCUMENT_LIST.ACTIONS.DOCUMENT.CUSTOM' | translate}}"
|
||||||
(execute)="myCustomAction1($event)">
|
(execute)="myCustomAction1($event)">
|
||||||
</content-action>
|
</content-action>
|
||||||
<content-action
|
<content-action
|
||||||
target="document"
|
target="document"
|
||||||
title="{{'DOCUMENT_LIST.ACTIONS.DOCUMENT.DELETE' | translate}}"
|
title="{{'DOCUMENT_LIST.ACTIONS.DOCUMENT.DELETE' | translate}}"
|
||||||
handler="delete">
|
handler="delete">
|
||||||
</content-action>
|
</content-action>
|
||||||
<content-action
|
<content-action
|
||||||
target="folder"
|
target="folder"
|
||||||
title="Activiti: View Form"
|
title="Activiti: View Form"
|
||||||
(execute)="viewActivitiForm($event)">
|
(execute)="viewActivitiForm($event)">
|
||||||
</content-action>
|
</content-action>
|
||||||
</content-actions>
|
</content-actions>
|
||||||
</alfresco-document-list>
|
</alfresco-document-list>
|
||||||
<alfresco-pagination
|
<alfresco-pagination
|
||||||
[provider]="documentList.data"
|
[provider]="documentList.data"
|
||||||
[supportedPageSizes]="[5, 10, 15, 20]">
|
[supportedPageSizes]="[5, 10, 15, 20]">
|
||||||
</alfresco-pagination>
|
</alfresco-pagination>
|
||||||
</alfresco-upload-drag-area>
|
</alfresco-upload-drag-area>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<context-menu-holder></context-menu-holder>
|
||||||
|
|
||||||
|
<div class="p-10">
|
||||||
|
<ul>
|
||||||
|
<li>Current path: {{documentList.currentFolderPath}}</li>
|
||||||
|
<li>
|
||||||
|
<button (click)="documentList.currentFolderPath = '/Sites/swsdp/documentLibrary';">Go to Document Library</button>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<button (click)="documentList.currentFolderPath = '/Sites/swsdp/documentLibrary/Agency Files/Contracts'">Go to agency contracts</button>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<button (click)="documentList.currentFolderPath = '/'">Go to root</button>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<button (click)="fileDialog.toggleShowDialog()">Show/Hide File Dialog</button>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<p style="width:250px;margin: 20px;">
|
||||||
|
<label for="switch-multiple-file" class="mdl-switch mdl-js-switch mdl-js-ripple-effect">
|
||||||
|
<input type="checkbox" id="switch-multiple-file" class="mdl-switch__input" (change)="toggleMultipleFileUpload()" >
|
||||||
|
<span class="mdl-switch__label">Multiple File Upload</span>
|
||||||
|
</label>
|
||||||
|
</p>
|
||||||
|
|
||||||
|
|
||||||
|
<p style="width:250px;margin: 20px;">
|
||||||
|
<label for="switch-folder-upload" class="mdl-switch mdl-js-switch mdl-js-ripple-effect">
|
||||||
|
<input type="checkbox" id="switch-folder-upload" class="mdl-switch__input" (change)="toggleFolder()">
|
||||||
|
<span class="mdl-switch__label">Folder Upload</span>
|
||||||
|
</label>
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<p style="width:250px;margin: 20px;">
|
||||||
|
<label for="switch-accepted-file-type" class="mdl-switch mdl-js-switch mdl-js-ripple-effect">
|
||||||
|
<input type="checkbox" id="switch-accepted-file-type" class="mdl-switch__input" (change)="toggleAcceptedFilesType()">
|
||||||
|
<span class="mdl-switch__label">Filter extension</span>
|
||||||
|
</label>
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<p style="width:250px;margin: 20px;">
|
||||||
|
<label for="switch-versioning" class="mdl-switch mdl-js-switch mdl-js-ripple-effect">
|
||||||
|
<input type="checkbox" id="switch-versioning" class="mdl-switch__input" (change)="toggleVersioning()">
|
||||||
|
<span class="mdl-switch__label">Versioning</span>
|
||||||
|
</label>
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<h5>Upload</h5>
|
||||||
|
<br>
|
||||||
|
<div *ngIf="acceptedFilesTypeShow">
|
||||||
|
<label class="mdl-input__label">Extension accepted
|
||||||
|
<input type="text" data-automation-id="accepted-files-type" [(ngModel)]="acceptedFilesType">
|
||||||
|
</label>
|
||||||
|
<br/>
|
||||||
|
</div>
|
||||||
|
<div *ngIf="!acceptedFilesTypeShow">
|
||||||
|
<alfresco-upload-button data-automation-id="multiple-file-upload"
|
||||||
|
[uploaddirectory]="currentPath"
|
||||||
|
[currentFolderPath]="currentPath"
|
||||||
|
[multipleFiles]="multipleFileUpload"
|
||||||
|
[uploadFolders]="folderUpload"
|
||||||
|
[versioning] = "versioning"
|
||||||
|
(onSuccess)="documentList.reload()">
|
||||||
|
<div class="mdl-spinner mdl-js-spinner is-active"></div>
|
||||||
|
</alfresco-upload-button>
|
||||||
|
</div>
|
||||||
|
<div *ngIf="acceptedFilesTypeShow">
|
||||||
|
<alfresco-upload-button data-automation-id="multiple-file-upload"
|
||||||
|
[uploaddirectory]="currentPath"
|
||||||
|
[currentFolderPath]="currentPath"
|
||||||
|
acceptedFilesType="{{acceptedFilesType}}"
|
||||||
|
[multipleFiles]="multipleFileUpload"
|
||||||
|
[uploadFolders]="folderUpload"
|
||||||
|
[versioning] = "versioning"
|
||||||
|
(onSuccess)="documentList.reload()">
|
||||||
|
<div class="mdl-spinner mdl-js-spinner is-active"></div>
|
||||||
|
</alfresco-upload-button>
|
||||||
|
</div>
|
||||||
|
<file-uploading-dialog #fileDialog></file-uploading-dialog>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<context-menu-holder></context-menu-holder>
|
<div *ngIf="fileShowed">
|
||||||
|
<alfresco-viewer [(showViewer)]="fileShowed"
|
||||||
<div class="p-10">
|
[fileNodeId]="fileNodeId"
|
||||||
<ul>
|
[overlayMode]="true">
|
||||||
<li>Current path: {{documentList.currentFolderPath}}</li>
|
|
||||||
<li>
|
|
||||||
<button (click)="documentList.currentFolderPath = '/Sites/swsdp/documentLibrary';">Go to Document Library</button>
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<button (click)="documentList.currentFolderPath = '/Sites/swsdp/documentLibrary/Agency Files/Contracts'">Go to agency contracts</button>
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<button (click)="documentList.currentFolderPath = '/'">Go to root</button>
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<button (click)="fileDialog.toggleShowDialog()">Show/Hide File Dialog</button>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
<p style="width:250px;margin: 20px;">
|
|
||||||
<label for="switch-multiple-file" class="mdl-switch mdl-js-switch mdl-js-ripple-effect">
|
|
||||||
<input type="checkbox" id="switch-multiple-file" class="mdl-switch__input" (change)="toggleMultipleFileUpload()" >
|
|
||||||
<span class="mdl-switch__label">Multiple File Upload</span>
|
|
||||||
</label>
|
|
||||||
</p>
|
|
||||||
|
|
||||||
|
|
||||||
<p style="width:250px;margin: 20px;">
|
|
||||||
<label for="switch-folder-upload" class="mdl-switch mdl-js-switch mdl-js-ripple-effect">
|
|
||||||
<input type="checkbox" id="switch-folder-upload" class="mdl-switch__input" (change)="toggleFolder()">
|
|
||||||
<span class="mdl-switch__label">Folder Upload</span>
|
|
||||||
</label>
|
|
||||||
</p>
|
|
||||||
|
|
||||||
<p style="width:250px;margin: 20px;">
|
|
||||||
<label for="switch-accepted-file-type" class="mdl-switch mdl-js-switch mdl-js-ripple-effect">
|
|
||||||
<input type="checkbox" id="switch-accepted-file-type" class="mdl-switch__input" (change)="toggleAcceptedFilesType()">
|
|
||||||
<span class="mdl-switch__label">Filter extension</span>
|
|
||||||
</label>
|
|
||||||
</p>
|
|
||||||
|
|
||||||
<p style="width:250px;margin: 20px;">
|
|
||||||
<label for="switch-versioning" class="mdl-switch mdl-js-switch mdl-js-ripple-effect">
|
|
||||||
<input type="checkbox" id="switch-versioning" class="mdl-switch__input" (change)="toggleVersioning()">
|
|
||||||
<span class="mdl-switch__label">Versioning</span>
|
|
||||||
</label>
|
|
||||||
</p>
|
|
||||||
|
|
||||||
<h5>Upload</h5>
|
|
||||||
<br>
|
|
||||||
<div *ngIf="acceptedFilesTypeShow">
|
|
||||||
<label class="mdl-input__label">Extension accepted
|
|
||||||
<input type="text" data-automation-id="accepted-files-type" [(ngModel)]="acceptedFilesType">
|
|
||||||
</label>
|
|
||||||
<br/>
|
|
||||||
</div>
|
|
||||||
<div *ngIf="!acceptedFilesTypeShow">
|
|
||||||
<alfresco-upload-button data-automation-id="multiple-file-upload"
|
|
||||||
[uploaddirectory]="currentPath"
|
|
||||||
[currentFolderPath]="currentPath"
|
|
||||||
[multipleFiles]="multipleFileUpload"
|
|
||||||
[uploadFolders]="folderUpload"
|
|
||||||
[versioning] = "versioning"
|
|
||||||
(onSuccess)="documentList.reload()">
|
|
||||||
<div class="mdl-spinner mdl-js-spinner is-active"></div>
|
<div class="mdl-spinner mdl-js-spinner is-active"></div>
|
||||||
</alfresco-upload-button>
|
</alfresco-viewer>
|
||||||
</div>
|
|
||||||
<div *ngIf="acceptedFilesTypeShow">
|
|
||||||
<alfresco-upload-button data-automation-id="multiple-file-upload"
|
|
||||||
[uploaddirectory]="currentPath"
|
|
||||||
[currentFolderPath]="currentPath"
|
|
||||||
acceptedFilesType="{{acceptedFilesType}}"
|
|
||||||
[multipleFiles]="multipleFileUpload"
|
|
||||||
[uploadFolders]="folderUpload"
|
|
||||||
[versioning] = "versioning"
|
|
||||||
(onSuccess)="documentList.reload()">
|
|
||||||
<div class="mdl-spinner mdl-js-spinner is-active"></div>
|
|
||||||
</alfresco-upload-button>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<alfresco-viewer [(showViewer)]="fileShowed"
|
|
||||||
[fileNodeId]="fileNodeId"
|
|
||||||
[overlayMode]="true">
|
|
||||||
<div class="mdl-spinner mdl-js-spinner is-active"></div>
|
|
||||||
</alfresco-viewer>
|
|
||||||
|
|
||||||
<file-uploading-dialog #fileDialog></file-uploading-dialog>
|
|
||||||
|
|||||||
@ -39,7 +39,6 @@ export class PdfViewerComponent {
|
|||||||
@Input()
|
@Input()
|
||||||
showToolbar: boolean = true;
|
showToolbar: boolean = true;
|
||||||
|
|
||||||
|
|
||||||
currentPdfDocument: any;
|
currentPdfDocument: any;
|
||||||
page: number;
|
page: number;
|
||||||
displayPage: number;
|
displayPage: number;
|
||||||
@ -105,7 +104,7 @@ export class PdfViewerComponent {
|
|||||||
|
|
||||||
initPDFViewer(pdfDocument: any) {
|
initPDFViewer(pdfDocument: any) {
|
||||||
PDFJS.verbosity = 1;
|
PDFJS.verbosity = 1;
|
||||||
PDFJS.disableWorker = true;
|
PDFJS.disableWorker = false;
|
||||||
|
|
||||||
let documentContainer = document.getElementById('viewer-pdf-container');
|
let documentContainer = document.getElementById('viewer-pdf-container');
|
||||||
let viewer: any = document.getElementById('viewer-viewerPdf');
|
let viewer: any = document.getElementById('viewer-viewerPdf');
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user