mirror of
https://code.equilibrium.co.ao/ITO/doneit-web.git
synced 2026-04-18 20:47:54 +00:00
Peter Maquiran
1064 lines
29 KiB
TypeScript
1064 lines
29 KiB
TypeScript
import { AfterViewInit, Component, ElementRef, HostListener, OnDestroy, OnInit, ViewChild } from '@angular/core';
|
|
import { GestureController, ModalController, NavParams, PopoverController, Platform } from '@ionic/angular';
|
|
import { ViewDocumentPage } from 'src/app/modals/view-document/view-document.page';
|
|
import { AlertService } from 'src/app/services/alert.service';
|
|
import { ToastService } from 'src/app/services/toast.service';
|
|
import { ThemeService } from 'src/app/services/theme.service'
|
|
|
|
import { VoiceRecorder, GenericResponse } from 'capacitor-voice-recorder';
|
|
import { Haptics, ImpactStyle } from '@capacitor/haptics';
|
|
import { SearchPage } from 'src/app/pages/search/search.page';
|
|
import { Storage } from '@ionic/storage';
|
|
import { CameraResultType } from '@capacitor/camera';
|
|
import { DomSanitizer } from '@angular/platform-browser';
|
|
import { SessionStore } from 'src/app/store/session.service';
|
|
import { ViewMediaPage } from 'src/app/modals/view-media/view-media.page';
|
|
|
|
//======
|
|
import { Subscription } from 'rxjs';
|
|
import { EditMessagePage } from 'src/app/ui/chat/modal/edit-message/edit-message.page';
|
|
import { IMessageType, MessageAttachmentFileType, MessageAttachmentSource, MessageEntity } from 'src/app/core/chat/entity/message';
|
|
import { compressImageBase64 } from 'src/app/utils/imageCompressore';
|
|
import { RecordingData } from 'capacitor-voice-recorder';
|
|
import { ChatOptionsPopoverPage } from '../chat-options-popover/chat-options-popover.page';
|
|
import { CameraService } from 'src/app/infra/camera/camera.service'
|
|
import { FilePickerMobileService } from 'src/app/infra/file-picker/mobile/file-picker-mobile.service'
|
|
import { FilePickerWebService } from 'src/app/infra/file-picker/web/file-picker-web.service'
|
|
import { allowedDocExtension } from 'src/app/utils/allowedDocExtension';
|
|
import { JSFileToDataUrl } from 'src/app/utils/ToBase64';
|
|
import { RoomType } from "src/app/core/chat/entity/group";
|
|
import { MessageViewModal } from '../../store/model/message';
|
|
import { ChatPopoverPage } from '../chat-popover/chat-popover.page';
|
|
import { ViewOncesImagePageInput, ViewOncesImagePage } from '../view-onces/view-onces.page';
|
|
import { LastMessage } from '../../utils/lastMessage';
|
|
import { File } from '@awesome-cordova-plugins/file/ngx';
|
|
import { FileSystemMobileService } from 'src/app/infra/file-system/mobile/file-system-mobile.service';
|
|
import { RoomViewModel } from '../../store/model/room';
|
|
import { RoomStore } from '../../store/roomStore'
|
|
import { EditGroupPage } from '../edit-group/edit-group.page';
|
|
import { imageMimeTypes } from 'src/app/utils/allowedImageExtension';
|
|
import { GroupContactsPage, IGroupContactsPageOutPutSchema } from '../group-contacts/group-contacts.page';
|
|
|
|
@Component({
|
|
selector: 'app-messages',
|
|
templateUrl: './messages.page.html',
|
|
styleUrls: ['./messages.page.scss'],
|
|
})
|
|
export class MessagesPage implements OnInit, AfterViewInit, OnDestroy {
|
|
showLoader: boolean;
|
|
|
|
@ViewChild('scrollMe') private myScrollContainer: ElementRef;
|
|
@ViewChild('rectangle') private rectangle: ElementRef;
|
|
|
|
canvas: any
|
|
ctx: any
|
|
loggedUser: any;
|
|
userPresence = '';
|
|
dmUsers: any;
|
|
roomId: string;
|
|
el: any;
|
|
scrollingOnce: boolean = true;
|
|
|
|
private scrollChangeCallback: () => void;
|
|
currentPosition: any;
|
|
startPosition: number;
|
|
scrollToBottomBtn = false;
|
|
showMessageOptions = false;
|
|
selectedMsgId: string;
|
|
|
|
LoadedDocument: any = null;
|
|
|
|
recording = false;
|
|
allowTyping = true;
|
|
lastAudioRecorded = '';
|
|
audioRecorded: any = "";
|
|
audioDownloaded: any = "";
|
|
durationDisplay = '';
|
|
duration = 0;
|
|
@ViewChild('recordbtn', { read: ElementRef }) recordBtn: ElementRef;
|
|
myAudio: any;
|
|
downloadfile: any;
|
|
downloadFile: any;
|
|
files: any[] = [];
|
|
@ViewChild('filechooser') fileChooserElementRef: ElementRef;
|
|
@ViewChild('array') myInputRef!: ElementRef;
|
|
|
|
downloadProgess: number;
|
|
downloadLoader: boolean;
|
|
|
|
audioPermissionStatus: 'granted' | 'denied' | 'prompt' | null = null
|
|
sessionStore = SessionStore
|
|
SessionStore = SessionStore
|
|
|
|
selectedMessage: any = null;
|
|
emojis: string[] = ['😊', '😂', '❤️', '👍', '😢']; // Add more emojis as needed
|
|
textField = ''
|
|
|
|
MessageAttachmentFileType = MessageAttachmentFileType
|
|
MessageAttachmentFileSource = MessageAttachmentSource
|
|
messageOnReconnectSubject: Subscription
|
|
|
|
RoomTypeEnum = RoomType
|
|
IMessageType = IMessageType
|
|
handleClickActive = false
|
|
|
|
room!: RoomViewModel
|
|
|
|
constructor(
|
|
public popoverController: PopoverController,
|
|
private modalController: ModalController,
|
|
private navParams: NavParams,
|
|
private alertService: AlertService,
|
|
private toastService: ToastService,
|
|
private gestureController: GestureController,
|
|
public ThemeService: ThemeService,
|
|
private platform: Platform,
|
|
private storage: Storage,
|
|
private sanitiser: DomSanitizer,
|
|
private CameraService: CameraService,
|
|
private FilePickerMobileService: FilePickerMobileService,
|
|
private FilePickerWebService: FilePickerWebService,
|
|
private file: File,
|
|
private fileSystemMobileService: FileSystemMobileService,
|
|
public RoomStore: RoomStore,
|
|
) {
|
|
|
|
this.room = this.navParams.get('room');
|
|
this.RoomStore.start(this.room)
|
|
}
|
|
|
|
|
|
@HostListener('document:click', ['$event'])
|
|
@HostListener('document:touchstart', ['$event'])
|
|
handleClickOutside(event: Event) {
|
|
|
|
if (!this.handleClickActive) return;
|
|
const clickedInside = (event.target as HTMLElement).closest('.mat-menu-content');
|
|
|
|
setTimeout(()=> {
|
|
|
|
if (!clickedInside) {
|
|
this.selectedMessage = null;
|
|
}
|
|
}, 100);
|
|
|
|
}
|
|
|
|
messageStatus(message: MessageViewModal) {
|
|
if(this.allViewed(message)) {
|
|
return 'allViewed'
|
|
} else if(this.allReceived(message)) {
|
|
return 'allReceived'
|
|
} else if (message.messageStatus == 'send') {
|
|
return 'enviado'
|
|
} else {
|
|
return 'enviar'
|
|
}
|
|
}
|
|
allReceived(message: MessageViewModal) {
|
|
return message.info.filter(e => typeof e.deliverAt == 'string').length == this.RoomStore.totalMembers
|
|
}
|
|
|
|
allViewed(message: MessageViewModal) {
|
|
const totalMembers = this.RoomStore.members.filter((e) => message.sender.wxUserId != e.wxUserId ).length
|
|
return message.info.filter(e => typeof e.readAt == 'string' && message.sender.wxUserId != e.memberId ).length == totalMembers
|
|
}
|
|
ngOnInit() {}
|
|
|
|
|
|
ngAfterViewInit() {
|
|
this.scrollChangeCallback = () => this.onContentScrolled(event);
|
|
window.addEventListener('scroll', this.scrollChangeCallback, true);
|
|
|
|
const longpress = this.gestureController.create({
|
|
el: this.recordBtn.nativeElement,
|
|
threshold: 0,
|
|
gestureName: 'long-press',
|
|
onStart: ev => {
|
|
Haptics.impact({ style: ImpactStyle.Light })
|
|
this.startRecording();
|
|
//this.calculateDuration();
|
|
},
|
|
onEnd: ev => {
|
|
Haptics.impact({ style: ImpactStyle.Light })
|
|
this.stopRecording();
|
|
}
|
|
}, true);
|
|
longpress.enable();
|
|
}
|
|
|
|
onDragOver(e?) { }
|
|
onDragLeave(e?) { }
|
|
|
|
calculateDuration() {
|
|
if (!this.recording) {
|
|
this.duration = 0;
|
|
this.durationDisplay = '';
|
|
return;
|
|
}
|
|
this.duration += 1;
|
|
const minutes = Math.floor(this.duration / 60);
|
|
const seconds = (this.duration % 60).toString().padStart(2, '0');
|
|
this.durationDisplay = `${minutes}:${seconds}`;
|
|
|
|
setTimeout(() => {
|
|
this.calculateDuration();
|
|
}, 1000)
|
|
}
|
|
|
|
|
|
async loadFiles() {
|
|
|
|
this.storage.get('fileName').then((fileName) => {
|
|
this.lastAudioRecorded = fileName;
|
|
})
|
|
|
|
try {
|
|
this.storage.get('recordData').then((recordData) => {
|
|
|
|
if (recordData?.value?.recordDataBase64.includes('data:audio')) {
|
|
this.audioRecorded = this.sanitiser.bypassSecurityTrustResourceUrl(recordData?.value?.recordDataBase64);
|
|
}
|
|
else if (recordData?.value?.mimeType && recordData?.value?.recordDataBase64) {
|
|
this.audioRecorded = this.sanitiser.bypassSecurityTrustResourceUrl(`data:${recordData.value.mimeType};base64,${recordData?.value?.recordDataBase64}`);
|
|
}
|
|
});
|
|
} catch (error) { }
|
|
|
|
|
|
}
|
|
|
|
async startRecording() {
|
|
VoiceRecorder.requestAudioRecordingPermission();
|
|
if (await VoiceRecorder.canDeviceVoiceRecord().then((result: GenericResponse) => { return result.value })) {
|
|
if (await VoiceRecorder.requestAudioRecordingPermission().then((result: GenericResponse) => { return result.value })) {
|
|
//if(await this.hasAudioRecordingPermission()){
|
|
if (this.recording) {
|
|
return;
|
|
}
|
|
this.recording = true;
|
|
VoiceRecorder.startRecording();
|
|
this.calculateDuration();
|
|
//}
|
|
}
|
|
else {
|
|
this.toastService._badRequest('Para gravar uma mensagem de voz, permita o acesso do Gabinete Digital ao seu microfone.');
|
|
}
|
|
}
|
|
else {
|
|
this.toastService._badRequest('Este dispositivo não tem capacidade para gravação de áudio!');
|
|
}
|
|
}
|
|
|
|
stopRecording() {
|
|
this.deleteRecording();
|
|
this.allowTyping = false;
|
|
|
|
if (!this.recording) {
|
|
return;
|
|
}
|
|
this.recording = false;
|
|
VoiceRecorder.stopRecording().then(async (result: RecordingData) => {
|
|
|
|
this.recording = false;
|
|
if (result.value && result.value.recordDataBase64) {
|
|
const recordData = result.value.recordDataBase64;
|
|
//
|
|
const fileName = new Date().getTime() + ".mp3";
|
|
//Save file
|
|
this.storage.set('fileName', fileName);
|
|
this.storage.set('recordData', result).then(() => {
|
|
|
|
})
|
|
}
|
|
})
|
|
setTimeout(async () => {
|
|
this.loadFiles();
|
|
}, 1000);
|
|
}
|
|
|
|
async deleteRecording() {
|
|
this.storage.remove('fileName');
|
|
this.storage.remove('recordData');
|
|
|
|
this.allowTyping = true;
|
|
this.lastAudioRecorded = '';
|
|
this.loadFiles();
|
|
}
|
|
|
|
|
|
|
|
handlePress(id?: string) {
|
|
this.selectedMsgId = id;
|
|
this.showMessageOptions = true;
|
|
}
|
|
|
|
handleClick() {
|
|
this.showMessageOptions = false;
|
|
this.selectedMsgId = "";
|
|
}
|
|
|
|
deleteMessage(msgId: string) {}
|
|
|
|
|
|
notImplemented() {
|
|
this.alertService.presentAlert('Funcionalidade em desenvolvimento');
|
|
}
|
|
|
|
close() {
|
|
this.modalController.dismiss();
|
|
this.deleteRecording();
|
|
}
|
|
|
|
|
|
|
|
doRefresh(ev: any) {
|
|
ev.target.complete();
|
|
}
|
|
|
|
scrollToBottom(): void {
|
|
try {
|
|
if (this.scrollingOnce) {
|
|
this.myScrollContainer.nativeElement.scrollTop = this.myScrollContainer.nativeElement.scrollHeight;
|
|
//this.scrollingOnce = false;
|
|
}
|
|
} catch (err) { }
|
|
}
|
|
|
|
scrollToBottomClicked = () => {
|
|
try {
|
|
this.myScrollContainer.nativeElement.scrollTop = this.myScrollContainer.nativeElement.scrollHeight;
|
|
} catch (err) { }
|
|
}
|
|
|
|
|
|
onContentScrolled(e) {
|
|
this.startPosition = e.srcElement.scrollTop;
|
|
let scroll = e.srcElement.scrollTop;
|
|
let windowHeight = e.srcElement.scrollHeight;
|
|
let containerHeight = windowHeight - e.srcElement.clientHeight;
|
|
|
|
if (scroll > this.currentPosition) {
|
|
} else {
|
|
this.scrollingOnce = false;
|
|
}
|
|
if ((containerHeight - 100) > scroll) {
|
|
this.scrollToBottomBtn = true;
|
|
}
|
|
else {
|
|
this.scrollToBottomBtn = false;
|
|
}
|
|
this.currentPosition = scroll;
|
|
|
|
}
|
|
|
|
ngOnDestroy() {
|
|
this.RoomStore.stop()
|
|
window.removeEventListener('scroll', this.scrollChangeCallback, true);
|
|
this.handleClickActive = false; // Disable the listener before component destruction
|
|
}
|
|
|
|
async sendMessage() {
|
|
|
|
|
|
this.RoomStore.sendMessage(this.textField)
|
|
this.textField = ''
|
|
|
|
setTimeout(() => {
|
|
this.scrollToBottomClicked()
|
|
}, 100)
|
|
}
|
|
|
|
async sendAudio(fileName) {
|
|
const roomId = this.room.id
|
|
let audioFile;
|
|
this.storage.get('recordData').then(async (recordData:RecordingData) => {
|
|
|
|
audioFile = recordData;
|
|
if (recordData?.value?.recordDataBase64.includes('data:audio')) {
|
|
this.audioRecorded = recordData?.value?.recordDataBase64;
|
|
}
|
|
else if (recordData?.value?.mimeType && recordData?.value?.recordDataBase64) {
|
|
this.audioRecorded = `data:${recordData.value.mimeType};base64,${recordData?.value?.recordDataBase64}`;
|
|
}
|
|
|
|
const audioMimeType: string = recordData.value.mimeType
|
|
|
|
this.RoomStore.sendMessage('', [{
|
|
file: this.audioRecorded.split(',')[1],
|
|
fileName: "audio",
|
|
source: MessageAttachmentSource.Device,
|
|
fileType: MessageAttachmentFileType.Audio,
|
|
mimeType: audioMimeType, // 'audio/webm',
|
|
safeFile: this.sanitiser.bypassSecurityTrustResourceUrl(this.audioRecorded)
|
|
}])
|
|
|
|
setTimeout(() => {
|
|
this.scrollToBottomClicked()
|
|
}, 100)
|
|
|
|
this.deleteRecording();
|
|
|
|
});
|
|
this.deleteRecording();
|
|
}
|
|
|
|
viewDocument(file: any, url?: string) {
|
|
|
|
this.openViewDocumentModal(file);
|
|
}
|
|
|
|
|
|
|
|
async openViewDocumentModal(file: any) {
|
|
|
|
let task = {
|
|
serialNumber: '',
|
|
taskStartDate: '',
|
|
isEvent: true,
|
|
workflowInstanceDataFields: {
|
|
FolderID: '',
|
|
Subject: file.Assunto,
|
|
SourceSecFsID: file.ApplicationId,
|
|
SourceType: 'PDF',
|
|
SourceID: file.DocId,
|
|
DispatchNumber: ''
|
|
}
|
|
}
|
|
|
|
let doc = {
|
|
"Id": "",
|
|
"ParentId": "",
|
|
"Source": 1,
|
|
"ApplicationId": file.ApplicationId,
|
|
"CreateDate": "",
|
|
"Data": null,
|
|
"Description": "",
|
|
"Link": null,
|
|
"SourceId": file.DocId,
|
|
"SourceName": file.Assunto,
|
|
"Stakeholders": "",
|
|
}
|
|
|
|
const modal = await this.modalController.create({
|
|
component: ViewDocumentPage,
|
|
componentProps: {
|
|
trustedUrl: '',
|
|
file: {
|
|
title: file.Assunto,
|
|
url: '',
|
|
title_link: '',
|
|
},
|
|
Document: doc,
|
|
applicationId: file.ApplicationId,
|
|
docId: file.DocId,
|
|
folderId: '',
|
|
task: task
|
|
},
|
|
cssClass: 'modal modal-desktop'
|
|
});
|
|
await modal.present();
|
|
}
|
|
|
|
|
|
|
|
showDateDuration(start: any) {
|
|
let end;
|
|
end = new Date();
|
|
start = new Date(start);
|
|
let customizedDate;
|
|
|
|
const totalSeconds = Math.floor((end - (start)) / 1000);;
|
|
const totalMinutes = Math.floor(totalSeconds / 60);
|
|
const totalHours = Math.floor(totalMinutes / 60);
|
|
const totalDays = Math.floor(totalHours / 24);
|
|
|
|
const hours = totalHours - (totalDays * 24);
|
|
const minutes = totalMinutes - (totalDays * 24 * 60) - (hours * 60);
|
|
const seconds = totalSeconds - (totalDays * 24 * 60 * 60) - (hours * 60 * 60) - (minutes * 60);
|
|
|
|
if (totalDays == 0) {
|
|
if (start.getDate() == new Date().getDate()) {
|
|
let time = start.getHours() + ":" + this.addZero(start.getUTCMinutes());
|
|
return time;
|
|
}
|
|
else {
|
|
return 'Ontem';
|
|
}
|
|
}
|
|
else {
|
|
let date = start.getDate() + "/" + (start.getMonth() + 1) + "/" + start.getFullYear();
|
|
return date;
|
|
}
|
|
}
|
|
|
|
addZero(i) {
|
|
if (i < 10) {
|
|
i = "0" + i;
|
|
}
|
|
return i;
|
|
}
|
|
|
|
async openMessagesOptions(ev?: any) {
|
|
const popover = await this.popoverController.create({
|
|
component: ChatPopoverPage,
|
|
componentProps: {
|
|
roomId: this.room.id,
|
|
members: [],
|
|
isAdmin: this.RoomStore.isAdmin,
|
|
roomType: this.RoomStore.room.roomType
|
|
},
|
|
cssClass: 'messages-options',
|
|
event: ev,
|
|
translucent: true,
|
|
});
|
|
await popover.present();
|
|
popover.onDidDismiss().then(res => {
|
|
|
|
if (res.data == 'leave') {
|
|
this.modalController.dismiss()
|
|
}
|
|
else if (res.data == 'delete') {
|
|
this.modalController.dismiss()
|
|
}
|
|
else if (res.data == 'cancel') {
|
|
this.modalController.dismiss()
|
|
}
|
|
else if (res.data == 'edit') {
|
|
|
|
//this.closeAllDesktopComponents.emit();
|
|
this.editGroup()
|
|
} else if (res.data == 'addUser') {
|
|
|
|
this.addContacts();
|
|
}
|
|
else {}
|
|
});
|
|
}
|
|
|
|
async addContacts() {
|
|
|
|
const modal = await this.modalController.create({
|
|
component: GroupContactsPage,
|
|
componentProps: {
|
|
roomId: this.RoomStore.room.id,
|
|
},
|
|
cssClass: 'contacts',
|
|
backdropDismiss: false
|
|
});
|
|
|
|
|
|
modal.onDidDismiss<IGroupContactsPageOutPutSchema>().then(result => {
|
|
|
|
// this.modalController.dismiss({roomId})
|
|
|
|
});
|
|
await modal.present();
|
|
}
|
|
|
|
async editGroup() {
|
|
const modal = await this.modalController.create({
|
|
component: EditGroupPage,
|
|
cssClass: 'modal modal-desktop',
|
|
componentProps: {
|
|
roomId: this.RoomStore.room.id,
|
|
},
|
|
});
|
|
await modal.present();
|
|
modal.onDidDismiss().then((res) => {
|
|
|
|
this.RoomStore.updateRoomDetails()
|
|
// this.getRoomInfo();
|
|
//this.modalController.dismiss(res.data);
|
|
});
|
|
}
|
|
|
|
|
|
async onImageError() {}
|
|
async onImageLoad(message: MessageViewModal, index:number) {
|
|
if(message.attachments[0].fileName == LastMessage.attachments[0].fileName) {
|
|
|
|
this.scrollToBottom()
|
|
setTimeout(() => {
|
|
this.scrollToBottom();
|
|
}, 100)
|
|
|
|
// this.messages1[this.room.id].splice(index, 1);
|
|
}
|
|
}
|
|
|
|
|
|
async takePictureMobile() {
|
|
|
|
const picture = await this.CameraService.takePicture({
|
|
cameraResultType: CameraResultType.DataUrl,
|
|
quality: 90
|
|
})
|
|
|
|
if(picture.isOk()) {
|
|
const file = picture.value
|
|
|
|
const compressedImage = await compressImageBase64(
|
|
file.dataUrl,
|
|
800, // maxWidth
|
|
800, // maxHeight
|
|
0.9 // quality
|
|
)
|
|
|
|
if(compressedImage.isOk()) {
|
|
|
|
this.RoomStore.sendMessage('', [{
|
|
file: compressedImage.value.split(',')[1],
|
|
fileName: "foto",
|
|
source: MessageAttachmentSource.Device,
|
|
fileType: MessageAttachmentFileType.Image,
|
|
mimeType: 'image/'+picture.value.format
|
|
}])
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
async addFile() {
|
|
this.addFileToChat(['.doc', '.docx', '.pdf'])
|
|
}
|
|
|
|
async addFileWebtrix() {
|
|
const modal = await this.modalController.create({
|
|
component: SearchPage,
|
|
cssClass: 'group-messages modal-desktop search-modal search-modal-to-desktop',
|
|
componentProps: {
|
|
type: 'AccoesPresidenciais & ArquivoDespachoElect',
|
|
select: true,
|
|
showSearchInput: true,
|
|
}
|
|
});
|
|
await modal.present();
|
|
modal.onDidDismiss().then(async res => {
|
|
const data = res.data;
|
|
|
|
if (data.selected) {
|
|
|
|
this.RoomStore.sendMessage('', [{
|
|
fileName: res.data.selected.Assunto,
|
|
source: MessageAttachmentSource.Webtrix,
|
|
fileType: MessageAttachmentFileType.Doc,
|
|
applicationId: res.data.selected.ApplicationType,
|
|
docId: parseInt(res.data.selected.Id),
|
|
description: res.data.selected.Assunto
|
|
}])
|
|
|
|
}
|
|
});
|
|
}
|
|
|
|
async pickPicture() {
|
|
|
|
const result = await this.FilePickerMobileService.getFile({
|
|
types: imageMimeTypes,
|
|
multiple: false,
|
|
readData: true,
|
|
})
|
|
|
|
if(result.isOk()) {
|
|
const file = result.value.files[0]
|
|
if(file) {
|
|
let resultUrl = decodeURIComponent(file.path);
|
|
const base64 = await this.fileSystemMobileService.readFile({resultUrl})
|
|
|
|
if(base64.isOk()) {
|
|
// console.log('1', base64.value)
|
|
// console.log('base64.value.data', base64.value.data)
|
|
// console.log('file', file)
|
|
// console.log('3',createDataURL(base64.value.data, file.mimeType))
|
|
|
|
this.RoomStore.sendMessage('', [{
|
|
file: base64.value.data,
|
|
fileName: "foto",
|
|
source: MessageAttachmentSource.Device,
|
|
fileType: MessageAttachmentFileType.Image,
|
|
mimeType: file.mimeType
|
|
}])
|
|
} else {
|
|
console.log(base64.error)
|
|
}
|
|
} else {
|
|
console.log('no file')
|
|
}
|
|
} else {
|
|
console.log('error', result.error)
|
|
}
|
|
|
|
// const file = await this.FilePickerService.getPicture({
|
|
// cameraResultType: CameraResultType.Base64
|
|
// })
|
|
|
|
// if(file.isOk()) {
|
|
|
|
// var base64 = 'data:image/jpeg;base64,' + file.value.base64String
|
|
// if (file.value.format == "jpeg" || file.value.format == "png" || file.value.format == "gif") {
|
|
|
|
// const compressedImage = await compressImageBase64(
|
|
// base64,
|
|
// 800, // maxWidth
|
|
// 800, // maxHeight
|
|
// 0.9 // quality
|
|
// )
|
|
|
|
// if(compressedImage.isOk()) {
|
|
|
|
|
|
// this.RoomStore.sendMessage('', [{
|
|
// file: compressedImage.value,
|
|
// fileName: "foto",
|
|
// source: MessageAttachmentSource.Device,
|
|
// fileType: MessageAttachmentFileType.Image,
|
|
// mimeType: 'image/'+file.value.format
|
|
// }])
|
|
// }
|
|
// }
|
|
|
|
// } else {
|
|
// if(file.error.type == 'PERMISSION_DENIED') {
|
|
// this.toastService._badRequest("Sem acesso a camera")
|
|
// }
|
|
// Logger.error('failed to pick picture from the device', {
|
|
// error: file.error
|
|
// })
|
|
// }
|
|
|
|
}
|
|
|
|
async viewOnce(event: Event, message: MessageViewModal, index:number) {
|
|
const params: ViewOncesImagePageInput = {
|
|
imageDataUrl: message.attachments[index].safeFile as any,
|
|
}
|
|
const modal = await this.modalController.create({
|
|
component: ViewOncesImagePage,
|
|
cssClass: '',
|
|
componentProps: params
|
|
});
|
|
|
|
modal.present()
|
|
|
|
return modal.onDidDismiss().then((res) => {
|
|
this.messageDelete(message)
|
|
});
|
|
}
|
|
|
|
async addFileToChat(types) {
|
|
console.log('add file ')
|
|
const roomId = this.room.id
|
|
|
|
if (this.platform.is('ios')) {
|
|
console.log('ios add file ')
|
|
|
|
const result = await this.FilePickerMobileService.getFile({
|
|
types: ['application/pdf', 'application/doc', 'application/docx','application/xls', 'application/xlsx', 'application/ppt',
|
|
'application/pptx', 'application/txt'],
|
|
multiple: false,
|
|
readData: true,
|
|
})
|
|
|
|
if(result.isOk()) {
|
|
console.log('RESULT', result.value.files[0].data)
|
|
|
|
this.RoomStore.sendMessage('', [{
|
|
file: result.value.files[0].data,
|
|
fileName: result.value.files[0].name,
|
|
source: MessageAttachmentSource.Device,
|
|
fileType: MessageAttachmentFileType.Doc,
|
|
description: result.value.files[0].name
|
|
}])
|
|
|
|
return
|
|
}
|
|
|
|
|
|
}
|
|
|
|
const file = await this.FilePickerWebService.getFileFromDevice(types)
|
|
|
|
if(file.isOk()) {
|
|
|
|
console.log(file)
|
|
|
|
|
|
const fileName = file.value.name
|
|
|
|
const validation = await allowedDocExtension(file.value.type)
|
|
|
|
if (validation.isOk()) {
|
|
|
|
let fileBase64 = await JSFileToDataUrl(file.value);
|
|
|
|
if(fileBase64.isOk()) {
|
|
|
|
this.RoomStore.sendMessage('', [{
|
|
file: fileBase64.value.split(',')[1],
|
|
fileName: file.value.name,
|
|
source: MessageAttachmentSource.Device,
|
|
fileType: MessageAttachmentFileType.Doc,
|
|
mimeType: file.value.type,
|
|
description: file.value.name
|
|
}])
|
|
}
|
|
|
|
|
|
} else {
|
|
console.log({fileName})
|
|
this.toastService._badRequest("Ficheiro inválido")
|
|
}
|
|
}
|
|
|
|
}
|
|
|
|
async openChatOptions(ev?: any) {
|
|
const roomId = this.room.id
|
|
|
|
|
|
const popover = await this.popoverController.create({
|
|
component: ChatOptionsPopoverPage,
|
|
cssClass: 'chat-options-popover',
|
|
event: ev,
|
|
componentProps: {
|
|
room: this.room.id,
|
|
members: this.RoomStore.members,
|
|
eventSelectedDate: new Date(),
|
|
},
|
|
translucent: true
|
|
});
|
|
await popover.present();
|
|
popover.onDidDismiss().then(async (res) => {
|
|
|
|
if (res['data'] == 'take-picture') {
|
|
this.takePictureMobile()
|
|
}
|
|
else if (res['data'] == 'add-picture') {
|
|
console.log('add-picture')
|
|
this.pickPicture()
|
|
}
|
|
else if (res['data'] == 'add-document') {
|
|
this.addFile()
|
|
}
|
|
else if (res['data'] == 'documentoGestaoDocumental') {
|
|
|
|
this.addFileWebtrix()
|
|
}
|
|
|
|
|
|
});
|
|
}
|
|
|
|
isJson(str) {
|
|
try {
|
|
JSON.parse(str);
|
|
} catch (e) {
|
|
return "";
|
|
}
|
|
return JSON.parse(str);
|
|
}
|
|
|
|
async fetchBlobFromURL(blobUrl: string): Promise<Blob> {
|
|
try {
|
|
const response = await fetch(blobUrl);
|
|
if (!response.ok) {
|
|
throw new Error(`Failed to fetch blob: ${response.statusText}`);
|
|
}
|
|
return await response.blob();
|
|
} catch (error) {
|
|
console.error('Error fetching blob from URL:', error);
|
|
throw error;
|
|
}
|
|
}
|
|
|
|
convertBlobToDataURL(blob: Blob): Promise<string> {
|
|
return new Promise((resolve, reject) => {
|
|
const reader = new FileReader();
|
|
reader.onloadend = () => {
|
|
if (reader.result) {
|
|
resolve(reader.result as string);
|
|
} else {
|
|
reject('Conversion failed');
|
|
}
|
|
};
|
|
reader.onerror = (error) => reject(error);
|
|
reader.readAsDataURL(blob);
|
|
});
|
|
}
|
|
|
|
|
|
async openFile(blobUrl:string, filename, fileType) {
|
|
|
|
let pathFile = ''
|
|
const fileName = filename
|
|
const contentFile = await this.fetchBlobFromURL(blobUrl)
|
|
if (this.platform.is('ios')) {
|
|
pathFile = this.file.documentsDirectory
|
|
} else {
|
|
pathFile = this.file.cacheDirectory
|
|
}
|
|
console.log(pathFile)
|
|
console.log(contentFile)
|
|
const writeResult = await this.fileSystemMobileService.writeFile(pathFile, fileName, contentFile, { replace: true })
|
|
|
|
if(writeResult.isOk()) {
|
|
const openResult = await this.fileSystemMobileService.fileOpener(pathFile + fileName, fileType)
|
|
}
|
|
}
|
|
|
|
|
|
|
|
downloadFileFromBrowser(fileName: string, msg: MessageViewModal): void {
|
|
if(msg.attachments[0]?.blobURl) {
|
|
// Create a temporary URL for the Blob
|
|
const url = msg.attachments[0].safeFile;
|
|
|
|
// Create an <a> element with the download attribute
|
|
const a = document.createElement('a');
|
|
a.href = url;
|
|
a.download = fileName; // Set the desired file name
|
|
|
|
a.click();
|
|
} else {
|
|
const link = document.createElement("a")
|
|
link.href = `data:${msg.attachments[0].mimeType}';base64,${msg.attachments[0].safeFile}`;
|
|
link.download = fileName
|
|
link.click()
|
|
|
|
link.remove()
|
|
}
|
|
}
|
|
|
|
|
|
async openPreview(msg: MessageViewModal) {
|
|
|
|
if (msg.attachments[0].source === MessageAttachmentSource.Webtrix) {
|
|
this.viewDocument(msg)
|
|
} else {
|
|
|
|
if (!msg.attachments[0].safeFile || msg.attachments[0].safeFile === null || msg.attachments[0].safeFile === '') {
|
|
|
|
|
|
} else {
|
|
|
|
if (this.platform.is('desktop') || this.platform.is('mobileweb')) {
|
|
|
|
if (msg.attachments[0].mimeType.includes('image')) {
|
|
const modal = await this.modalController.create({
|
|
component: ViewMediaPage,
|
|
cssClass: 'modal modal-desktop',
|
|
componentProps: {
|
|
image: msg.attachments[0].safeFile,
|
|
type: msg.attachments[0].mimeType,
|
|
username: msg.attachments[0].description,
|
|
_updatedAt: msg.sentAt
|
|
}
|
|
});
|
|
modal.present();
|
|
} else {
|
|
|
|
this.downloadFileFromBrowser(msg.attachments[0].description, msg)
|
|
}
|
|
|
|
} else {
|
|
if (msg.attachments[0].mimeType.includes('image')) {
|
|
const modal = await this.modalController.create({
|
|
component: ViewMediaPage,
|
|
cssClass: 'modal modal-desktop',
|
|
componentProps: {
|
|
image: msg.attachments[0].safeFile,
|
|
type: msg.attachments[0].mimeType,
|
|
username: msg.attachments[0].description,
|
|
_updatedAt: msg.sentAt
|
|
}
|
|
});
|
|
modal.present();
|
|
} else {
|
|
this.openFile(msg.attachments[0].safeFile, msg.attachments[0].fileName || msg.attachments[0].description, msg.attachments[0].mimeType);
|
|
}
|
|
}
|
|
|
|
}
|
|
}
|
|
|
|
}
|
|
|
|
imageSize(img) {
|
|
var canvas = document.createElement('canvas');
|
|
var ctx = canvas.getContext('2d');
|
|
canvas.width = 300
|
|
canvas.height = 234
|
|
ctx.drawImage(img.attachments[0].image_url, 0, 0, 300, 234);
|
|
document.body.appendChild(canvas);
|
|
}
|
|
|
|
getPicture(img) {
|
|
var canvas = document.createElement('canvas');
|
|
var ctx = canvas.getContext('2d');
|
|
canvas.width = 300
|
|
canvas.height = 234
|
|
ctx.drawImage(img.attachments[0].image_url, 0, 0, 300, 234);
|
|
document.body.appendChild(canvas);
|
|
|
|
}
|
|
|
|
messageDelete(message: MessageViewModal) {
|
|
|
|
this.RoomStore.messageDelete(message)
|
|
}
|
|
|
|
async editMessage(message: any) {
|
|
|
|
const modal = await this.popoverController.create({
|
|
component: EditMessagePage,
|
|
cssClass: 'edit-message',
|
|
componentProps: {
|
|
message: message.message,
|
|
roomId: this.room.id,
|
|
}
|
|
});
|
|
|
|
modal.present()
|
|
|
|
return modal.onDidDismiss().then((res) => {
|
|
|
|
if(res.data) {
|
|
|
|
|
|
this.RoomStore.updateMessage({
|
|
messageId:message.id,
|
|
message: res.data.message
|
|
})
|
|
}
|
|
|
|
});
|
|
}
|
|
|
|
toggleEmojiPicker(message: MessageViewModal) {
|
|
if (this.selectedMessage === message) {
|
|
this.selectedMessage = null; // Close the picker if it's already open
|
|
} else {
|
|
this.handleClickActive = true
|
|
this.selectedMessage = message; // Open the picker for the selected message
|
|
}
|
|
}
|
|
|
|
addReaction(message: any, emoji: string) {
|
|
console.log('reaction==')
|
|
// Logic to add reaction to the message
|
|
this.selectedMessage = null; // Close the picker after adding reaction
|
|
|
|
this.RoomStore.addReaction(message, emoji)
|
|
|
|
}
|
|
|
|
sendTyping() {
|
|
this.RoomStore.sendTyping()
|
|
}
|
|
}
|