src/client/chat.ts

   1 import $ from 'jquery';
   2 import {Socket} from 'socket.io-client';
   3 import {Message} from '../shared/message';
   4 import { configureDiscordChat } from './discord';
   5
   6 // disable chat temporarily to test widgetbot
   7 let socket: Socket;
   8
   9 function renderChatHistory(messages: Message[]) {
  10   $('#chat-messages').html(messages.map(msg => {
  11     return `<div class="chat-message" title="${new Date(parseInt(msg.sentAt))}" id="${msg.id}">
  12     <span class="from">${msg.from}</span>
  13     <span class="message">${msg.msg}</span>
  14     </div>`;
  15
  16   }).join("\n"));
  17   $('#chat-messages').scrollTop($('#chat-messages')[0].scrollHeight);
  18 }
  19
  20 function renderChatMessage(msg: Message) {
  21   $('#chat-messages').append(`<div class="chat-message" title="${new Date(parseInt(msg.sentAt))}" id="${msg.id}">
  22                              <span class="from">${msg.from}</span>
  23                              <span class="message">${msg.msg}</span>
  24                              </div>`);
  25                              $('#chat-messages').scrollTop($('#chat-messages')[0].scrollHeight);
  26 }
  27
  28 function configureStandardChat() {
  29   socket.on('chathistory', renderChatHistory);
  30   socket.on('chat', renderChatMessage);
  31
  32   // bind HTML event
  33   $('#chat-form').on('submit', e => {
  34     e.preventDefault();
  35     e.stopPropagation();
  36
  37     const msg = $('#message').val().toString();
  38
  39     if(msg.length > 0) {
  40       socket.emit('chat', msg);
  41       $('#message').val('');
  42     }
  43   });
  44 }
  45
  46 export function configureChat(_socket: Socket) {
  47   // disable chat temporarily to test discord chat
  48   socket = _socket;
  49
  50   //configureDiscordChat(socket);
  51   configureStandardChat();
  52
  53   console.log('Chat Configured');
  54 }