save

src/app/shared/chat/group-messages/group-messages.page.html

@@ -36,8 +36,8 @@
     <ion-label> {{message}} Esta conversa passou a grupo</ion-label><br />
     <ion-label>A conversa original mantêm-se como chat individual</ion-label>
   </div>
-  <div class="messages">
-    <div class="container-width-100" *ngFor="let msg of messages">
+  <div class="messages" #scrollMe>
+    <div class="container-width-100" *ngFor="let msg of messages" #scrollMe>
       <div *ngIf="msg.t != 'r'" class='incoming-{{msg.u.username!=loggedUser.me.username}} max-width-45'>
         <div class="title">
           <ion-label>{{msg.u.name}}</ion-label>
@@ -68,7 +68,7 @@
     <div class="width-80">
       <ion-item class="ion-no-padding type-message" lines="none">
         <ion-textarea clearOnEdit="true" placeholder="Escrever uma mensagem" auto-grow class="message-input" rows="1" [(ngModel)]="message"></ion-textarea>
-        <button class="btn-no-color" (click)="notImplemented()">
+        <button class="btn-no-color">
           <ion-icon slot="end" src="assets/icon/icons-chat-mic.svg"></ion-icon>
         </button>
       </ion-item>

src/app/shared/chat/group-messages/group-messages.page.ts

@@ -1,4 +1,4 @@
-import { Component, OnChanges, OnInit, Input, SimpleChanges, Output, EventEmitter} from '@angular/core';
+import { Component, OnChanges, OnInit, Input, SimpleChanges, Output, EventEmitter, ViewChild, ElementRef, AfterViewChecked} from '@angular/core';
 import { ActionSheetController, AnimationController, MenuController, ModalController, PopoverController } from '@ionic/angular';
 import { AlertService } from 'src/app/services/alert.service';
 import { AuthService } from 'src/app/services/auth.service';
@@ -14,7 +14,7 @@ import { GroupContactsPage } from './group-contacts/group-contacts.page';
   templateUrl: './group-messages.page.html',
   styleUrls: ['./group-messages.page.scss'],
 })
-export class GroupMessagesPage implements OnInit, OnChanges {
+export class GroupMessagesPage implements OnInit, OnChanges, AfterViewChecked {
   showLoader: boolean;
   isGroupCreated:boolean;
   loggedUser: any;
@@ -34,6 +34,8 @@ export class GroupMessagesPage implements OnInit, OnChanges {
   @Output() openGroupContacts:EventEmitter<any> = new EventEmitter<any>();
   @Output() openEditGroupPage:EventEmitter<any> = new EventEmitter<any>();
 
+  @ViewChild('scrollMe') private myScrollContainer: ElementRef;
+
   constructor(
     private menu: MenuController,
     private modalController: ModalController,
@@ -49,6 +51,7 @@ export class GroupMessagesPage implements OnInit, OnChanges {
   }
   ngOnChanges(changes: SimpleChanges): void {
     this.getRoomInfo();
+    this.scrollToBottom();
   }
 
   ngOnInit() {
@@ -57,8 +60,16 @@ export class GroupMessagesPage implements OnInit, OnChanges {
     console.log(this.roomId);
   }
 
-  notImplemented(){
-    this.alertService.presentAlert('Funcionalidade em desenvolvimento');
+  ngAfterViewChecked() {
+    this.scrollToBottom();
+  }
+
+  scrollToBottom(): void {
+    try {
+      this.myScrollContainer.nativeElement.scrollTop = this.myScrollContainer.nativeElement.scrollHeight;
+    } catch(err) { }
+    finally {
+    }
   }
 
   openGroupContactsPage(){
@@ -73,6 +84,7 @@ export class GroupMessagesPage implements OnInit, OnChanges {
     this.getRoomInfo();
     ev.target.complete();
   }
+
   get watch(){
     this.getRoomInfo();
     console.log('here watching');

src/app/shared/chat/messages/messages.page.ts

@@ -45,15 +45,14 @@ export class MessagesPage implements OnInit, AfterViewChecked, OnChanges {
    /*  this.dm = this.navParams.get('dm'); */
   }
   ngOnChanges(changes: SimpleChanges): void {
-    console.log(this.roomId);
-    this.load();
+    //this.load();
 
     //throw new Error('Method not implemented.');
   }
 
   ngOnInit() {
 
-    //this.scrollToBottom();
+    this.scrollToBottom();
 
     /* setInterval(()=>{ */
       this.load();
@@ -79,20 +78,17 @@ export class MessagesPage implements OnInit, AfterViewChecked, OnChanges {
   }
 
   ngAfterViewChecked() {
-    //this.scrollToBottom();
-    console.log(this.roomId);
+    this.scrollToBottom();
   }
-  /* scrollToBottom(): void {
-    const loader = this.toastService.loading()
 
+  scrollToBottom(): void {
     try {
       this.myScrollContainer.nativeElement.scrollTop = this.myScrollContainer.nativeElement.scrollHeight;
     } catch(err) { }
     finally {
-      loader.remove()
     }
+  }
 
-  } */
   loadMoreMessages(ev:any){
 
   }