peter/doneit-web
1
0
Fork 0
mirror of https://code.equilibrium.co.ao/ITO/doneit-web.git synced 2026-04-19 21:06:06 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix scrolling

Browse Source
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
Download Patch File Download Diff File Expand all files Collapse all files
src/app/pages/chat/messages/messages.page.ts
+50 -11
View File
@@ -1,4 +1,4 @@
import { AfterViewChecked, Component, ElementRef, OnInit, ViewChild } from '@angular/core';
import { AfterViewChecked, AfterViewInit, Component, ElementRef, OnDestroy, OnInit, ViewChild } from '@angular/core';
import {ActivatedRoute, Router} from '@angular/router'
import { ModalController, NavParams, PopoverController } from '@ionic/angular';
import { Status } from 'src/app/models/chat/status.model';
@@ -16,7 +16,7 @@ import { MessagesOptionsPage } from 'src/app/shared/popover/messages-options/mes
templateUrl: './messages.page.html',
styleUrls: ['./messages.page.scss'],
})
export class MessagesPage implements OnInit, AfterViewChecked {
export class MessagesPage implements OnInit, AfterViewInit, OnDestroy {
showLoader: boolean;
@ViewChild('scrollMe') private myScrollContainer: ElementRef;
@@ -30,8 +30,13 @@ export class MessagesPage implements OnInit, AfterViewChecked {
roomId:string;
el:any;
members:any;
scrollingOnce:boolean = true;
connection = connection
connection = connection;
private scrollChangeCallback: () => void;
currentPosition: any;
startPosition: number;
constructor(
public popoverController: PopoverController,
@@ -55,14 +60,23 @@ export class MessagesPage implements OnInit, AfterViewChecked {
ngOnInit() {
this.scrollToBottom();
/* setInterval(()=>{ */
this.load();
/* }, 9000); */
/* this.el = document.getElementById("scrollToBottom");
this.el.scrollTop = this.el.scrollHeight - this.el.scrollTop; */
this.setStatus('online');
}
setStatus(status:string){
let body = {
message: '',
status: status,
}
this.chatService.setUserStatus(body).subscribe(res => {
console.log(res);
})
}
notImplemented(){
@@ -83,16 +97,40 @@ export class MessagesPage implements OnInit, AfterViewChecked {
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) { }
}
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() {
window.removeEventListener('scroll', this.scrollChangeCallback, true);
}
sendMessage() {
let body = {
"message":
@@ -101,7 +139,8 @@ export class MessagesPage implements OnInit, AfterViewChecked {
}
}
this.chatService.sendMessage(body).subscribe(res=> {
this.loadMessages();
//this.loadMessages();
this.scrollingOnce = true;
});
this.message = "";
}