Make this better
This commit is contained in:
parent
5b042deede
commit
d77cb8ec00
@ -350,15 +350,16 @@
|
||||
</ng-template>
|
||||
|
||||
<ng-template #previewContent>
|
||||
@if (!metadata) {
|
||||
<img [src]="thumbUrl | safeUrl" class="thumb-preview" width="100%" height="auto" alt="Document loading..." i18n-alt />
|
||||
<div class="position-absolute top-0 left-0 p-2 d-flex align-items-center justify-content-center">
|
||||
<div class="thumb-preview position-absolute pe-none" [class.fade]="previewLoaded">
|
||||
<img [src]="thumbUrl | safeUrl" class="" width="100%" height="auto" alt="Document loading..." i18n-alt />
|
||||
<div class="position-absolute top-0 start-0 m-2 p-2 d-flex align-items-center justify-content-center">
|
||||
<div>
|
||||
<div class="spinner-border spinner-border-sm me-2" role="status"></div>
|
||||
<ng-container i18n>Loading...</ng-container>
|
||||
</div>
|
||||
</div>
|
||||
} @else {
|
||||
</div>
|
||||
@if (metadata) {
|
||||
@switch (archiveContentRenderType) {
|
||||
@case (ContentRenderType.PDF) {
|
||||
@if (!useNativePdfViewer) {
|
||||
|
@ -64,5 +64,16 @@ textarea.rtl {
|
||||
}
|
||||
|
||||
.thumb-preview {
|
||||
border: 8px solid var(--bs-secondary);
|
||||
top: 0;
|
||||
left: calc(.5 * var(--bs-gutter-x));
|
||||
height: calc(100vh - 160px);
|
||||
overflow: hidden;
|
||||
background-color: gray;
|
||||
padding: 10px 8px; // border
|
||||
width: calc(100% - var(--bs-gutter-x));
|
||||
z-index: 1000;
|
||||
|
||||
> div {
|
||||
mix-blend-mode: difference;
|
||||
}
|
||||
}
|
||||
|
@ -136,6 +136,7 @@ export class DocumentDetailComponent
|
||||
previewText: string
|
||||
downloadUrl: string
|
||||
downloadOriginalUrl: string
|
||||
previewLoaded: boolean = false
|
||||
|
||||
correspondents: Correspondent[]
|
||||
documentTypes: DocumentType[]
|
||||
@ -538,6 +539,9 @@ export class DocumentDetailComponent
|
||||
.subscribe({
|
||||
next: (result) => {
|
||||
this.metadata = result
|
||||
if (this.archiveContentRenderType !== ContentRenderType.PDF) {
|
||||
this.previewLoaded = true
|
||||
}
|
||||
},
|
||||
error: (error) => {
|
||||
this.metadata = {} // allow display to fallback to <object> tag
|
||||
@ -904,11 +908,15 @@ export class DocumentDetailComponent
|
||||
pdfPreviewLoaded(pdf: PDFDocumentProxy) {
|
||||
this.previewNumPages = pdf.numPages
|
||||
if (this.password) this.requiresPassword = false
|
||||
setTimeout(() => {
|
||||
this.previewLoaded = true
|
||||
}, 300)
|
||||
}
|
||||
|
||||
onError(event) {
|
||||
if (event.name == 'PasswordException') {
|
||||
this.requiresPassword = true
|
||||
this.previewLoaded = true
|
||||
}
|
||||
}
|
||||
|
||||
|
Loading…
x
Reference in New Issue
Block a user