From e5002821ecbbd278bab1621faf6eb5cc752e7e38 Mon Sep 17 00:00:00 2001
From: Alex ORLUC <alex.orluc@maarch.org>
Date: Thu, 28 Mar 2019 18:13:42 +0100
Subject: [PATCH] FEAT #9598 add pdf viwer embedded (only in signaturebook and
view doc action v2)
---
package.json | 2 +-
.../view-doc-action.component.html | 4 +++-
.../view-doc-action.component.ts | 3 ---
src/frontend/app/app-common.module.ts | 7 ++++---
.../app/header/header-left.component.scss | 2 +-
src/frontend/app/home.component.html | 3 ++-
src/frontend/app/home.component.ts | 1 +
.../app/signature-book.component.html | 14 ++++++++++---
src/frontend/app/signature-book.component.ts | 20 ++++++++++++-------
9 files changed, 36 insertions(+), 20 deletions(-)
diff --git a/package.json b/package.json
index 4c9847a8e59..19631b0d8f5 100755
--- a/package.json
+++ b/package.json
@@ -21,11 +21,11 @@
"jquery-typeahead": "^2.10.6",
"jquery.nicescroll": "~3.6.8",
"jstree-bootstrap-theme": "^1.0.1",
+ "ng2-pdf-viewer": "^5.2.3",
"ngx-cookie-service": "^2.1.0",
"ngx-pipes": "^2.4.6",
"pdfjs-dist": "^2.0.943",
"photoswipe": "^4.1.2",
- "simple-pdf-viewer": "^2.0.3",
"tinymce": "^4.9.4",
"tooltipster": "^4.2.6",
"uglify-es": "3.2.2",
diff --git a/src/frontend/app/actions/view-doc-action/view-doc-action.component.html b/src/frontend/app/actions/view-doc-action/view-doc-action.component.html
index 50486b5f786..1290e1391b4 100644
--- a/src/frontend/app/actions/view-doc-action/view-doc-action.component.html
+++ b/src/frontend/app/actions/view-doc-action/view-doc-action.component.html
@@ -3,4 +3,6 @@
<mat-icon class="fa fa-times-circle fa-2x"></mat-icon>
</button>
</h1>
-<div [innerHTML]="innerHtml"></div>
\ No newline at end of file
+<div style="overflow:auto;height: 100%;width: 100%;">
+ <pdf-viewer [src]="docUrl" [render-text]="true" [autoresize]="true" [original-size]="false" [show-all]="true"></pdf-viewer>
+</div>
diff --git a/src/frontend/app/actions/view-doc-action/view-doc-action.component.ts b/src/frontend/app/actions/view-doc-action/view-doc-action.component.ts
index c489341e4df..31e7690524c 100644
--- a/src/frontend/app/actions/view-doc-action/view-doc-action.component.ts
+++ b/src/frontend/app/actions/view-doc-action/view-doc-action.component.ts
@@ -20,8 +20,5 @@ export class ViewDocActionComponent implements OnInit {
ngOnInit(): void {
this.docUrl = '../../rest/res/' + this.data.selectedRes[0] + '/content';
- this.innerHtml = this.sanitizer.bypassSecurityTrustHtml(
- "<iframe style='position: absolute;width: 100%;height: 100%;border: none;left: 0px;top: 0px;padding-top: 40px;' src='" + this.docUrl + "' class='embed-responsive-item'>" +
- "</iframe>");
}
}
diff --git a/src/frontend/app/app-common.module.ts b/src/frontend/app/app-common.module.ts
index 8ffa34e66b8..c5a277a4dc5 100755
--- a/src/frontend/app/app-common.module.ts
+++ b/src/frontend/app/app-common.module.ts
@@ -11,7 +11,8 @@ import { RouterModule } from '@angular/router';
import { DragDropModule } from '@angular/cdk/drag-drop';
/*PLUGINS IMPORTS*/
-import { SimplePdfViewerModule } from 'simple-pdf-viewer';
+import { PdfViewerModule } from 'ng2-pdf-viewer';
+//import { SimplePdfViewerModule } from 'simple-pdf-viewer';
import { NgStringPipesModule } from 'ngx-pipes';
import { CookieService } from 'ngx-cookie-service';
import { TimeAgoPipe } from '../plugins/timeAgo.pipe';
@@ -54,7 +55,7 @@ export class MyHammerConfig extends HammerGestureConfig {
FormsModule,
HttpClientModule,
RouterModule,
- SimplePdfViewerModule,
+ PdfViewerModule,
NgStringPipesModule,
AppMaterialModule,
DragDropModule
@@ -98,7 +99,7 @@ export class MyHammerConfig extends HammerGestureConfig {
TimeAgoPipe,
TimeLimitPipe,
FilterListPipe,
- SimplePdfViewerModule,
+ PdfViewerModule,
NgStringPipesModule,
SmdFabSpeedDialComponent,
SmdFabSpeedDialTrigger,
diff --git a/src/frontend/app/header/header-left.component.scss b/src/frontend/app/header/header-left.component.scss
index d16e25dd4b4..b58fd3b9583 100644
--- a/src/frontend/app/header/header-left.component.scss
+++ b/src/frontend/app/header/header-left.component.scss
@@ -2,6 +2,6 @@
.mat-icon-button {
position: absolute;
margin-left: -35px;
- margin-top: -5px;
+ margin-top: -10px;
}
}
\ No newline at end of file
diff --git a/src/frontend/app/home.component.html b/src/frontend/app/home.component.html
index f063e3a6d97..169445df667 100755
--- a/src/frontend/app/home.component.html
+++ b/src/frontend/app/home.component.html
@@ -123,6 +123,7 @@
<mat-sidenav #snav2 [fixedInViewport]="mobileQuery.matches" position='end'
[opened]="mobileQuery.matches ? false : false" [mode]="mobileMode ? 'over' : 'side'" class="panel-right"
style="overflow-x:hidden;" [ngStyle]="{'width': mobileMode ? '80%' : '30%'}" autoFocus="false">
- <div *ngIf="innerHtml" [innerHTML]="innerHtml" style="height: 100%;overflow: hidden;"></div>
+ <pdf-viewer [src]="docUrl" [render-text]="true" [autoresize]="true" [original-size]="false" [show-all]="true"></pdf-viewer>
+ <!-- <div *ngIf="innerHtml" [innerHTML]="innerHtml" style="height: 100%;overflow: hidden;"></div> -->
</mat-sidenav>
</mat-sidenav-container>
\ No newline at end of file
diff --git a/src/frontend/app/home.component.ts b/src/frontend/app/home.component.ts
index c7f338e1016..bc56436dd99 100755
--- a/src/frontend/app/home.component.ts
+++ b/src/frontend/app/home.component.ts
@@ -90,6 +90,7 @@ export class HomeComponent extends AutoCompletePlugin implements OnInit {
this.sidenavRight.close();
} else {
this.docUrl = this.coreUrl+'rest/res/'+row.res_id+'/content';
+
this.innerHtml = this.sanitizer.bypassSecurityTrustHtml(
"<iframe style='height:100%;width:100%;' src='" + this.docUrl + "' class='embed-responsive-item'>" +
"</iframe>");
diff --git a/src/frontend/app/signature-book.component.html b/src/frontend/app/signature-book.component.html
index 59845a90c3f..237dc8f2c76 100755
--- a/src/frontend/app/signature-book.component.html
+++ b/src/frontend/app/signature-book.component.html
@@ -85,7 +85,11 @@
<sup *ngIf="!showTopLeftPanel" class="nbRes" style="position: absolute;right: 6px;top: 5px;">{{signatureBook.documents.length - 1}}</sup>
<i *ngIf="showTopLeftPanel" class="fa fa-chevron-up" aria-hidden="true"></i>
</div>
- <iframe *ngIf="leftViewerLink != '' && (leftSelectedThumbnail == 0 || signatureBook.documents[leftSelectedThumbnail].format == 'pdf' || signatureBook.documents[leftSelectedThumbnail].isConverted)" id="leftPanelShowDocumentIframe" [src]="leftViewerLink | safeUrl" [ngStyle]="{'height': showTopLeftPanel ? '84%' : '99%'}"></iframe>
+ <pdf-viewer *ngIf="leftViewerLink != '' && (leftSelectedThumbnail == 0 || signatureBook.documents[leftSelectedThumbnail].format == 'pdf' || signatureBook.documents[leftSelectedThumbnail].isConverted)" id="leftPanelShowDocumentIframe" #leftPanelShowDocumentIframe [src]="leftViewerLink"
+ [render-text]="true" [fit-to-page]="false" [original-size]="true"
+ [ngStyle]="{'height': showTopLeftPanel ? '84%' : '99%'}" [show-all]="true"
+ ></pdf-viewer>
+ <!-- <iframe *ngIf="leftViewerLink != '' && (leftSelectedThumbnail == 0 || signatureBook.documents[leftSelectedThumbnail].format == 'pdf' || signatureBook.documents[leftSelectedThumbnail].isConverted)" id="leftPanelShowDocumentIframe" [src]="leftViewerLink | safeUrl" [ngStyle]="{'height': showTopLeftPanel ? '84%' : '99%'}"></iframe> -->
<div *ngIf="leftSelectedThumbnail > 0 && signatureBook.documents[leftSelectedThumbnail].format != 'pdf' && !signatureBook.documents[leftSelectedThumbnail].isConverted" [ngStyle]="{'height': showTopLeftPanel ? '79%' : '96%'}" class="visaNoPdfWarning">
<div style="padding-top: 25%;">Aucun aperçu disponible<br/><sub>La version PDF du fichier "{{signatureBook.documents[leftSelectedThumbnail].title}}.{{signatureBook.documents[leftSelectedThumbnail].format}}" n'est pas disponible.</sub></div>
<div class="visaPjView">
@@ -118,7 +122,7 @@
<i class="fa fa-chevron-right" aria-hidden="true" *ngIf="!showLeftPanel"></i>
</div>
<div *ngIf="signatureBook.hasWorkflow" class="contentShow">
- <div *ngIf="signatureBook.attachments[rightSelectedThumbnail] && !showAttachmentPanel" style="height:100%;">
+ <div *ngIf="signatureBook.attachments[rightSelectedThumbnail] && !showAttachmentPanel" style="height:100%;overflow: auto;">
<div [ngStyle]="{'display': showTopRightPanel ? 'block' : 'none'}" class="pjDetails">
<div class="infoPj" title="{{signatureBook.attachments[rightSelectedThumbnail].attachment_type}}">
<label>Type : </label>
@@ -168,7 +172,11 @@
<i *ngIf="!showTopRightPanel" class="fa fa-list-alt fa-2x" aria-hidden="true"></i>
<i *ngIf="showTopRightPanel" class="fa fa-chevron-up" aria-hidden="true"></i>
</div>
- <iframe id="rightPanelShowDocumentIframe" [src]="rightViewerLink | safeUrl" [ngStyle]="{'height': showTopRightPanel ? '84%' : '99%'}"></iframe>
+ <pdf-viewer #rightPanelShowDocumentIframe id="rightPanelShowDocumentIframe" [src]="rightViewerLink"
+ [render-text]="true" [autoresize]="true" [original-size]="false"
+ [ngStyle]="{'height': showTopRightPanel ? '84%' : '99%'}" [show-all]="true"
+ ></pdf-viewer>
+ <!-- <iframe id="rightPanelShowDocumentIframe" [src]="rightViewerLink | safeUrl" [ngStyle]="{'height': showTopRightPanel ? '84%' : '99%'}"></iframe> -->
<div *ngIf="signatureBook.attachments[rightSelectedThumbnail].format != 'pdf' && signatureBook.attachments[rightSelectedThumbnail].status != 'TMP' && !signatureBook.attachments[rightSelectedThumbnail].isConverted" [ngStyle]="{'height': showTopRightPanel ? '79%' : '96%'}" class="visaNoPdfWarning">
<div style="padding-top: 25%;">Aucun aperçu disponible<br/><sub>La version PDF du fichier "{{signatureBook.attachments[rightSelectedThumbnail].title}}.{{signatureBook.attachments[rightSelectedThumbnail].format}}" n'est pas disponible.</sub></div>
<div class="visaPjView">
diff --git a/src/frontend/app/signature-book.component.ts b/src/frontend/app/signature-book.component.ts
index 482e0bad591..c03a9be02c9 100755
--- a/src/frontend/app/signature-book.component.ts
+++ b/src/frontend/app/signature-book.component.ts
@@ -1,4 +1,4 @@
-import { Pipe, PipeTransform, Component, OnInit, NgZone } from '@angular/core';
+import { Pipe, PipeTransform, Component, OnInit, NgZone, ViewChild, HostListener } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { DomSanitizer } from '@angular/platform-browser';
import { Router, ActivatedRoute } from '@angular/router';
@@ -72,7 +72,6 @@ export class SignatureBookComponent implements OnInit {
linksViewerLink : string = "";
attachmentsViewerLink : string = "";
-
constructor(public http: HttpClient, private route: ActivatedRoute, private router: Router, private zone: NgZone, private notify: NotificationService) {
$j("head style").remove();
@@ -227,11 +226,13 @@ export class SignatureBookComponent implements OnInit {
this.rightViewerLink = "";
}
this.rightSelectedThumbnail = index;
+ //this.reloadViewerRight();
}
changeLeftViewer(index: number) {
this.leftViewerLink = this.signatureBook.documents[index].viewerLink;
this.leftSelectedThumbnail = index;
+ //this.reloadViewerLeft();
}
displayPanel(panel: string) {
@@ -478,14 +479,19 @@ export class SignatureBookComponent implements OnInit {
}
backToBasket() {
- unlockDocument(this.resId);
- window.location.href = 'index.php?page=view_baskets&module=basket&basketId='+this.basketId+'&userId='+this.userId+'&groupIdSer='+this.groupId+'&backToBasket=true';
+ this.http.put('../../rest/resourcesList/users/' + this.userId + '/groups/' + this.groupId + '/baskets/' + this.basketId + '/unlock', { resources: [this.resId] })
+ .subscribe((data: any) => {
+ window.location.href = 'index.php?page=view_baskets&module=basket&basketId='+this.basketId+'&userId='+this.userId+'&groupIdSer='+this.groupId+'&backToBasket=true';
+ }, (err: any) => { });
}
backToDetails() {
- unlockDocument(this.resId);
- location.hash = "";
- location.search = "?page=details&dir=indexing_searching&id=" + this.resId;
+ this.http.put('../../rest/resourcesList/users/' + this.userId + '/groups/' + this.groupId + '/baskets/' + this.basketId + '/unlock', { resources: [this.resId] })
+ .subscribe((data: any) => {
+ location.hash = "";
+ location.search = "?page=details&dir=indexing_searching&id=" + this.resId;
+ }, (err: any) => { });
+
}
changeLocation(resId: number, origin: string) {
--
GitLab