bug fix in chat view

This commit is contained in:
tiago.kayaya
2022-01-28 15:31:52 +01:00
parent 8756462665
commit 5a214aebf4
12 changed files with 145 additions and 49 deletions
+6 -3
View File
@@ -68,17 +68,20 @@
</div> </div>
<div *ngIf="room.value.lastMessage" class="item-description" [class.item-description-active]="room.value.id == idSelected"> <div *ngIf="room.value.lastMessage" class="item-description" [class.item-description-active]="room.value.id == idSelected">
<ion-label *ngIf="room.value.lastMessage">{{room.value.lastMessage.msg}}</ion-label> <ion-label *ngIf="room.value.lastMessage">{{room.value.lastMessage.msg}}</ion-label>
<ion-label *ngIf="room.value.lastMessage.file">
<fa-icon *ngIf="room.value.lastMessage.file.type != 'application/meeting'" icon="file-alt" class="file-icon" [class.set-active-item-font-to-white]="room.value.id == idSelected"></fa-icon> <div *ngIf="room.value.lastMessage.file">
<fa-icon *ngIf="room.value.lastMessage.file.type != 'application/meeting' && room.value.lastMessage.file.type != 'application/img'" icon="file-alt" class="file-icon" [class.set-active-item-font-to-white]="room.value.id == idSelected"></fa-icon>
<fa-icon *ngIf="room.value.lastMessage.file.type == 'application/meeting'" icon="calendar-alt" class="file-icon" [class.set-active-item-font-to-white]="room.value.id == idSelected"></fa-icon> <fa-icon *ngIf="room.value.lastMessage.file.type == 'application/meeting'" icon="calendar-alt" class="file-icon" [class.set-active-item-font-to-white]="room.value.id == idSelected"></fa-icon>
<span> {{room.value.lastMessage.file.name || room.value.lastMessage.file.subject }}</span> <span> {{room.value.lastMessage.file.name || room.value.lastMessage.file.subject }}</span>
</ion-label> </div>
<ion-label *ngIf="room.value.lastMessage.attachments"> <ion-label *ngIf="room.value.lastMessage.attachments">
<div *ngIf="room.value.lastMessage.attachments[0].image_url"> <div *ngIf="room.value.lastMessage.attachments[0].image_url">
<fa-icon icon="image" class="file-icon" [class.set-active-item-font-to-white]="room.value.id == idSelected"></fa-icon> <fa-icon icon="image" class="file-icon" [class.set-active-item-font-to-white]="room.value.id == idSelected"></fa-icon>
<span> Fotografia</span> <span> Fotografia</span>
</div> </div>
</ion-label> </ion-label>
</div> </div>
</div> </div>
</div> </div>
+1
View File
@@ -143,6 +143,7 @@ export class ChatPage implements OnInit {
ngOnInit() { ngOnInit() {
console.log(this.wsChatMethodsService.dm);
console.log(this.wsChatMethodsService.group); console.log(this.wsChatMethodsService.group);
@@ -138,7 +138,7 @@ export class GroupMessagesPage implements OnInit, AfterViewInit, OnDestroy {
"asUser": false, "asUser": false,
} }
if(msgId){ if(msgId){
this.alertService.confirmDeleteMessage(body); //this.alertService.confirmDeleteMessage(body);
} }
else{ else{
this.toastService.badRequest('Não foi possível apagar'); this.toastService.badRequest('Não foi possível apagar');
+8 -8
View File
@@ -114,7 +114,7 @@ export class MessagesPage implements OnInit, AfterViewInit, OnDestroy {
this.wsChatMethodsService.getDmRoom(this.roomId).loadHistory() this.wsChatMethodsService.getDmRoom(this.roomId).loadHistory()
this.wsChatMethodsService.getDmRoom(this.roomId).scrollDown = this.scrollToBottomClicked this.wsChatMethodsService.getDmRoom(this.roomId).scrollDown = this.scrollToBottomClicked
setTimeout(()=>{ setTimeout(()=>{
this.scrollToBottomClicked() this.scrollToBottomClicked()
}, 50) }, 50)
@@ -245,7 +245,7 @@ export class MessagesPage implements OnInit, AfterViewInit, OnDestroy {
"asUser": false, "asUser": false,
} }
if (msgId) { if (msgId) {
this.alertService.confirmDeleteMessage(body); //this.alertService.confirmDeleteMessage(body);
} }
else { else {
this.toastService.badRequest('Não foi possível apagar'); this.toastService.badRequest('Não foi possível apagar');
@@ -576,11 +576,11 @@ export class MessagesPage implements OnInit, AfterViewInit, OnDestroy {
}); });
} }
/* /*
this.fileService.downloadFile(element.file.guid).subscribe(async (event) => { this.fileService.downloadFile(element.file.guid).subscribe(async (event) => {
var name = element.file.guid; var name = element.file.guid;
if (event.type === HttpEventType.DownloadProgress) { if (event.type === HttpEventType.DownloadProgress) {
} else if (event.type === HttpEventType.Response) { } else if (event.type === HttpEventType.Response) {
var base64 = btoa(new Uint8Array(event.body).reduce((data, byte) => data + String.fromCharCode(byte), '') var base64 = btoa(new Uint8Array(event.body).reduce((data, byte) => data + String.fromCharCode(byte), '')
); );
@@ -600,14 +600,14 @@ export class MessagesPage implements OnInit, AfterViewInit, OnDestroy {
console.log('error LAKE FS FILE', error) console.log('error LAKE FS FILE', error)
}); });
const readFile = await Filesystem.readFile({ const readFile = await Filesystem.readFile({
path: `${IMAGE_DIR}/${name}`, path: `${IMAGE_DIR}/${name}`,
directory: Directory.Data, directory: Directory.Data,
}); });
});*/ });*/
getRoomMessageDB(roomId) { getRoomMessageDB(roomId) {
+9 -5
View File
@@ -1,6 +1,7 @@
import { Injectable } from '@angular/core'; import { Injectable } from '@angular/core';
import { AlertController, AnimationController } from '@ionic/angular'; import { AlertController, AnimationController } from '@ionic/angular';
import { ChatService } from './chat.service'; import { ChatService } from './chat.service';
import { WsChatMethodsService } from './chat/ws-chat-methods.service';
import { ToastService } from './toast.service'; import { ToastService } from './toast.service';
@Injectable({ @Injectable({
@@ -13,6 +14,7 @@ export class AlertService {
private animationController: AnimationController, private animationController: AnimationController,
private chatService: ChatService, private chatService: ChatService,
private toastService: ToastService, private toastService: ToastService,
public wsChatMethodsService: WsChatMethodsService,
) { } ) { }
async presentAlert(message:string) { async presentAlert(message:string) {
@@ -40,7 +42,9 @@ export class AlertService {
}, 2500); }, 2500);
} }
async confirmDeleteMessage(body:any) { async confirmDeleteMessage(msgId:any, room:any) {
console.log(room);
const alert = await this.alertController.create({ const alert = await this.alertController.create({
cssClass: 'my-custom-class', cssClass: 'my-custom-class',
header: 'Apagar a mensagem?', header: 'Apagar a mensagem?',
@@ -55,10 +59,10 @@ export class AlertService {
}, { }, {
text: 'Apagar', text: 'Apagar',
handler: () => { handler: () => {
const loader = this.toastService.loading(); //const loader = this.toastService.loading();
this.chatService.deleteMessage(body).subscribe(res=>{ this.wsChatMethodsService.deleteMessage(msgId);
loader.remove(); //this.wsChatMethodsService.subscribeToRoomUpdate(room._id, room);
}); //loader.remove();
} }
} }
] ]
+37 -3
View File
@@ -52,8 +52,9 @@ export class RoomService {
receiveMessage() { receiveMessage() {
this.WsChatService.receiveLiveMessageFromRoom( this.WsChatService.upateRoomEvents(
this.id, this.id,
"stream-room-messages",
(ChatMessage) => { (ChatMessage) => {
ChatMessage = ChatMessage.fields.args[0] ChatMessage = ChatMessage.fields.args[0]
ChatMessage = this.fix_updatedAt(ChatMessage) ChatMessage = this.fix_updatedAt(ChatMessage)
@@ -63,7 +64,7 @@ export class RoomService {
const message = new MessageService() const message = new MessageService()
message.setData(ChatMessage) message.setData(ChatMessage)
this.lastMessage.msg = message.msg this.lastMessage = message
if (message.t == 'r') { this.name = message.msg } if (message.t == 'r') { this.name = message.msg }
this.calDateDuration(ChatMessage._updatedAt) this.calDateDuration(ChatMessage._updatedAt)
this.massages.push(message) this.massages.push(message)
@@ -84,6 +85,37 @@ export class RoomService {
} }
) )
this.WsChatService.registerCallback
}
async receiveMessageDelete() {
this.WsChatService.upateRoomEvents(
this.id,
"stream-notify-room",
async (ChatMessage) => {
console.log(ChatMessage.fields.args[0]._id);
const messageId = ChatMessage.fields.args[0]._id;
this.massages.forEach((message, index)=>{
if(message._id == messageId){
this.massages.splice(index, 1)
this.storage.set('chatmsg' + this.id, this.massages).then((value) => {
//console.log('MSG DELETE ON STORAGE', value)
});
//Get previous last message from room
const previousLastMessage = this.massages.slice(-1)[0];
this.lastMessage = previousLastMessage;
this.calDateDuration(previousLastMessage._updatedAt)
}
})
}
)
this.WsChatService.registerCallback
} }
send(msg) { send(msg) {
@@ -148,7 +180,7 @@ export class RoomService {
if (message.file) { if (message.file) {
if (message.file.guid) { if (message.file.guid) {
this.storage.get(message.file.guid).then((image) => { this.storage.get(message.file.guid).then((image) => {
console.log('IMAGE FROM STORAGE', image) //console.log('IMAGE FROM STORAGE', image)
message.file.image_url = image message.file.image_url = image
}); });
} }
@@ -188,6 +220,8 @@ export class RoomService {
this.WsChatService.loadHistory(this.id, limit).then(async (chatHistory: chatHistory) => { this.WsChatService.loadHistory(this.id, limit).then(async (chatHistory: chatHistory) => {
const mgsArray = chatHistory.result.messages.reverse(); const mgsArray = chatHistory.result.messages.reverse();
console.log(mgsArray);
if (this.platform.is('desktop') || this.platform.is('mobileweb')) { if (this.platform.is('desktop') || this.platform.is('mobileweb')) {
await this.storage.remove('chatmsg' + this.id).then(() => { await this.storage.remove('chatmsg' + this.id).then(() => {
console.log('MSG REMOVE ON STORAGE') console.log('MSG REMOVE ON STORAGE')
@@ -58,14 +58,19 @@ export class WsChatMethodsService {
this.WsChatService.streamRoomMessages(id).then((subscription)=>{ this.WsChatService.streamRoomMessages(id).then((subscription)=>{
console.log('streamRoomMessages', subscription) console.log('streamRoomMessages', subscription)
}) })
this.WsChatService.streamNotifyRoomDeleteMessage(id).then((subscription)=>{
console.log('streamNotifyRoomDeleteMessage', subscription);
})
} }
for (const id in this.group) { for (const id in this.group) {
this.WsChatService.streamRoomMessages(id).then((subscription)=>{ this.WsChatService.streamRoomMessages(id).then((subscription)=>{
console.log('streamRoomMessages', subscription) console.log('streamRoomMessages', subscription)
}) })
this.WsChatService.streamNotifyRoomDeleteMessage(id).then((subscription)=>{
console.log('streamNotifyRoomDeleteMessage', subscription);
})
} }
this.WsChatService.streamNotifyLogged().then((subscription=>{ this.WsChatService.streamNotifyLogged().then((subscription=>{
console.log('streamRoomMessages', subscription) console.log('streamRoomMessages', subscription)
})) }))
@@ -82,6 +87,9 @@ export class WsChatMethodsService {
this.WsChatService.streamNotifyLogged().then((subscription=>{ this.WsChatService.streamNotifyLogged().then((subscription=>{
console.log('streamRoomMessages', subscription) console.log('streamRoomMessages', subscription)
})) }))
this.WsChatService.streamNotifyRoomDeleteMessage(id).then((subscription)=>{
console.log('streamNotifyRoomDeleteMessage', subscription);
})
this.prepareRoom(roomData); this.prepareRoom(roomData);
@@ -103,10 +111,13 @@ export class WsChatMethodsService {
}) })
room.receiveMessage() room.receiveMessage()
room.receiveMessageDelete();
let roomId = this.getRoomId(roomData) let roomId = this.getRoomId(roomData)
if(this.isIndividual(roomData)) { if(this.isIndividual(roomData)) {
console.log(room);
this.dm[roomId] = room this.dm[roomId] = room
this.dmCount++ this.dmCount++
} else { } else {
@@ -115,7 +126,9 @@ export class WsChatMethodsService {
} }
} }
deleteMessage(id?) {
return this.WsChatService.deleteMessage(id);
}
leaveRoom(id?) { leaveRoom(id?) {
return this.WsChatService.leaveRoom(id); return this.WsChatService.leaveRoom(id);
+57 -3
View File
@@ -228,7 +228,29 @@ export class WsChatService {
} }
joinRoom(){} joinRoom(){}
deleteMessage() {}
deleteMessage(msgId) {
const requestId = uuidv4();
var message = {
msg: "method",
method: "deleteMessage",
id: requestId,
params:[{"_id":msgId}]
}
this.ws.send({message, requestId});
return new Promise ((resolve, reject) => {
this.ws.registerCallback({type:'Onmessage', funx:(message) =>{
if(message.id == requestId || deepFind(message, 'result') == requestId){
resolve(message)
return true
}
}})
});
}
createPrivateRoom(groupName, username, customFields) { createPrivateRoom(groupName, username, customFields) {
const requestId = uuidv4() const requestId = uuidv4()
@@ -337,15 +359,20 @@ export class WsChatService {
} }
receiveLiveMessageFromRoom(roomId, funx: Function) { upateRoomEvents(roomId, collection:string, funx: Function, ) {
this.ws.registerCallback({ this.ws.registerCallback({
type:'Onmessage', type:'Onmessage',
funx:(message)=>{ funx:(message)=>{
if(message.msg =='changed' && message.collection == 'stream-room-messages') { //console.log(message);
if(message.msg =='changed' && message.collection == collection) {
if(message.fields.args[0].rid == roomId) { if(message.fields.args[0].rid == roomId) {
funx(message) funx(message)
} }
else if(message.fields.eventName ==`${roomId}/deleteMessage`){
funx(message)
}
} }
} }
}) })
@@ -432,6 +459,33 @@ export class WsChatService {
} }
streamNotifyRoomDeleteMessage(roomId:string) {
const requestId = uuidv4()
let message = {
"msg": "sub",
"id": requestId,
"name": "stream-notify-room",
"params": [
`${roomId}/deleteMessage`,
true
]
};
this.ws.send({message, requestId})
return new Promise((resolve, reject) => {
this.ws.registerCallback({type:'Onmessage', funx:(message)=>{
if(message.id == requestId || deepFind(message,'result.id') == requestId) { // same request send
resolve(message)
return true
}
}})
});
}
registerCallback(data:wsCallbacksParams) { registerCallback(data:wsCallbacksParams) {
return this.ws.registerCallback(data) return this.ws.registerCallback(data)
} }
@@ -49,7 +49,7 @@
<div class="message-item-options d-flex justify-content-end"> <div class="message-item-options d-flex justify-content-end">
<fa-icon [matMenuTriggerFor]="beforeMenu" icon="chevron-down" class="message-options-icon cursor-pointer"></fa-icon> <fa-icon [matMenuTriggerFor]="beforeMenu" icon="chevron-down" class="message-options-icon cursor-pointer"></fa-icon>
<mat-menu #beforeMenu="matMenu" xPosition="before"> <mat-menu #beforeMenu="matMenu" xPosition="before">
<button (click)="deleteMessage(msg._id)" class="menuButton">Apagar mensagem</button> <button (click)="deleteMessage(msg._id, msg)" class="menuButton">Apagar mensagem</button>
</mat-menu> </mat-menu>
</div> </div>
<div class="title"> <div class="title">
@@ -68,7 +68,7 @@
<div class="message-item-options d-flex justify-content-end"> <div class="message-item-options d-flex justify-content-end">
<fa-icon [matMenuTriggerFor]="beforeMenu" icon="chevron-down" class="message-options-icon cursor-pointer"></fa-icon> <fa-icon [matMenuTriggerFor]="beforeMenu" icon="chevron-down" class="message-options-icon cursor-pointer"></fa-icon>
<mat-menu #beforeMenu="matMenu" xPosition="before"> <mat-menu #beforeMenu="matMenu" xPosition="before">
<button (click)="deleteMessage(msg._id)" class="menuButton">Apagar mensagem</button> <button (click)="deleteMessage(msg._id, msg)" class="menuButton">Apagar mensagem</button>
</mat-menu> </mat-menu>
</div> </div>
<div class="title"> <div class="title">
@@ -306,13 +306,8 @@ export class GroupMessagesPage implements OnInit, OnChanges, AfterViewInit, OnDe
this.message = ""; this.message = "";
} }
deleteMessage(msgId: string) { deleteMessage(msgId: string, room:any) {
let body = { this.alertService.confirmDeleteMessage(msgId, room);
"roomId": this.roomId,
"msgId": msgId,
"asUser": false,
}
this.alertService.confirmDeleteMessage(body);
} }
async openGroupMessagesOptions() { async openGroupMessagesOptions() {
@@ -44,7 +44,7 @@
<fa-icon [matMenuTriggerFor]="beforeMenu" icon="chevron-down" class="message-options-icon cursor-pointer"> <fa-icon [matMenuTriggerFor]="beforeMenu" icon="chevron-down" class="message-options-icon cursor-pointer">
</fa-icon> </fa-icon>
<mat-menu #beforeMenu="matMenu" xPosition="before"> <mat-menu #beforeMenu="matMenu" xPosition="before">
<button (click)="deleteMessage(msg._id)" class="menuButton">Apagar mensagem</button> <button (click)="deleteMessage(msg._id, msg)" class="menuButton">Apagar mensagem</button>
</mat-menu> </mat-menu>
</div> </div>
<div class="title"> <div class="title">
@@ -63,7 +63,7 @@
<fa-icon [matMenuTriggerFor]="beforeMenu" icon="chevron-down" class="message-options-icon cursor-pointer"> <fa-icon [matMenuTriggerFor]="beforeMenu" icon="chevron-down" class="message-options-icon cursor-pointer">
</fa-icon> </fa-icon>
<mat-menu #beforeMenu="matMenu" xPosition="before"> <mat-menu #beforeMenu="matMenu" xPosition="before">
<button (click)="deleteMessage(msg._id)" class="menuButton">Apagar mensagem</button> <button (click)="deleteMessage(msg._id, msg)" class="menuButton">Apagar mensagem</button>
</mat-menu> </mat-menu>
</div> </div>
<div class="title"> <div class="title">
+5 -13
View File
@@ -107,8 +107,8 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
this.wsChatMethodsService.getDmRoom(this.roomId).massages.forEach((element) => { this.wsChatMethodsService.getDmRoom(this.roomId).massages.forEach((element) => {
console.log('DATATATA 11', element) console.log('DATATATA 11', element)
}) */ }) */
//this.transformData(this.wsChatMethodsService.getDmRoom(this.roomId).massages) //this.transformData(this.wsChatMethodsService.getDmRoom(this.roomId).massages)
//this.getMessageDB() //this.getMessageDB()
@@ -254,16 +254,8 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
this.message = ""; this.message = "";
} }
deleteMessage(msgId: string) { deleteMessage(msgId: string, room:any) {
let body = { this.alertService.confirmDeleteMessage(msgId, room);
"roomId": this.roomId,
"msgId": msgId,
"asUser": false,
}
this.alertService.confirmDeleteMessage(body);
/* this.chatService.deleteMessage(body).subscribe(res=>{
console.log(res);
}); */
} }
async viewDocument(msg: any, url?: string) { async viewDocument(msg: any, url?: string) {
@@ -637,7 +629,7 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
console.log('FILE TYPE 33', msg.file.type) console.log('FILE TYPE 33', msg.file.type)
} else if (event.type === HttpEventType.Response) { } else if (event.type === HttpEventType.Response) {
this.downloadFile = 'data:image/jpeg;base64,' + btoa(new Uint8Array(event.body).reduce((data, byte) => data + String.fromCharCode(byte), '')); this.downloadFile = 'data:image/jpeg;base64,' + btoa(new Uint8Array(event.body).reduce((data, byte) => data + String.fromCharCode(byte), ''));
msg.file = { msg.file = {
guid: msg.file.guid, guid: msg.file.guid,
image_url: this.downloadFile, image_url: this.downloadFile,