fix scrolling

This commit is contained in:
tiago.kayaya
2021-08-23 16:31:06 +01:00
parent 276febdf71
commit e0f68c9706
10 changed files with 242 additions and 56 deletions
+45 -12
View File
@@ -1,4 +1,4 @@
import { AfterViewChecked, Component, ElementRef, EventEmitter, Input, OnChanges, OnInit, Output, SimpleChanges, ViewChild } from '@angular/core';
import { AfterViewChecked, AfterViewInit, Component, ElementRef, EventEmitter, Input, OnChanges, OnDestroy, OnInit, Output, SimpleChanges, ViewChild } from '@angular/core';
import { AnimationController, ModalController, PopoverController } from '@ionic/angular';
import { AlertService } from 'src/app/services/alert.service';
import { AuthService } from 'src/app/services/auth.service';
@@ -16,7 +16,7 @@ import { ChatOptionsFeaturesPage } from 'src/app/modals/chat-options-features/ch
templateUrl: './messages.page.html',
styleUrls: ['./messages.page.scss'],
})
export class MessagesPage implements OnInit, AfterViewChecked, OnChanges {
export class MessagesPage implements OnInit, OnChanges, AfterViewInit, OnDestroy {
showLoader: boolean;
@ViewChild('scrollMe') private myScrollContainer: ElementRef;
@@ -37,7 +37,11 @@ export class MessagesPage implements OnInit, AfterViewChecked, OnChanges {
@Output() openNewEventPage:EventEmitter<any> = new EventEmitter<any>();
connection = connection
connection = connection;
scrollingOnce:boolean = true;
private scrollChangeCallback: () => void;
currentPosition: any;
startPosition: number;
constructor(
public popoverController: PopoverController,
@@ -70,11 +74,17 @@ export class MessagesPage implements OnInit, AfterViewChecked, OnChanges {
console.log(this.roomId);
console.log("Chat route", this.route.url)
this.setStatus('online');
}
ngOnDestroy(){
this.checktimeOut = false;
console.log('On Destroy')
setStatus(status:string){
let body = {
message: '',
status: status,
}
this.chatService.setUserStatus(body).subscribe(res => {
console.log(res);
})
}
notImplemented(){
@@ -93,16 +103,38 @@ export class MessagesPage implements OnInit, AfterViewChecked, OnChanges {
ev.target.complete();
}
ngAfterViewChecked() {
//this.scrollToBottom();
}
scrollToBottom(): void {
try {
this.myScrollContainer.nativeElement.scrollTop = this.myScrollContainer.nativeElement.scrollHeight;
if(this.scrollingOnce){
this.myScrollContainer.nativeElement.scrollTop = this.myScrollContainer.nativeElement.scrollHeight;
//this.scrollingOnce = false;
}
} catch(err) { }
finally {
}
ngAfterViewInit() {
this.scrollChangeCallback = () => this.onContentScrolled(event);
window.addEventListener('scroll', this.scrollChangeCallback, true);
}
onContentScrolled(e) {
this.startPosition = e.srcElement.scrollTop;
let scroll = e.srcElement.scrollTop;
if (scroll > this.currentPosition) {
//this.showButton = false;
//alert('BOTTOM');
} else {
//this.showButton = true;
//alert('UP');
this.scrollingOnce = false;
}
this.currentPosition = scroll;
}
ngOnDestroy() {
this.checktimeOut = false;
this.setStatus('away');
window.removeEventListener('scroll', this.scrollChangeCallback, true);
}
openBookMeetingComponent(){
@@ -125,6 +157,7 @@ export class MessagesPage implements OnInit, AfterViewChecked, OnChanges {
}
this.chatService.sendMessage(body).subscribe(res=> {
this.scrollingOnce = true;
});
this.message = "";
}