Merge with websocket branch

2026-04-19 04:57:52 +00:00 · 2022-01-19 09:12:30 +01:00
parent 9f5a0da607 05a1b4a82a
commit 4d9db4f198
46 changed files with 1631 additions and 729 deletions
@@ -3,7 +3,7 @@
    <div class="main-header">
      <div class="header-top">
        <div class="middle">
-          <ion-label class="title">{{roomName}}</ion-label>
+          <ion-label class="title">{{wsChatMethodsService.getGroupRoom(roomId).name}}</ion-label>
        </div>
        <div class="right">
          <button class="btn-no-color" (click)="openGroupMessagesOptions()">
@@ -23,10 +23,10 @@
          </ion-label>
        </div>
      </div>
-      <div *ngIf="room.customFields.countDownDate" class="d-flex align-items-center yellow-orange pl-10">
+      <!-- <div *ngIf="room.customFields.countDownDate" class="d-flex align-items-center yellow-orange pl-10">
        <i class="far fa-clock font-15" ></i>
        <ion-label class="font-15 pl-10" color="warning">{{countDownDate()}}</ion-label>
-      </div>
+      </div> -->
    </div>
  </ion-toolbar>
 </ion-header>
@@ -44,8 +44,8 @@
      <ion-label>A conversa original mantêm-se como chat individual</ion-label>
    </div>

-    <div class="messages-list-item-wrapper container-width-100" *ngFor="let msg of messages; let last = last">
-      <div class="message-item incoming-{{msg.u.username!=loggedUser.me.username}} max-width-45" *ngIf="msg.t != 'r' && msg.t != 'ul' && msg.t != 'ru' && msg.msg !=''" >
+    <div class="messages-list-item-wrapper container-width-100" *ngFor="let msg of wsChatMethodsService.getGroupRoom(roomId).massages; let last = last">
+      <div class="message-item incoming-{{msg.u.username!=loggedUser.me.username}} max-width-45" *ngIf="msg.t != 'r' && msg.t != 'ul' && msg.t != 'au' && msg.t != 'ru' && msg.msg !=''" >
        <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>
          <mat-menu #beforeMenu="matMenu" xPosition="before">
@@ -93,7 +93,7 @@
      </div>


-      <div class="message-item incoming-{{msg.u.username!=loggedUser.me.username}} max-width-45" *ngIf="msg.t != 'r' && msg.t != 'ul' && msg.t != 'ru' && msg.alias =='documento'" >
+      <div class="message-item incoming-{{msg.u.username!=loggedUser.me.username}} max-width-45" *ngIf="msg.t != 'r' && msg.t != 'ul' && msg.t != 'au' && msg.t != 'ru' && msg.alias =='documento'" >
        <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>
          <mat-menu #beforeMenu="matMenu" xPosition="before">
@@ -191,6 +191,14 @@
        </div>
        {{last ? scrollToBottom() : ''}}
      </div>
+      <div *ngIf="msg.t == 'au'" class="info-text-leave">
+        <div *ngFor="let user of allUsers">
+          <div *ngIf="msg.msg == user.username">
+            <ion-label>Adicionou {{user.name}}</ion-label><br />
+          </div>
+        </div>
+        {{last ? scrollToBottom() : ''}}
+      </div>
      <div *ngIf="msg.file" >
        <div *ngIf="msg.file.type == 'application/meeting'" class="info-meeting">
          <ion-label class="info-meeting-small">{{msg.u.name}} criou esta reunião</ion-label><br />
@@ -24,6 +24,7 @@ import { ViewMediaPage } from 'src/app/modals/view-media/view-media.page';
 import { ViewEventPage } from 'src/app/modals/view-event/view-event.page';
 import { HttpEventType } from '@angular/common/http';
 import { Storage } from '@ionic/storage';
+import { WsChatMethodsService } from 'src/app/services/chat/ws-chat-methods.service';

 /*
 import * as pdfjsLib from 'pdfjs-dist';
@@ -94,7 +95,8 @@ export class GroupMessagesPage implements OnInit, OnChanges, AfterViewInit, OnDe
    private fileService: FileService,
    public ThemeService: ThemeService,
    private changeDetectorRef: ChangeDetectorRef,
-    private storage: Storage
+    private storage: Storage,
+    public wsChatMethodsService: WsChatMethodsService
  ) {
    this.loggedUserChat = authService.ValidatedUserChat['data'];
    this.isGroupCreated = true;
@@ -105,12 +107,22 @@ export class GroupMessagesPage implements OnInit, OnChanges, AfterViewInit, OnDe
  ngOnChanges(changes: SimpleChanges): void {
    this.getRoomInfo();
    //this.scrollToBottom();
+    this.wsChatMethodsService.getGroupRoom(this.roomId).loadHistory();
+    console.log('MESSAGES'+this.wsChatMethodsService.getGroupRoom(this.roomId).massages);
+    this.wsChatMethodsService.getGroupRoom(this.roomId).scrollDown = this.scrollToBottomClicked
+
+    setTimeout(()=>{
+      this.scrollToBottomClicked()
+    }, 50)
+
  }

  ngOnInit() {
    this.loggedUser = this.loggedUserChat;
+    //console.log(this.wsChatMethodsService.getRoom(this.roomId).massages);
+
+    this.loggedUser=this.loggedUserChat;
    this.getRoomInfo();
-    this.serverLongPull();
    this.setStatus('online');
    this.getChatMembers();
    //this.getMessageDB();
@@ -144,7 +156,7 @@ export class GroupMessagesPage implements OnInit, OnChanges, AfterViewInit, OnDe
    } catch (err) { }
  }

-  scrollToBottomClicked(): void {
+  scrollToBottomClicked = () => {
    try {
      this.myScrollContainer.nativeElement.scrollTop = this.myScrollContainer.nativeElement.scrollHeight;
    } catch (err) { }
@@ -384,27 +396,7 @@ export class GroupMessagesPage implements OnInit, OnChanges, AfterViewInit, OnDe
  }

  sendMessage() {
-    let body = {
-      "message":
-      {
-        "rid": this.roomId,
-        "msg": this.message,
-        /* "attachments": [{
-          "color": "#ff0000",
-          "text": "Yay for gruggy!",
-          "title": "Attachment Example",
-          "title_link": "https://youtube.com",
-          "title_link_download": false,
-          "image_url": "https://upload.wikimedia.org/wikipedia/commons/e/ee/Chain_link_icon.png",
-        }] */
-      }
-    }
-
-    this.chatService.sendMessage(body).subscribe(res => {
-      /*  this.loadGroupMessages(); */
-      //this.getRoomInfo();
-      this.scrollingOnce = true;
-    });
+    this.wsChatMethodsService.getDmRoom(this.roomId).send(this.message)
    this.message = "";
  }

@@ -841,47 +833,6 @@ export class GroupMessagesPage implements OnInit, OnChanges, AfterViewInit, OnDe
    });
  }

-  async serverLongPull() {
-
-    if (this.route.url != "/home/chat" && document.querySelector('app-group-messages')) {
-      console.log("Timer message stop")
-    }
-    else {
-
-      this.chatService.getPrivateGroupMessages(this.roomId).subscribe(async res => {
-        if (res['success'] == true) {
-          // Show Error
-          //showMessage(response.statusText);
-          //this.loadMessages()
-          let msgOnly = res['messages'].filter(data => data.t != 'au');
-          //this.messages = msgOnly.reverse();
-          console.log('GROUP MSG FROM ROCKET',msgOnly.reverse());
-          this.transformData(msgOnly.reverse());
-          this.getMessageDB();
-          // Reconnect in one second
-
-          if (document.querySelector('app-group-messages')) {
-            await new Promise(resolve => setTimeout(resolve, 5000));
-            this.getGroups.emit();
-            console.log('Timer message running')
-            await this.serverLongPull();
-          }
-
-        }
-        else {
-          alert('HEY2')
-          // Got message
-          //let message = await response.text();
-          //this.loadMessages()
-          await this.serverLongPull();
-        }
-      }, (error) => {
-        console.log(error);
-        this.serverLongPull();
-      });
-    }
-  }
-

  sliderOpts = {
    zoom: false,
@@ -2,11 +2,9 @@
  <ion-toolbar class="header-toolbar">
    <div class="main-header">
      <div class="header-top">
-        <div class="middle" *ngFor="let users of dmUsers">
-          <ion-label class="title">{{users.name}}</ion-label>
-          <span>
-            <ion-icon class="{{users.status}}" name="ellipse"></ion-icon>
-          </span>
+        <div class="middle">
+          <ion-label class="title">{{ wsChatMethodsService.getDmRoom(roomId).name }}</ion-label>
+          <!-- <span><ion-icon class="{{users.status}}" name="ellipse"></ion-icon></span> -->
        </div>
        <div hidden class="right">
          <button class="btn-no-color" (click)="_openMessagesOptions()">
@@ -41,7 +39,7 @@
  </ion-refresher>
  <div class="messages" #scrollMe>
    <div class="messages-list-item-wrapper container-width-100" *ngFor="let msg of messages; let last = last">
-      <div class='message-item incoming-{{msg.u.username!=loggedUser.me.username}} max-width-45'>
+      <div class='message-item incoming-{{msg.u.username!=loggedUser.me.username}} max-width-45' *ngIf="msg.msg !=''">
        <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>
@@ -23,6 +23,8 @@ import { StorageService } from 'src/app/services/storage.service';
 import { Directory, Filesystem } from '@capacitor/filesystem';
 import { ViewEventPage } from 'src/app/modals/view-event/view-event.page';
 import { Storage } from '@ionic/storage';
+import { WsChatMethodsService} from 'src/app/services/chat/ws-chat-methods.service'
+import { WsChatService } from 'src/app/services/chat/ws-chat.service'

 const IMAGE_DIR = 'stored-images';
@Component({
@@ -86,30 +88,31 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
    private sqliteservice: SqliteService,
    private storageservice: StorageService,
    private router: Router,
-    private storage: Storage
+    private storage: Storage,
+    public wsChatMethodsService: WsChatMethodsService,
+    public WsChatService: WsChatService
  ) {
+
    this.loggedUser = authService.ValidatedUserChat['data'];

-    /*  this.dm = this.navParams.get('dm'); */
  }
  ngOnChanges(changes: SimpleChanges): void {
-    this.load();
+    this.wsChatMethodsService.getDmRoom(this.roomId).loadHistory()

-    //throw new Error('Method not implemented.');
+    this.wsChatMethodsService.getDmRoom(this.roomId).scrollDown = this.scrollToBottomClicked
+    this.getMessageDB();
+
+    setTimeout(()=>{
+      this.scrollToBottomClicked()
+    }, 50)
+    
+    
  }

  ngOnInit() {
-
    this.scrollToBottom();
-
-    /* setInterval(()=>{ */
-    this.load();
-    /* }, 9000); */
-    console.log(this.roomId);
-    console.log("Chat route", this.route.url)
-
    this.setStatus('online');
-    this.getMessageDB();
+    
  }

  onPressingMessage() {
@@ -153,7 +156,7 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
    ev.target.complete();
  }

-  scrollToBottom(): void {
+  scrollToBottom = () => {
    try {
      if (this.scrollingOnce) {
        this.myScrollContainer.nativeElement.scrollTop = this.myScrollContainer.nativeElement.scrollHeight;
@@ -162,7 +165,8 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
    } catch (err) { }
  }

-  scrollToBottomClicked(): void {
+  scrollToBottomClicked = () => {
+    console.log('scroll')
    try {
      this.myScrollContainer.nativeElement.scrollTop = this.myScrollContainer.nativeElement.scrollHeight;
      //this.scrollingOnce = false;
@@ -234,20 +238,11 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
  }

  sendMessage() {
-    let body = {
-      "message":
-      {
-        "rid": this.roomId, "msg": this.message,
-      }
-    }
-
-    this.chatService.sendMessage(body).subscribe(res => {
-      this.scrollingOnce = true;
-    });
+    this.wsChatMethodsService.getDmRoom(this.roomId).send(this.message)
    this.message = "";
  }

-  deleteMessage(msgId: string) {
+  deleteMessage(msgId:string) {
    let body = {
      "roomId": this.roomId,
      "msgId": msgId,
@@ -259,22 +254,23 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
    }); */
  }

-
  getMessageDB() {
    this.storage.get('chatmsg').then((msg) => {
      console.log('FROM DB WEB', msg)
      let msgArray = [];
      msgArray = msg;
      msgArray.filter(data => data._id != this.roomId);
-      this.messages = msgArray.reverse();
+      this.messages = msgArray;
      console.log("MSG CHAT WEB", this.messages)
    })

  }

  async transformData(res) {
+    
    let mgsArray = [];
-    res.map(async element => {
+    res.forEach(async element => {
+      console.log('TRANSFORM DATA ELEMENT' ,element)

      if (element.file) {
        if (element.file.guid) {
@@ -342,29 +338,13 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy

  }

-  loadMessages() {
-    //this.showLoader = true;
-    const roomId = this.roomId
-    this.chatService.getRoomMessages(this.roomId).subscribe(async res => {
-      console.log('ALL MSG FROM CHATROCK', res);
-      await this.transformData(res['messages']);
-      //this.getFileFromLakeFS();
-      /* this.messages = res['messages'].reverse();
-      this.chatMessageStore.add(roomId, this.messages) */
+  async viewDocument(msg:any, url?:string){
+    if(msg.file.type == "application/img"){
+      let response:any = await this.fileService.getFile(msg.file.guid).toPromise();
+      console.log(response);
+      alert(response);

-      console.log(this.messages);
-      //this.serverLongPull(res)
-      /* this.chatService.subscribe(this.roomId).then(res => {
-        console.log("Real fake msg", res)
-      }); */
-      //this.showLoader = false;
-    })
-  }
-
-  async viewDocument(msg: any, url?: string) {
-    console.log('FILE TYPE', msg.file.type)
-    if (msg.file.type == "application/img") {
-      this.downloadFileMsg(msg)
+      //this.openPreview(msg);

    }
    else if (msg.file.type == "application/webtrix") {
@@ -633,7 +613,6 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
        this.showLoader = false;
        //this.addDocGestaoDocumental();
      }
-      this.loadMessages();

    });
  }
@@ -646,43 +625,35 @@ export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy
      console.log('serverLongPull', res['success']);


-      if (res['success'] == true) {
-        // Show Error
-        //showMessage(response.statusText);
-        console.log('ALL MSG FROM CHATROCK', res);
-        /* this.transformData(res['messages']);*/
-        await this.transformData(res['messages']);
-        this.getMessageDB();
+     if (res['success'] == true) {
+      // Show Error
+      //showMessage(response.statusText);
+      /* this.messages = res['messages'].reverse();
+      this.chatMessageStore.add(roomId, this.messages) */
+      console.log('MSG FROM ROCKET ', res['messages'].reverse())
+      /* this.transformData(res['messages'].reverse());
+      this.getMessageDB(); */

-        /* 
-        this.messages = res['messages'].reverse();
-        this.chatMessageStore.add(roomId, this.messages) */
-
-        //console.log(this.messages);
-        // Reconnect in one second
-        if (this.route.url != "/home/chat") {
-          console.log("Timer message stop")
+      //console.log(this.messages);
+      // Reconnect in one second
+      if(this.route.url != "/home/chat"){
+        console.log("Timer message stop")
+      }
+      else{
+        if(document.querySelector('app-messages')){
+          await new Promise(resolve => setTimeout(resolve, 5000));
+          // await this.serverLongPull();
+          this.getDirectMessages.emit();
+          console.log('Timer message running')
        }
-        else {
-          if (document.querySelector('app-messages')) {
-            await new Promise(resolve => setTimeout(resolve, 5000));
-            await this.serverLongPull();
-            this.getDirectMessages.emit();
-            console.log('Timer message running')
-          }
-        }
-      } /* else {
-      // Got message
-      //let message = await response.text();
-      //this.loadMessages()
-      await this.serverLongPull();
-    } */
-    }, (error) => {
-      console.log(error);
-      this.serverLongPull();
-
-    });
-  } sliderOpts = {
+      } 
+    }
+  }, (error) => {
+    console.log(error);
+  });
+  
+  }
+  sliderOpts = {
    zoom: false,
    slidesPerView: 1.5,
    spaceBetween: 20,