mrtoth/frontend-tutorial-framework
1
0
Fork 0
mirror of https://github.com/avatao-content/frontend-tutorial-framework synced 2025-07-01 07:06:22 +00:00
Code Issues Releases Wiki Activity

Move scrolling logic to MessagesComponent

Browse Source
This commit is contained in:
Kristóf Tóth
2019-10-03 13:04:32 +02:00
parent d6874335cd
commit 25433a1ccd
3 changed files with 14 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
src/app/messages/messages.component.ts
View File

@ -1,4 +1,4 @@
import { ChangeDetectorRef, Component, OnInit, EventEmitter, Output } from '@angular/core';
import { ChangeDetectorRef, Component, OnInit, EventEmitter, Output, ElementRef } from '@angular/core';
import { MessageData, Message } from '../message-types/bot-messages';
import { MarkdownService } from '../services/markdown.service';
import { WebSocketService } from '../services/websocket.service';
@ -19,7 +19,8 @@ export class MessagesComponent implements OnInit {
constructor(
private markdownService: MarkdownService,
private websocketService: WebSocketService,
private changeDetectorRef: ChangeDetectorRef
private changeDetectorRef: ChangeDetectorRef,
private ref: ElementRef
) {}
ngOnInit() {
@ -27,6 +28,7 @@ export class MessagesComponent implements OnInit {
message => {
this.writeMessage(message);
this.newMessageEvent.emit();
this.scrollToBottom();
});
this.websocketService.connect();
@ -41,6 +43,11 @@ export class MessagesComponent implements OnInit {
this.changeDetectorRef.detectChanges();
}
scrollToBottom() {
const element = this.ref.nativeElement.parentElement;
element.scrollTop = element.scrollHeight;
}
transformMessage(message: MessageData) {
message.message = this.convertMarkdownToHTML(message.message);
if (!message.timestamp) {