mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2025-07-24 17:32:15 +00:00
[AAE-10778] Refactor Viewer (#7992)
* refactor version 1 many todo
* split render from viewer
move alfresco render in content pack
* refactor part 2
* test fixed
* fix doc
* [AAE-10778] Fix lint issues
* [AAE-10778] Fix lint issue: remove duplicated declaration
* [AAE-10778] Fix lint issue: use flex shorthand rule
* [AAE-10778] Fix FormService and WidgetComponent imports
* [AAE-10778] Fix import FormModel, FormService, FormFieldModel from adf-core
* [AAE-10778] Implement missing oninit, onchanges and ondestroy
* [AAE-10778] Replace adf-viewer with adf-alfresco-viewer, update escape command to close the viewer
* [AAE-10778] Fix unit test: fix the class name to match the 'adf-viewer-render.image-viewer-scaling' get from the appConfigService
* [AAE-10778] Fix image-viewer unit tests: replace ContentService with UrlService
* [AAE-10778] Fix unit test 'should if the extension change extension Change event be fired': emit file extension when the filename extension change
* [AAE-10778] Fix unit test: expect for internalFileName value instead of display-name id because the display name logic has been moved to the alfresco-viewer.component
* [AAE-10778] Fix unit test: remove display name it because the unknown display name value is no longer handled after refactoring
* [AAE-10778] Fix e2e: [C260096] Should the Viewer able to accept a customToolbar
* [AAE-10778] Update selector to fix e2e: '[C362265] Should the Viewer be able to download a previous version of a file'
* [AAE-10778] Update selector to fix e2e: '[C260038] Should display first page, toolbar and pagination when opening a .pdf file'
* fix aftrer rebase
* fix unit test
* [AAE-10778] Add adf viewer component that is node agnostic, show adf-alfresco-viewer or adf-viewer into file-view-component if blob or node are set
* [AAE-10778] Update viewer export path
* [AAE-10778] Update selectors since have been updated in the viewer component
* [AAE-10778] Call adf-viewer from alfresco-viewer, project adf-alfresco-viewer content to adf-viewer
* [AAE-10778] Remove full screen unit tests from alfresco-viewer component becase that logic is handled in the viewer.component
* [AAE-10778] Export toolbar custom actions component
* [AAE-10778] Pass mimeType as input to adf-viewer to update mime icon
* [AAE-10778] Remove e2e because the custom name behaviour has been removed from the file-view.component (9f21b6dc69\#diff-4b438dc59784dce9eb7634cfeca6d8db61362966343bd3d6895a3edafdf4cfd5L129)
* [AAE-10778] Use two-way binding for showViewer change to fix C260100
* [AAE-10778] Update prefix css selectors to adf-viewer because are related to the adf-viewer component
* [AAE-10778] Update prefix css selectors to adf-viewer in the unit tests because are related to the adf-viewer component
* [AAE-10778] Update the output name to showViewerChange to navigate to primary url after closing the viewer
* [AAE-10778] Pass right and left sidebar template context to viewer component (fix C362242)
* [AAE-10778] Add allowFullScreen input to disable/enable full screen behaviour
* [AAE-10778] Handle loading visualization only inside the viewer-render component
* [AAE-10778] PDF viewer: fix mat-progress-bar is not showed during the pdf loading, center progress bar
* [AAE-10778] Remove isLoading from unit tests because no longer exists
* [AAE-10778] Remove viewerType input from adf-viewer, viewerType will be handled by viewer-render
* [AAE-10778] Remove console.log
* [AAE-10778] Remove check full screen button is not displayed on the media file because is not needed anymore, we don't need to check for the fullscreen button in the viewer component
* [AAE-10778] Check for node rendtion before to assign to urlFileContent and mimeType
* [AAE-10778] Process Services Cloud: register file-viewer widget that uses adf-alfresco-viewer component to display content from ACS
* [AAE-10778] Core: rename file-viewer widget into base-viewer, base-viewer no longer accept nodeId, but will accept urlFile and blobFile
* [AAE-10778] Process Services: register file-viewer widget that uses adf-alfresco-viewer component to display content from ACS
* [AAE-10778] Base viewer widget: show viewer only if there's a file input
* [AAE-10778] Viewer component: check for fileName when urlFile is provided as Input
* [AAE-10778] Viewer component documentation
* [AAE-10778] Update upgrade guide with viewer changes
* [AAE-10778] Fix double quote lint issue after rebase
---------
Co-authored-by: Amedeo Lepore <amedeo.lepore@hyland.com>
Co-authored-by: Amedeo Lepore <amedeo.lepore85@gmail.com>
This commit is contained in:
Eugenio Romano
GitHub
@@ -1,4 +1,3 @@
|
||||
<adf-viewer
|
||||
[overlayMode]="true"
|
||||
<adf-alfresco-viewer
|
||||
[nodeId]="nodeId">
|
||||
</adf-viewer>
|
||||
</adf-alfresco-viewer>
|
||||
|
||||
@@ -1,340 +1,382 @@
|
||||
<ng-container *ngIf="nodeId || content">
|
||||
<ng-container *ngIf="nodeId">
|
||||
|
||||
<ng-template let-node="node" #sidebarRightTemplate>
|
||||
<adf-info-drawer [title]="'APP.INFO_DRAWER.TITLE' | translate">
|
||||
|
||||
<adf-info-drawer-tab label="APP.INFO_DRAWER.COMMENTS">
|
||||
<adf-node-comments
|
||||
[nodeId]="nodeId"
|
||||
[readOnly]="!isCommentEnabled"
|
||||
>
|
||||
</adf-node-comments>
|
||||
</adf-info-drawer-tab>
|
||||
|
||||
<adf-info-drawer-tab label="APP.INFO_DRAWER.PROPERTIES">
|
||||
<adf-content-metadata-card *ngIf="isPreset" [node]="node"
|
||||
[multi]="multi"
|
||||
[preset]="customPreset"
|
||||
[readOnly]="isReadOnly"
|
||||
[displayAspect]="showAspect"
|
||||
[displayDefaultProperties]="displayDefaultProperties"
|
||||
[displayEmpty]="displayEmptyMetadata"></adf-content-metadata-card>
|
||||
|
||||
<adf-content-metadata-card *ngIf="!isPreset" [node]="node"
|
||||
[multi]="multi"
|
||||
[readOnly]="isReadOnly"
|
||||
[displayAspect]="showAspect"
|
||||
[displayDefaultProperties]="displayDefaultProperties"
|
||||
[displayEmpty]="displayEmptyMetadata"></adf-content-metadata-card>
|
||||
|
||||
<p class="toggle">
|
||||
<mat-slide-toggle
|
||||
id="adf-metadata-default-properties"
|
||||
[color]="'primary'"
|
||||
(change)="toggleDisplayProperties()"
|
||||
[checked]="displayDefaultProperties">
|
||||
Display Default Properties
|
||||
</mat-slide-toggle>
|
||||
</p>
|
||||
|
||||
<p class="toggle">
|
||||
<mat-slide-toggle
|
||||
id="adf-metadata-empty"
|
||||
[color]="'primary'"
|
||||
(change)="toggleEmptyMetadata()"
|
||||
[checked]="displayEmptyMetadata">
|
||||
Display Empty Metadata
|
||||
</mat-slide-toggle>
|
||||
</p>
|
||||
|
||||
<p class="toggle">
|
||||
<mat-slide-toggle
|
||||
id="adf-metadata-multi"
|
||||
[color]="'primary'"
|
||||
(change)="toggleMulti()"
|
||||
[checked]="multi">
|
||||
Multi accordion
|
||||
</mat-slide-toggle>
|
||||
</p>
|
||||
|
||||
<p class="toggle">
|
||||
<mat-slide-toggle
|
||||
id="adf-metadata-readonly"
|
||||
[color]="'primary'"
|
||||
(change)="toggleReadOnly()"
|
||||
[checked]="isReadOnly">
|
||||
Read Only
|
||||
</mat-slide-toggle>
|
||||
</p>
|
||||
|
||||
<p class="toggle">
|
||||
<mat-slide-toggle
|
||||
id="adf-toggle-custom-preset"
|
||||
[color]="'primary'"
|
||||
(change)="togglePreset()"
|
||||
[checked]="isPreset">
|
||||
Custom preset
|
||||
</mat-slide-toggle>
|
||||
</p>
|
||||
|
||||
<p class="toggle">
|
||||
|
||||
<mat-form-field floatPlaceholder="float">
|
||||
<input matInput
|
||||
placeholder="Display Aspect"
|
||||
[(ngModel)]="desiredAspect">
|
||||
</mat-form-field>
|
||||
|
||||
<button mat-raised-button (click)="applyAspect()" color="primary">
|
||||
Apply Aspect
|
||||
</button>
|
||||
</p>
|
||||
|
||||
<p class="toggle">
|
||||
<ng-container *ngIf="isPreset">
|
||||
<mat-form-field floatPlaceholder="float">
|
||||
<input matInput
|
||||
placeholder="Custom Preset"
|
||||
[(ngModel)]="customPreset"
|
||||
data-automation-id="adf-text-custom-preset">
|
||||
</mat-form-field>
|
||||
|
||||
<button mat-raised-button id="adf-metadata-aplly" (click)="applyCustomPreset()" color="primary">
|
||||
Apply
|
||||
</button>
|
||||
|
||||
</ng-container>
|
||||
</p>
|
||||
|
||||
</adf-info-drawer-tab>
|
||||
|
||||
<adf-info-drawer-tab label="APP.INFO_DRAWER.VERSIONS">
|
||||
<mat-card>
|
||||
<mat-card-content>
|
||||
<adf-version-manager [node]="node"
|
||||
(uploadError)="onUploadError($event)"
|
||||
(viewVersion)="onViewVersion($event)">
|
||||
</adf-version-manager>
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
</adf-info-drawer-tab>
|
||||
</adf-info-drawer>
|
||||
</ng-template>
|
||||
|
||||
|
||||
<ng-template let-node="node" #sidebarLeftTemplate>
|
||||
<adf-info-drawer [title]="'Viewer Options'">
|
||||
|
||||
<adf-info-drawer-tab label="Settings">
|
||||
<p class="toggle">
|
||||
<mat-slide-toggle
|
||||
id="adf-switch-custoname"
|
||||
[color]="'primary'"
|
||||
(change)="toggleCustomName()"
|
||||
[checked]="customName">
|
||||
Custom Name
|
||||
</mat-slide-toggle>
|
||||
</p>
|
||||
|
||||
<p class="toggle">
|
||||
<ng-container *ngIf="customName">
|
||||
<mat-form-field floatLabel="never">
|
||||
<input matInput
|
||||
placeholder="Custom Name"
|
||||
[(ngModel)]="displayName"
|
||||
data-automation-id="adf-text-custom-name">
|
||||
</mat-form-field>
|
||||
</ng-container>
|
||||
</p>
|
||||
|
||||
<p class="toggle">
|
||||
<mat-slide-toggle
|
||||
id="adf-switch-fileurl"
|
||||
[color]="'primary'"
|
||||
(change)="toggleFileUrl()"
|
||||
[checked]="fileUrlSwitch">
|
||||
Url File
|
||||
</mat-slide-toggle>
|
||||
</p>
|
||||
|
||||
<p class="toggle">
|
||||
<ng-container *ngIf="fileUrlSwitch">
|
||||
<mat-form-field floatPlaceholder="float">
|
||||
<input matInput
|
||||
placeholder="Url File"
|
||||
[(ngModel)]="urlFile"
|
||||
data-automation-id="adf-text-file-url">
|
||||
</mat-form-field>
|
||||
</ng-container>
|
||||
</p>
|
||||
|
||||
<p class="toggle">
|
||||
<mat-slide-toggle
|
||||
id="adf-switch-toolbar"
|
||||
[color]="'primary'"
|
||||
(change)="toggleShowToolbar()"
|
||||
[checked]="showToolbar">
|
||||
Show Toolbar
|
||||
</mat-slide-toggle>
|
||||
</p>
|
||||
|
||||
<p class="toggle">
|
||||
<mat-slide-toggle
|
||||
id="adf-switch-goback"
|
||||
[color]="'primary'"
|
||||
(change)="toggleAllowGoBack()"
|
||||
[checked]="allowGoBack">
|
||||
Allow GoBack
|
||||
</mat-slide-toggle>
|
||||
</p>
|
||||
|
||||
<p class="toggle">
|
||||
<mat-slide-toggle
|
||||
id="adf-switch-openwith"
|
||||
[color]="'primary'"
|
||||
(change)="toggleOpenWith()"
|
||||
[checked]="openWith">
|
||||
Open With
|
||||
</mat-slide-toggle>
|
||||
</p>
|
||||
|
||||
<p class="toggle">
|
||||
<mat-slide-toggle
|
||||
id="adf-switch-moreactions"
|
||||
[color]="'primary'"
|
||||
(change)="toggleOpenMoreActions()"
|
||||
[checked]="moreActions">
|
||||
More Actions
|
||||
</mat-slide-toggle>
|
||||
</p>
|
||||
|
||||
<p class="toggle">
|
||||
<mat-slide-toggle
|
||||
id="adf-switch-moreactionsmenu"
|
||||
[color]="'primary'"
|
||||
(change)="toggleMoreActionsMenu()"
|
||||
[checked]="moreActionsMenu">
|
||||
More Actions Menu
|
||||
</mat-slide-toggle>
|
||||
</p>
|
||||
|
||||
<p class="toggle">
|
||||
<mat-slide-toggle
|
||||
id="adf-switch-download"
|
||||
[color]="'primary'"
|
||||
(change)="toggleAllowDownload()"
|
||||
[checked]="allowDownload">
|
||||
Allow Download
|
||||
</mat-slide-toggle>
|
||||
</p>
|
||||
|
||||
<p class="toggle">
|
||||
<mat-slide-toggle
|
||||
id="adf-switch-print"
|
||||
[color]="'primary'"
|
||||
(change)="toggleAllowPrint()"
|
||||
[checked]="allowPrint">
|
||||
Allow Print
|
||||
</mat-slide-toggle>
|
||||
</p>
|
||||
|
||||
<p class="toggle">
|
||||
<mat-slide-toggle
|
||||
id="adf-switch-allowsidebar"
|
||||
[color]="'primary'"
|
||||
(change)="toggleAllowRightSidebar()"
|
||||
[checked]="allowRightSidebar">
|
||||
Allow Right Sidebar
|
||||
</mat-slide-toggle>
|
||||
</p>
|
||||
|
||||
<p class="toggle">
|
||||
<mat-slide-toggle
|
||||
id="adf-switch-allowLeftSidebar"
|
||||
[color]="'primary'"
|
||||
(change)="toggleAllowLeftSidebar()"
|
||||
[checked]="allowLeftSidebar">
|
||||
Allow Left Sidebar
|
||||
</mat-slide-toggle>
|
||||
</p>
|
||||
|
||||
<p class="toggle">
|
||||
<mat-slide-toggle
|
||||
id="adf-toggle-custom-toolbar"
|
||||
[color]="'primary'"
|
||||
(change)="toggleToolbar()"
|
||||
[checked]="customToolbar">
|
||||
Custom Toolbar
|
||||
</mat-slide-toggle>
|
||||
</p>
|
||||
|
||||
<p class="toggle">
|
||||
<mat-slide-toggle
|
||||
id="adf-tab-with-icon"
|
||||
[color]="'primary'"
|
||||
(change)="toggleShowTabWithIcon()"
|
||||
[checked]="showTabWithIcon">
|
||||
Show tab with icon
|
||||
</mat-slide-toggle>
|
||||
</p>
|
||||
|
||||
<p class="toggle">
|
||||
<mat-slide-toggle
|
||||
id="adf-icon-and-label-tab"
|
||||
[color]="'primary'"
|
||||
(change)="toggleShowTabWithIconAndLabel()"
|
||||
[checked]="showTabWithIconAndLabel">
|
||||
Show tab with icon and label
|
||||
</mat-slide-toggle>
|
||||
</p>
|
||||
|
||||
<p class="toggle">
|
||||
<button mat-raised-button id="adf-switch-showrightsidebar" (click)="toggleShowRightSidebar()"
|
||||
color="primary">
|
||||
Toggle Right Sidebar
|
||||
</button>
|
||||
</p>
|
||||
|
||||
<p class="toggle">
|
||||
<button mat-raised-button id="adf-switch-showleftsidebar" (click)="hideLeftSidebar()"
|
||||
color="primary">
|
||||
Hide Left Sidebar
|
||||
</button>
|
||||
</p>
|
||||
|
||||
</adf-info-drawer-tab>
|
||||
|
||||
<adf-info-drawer-tab
|
||||
*ngIf="showTabWithIcon"
|
||||
[label]=""
|
||||
[icon]="'face'"
|
||||
data-automation-id="adf-settings-tab">
|
||||
</adf-info-drawer-tab>
|
||||
|
||||
<adf-info-drawer-tab
|
||||
*ngIf="showTabWithIconAndLabel"
|
||||
[label]="'Comments'"
|
||||
[icon]="'comment'"
|
||||
data-automation-id="adf-settings-tab">
|
||||
</adf-info-drawer-tab>
|
||||
</adf-info-drawer>
|
||||
</ng-template>
|
||||
|
||||
<adf-viewer
|
||||
[blobFile]="content"
|
||||
<adf-alfresco-viewer
|
||||
(showViewerChange)="onViewerClosed()"
|
||||
[nodeId]="nodeId"
|
||||
[versionId]="versionId"
|
||||
[showRightSidebar]="showRightSidebar"
|
||||
[showLeftSidebar]="showLeftSidebar"
|
||||
[allowGoBack]="allowGoBack"
|
||||
[displayName]="displayName"
|
||||
[showToolbar]="showToolbar"
|
||||
[allowPrint]="allowPrint"
|
||||
[allowDownload]="allowDownload"
|
||||
[allowRightSidebar]="allowRightSidebar"
|
||||
[allowLeftSidebar]="allowLeftSidebar"
|
||||
[urlFile]="urlFile"
|
||||
(showViewerChange)="onViewerVisibilityChanged()"
|
||||
[sidebarLeftTemplate]="sidebarLeftTemplate"
|
||||
[sidebarRightTemplate]="sidebarRightTemplate">
|
||||
|
||||
<adf-viewer-toolbar *ngIf="customToolbar" data-automation-id="adf-viewer-custom-toolbar">
|
||||
<h1>My custom toolbar</h1>
|
||||
</adf-viewer-toolbar>
|
||||
|
||||
<adf-viewer-toolbar-actions *ngIf="moreActions">
|
||||
<button mat-icon-button id="adf-viewer-time">
|
||||
<mat-icon>alarm</mat-icon>
|
||||
</button>
|
||||
<button mat-icon-button id="adf-viewer-upload">
|
||||
<mat-icon>backup</mat-icon>
|
||||
</button>
|
||||
<button mat-icon-button id="adf-viewer-bug">
|
||||
<mat-icon>bug_report</mat-icon>
|
||||
</button>
|
||||
</adf-viewer-toolbar-actions>
|
||||
|
||||
<adf-viewer-more-actions *ngIf="moreActionsMenu">
|
||||
<button mat-menu-item id="adf-viewer-more-menu-alarm">
|
||||
<mat-icon>alarm</mat-icon>
|
||||
<span>Alarm</span>
|
||||
</button>
|
||||
<button mat-menu-item id="adf-viewer-more-menu-backup">
|
||||
<mat-icon>backup</mat-icon>
|
||||
<span>Backup</span>
|
||||
</button>
|
||||
<button mat-menu-item id="adf-viewer-more-menu-bug">
|
||||
<mat-icon>bug_report</mat-icon>
|
||||
<span>Bug report</span>
|
||||
</button>
|
||||
</adf-viewer-more-actions>
|
||||
|
||||
<ng-container *ngIf="openWith">
|
||||
<adf-viewer-open-with>
|
||||
<button mat-menu-item>
|
||||
<mat-icon>dialpad</mat-icon>
|
||||
<span>Option 1</span>
|
||||
</button>
|
||||
<button mat-menu-item disabled>
|
||||
<mat-icon>voicemail</mat-icon>
|
||||
<span>Option 2</span>
|
||||
</button>
|
||||
<button mat-menu-item>
|
||||
<mat-icon>notifications_off</mat-icon>
|
||||
<span>Option 3</span>
|
||||
</button>
|
||||
</adf-viewer-open-with>
|
||||
</ng-container>
|
||||
</adf-alfresco-viewer>
|
||||
|
||||
</ng-container>
|
||||
|
||||
|
||||
<ng-template let-node="node" #sidebarRightTemplate>
|
||||
<adf-info-drawer [title]="'APP.INFO_DRAWER.TITLE' | translate">
|
||||
|
||||
<adf-info-drawer-tab label="APP.INFO_DRAWER.COMMENTS">
|
||||
<adf-node-comments
|
||||
[nodeId]="nodeId"
|
||||
[readOnly]="!isCommentEnabled"
|
||||
>
|
||||
</adf-node-comments>
|
||||
</adf-info-drawer-tab>
|
||||
|
||||
<adf-info-drawer-tab label="APP.INFO_DRAWER.PROPERTIES">
|
||||
<adf-content-metadata-card *ngIf="isPreset" [node]="node"
|
||||
[multi]="multi"
|
||||
[preset]="customPreset"
|
||||
[readOnly]="isReadOnly"
|
||||
[displayAspect]="showAspect"
|
||||
[displayDefaultProperties]="displayDefaultProperties"
|
||||
[displayEmpty]="displayEmptyMetadata"></adf-content-metadata-card>
|
||||
|
||||
<adf-content-metadata-card *ngIf="!isPreset" [node]="node"
|
||||
[multi]="multi"
|
||||
[readOnly]="isReadOnly"
|
||||
[displayAspect]="showAspect"
|
||||
[displayDefaultProperties]="displayDefaultProperties"
|
||||
[displayEmpty]="displayEmptyMetadata"></adf-content-metadata-card>
|
||||
|
||||
<p class="toggle">
|
||||
<mat-slide-toggle
|
||||
id="adf-metadata-default-properties"
|
||||
[color]="'primary'"
|
||||
(change)="toggleDisplayProperties()"
|
||||
[checked]="displayDefaultProperties">
|
||||
Display Default Properties
|
||||
</mat-slide-toggle>
|
||||
</p>
|
||||
|
||||
<p class="toggle">
|
||||
<mat-slide-toggle
|
||||
id="adf-metadata-empty"
|
||||
[color]="'primary'"
|
||||
(change)="toggleEmptyMetadata()"
|
||||
[checked]="displayEmptyMetadata">
|
||||
Display Empty Metadata
|
||||
</mat-slide-toggle>
|
||||
</p>
|
||||
|
||||
<p class="toggle">
|
||||
<mat-slide-toggle
|
||||
id="adf-metadata-multi"
|
||||
[color]="'primary'"
|
||||
(change)="toggleMulti()"
|
||||
[checked]="multi">
|
||||
Multi accordion
|
||||
</mat-slide-toggle>
|
||||
</p>
|
||||
|
||||
<p class="toggle">
|
||||
<mat-slide-toggle
|
||||
id="adf-metadata-readonly"
|
||||
[color]="'primary'"
|
||||
(change)="toggleReadOnly()"
|
||||
[checked]="isReadOnly">
|
||||
Read Only
|
||||
</mat-slide-toggle>
|
||||
</p>
|
||||
|
||||
<p class="toggle">
|
||||
<mat-slide-toggle
|
||||
id="adf-toggle-custom-preset"
|
||||
[color]="'primary'"
|
||||
(change)="togglePreset()"
|
||||
[checked]="isPreset">
|
||||
Custom preset
|
||||
</mat-slide-toggle>
|
||||
</p>
|
||||
|
||||
<p class="toggle">
|
||||
|
||||
<mat-form-field floatPlaceholder="float">
|
||||
<input matInput
|
||||
placeholder="Display Aspect"
|
||||
[(ngModel)]="desiredAspect">
|
||||
</mat-form-field>
|
||||
|
||||
<button mat-raised-button (click)="applyAspect()" color="primary">
|
||||
Apply Aspect
|
||||
</button>
|
||||
</p>
|
||||
|
||||
<p class="toggle">
|
||||
<ng-container *ngIf="isPreset">
|
||||
<mat-form-field floatPlaceholder="float">
|
||||
<input matInput
|
||||
placeholder="Custom Preset"
|
||||
[(ngModel)]="customPreset"
|
||||
data-automation-id="adf-text-custom-preset">
|
||||
</mat-form-field>
|
||||
|
||||
<button mat-raised-button id="adf-metadata-aplly" (click)="applyCustomPreset()" color="primary">
|
||||
Apply
|
||||
</button>
|
||||
|
||||
</ng-container>
|
||||
</p>
|
||||
|
||||
</adf-info-drawer-tab>
|
||||
|
||||
<adf-info-drawer-tab label="APP.INFO_DRAWER.VERSIONS">
|
||||
<mat-card>
|
||||
<mat-card-content>
|
||||
<adf-version-manager [node]="node"
|
||||
(uploadError)="onUploadError($event)"
|
||||
(viewVersion)="onViewVersion($event)">
|
||||
</adf-version-manager>
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
</adf-info-drawer-tab>
|
||||
</adf-info-drawer>
|
||||
</ng-template>
|
||||
|
||||
<ng-template #sidebarLeftTemplate>
|
||||
<adf-info-drawer [title]="'Viewer Options'">
|
||||
|
||||
<adf-info-drawer-tab label="Settings">
|
||||
|
||||
<p class="toggle">
|
||||
<mat-slide-toggle
|
||||
id="adf-switch-fileurl"
|
||||
[color]="'primary'"
|
||||
(change)="toggleFileUrl()"
|
||||
[checked]="fileUrlSwitch">
|
||||
Url File
|
||||
</mat-slide-toggle>
|
||||
</p>
|
||||
|
||||
<p class="toggle">
|
||||
<ng-container *ngIf="fileUrlSwitch">
|
||||
<mat-form-field floatPlaceholder="float">
|
||||
<input matInput
|
||||
placeholder="Url File"
|
||||
[(ngModel)]="urlFile"
|
||||
data-automation-id="adf-text-file-url">
|
||||
</mat-form-field>
|
||||
</ng-container>
|
||||
</p>
|
||||
|
||||
<p class="toggle">
|
||||
<mat-slide-toggle
|
||||
id="adf-switch-toolbar"
|
||||
[color]="'primary'"
|
||||
(change)="toggleShowToolbar()"
|
||||
[checked]="showToolbar">
|
||||
Show Toolbar
|
||||
</mat-slide-toggle>
|
||||
</p>
|
||||
|
||||
<p class="toggle">
|
||||
<mat-slide-toggle
|
||||
id="adf-switch-goback"
|
||||
[color]="'primary'"
|
||||
(change)="toggleAllowGoBack()"
|
||||
[checked]="allowGoBack">
|
||||
Allow GoBack
|
||||
</mat-slide-toggle>
|
||||
</p>
|
||||
|
||||
<p class="toggle">
|
||||
<mat-slide-toggle
|
||||
id="adf-switch-openwith"
|
||||
[color]="'primary'"
|
||||
(change)="toggleOpenWith()"
|
||||
[checked]="openWith">
|
||||
Open With
|
||||
</mat-slide-toggle>
|
||||
</p>
|
||||
|
||||
<p class="toggle">
|
||||
<mat-slide-toggle
|
||||
id="adf-switch-moreactions"
|
||||
[color]="'primary'"
|
||||
(change)="toggleOpenMoreActions()"
|
||||
[checked]="moreActions">
|
||||
More Actions
|
||||
</mat-slide-toggle>
|
||||
</p>
|
||||
|
||||
<p class="toggle">
|
||||
<mat-slide-toggle
|
||||
id="adf-switch-moreactionsmenu"
|
||||
[color]="'primary'"
|
||||
(change)="toggleMoreActionsMenu()"
|
||||
[checked]="moreActionsMenu">
|
||||
More Actions Menu
|
||||
</mat-slide-toggle>
|
||||
</p>
|
||||
|
||||
<p class="toggle">
|
||||
<mat-slide-toggle
|
||||
id="adf-switch-download"
|
||||
[color]="'primary'"
|
||||
(change)="toggleAllowDownload()"
|
||||
[checked]="allowDownload">
|
||||
Allow Download
|
||||
</mat-slide-toggle>
|
||||
</p>
|
||||
|
||||
<p class="toggle">
|
||||
<mat-slide-toggle
|
||||
id="adf-switch-print"
|
||||
[color]="'primary'"
|
||||
(change)="toggleAllowPrint()"
|
||||
[checked]="allowPrint">
|
||||
Allow Print
|
||||
</mat-slide-toggle>
|
||||
</p>
|
||||
|
||||
<p class="toggle">
|
||||
<mat-slide-toggle
|
||||
id="adf-switch-allowsidebar"
|
||||
[color]="'primary'"
|
||||
(change)="toggleAllowRightSidebar()"
|
||||
[checked]="allowRightSidebar">
|
||||
Allow Right Sidebar
|
||||
</mat-slide-toggle>
|
||||
</p>
|
||||
|
||||
<p class="toggle">
|
||||
<mat-slide-toggle
|
||||
id="adf-switch-allowLeftSidebar"
|
||||
[color]="'primary'"
|
||||
(change)="toggleAllowLeftSidebar()"
|
||||
[checked]="allowLeftSidebar">
|
||||
Allow Left Sidebar
|
||||
</mat-slide-toggle>
|
||||
</p>
|
||||
|
||||
<p class="toggle">
|
||||
<mat-slide-toggle
|
||||
id="adf-toggle-custom-toolbar"
|
||||
[color]="'primary'"
|
||||
(change)="toggleToolbar()"
|
||||
[checked]="customToolbar">
|
||||
Custom Toolbar
|
||||
</mat-slide-toggle>
|
||||
</p>
|
||||
|
||||
<p class="toggle">
|
||||
<mat-slide-toggle
|
||||
id="adf-tab-with-icon"
|
||||
[color]="'primary'"
|
||||
(change)="toggleShowTabWithIcon()"
|
||||
[checked]="showTabWithIcon">
|
||||
Show tab with icon
|
||||
</mat-slide-toggle>
|
||||
</p>
|
||||
|
||||
<p class="toggle">
|
||||
<mat-slide-toggle
|
||||
id="adf-icon-and-label-tab"
|
||||
[color]="'primary'"
|
||||
(change)="toggleShowTabWithIconAndLabel()"
|
||||
[checked]="showTabWithIconAndLabel">
|
||||
Show tab with icon and label
|
||||
</mat-slide-toggle>
|
||||
</p>
|
||||
|
||||
<p class="toggle">
|
||||
<button mat-raised-button id="adf-switch-showrightsidebar" (click)="toggleShowRightSidebar()"
|
||||
color="primary">
|
||||
Toggle Right Sidebar
|
||||
</button>
|
||||
</p>
|
||||
|
||||
<p class="toggle">
|
||||
<button mat-raised-button id="adf-switch-showleftsidebar" (click)="hideLeftSidebar()"
|
||||
color="primary">
|
||||
Hide Left Sidebar
|
||||
</button>
|
||||
</p>
|
||||
|
||||
</adf-info-drawer-tab>
|
||||
|
||||
<adf-info-drawer-tab
|
||||
*ngIf="showTabWithIcon"
|
||||
[label]=""
|
||||
[icon]="'face'"
|
||||
data-automation-id="adf-settings-tab">
|
||||
</adf-info-drawer-tab>
|
||||
|
||||
<adf-info-drawer-tab
|
||||
*ngIf="showTabWithIconAndLabel"
|
||||
[label]="'Comments'"
|
||||
[icon]="'comment'"
|
||||
data-automation-id="adf-settings-tab">
|
||||
</adf-info-drawer-tab>
|
||||
</adf-info-drawer>
|
||||
</ng-template>
|
||||
|
||||
<ng-container *ngIf="blobFile">
|
||||
<adf-viewer
|
||||
[blobFile]="blobFile"
|
||||
[fileName]="fileName"
|
||||
[showRightSidebar]="showRightSidebar"
|
||||
[showLeftSidebar]="showLeftSidebar"
|
||||
[allowGoBack]="allowGoBack"
|
||||
[showToolbar]="showToolbar"
|
||||
[allowRightSidebar]="allowRightSidebar"
|
||||
[allowLeftSidebar]="allowLeftSidebar"
|
||||
(showViewerChange)="onViewerClosed()"
|
||||
[sidebarLeftTemplate]="sidebarLeftTemplate"
|
||||
[sidebarRightTemplate]="sidebarRightTemplate">
|
||||
|
||||
@@ -386,36 +428,5 @@
|
||||
</adf-viewer-open-with>
|
||||
</ng-container>
|
||||
|
||||
<!--
|
||||
<adf-viewer-extension [supportedExtensions]="['json']">
|
||||
<ng-template let-urlFileContent="urlFileContent" let-extension="extension">
|
||||
<h1>JSON VIEWER</h1>
|
||||
</ng-template>
|
||||
</adf-viewer-extension>
|
||||
-->
|
||||
|
||||
<!--
|
||||
<adf-viewer-extension [supportedExtensions]="['png']">
|
||||
<ng-template>
|
||||
<h1>PNG Viewer</h1>
|
||||
</ng-template>
|
||||
</adf-viewer-extension>
|
||||
-->
|
||||
|
||||
<!--
|
||||
<adf-viewer-extension [supportedExtensions]="['pdf']">
|
||||
<ng-template>
|
||||
<h1>PDF Viewer</h1>
|
||||
</ng-template>
|
||||
</adf-viewer-extension>
|
||||
-->
|
||||
|
||||
<!--
|
||||
<extension-viewer [supportedExtensions]="['obj','3DS']" #extension>
|
||||
<ng-template let-urlFileContent="urlFileContent" let-extension="extension" >
|
||||
<threed-viewer [urlFile]="urlFileContent" [extension]="extension" ></threed-viewer>
|
||||
</ng-template>
|
||||
</extension-viewer>
|
||||
-->
|
||||
</adf-viewer>
|
||||
</ng-container>
|
||||
|
||||
@@ -45,7 +45,6 @@ export class FileViewComponent implements OnInit {
|
||||
customPreset: string = null;
|
||||
displayDefaultProperties = true;
|
||||
showToolbar = true;
|
||||
displayName = null;
|
||||
urlFile = null;
|
||||
allowGoBack = true;
|
||||
openWith = false;
|
||||
@@ -55,7 +54,6 @@ export class FileViewComponent implements OnInit {
|
||||
allowLeftSidebar = true;
|
||||
moreActions = true;
|
||||
moreActionsMenu = false;
|
||||
customName = false;
|
||||
fileUrlSwitch = false;
|
||||
showLeftSidebar = null;
|
||||
showRightSidebar = false;
|
||||
@@ -65,8 +63,9 @@ export class FileViewComponent implements OnInit {
|
||||
showTabWithIconAndLabel = false;
|
||||
desiredAspect: string = null;
|
||||
showAspect: string = null;
|
||||
content: Blob;
|
||||
name: string;
|
||||
fileName: string;
|
||||
blobFile: Blob;
|
||||
|
||||
constructor(private router: Router,
|
||||
private route: ActivatedRoute,
|
||||
@@ -93,9 +92,9 @@ export class FileViewComponent implements OnInit {
|
||||
},
|
||||
() => this.router.navigate(['/files', id])
|
||||
);
|
||||
} else if (this.preview.content) {
|
||||
this.content = this.preview.content;
|
||||
this.displayName = this.preview.name;
|
||||
} else if (this.preview?.content) {
|
||||
this.blobFile = this.preview.content;
|
||||
this.fileName = this.preview.name;
|
||||
}
|
||||
});
|
||||
}
|
||||
@@ -104,7 +103,7 @@ export class FileViewComponent implements OnInit {
|
||||
this.preview.showResource(this.nodeId, versionId);
|
||||
}
|
||||
|
||||
onViewerVisibilityChanged() {
|
||||
onViewerClosed() {
|
||||
const primaryUrl = this.router.parseUrl(this.router.url).root.children[PRIMARY_OUTLET].toString();
|
||||
this.router.navigateByUrl(primaryUrl);
|
||||
}
|
||||
@@ -182,14 +181,6 @@ export class FileViewComponent implements OnInit {
|
||||
this.showTabWithIconAndLabel = !this.showTabWithIconAndLabel;
|
||||
}
|
||||
|
||||
toggleCustomName() {
|
||||
this.customName = !this.customName;
|
||||
|
||||
if (!this.customName) {
|
||||
this.displayName = null;
|
||||
}
|
||||
}
|
||||
|
||||
toggleFileUrl() {
|
||||
this.fileUrlSwitch = !this.fileUrlSwitch;
|
||||
|
||||
|
||||
@@ -34,6 +34,7 @@ const routes: Routes = [
|
||||
CommonModule,
|
||||
RouterModule.forChild(routes),
|
||||
CoreModule,
|
||||
ContentModule,
|
||||
InfoDrawerModule,
|
||||
ContentModule,
|
||||
ContentDirectiveModule,
|
||||
|
||||
@@ -15,8 +15,8 @@
|
||||
(preview)="showPreview($event)">
|
||||
</adf-document-list>
|
||||
|
||||
<adf-viewer
|
||||
<adf-alfresco-viewer
|
||||
[(showViewer)]="showViewer"
|
||||
[overlayMode]="isOverlay"
|
||||
[nodeId]="nodeId">
|
||||
</adf-viewer>
|
||||
</adf-alfresco-viewer>
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
<ng-container *ngIf="sharedLinkId">
|
||||
<adf-viewer
|
||||
<adf-alfresco-viewer
|
||||
(invalidSharedLink)="redirectTo404()"
|
||||
[sharedLinkId]="sharedLinkId"
|
||||
[allowGoBack]="false">
|
||||
</adf-viewer>
|
||||
</adf-alfresco-viewer>
|
||||
</ng-container>
|
||||
|
||||
Reference in New Issue
Block a user