diff --git a/src/app/modals/view-media/view-media.page.html b/src/app/modals/view-media/view-media.page.html index 9e3d470b9..338c1be1f 100644 --- a/src/app/modals/view-media/view-media.page.html +++ b/src/app/modals/view-media/view-media.page.html @@ -24,12 +24,13 @@
+ - + > -->
diff --git a/src/app/modals/view-media/view-media.page.ts b/src/app/modals/view-media/view-media.page.ts index d32ce54fb..417d57199 100644 --- a/src/app/modals/view-media/view-media.page.ts +++ b/src/app/modals/view-media/view-media.page.ts @@ -20,7 +20,7 @@ export class ViewMediaPage implements OnInit { maxRation: 2 }; - base64Sanitize = ""; + base64Sanitize:any = ""; constructor( private modalController: ModalController, @@ -38,12 +38,7 @@ export class ViewMediaPage implements OnInit { ngOnInit() { console.log(this.image) - - const encodedData = btoa(this.image); - const blob = new Blob([this.b64toBlob(encodedData)], { type: 'application/pdf' }); - this.base64Sanitize = URL.createObjectURL(blob); - //this.base64Sanitize = this.sanitizer.bypassSecurityTrustResourceUrl(this.base64Sanitize); - this.base64Sanitize; + this.base64Sanitize = this.sanitizer.bypassSecurityTrustResourceUrl(this.image); console.log(this.base64Sanitize) } diff --git a/src/app/pages/chat/group-messages/group-messages.page.ts b/src/app/pages/chat/group-messages/group-messages.page.ts index 40d029c40..b53e1b254 100644 --- a/src/app/pages/chat/group-messages/group-messages.page.ts +++ b/src/app/pages/chat/group-messages/group-messages.page.ts @@ -677,6 +677,7 @@ export class GroupMessagesPage implements OnInit, AfterViewInit, OnDestroy { "DocId": res.data.selected.Id, "Assunto": res.data.selected.Assunto, }, + temporaryData: res, attachments: [{ "title": res.data.selected.Assunto, "description": res.data.selected.DocTypeDesc, @@ -704,10 +705,10 @@ export class GroupMessagesPage implements OnInit, AfterViewInit, OnDestroy { console.log('Add file', JSON.stringify(await this.getBase64(file))) - if (file.type == "application/pdf") { + if (file.type != "application/img" && file.type != "image/png" && file.type != "image/jpeg" && file.type != "image/gif") { const encodedData = btoa(JSON.stringify(await this.getBase64(file))); - const blob = this.base64toBlob(encodedData, 'application/pdf') + const blob = this.base64toBlob(encodedData, file.type) console.log('Add Blob file', blob) const formData = new FormData(); formData.append('blobFile', blob); @@ -1060,32 +1061,45 @@ export class GroupMessagesPage implements OnInit, AfterViewInit, OnDestroy { msg.downloadFileMsg() } + downloadFileFromBrowser(fileName: string, data: any): void { + const linkSource = data; + const downloadLink = document.createElement("a"); + downloadLink.href = linkSource; + downloadLink.download = fileName; + downloadLink.click(); + } + async openPreview(msg: MessageService) { - if (!msg.attachments[0].image_url || msg.attachments[0].image_url === null || msg.attachments[0].image_url === '') { - this.downloadFileMsg(msg) - + if(msg.file.type === "application/webtrix") { + this.viewDocument(msg.file, msg.attachments.image_url) } else { - - var str = msg.attachments[0].image_url; - str = str.substring(1, ((str.length) - 1)); - - if (this.platform.is('desktop') || this.platform.is('mobileweb')) { - - const modal = await this.modalController.create({ - component: ViewMediaPage, - cssClass: 'modal modal-desktop', - componentProps: { - image: str, - type: msg.file.type, - username: msg.u.name, - _updatedAt: msg._updatedAt - } - }); - modal.present(); - + if (!msg.attachments[0].image_url || msg.attachments[0].image_url === null || msg.attachments[0].image_url === '') { + this.downloadFileMsg(msg) + } else { - this.openFile(str, msg.attachments[0].name); + + var str = msg.attachments[0].image_url; + str = str.substring(1, ((str.length) - 1)); + + if (this.platform.is('desktop') || this.platform.is('mobileweb')) { + + this.downloadFileFromBrowser(msg.attachments[0].name, str) + /* const modal = await this.modalController.create({ + component: ViewMediaPage, + cssClass: 'modal modal-desktop', + componentProps: { + image: str, + type: msg.file.type, + username: msg.u.name, + _updatedAt: msg._updatedAt + } + }); + modal.present(); */ + + } else { + this.openFile(str, msg.attachments[0].name); + } } } diff --git a/src/app/pages/chat/messages/messages.page.ts b/src/app/pages/chat/messages/messages.page.ts index ec519c7bc..66fcc1b30 100644 --- a/src/app/pages/chat/messages/messages.page.ts +++ b/src/app/pages/chat/messages/messages.page.ts @@ -448,42 +448,14 @@ export class MessagesPage implements OnInit, AfterViewInit, OnDestroy { this.deleteRecording(); } - - viewDocument(msg: any, url?: string) { - console.log(msg) - if (msg.attachments.type == "application/webtrix") { - //this.openViewDocumentModal(file); + viewDocument(file: any, url?: string) { + console.log() + if (file.type == "application/webtrix") { + this.openViewDocumentModal(file); } - - if (msg.attachments.type == "application/pdf") { - - try { - const writeSecretFile = async () => { - await Filesystem.writeFile({ - path: msg.attachments.name, - data: msg.attachments.image_url, - directory: Directory.Documents, - encoding: Encoding.UTF8, - }); - }; - - console.log('WRITE', writeSecretFile); - - const readSecretFile = async () => { - const contents = await Filesystem.readFile({ - path: msg.attachments.name, - directory: Directory.Documents, - encoding: Encoding.UTF8, - }); - - console.log('secrets:', contents); - }; - - console.log('READ', readSecretFile); - - } catch (e) { - console.error("Unable to write file", e); - } + else { + let fullUrl = "https://www.tabularium.pt" + url; + this.fileService.viewDocumentByUrl(fullUrl); } } @@ -716,6 +688,7 @@ export class MessagesPage implements OnInit, AfterViewInit, OnDestroy { "DocId": res.data.selected.Id, "Assunto": res.data.selected.Assunto, }, + temporaryData: res, attachments: [{ "title": res.data.selected.Assunto, "description": res.data.selected.DocTypeDesc, @@ -780,7 +753,7 @@ export class MessagesPage implements OnInit, AfterViewInit, OnDestroy { console.log('Add file', JSON.stringify(await this.getBase64(file))) - //if (file.type == "application/pdf") { + if (file.type != "application/img" && file.type != "image/png" && file.type != "image/jpeg" && file.type != "image/gif") { const encodedData = btoa(JSON.stringify(await this.getBase64(file))); const blob = this.base64toBlob(encodedData, file.type) @@ -803,9 +776,9 @@ export class MessagesPage implements OnInit, AfterViewInit, OnDestroy { }], temporaryData: formData }); - /* } else { + } else { console.log('File type invalid') - } */ + } @@ -998,36 +971,50 @@ export class MessagesPage implements OnInit, AfterViewInit, OnDestroy { .catch(e => console.log('Error writing file', e)) } + downloadFileFromBrowser(fileName: string, data: any): void { + const linkSource = data; + const downloadLink = document.createElement("a"); + downloadLink.href = linkSource; + downloadLink.download = fileName; + downloadLink.click(); + } + async openPreview(msg) { console.log(msg); - if (!msg.attachments[0].image_url || msg.attachments[0].image_url === null || msg.attachments[0].image_url === '') { - this.downloadFileMsg(msg) - //this.testDownlod(msg) - + if(msg.file.type === "application/webtrix") { + this.viewDocument(msg.file, msg.attachments.image_url) } else { - var str = msg.attachments[0].image_url; - str = str.substring(1, ((str.length) - 1)); - - if (this.platform.is('desktop') || this.platform.is('mobileweb')) { - - const modal = await this.modalController.create({ - component: ViewMediaPage, - cssClass: 'modal modal-desktop', - componentProps: { - image: str, - type: msg.file.type, - username: msg.u.name, - _updatedAt: msg._updatedAt - } - }); - modal.present(); + if (!msg.attachments[0].image_url || msg.attachments[0].image_url === null || msg.attachments[0].image_url === '') { + this.downloadFileMsg(msg) + //this.testDownlod(msg) + } else { - this.openFile(str, msg.attachments[0].name, msg.file.type); + var str = msg.attachments[0].image_url; + str = str.substring(1, ((str.length) - 1)); + + if (this.platform.is('desktop') || this.platform.is('mobileweb')) { + + this.downloadFileFromBrowser(msg.attachments[0].name, str) + /* const modal = await this.modalController.create({ + component: ViewMediaPage, + cssClass: 'modal modal-desktop', + componentProps: { + image: str, + type: msg.file.type, + username: msg.u.name, + _updatedAt: msg._updatedAt + } + }); + modal.present(); */ + + } else { + this.openFile(str, msg.attachments[0].name, msg.file.type); + } + } - } } diff --git a/src/app/services/chat/message.service.ts b/src/app/services/chat/message.service.ts index fb911f97e..2c053f6c8 100644 --- a/src/app/services/chat/message.service.ts +++ b/src/app/services/chat/message.service.ts @@ -233,15 +233,17 @@ export class MessageService { } else if (event.type === HttpEventType.Response) { if (this.file.type == "application/img") { downloadFile = 'data:image/jpeg;base64,' + btoa(new Uint8Array(event.body).reduce((data, byte) => data + String.fromCharCode(byte), '')); - } else if (this.file.type === 'application/pdf') { + } else if (this.file.type != "application/img") { downloadFile = new Uint8Array(event.body).reduce((data, byte) => data + String.fromCharCode(byte), ''); console.log(downloadFile) - } else if (this.file.type == 'application/audio') { + } /* else if (this.file.type == 'application/audio') { downloadFile = new Uint8Array(event.body).reduce((data, byte) => data + String.fromCharCode(byte), ''); } else if (this.file.type == 'application/vnd.openxmlformats-officedocument.wordprocessingml.document') { downloadFile = new Uint8Array(event.body).reduce((data, byte) => data + String.fromCharCode(byte), ''); - } + } */ + + console.log('Download file ',downloadFile ) this.attachments[0] = { image_url: downloadFile, diff --git a/src/app/shared/chat/group-messages/group-messages.page.ts b/src/app/shared/chat/group-messages/group-messages.page.ts index 283ddeefa..8d3e0f9c3 100644 --- a/src/app/shared/chat/group-messages/group-messages.page.ts +++ b/src/app/shared/chat/group-messages/group-messages.page.ts @@ -871,15 +871,16 @@ export class GroupMessagesPage implements OnInit, OnChanges, AfterViewInit, OnDe const file: any = await this.fileService.getFileFromDevice(types); console.log('Add file', file) - if (file.type == "application/pdf") { + if (file.type != "application/img" && file.type != "image/png" && file.type != "image/jpeg" && file.type != "image/gif") { - const blob = new Blob([file], { type: file.type }) - console.log('Add file', blob) + const encodedData = btoa(JSON.stringify(await this.getBase64(file))); + const blob = this.base64toBlob(encodedData, file.type) + console.log('Add Blob file', blob) const formData = new FormData(); formData.append("blobFile", blob); - this.wsChatMethodsService.getGroupRoom(roomId).send({ + this.wsChatMethodsService.getDmRoom(roomId).send({ file: { "type": file.type, "guid": '', @@ -887,12 +888,13 @@ export class GroupMessagesPage implements OnInit, OnChanges, AfterViewInit, OnDe attachments: [{ "title": file.name, "name": file.name, - /* "image_url": res, */ + //"image_url": res, // "text": "description", "title_link_download": false, }], temporaryData: formData }) + } else { console.log('File type invalid') } @@ -900,15 +902,25 @@ export class GroupMessagesPage implements OnInit, OnChanges, AfterViewInit, OnDe } - blobToBase64 = blob => { - const reader = new FileReader(); - reader.readAsDataURL(blob); + getFileReader(): FileReader { + const fileReader = new FileReader(); + const zoneOriginalInstance = (fileReader as any)["__zone_symbol__originalInstance"]; + return zoneOriginalInstance || fileReader; + } + + getBase64(file) { + var reader = this.getFileReader(); + reader.readAsDataURL(file); return new Promise(resolve => { - reader.onloadend = () => { - resolve(reader.result); + reader.onload = function () { + resolve(reader.result) + }; + reader.onerror = function (error) { + console.log('Error: ', error); }; }); - }; + + } bookMeeting() { let data = { @@ -996,27 +1008,42 @@ export class GroupMessagesPage implements OnInit, OnChanges, AfterViewInit, OnDe msg.downloadFileMsg() } + downloadFileFromBrowser(fileName: string, data: any): void { + const linkSource = data; + const downloadLink = document.createElement("a"); + downloadLink.href = linkSource; + downloadLink.download = fileName; + downloadLink.click(); + } + async openPreview(msg) { - if (!msg.attachments[0].image_url || msg.attachments[0].image_url === null || msg.attachments[0].image_url === '') { - this.downloadFileMsg(msg) - + if(msg.file.type === "application/webtrix") { + this.viewDocument(msg.file, msg.attachments.image_url) } else { - var str = msg.attachments[0].image_url; - str = str.substring(1, ((str.length) - 1)); + if (!msg.attachments[0].image_url || msg.attachments[0].image_url === null || msg.attachments[0].image_url === '') { + this.downloadFileMsg(msg) + + } else { + + var str = msg.attachments[0].image_url; + str = str.substring(1, ((str.length) - 1)); - const modal = await this.modalController.create({ - component: ViewMediaPage, - cssClass: 'modal modal-desktop', - componentProps: { - image: str, - type: msg.file.type, - username: msg.u.name, - _updatedAt: msg._updatedAt - } - }); - modal.present(); + this.downloadFileFromBrowser(msg.attachments[0].name, str) + + /* const modal = await this.modalController.create({ + component: ViewMediaPage, + cssClass: 'modal modal-desktop', + componentProps: { + image: str, + type: msg.file.type, + username: msg.u.name, + _updatedAt: msg._updatedAt + } + }); + modal.present(); */ + } } } diff --git a/src/app/shared/chat/messages/messages.page.html b/src/app/shared/chat/messages/messages.page.html index 8b88fc645..8fdd6e7a6 100644 --- a/src/app/shared/chat/messages/messages.page.html +++ b/src/app/shared/chat/messages/messages.page.html @@ -97,6 +97,7 @@ + diff --git a/src/app/shared/chat/messages/messages.page.ts b/src/app/shared/chat/messages/messages.page.ts index 1f401f016..1729c608c 100644 --- a/src/app/shared/chat/messages/messages.page.ts +++ b/src/app/shared/chat/messages/messages.page.ts @@ -1,5 +1,5 @@ import { AfterViewChecked, AfterViewInit, Component, ElementRef, ChangeDetectorRef, EventEmitter, Input, OnChanges, OnDestroy, OnInit, Output, SimpleChanges, ViewChild } from '@angular/core'; -import { AnimationController, GestureController, IonSlides, ModalController, PopoverController } from '@ionic/angular'; +import { AnimationController, GestureController, IonSlides, ModalController, PopoverController, Platform } from '@ionic/angular'; import { AlertService } from 'src/app/services/alert.service'; import { AuthService } from 'src/app/services/auth.service'; import { ChatService } from 'src/app/services/chat.service'; @@ -35,6 +35,7 @@ import { DocumentViewer, DocumentViewerOptions } from '@ionic-native/document-vi import { VoiceRecorder, VoiceRecorderPlugin, RecordingData, GenericResponse, CurrentRecordingStatus } from 'capacitor-voice-recorder'; import { Filesystem, Directory, Encoding } from '@capacitor/filesystem'; import { DomSanitizer } from '@angular/platform-browser'; +import { File } from '@awesome-cordova-plugins/file/ngx'; const IMAGE_DIR = 'stored-images'; @Component({ @@ -118,6 +119,8 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy private processesService: ProcessesService, private fileToBase64Service: FileToBase64Service, private sanitiser: DomSanitizer, + private file: File, + private platform: Platform, ) { this.loggedUser = authService.ValidatedUserChat['data']; } @@ -697,6 +700,7 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy }); await modal.present(); modal.onDidDismiss().then(async res => { + console.log('webTrix ', res.data) const data = res.data; const roomId = this.roomId @@ -710,6 +714,7 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy "DocId": res.data.selected.Id, "Assunto": res.data.selected.Assunto, }, + temporaryData: res, attachments: [{ "title": res.data.selected.Assunto, "description": res.data.selected.DocTypeDesc, @@ -768,14 +773,19 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy const file: any = await this.fileService.getFileFromDevice(types); - if (file.type == "application/pdf") { + //if (file.type == "application/pdf") { - console.log('Add file', file) - /* const imageData = await this.fileToBase64Service.convert(file).then((filee) => { - console.log('Add file', filee) - }) */ - const blob = new Blob([file], { type: file.type }) - console.log('Add file', blob) + console.log('Add file', file) + /* const imageData = await this.fileToBase64Service.convert(file).then((filee) => { + console.log('Add file', filee) + }) */ + console.log('Add file', JSON.stringify(await this.getBase64(file))) + + if (file.type != "application/img" && file.type != "image/png" && file.type != "image/jpeg" && file.type != "image/gif") { + + const encodedData = btoa(JSON.stringify(await this.getBase64(file))); + const blob = this.base64toBlob(encodedData, file.type) + console.log('Add Blob file', blob) const formData = new FormData(); formData.append("blobFile", blob); @@ -802,15 +812,25 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy } - blobToBase64 = blob => { - const reader = new FileReader(); - reader.readAsDataURL(blob); + getFileReader(): FileReader { + const fileReader = new FileReader(); + const zoneOriginalInstance = (fileReader as any)["__zone_symbol__originalInstance"]; + return zoneOriginalInstance || fileReader; + } + + getBase64(file) { + var reader = this.getFileReader(); + reader.readAsDataURL(file); return new Promise(resolve => { - reader.onloadend = () => { - resolve(reader.result); + reader.onload = function () { + resolve(reader.result) + }; + reader.onerror = function (error) { + console.log('Error: ', error); }; }); - }; + + } bookMeeting() { @@ -922,53 +942,110 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy } else { } } + b64toBlob(b64Data, contentType) { + contentType = contentType || ''; + var sliceSize = 512; + b64Data = b64Data.replace(/^[^,]+,/, ''); + b64Data = b64Data.replace(/\s/g, ''); + var byteCharacters = window.atob(b64Data); + var byteArrays = []; + + for (var offset = 0; offset < byteCharacters.length; offset += sliceSize) { + var slice = byteCharacters.slice(offset, offset + sliceSize); + + var byteNumbers = new Array(slice.length); + for (var i = 0; i < slice.length; i++) { + byteNumbers[i] = slice.charCodeAt(i); + } + + var byteArray = new Uint8Array(byteNumbers); + + byteArrays.push(byteArray); + } + + var blob = new Blob(byteArrays, { type: contentType }); + return blob; + } + + createFile(pdfString, filename, type) { + const blob = this.b64toBlob(pdfString, type) + let pathFile = '' + const fileName = filename + const contentFile = blob + if (this.platform.is('ios')) { + pathFile = this.file.documentsDirectory + } else { + pathFile = this.file.externalRootDirectory + } + console.log(pdfString) + console.log(pathFile) + console.log(contentFile) + this.file + .writeFile(pathFile, fileName, contentFile, { replace: true }) + .then(success => { + console.log('File is created'); + }) + .catch(e => console.log('Error writing file', e)) + } + + downloadFileFromBrowser(fileName: string, data: any): void { + const linkSource = data; + const downloadLink = document.createElement("a"); + downloadLink.href = linkSource; + downloadLink.download = fileName; + downloadLink.click(); + } + + viewDocument(file: any, url?: string) { + console.log() + if (file.type == "application/webtrix") { + this.openViewDocumentModal(file); + } + else { + let fullUrl = "https://www.tabularium.pt" + url; + this.fileService.viewDocumentByUrl(fullUrl); + } + } + async openPreview(msg) { console.log(msg); - if (!msg.attachments[0].image_url || msg.attachments[0].image_url === null || msg.attachments[0].image_url === '') { - this.downloadFileMsg(msg) - - - /* } else if (msg.file.type === "application/pdf") { - - - console.log(str); - const win = window.open("", "_blank"); - let html = ''; - - html += ''; - html += ''; - html += '