forked from ng-book/angular2-rxjs-chat
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathchat-window.component.ts
79 lines (68 loc) · 2.01 KB
/
chat-window.component.ts
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
import {
Component,
Inject,
ElementRef,
OnInit,
ChangeDetectionStrategy
} from '@angular/core';
import { Observable } from 'rxjs';
import { User } from '../user/user.model';
import { UsersService } from '../user/users.service';
import { Thread } from '../thread/thread.model';
import { ThreadsService } from '../thread/threads.service';
import { Message } from '../message/message.model';
import { MessagesService } from '../message/messages.service';
@Component({
selector: 'chat-window',
templateUrl: './chat-window.component.html',
styleUrls: ['./chat-window.component.css'],
changeDetection: ChangeDetectionStrategy.OnPush
})
export class ChatWindowComponent implements OnInit {
messages: Observable<any>;
currentThread: Thread;
draftMessage: Message;
currentUser: User;
constructor(public messagesService: MessagesService,
public threadsService: ThreadsService,
public UsersService: UsersService,
public el: ElementRef) {
}
ngOnInit(): void {
this.messages = this.threadsService.currentThreadMessages;
this.draftMessage = new Message();
this.threadsService.currentThread.subscribe(
(thread: Thread) => {
this.currentThread = thread;
});
this.UsersService.currentUser
.subscribe(
(user: User) => {
this.currentUser = user;
});
this.messages
.subscribe(
(messages: Array<Message>) => {
setTimeout(() => {
this.scrollToBottom();
});
});
}
onEnter(event: any): void {
this.sendMessage();
event.preventDefault();
}
sendMessage(): void {
const m: Message = this.draftMessage;
m.author = this.currentUser;
m.thread = this.currentThread;
m.isRead = true;
this.messagesService.addMessage(m);
this.draftMessage = new Message();
}
scrollToBottom(): void {
const scrollPane: any = this.el
.nativeElement.querySelector('.msg-container-base');
scrollPane.scrollTop = scrollPane.scrollHeight;
}
}