KOKINIO - MANAGER
Edit File: readyChat.js
/* * Document : readyChat.js * Author : pixelcave * Description: Custom javascript code used in Chat page */ var ReadyChat = function() { var chatHeight = 600; // Default chat container height in large screens var chatHeightSmall = 300; // Default chat components (talk & people) height in small screens /* Cache some often used variables */ var chatCon = $('.chatui-container'); var chatTalk = $('.chatui-talk'); var chatTalkScroll = $('.chatui-talk-scroll'); var chatPeople = $('.chatui-people'); var chatPeopleScroll = $('.chatui-people-scroll'); var chatInput = $('.chatui-input'); var chatMsg = ''; /* Updates chat UI components height */ var updateChatHeight = function(){ var windowW = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth; if (windowW < 768) { // On small screens chatCon .css('height', (chatHeightSmall * 2) + chatInput.outerHeight()); chatTalk .add(chatTalkScroll) .add(chatTalkScroll.parent()) .add(chatPeople) .add(chatPeopleScroll) .add(chatPeopleScroll.parent()) .css('height', chatHeightSmall); } else if (windowW > 767) { // On large screens chatCon .css('height', chatHeight); chatTalk .add(chatTalkScroll) .add(chatTalkScroll.parent()) .css('height', chatHeight - chatInput.outerHeight()); chatPeople .add(chatPeopleScroll) .add(chatPeopleScroll.parent()) .css('height', chatHeight); } }; return { init: function() { // Initialize default chat height updateChatHeight(); // Update chat UI components height on window resize $(window).resize(function(){ updateChatHeight(); }); // Initialize scrolling on chat talk + people chatTalkScroll .slimScroll({ height: chatTalk.outerHeight(), color: '#000', size: '3px', position: 'right', touchScrollStep: 100 }); chatPeopleScroll .slimScroll({ height: chatPeople.outerHeight(), color: '#fff', size: '3px', position: 'right', touchScrollStep: 100 }); // When the chat message form is submitted chatInput .find('form') .submit(function(e){ // Get text from message input chatMsg = chatInput.find('#chatui-message').val(); // If the user typed a message if (chatMsg) { // Add it to the message list chatTalk .find('ul') .append('<li class="chatui-talk-msg chatui-talk-msg-highlight themed-border animation-expandUp">' + '<img src="img/placeholders/avatars/avatar2.jpg" alt="Avatar" class="img-circle chatui-talk-msg-avatar">' + $('<div />').text(chatMsg).html() + '</li>'); // Scroll the message list to the bottom chatTalkScroll .animate({ scrollTop: chatTalkScroll[0].scrollHeight },150); // Reset the message input chatInput .find('#chatui-message') .val(''); } // Don't submit the message form e.preventDefault(); }); } }; }();