Advertisement
Guest User

Untitled

a guest
Jun 23rd, 2017
45
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. /**
  2.  * Created by heghe on 6/6/17.
  3.  */
  4.  
  5. const REQUEST_INTERVAL = 10000; // 1000 = 1 second
  6. const ACTIVE_REQUEST_INTERVAL = 1000;
  7.  
  8. let activeChat = null;
  9. let chats = [];
  10.  
  11. class chat {
  12.     constructor(matchId) {
  13.         this.matchId = matchId;
  14.         this.totalMessages = 0;
  15.         this.autoScroll = true;
  16.         this.active = false;
  17.         this.timer = null;
  18.         this.notified = null;
  19.         this.updateRequest();
  20.     }
  21.  
  22.     updateScroll() {
  23.         if (this.autoScroll) {
  24.             let element = document.getElementById('chat-div');
  25.             element.scrollTop = element.scrollHeight;
  26.         }
  27.     }
  28.  
  29.     updateRequest() {
  30.         if (this.active)
  31.             this.updateMessages();
  32.         else
  33.             this.notificationMessage();
  34.     }
  35.  
  36.     updateMessages() {
  37.         this.totalMessages = $('#chat-div > ul li').length;
  38.         let thisClass = this;
  39.         $.ajax({
  40.             type: 'POST',
  41.             url: '/messages',
  42.             contentType: 'application/json;charset=UTF-8',
  43.             data: JSON.stringify({
  44.                 active: thisClass.active,
  45.                 messageNumber: thisClass.totalMessages,
  46.                 match: thisClass.matchId
  47.             }),
  48.             complete: function (data) {
  49.                 $('#chat-div > ul').append(data.responseText);
  50.                 if (thisClass.autoScroll)
  51.                     thisClass.updateScroll();
  52.                 thisClass.timer = setTimeout(thisClass.updateRequest.bind(thisClass), ACTIVE_REQUEST_INTERVAL);
  53.             }
  54.         });
  55.     }
  56.  
  57.     notificationMessage() {
  58.         let thisClass = this;
  59.         $.ajax({
  60.             type: 'POST',
  61.             url: '/messages',
  62.             contentType: 'application/json;charset=UTF-8',
  63.             data: JSON.stringify({
  64.                 active: thisClass.active,
  65.                 messageNumber: thisClass.totalMessages,
  66.                 match: thisClass.matchId
  67.             }),
  68.             complete: function (data) {
  69.                 if (thisClass.autoScroll)
  70.                     thisClass.updateScroll();
  71.                 if (data.responseText !== "" && !thisClass.notified) {
  72.                     thisClass.notified = true;
  73.                     $('#title' + thisClass.matchId).find(".pull-right").append('<span class="label label-primary notification" style="display: block; font-size: 2.7vh">New message</span>');
  74.                 }
  75.                 if (!thisClass.notified)
  76.                     thisClass.timer = setTimeout(thisClass.updateRequest.bind(thisClass), REQUEST_INTERVAL);
  77.             }
  78.         });
  79.     }
  80. }
  81. function openChat(userId) {
  82.     $('#chat-div').collapse('show'); //activate chat and reset messages
  83.     for (let _chat of chats) {
  84.         if (_chat.matchId === userId) {
  85.             activeChat = _chat;
  86.             activeChat.active = true;
  87.             $('#title' + activeChat.matchId + ' > .notification').remove();
  88.             clearTimeout(activeChat.timer);
  89.             activeChat.updateRequest();
  90.             break
  91.         }
  92.     }
  93. }
  94.  
  95. $('document').ready(function () {
  96.     $('#profile-div').children('.collapse').each(function () {
  97.         if ($(this).attr('id') !== 'chat-div') {
  98.             let _chat = new chat($(this).attr('id'));
  99.             chats.push(_chat);
  100.         }
  101.     });
  102.     console.log(chats.length);
  103. });
  104. $(function () {
  105.     $('.div-match').click(function () {
  106.         if (activeChat != null) {
  107.             clearTimeout(activeChat.timer);
  108.             activeChat.active = false;
  109.             activeChat.notified = false;
  110.             activeChat.timer = setTimeout(activeChat.updateRequest.bind(activeChat), REQUEST_INTERVAL);
  111.             activeChat = null;
  112.         }
  113.         $('#chat-div > ul').empty();
  114.         $('#chat-div').collapse('hide');
  115.     })
  116. });
  117. $('#send-message').submit(function (e) {
  118.     $.ajax({
  119.         type: 'POST',
  120.         url: '/chat/' + activeChat.matchId,
  121.         data: $("#send-message").serialize(), // serializes the form's elements.
  122.         success: function (data) {
  123.         }
  124.     });
  125.     $('#send-message')[0].reset();
  126.     e.preventDefault();
  127. });
  128.  
  129. $('#chat-div').on('scroll', function () {
  130.     let element = document.getElementById('chat-div');
  131.     console.log(element.scrollHeight, element.scrollTop, activeChat.autoScroll);
  132.     if (element.scrollTop != element.scrollHeight)
  133.         activeChat.autoScroll = false;
  134.     if (element.scrollHeight - element.scrollTop <= 570)
  135.         activeChat.autoScroll = true;
  136. });
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement