diff --git a/src/app/message-types/message-metadata.ts b/src/app/message-types/message-metadata.ts new file mode 100644 index 0000000..301764a --- /dev/null +++ b/src/app/message-types/message-metadata.ts @@ -0,0 +1,7 @@ +// Copyright (C) 2018 Avatao.com Innovative Learning Kft. +// All Rights Reserved. See LICENSE file for details. + +export class MessageMetadata { + originator: string; + timestamp: Date; +} diff --git a/src/app/message-types/message-queue-message.ts b/src/app/message-types/message-queue-message.ts new file mode 100644 index 0000000..540cebb --- /dev/null +++ b/src/app/message-types/message-queue-message.ts @@ -0,0 +1,8 @@ +// Copyright (C) 2018 Avatao.com Innovative Learning Kft. +// All Rights Reserved. See LICENSE file for details. + +import { MessagesMessage } from './messages-message'; + +export class MessageQueueMessage { + messages: Array; +} diff --git a/src/app/message-types/messages-message.ts b/src/app/message-types/messages-message.ts index d8b1d0a..0894522 100644 --- a/src/app/message-types/messages-message.ts +++ b/src/app/message-types/messages-message.ts @@ -1,8 +1,8 @@ // Copyright (C) 2018 Avatao.com Innovative Learning Kft. // All Rights Reserved. See LICENSE file for details. -export class MessagesMessage { - originator: string; - timestamp: Date; +import { MessageMetadata } from './message-metadata'; + +export class MessagesMessage extends MessageMetadata { message: string; } diff --git a/src/app/messages/messages.component.ts b/src/app/messages/messages.component.ts index 17fc2ff..ee0c52d 100644 --- a/src/app/messages/messages.component.ts +++ b/src/app/messages/messages.component.ts @@ -9,6 +9,7 @@ import { MessagesMessage } from '../message-types/messages-message'; import { MessagesControlCommand } from '../message-types/messages-control-command'; import { config } from '../config'; import { CommandMessage } from '../message-types/command-message'; +import { MessageQueueMessage } from '../message-types/message-queue-message'; @Component({ selector: 'app-messages', @@ -17,6 +18,7 @@ import { CommandMessage } from '../message-types/command-message'; }) export class MessagesComponent implements OnInit { messages: MessagesMessage[] = []; + messageQueueAttender: MessageQueueAttender; showNextButton: boolean = config.messages.showNextButton; command_handlers = { @@ -27,13 +29,18 @@ export class MessagesComponent implements OnInit { private markdownService: MarkdownService, private websocketService: WebSocketService, private changeDetectorRef: ChangeDetectorRef - ) {} + ) { + this.messageQueueAttender = new MessageQueueAttender(this.messages); + } ngOnInit() { this.websocketService.connect(); this.websocketService.observeKey('message').subscribe( (event) => this.handleMessage(event.data) ); + this.websocketService.observeKey('queueMessages').subscribe( + (event) => this.handleQueueMessage(event.data) + ); this.websocketService.observeKey('messagecontrol').subscribe( (event) => this.command_handlers[event.data.command](event.data) ); @@ -45,6 +52,10 @@ export class MessagesComponent implements OnInit { this.changeDetectorRef.detectChanges(); } + handleQueueMessage(data: MessageQueueMessage) { + this.messageQueueAttender.queueMessages(data.messages); + } + convert(text: string) { return this.markdownService.convertToHtml(text); } @@ -57,3 +68,45 @@ export class MessagesComponent implements OnInit { this.websocketService.sendJSON({key: '', trigger: 'step_next'}); } } + + +class MessageQueueAttender { + private readonly charPerSecond: number; + private lastMessageLength = 0; + private queue: MessagesMessage[] = []; + + constructor(private destArray: Array, wordPerMinute: number = 150) { + const charPerMinute = wordPerMinute * 5; + this.charPerSecond = charPerMinute / 60; + } + + queueMessages(messages: Array) { + this.queue = this.queue.concat(messages); + this.attendQueue(); + } + + private processMessage() { + if (this.queue.length > 0) { + const lastMessage = this.queue.shift(); + this.lastMessageLength = lastMessage.message.length; + this.destArray.push(lastMessage); + } + if (this.queue.length === 0) { + this.lastMessageLength = 0; + } + } + + private attendQueue() { + if (this.queue.length > 0) { + const timeoutSeconds = this.lastMessageLength / this.charPerSecond; + setTimeout( + () => { + this.processMessage(); + this.attendQueue(); + console.log(timeoutSeconds); + }, + timeoutSeconds * 1000 + ); + } + } +}