angular.module('gosFrontend').controller('chatClientCtrl', ['$scope', '$http', '$timeout', '$window', function ($scope, $http, $timeout, $window) { $scope.chatSupport = { roomchat: JSON.parse($window.sessionStorage.getItem('gos_roomchat')) || { messages: [] }, is_connect: false, socket: null, messageInput: '', showChat: showChat, hideChat: hideChat, send: function ($event) { if ($event.keyCode === 13 && !$event.shiftKey) { $event.preventDefault(); send(); } } }; if ($scope.chatSupport.roomchat.isOpen) { showChat(); } function hideChat() { angular.element('#btnChat').show(); angular.element('#panelChat').hide(); $scope.chatSupport.roomchat.isOpen = false; saveSession(); } function showChat() { angular.element('#btnChat').hide(); angular.element('#panelChat').show(); angular.element("#messContent").focus(); $(function () { $("#ChatPanel").scrollTop($("#ChatPanel")[0].scrollHeight); }); $scope.chatSupport.roomchat.isOpen = true; if (!$scope.chatSupport.is_connect) { $scope.chatSupport.is_connect = true; $scope.chatSupport.socket = io.connect(window.socket_host + '/socket-chat-support-frontend', { query: 'roomchat=' + ($scope.chatSupport.roomchat.room || ''), 'force new connection': true }); init($scope.chatSupport.socket); } } function saveSession() { var roomchatToSave = _.cloneDeep($scope.chatSupport.roomchat); for (var i = 0; i < roomchatToSave.messages.length;) { if (roomchatToSave.messages[i].type || roomchatToSave.messages[i].no_user) { roomchatToSave.messages.splice(i, 1); } else { delete roomchatToSave.messages[i].$$hashKey; i++; } } $window.sessionStorage.setItem('gos_roomchat', JSON.stringify(roomchatToSave)); } function init(socket) { socket.on('onready', function (data) { $timeout(function () { $scope.chatSupport.roomchat.room = data.room; if (data.message === 'MSG_WELCOME') { $scope.chatSupport.roomchat.fullname = data.fullname; $scope.chatSupport.roomchat.avatar = data.avatar || '/img/cs.png'; $scope.chatSupport.roomchat.is_online = true; $scope.chatSupport.roomchat.messages.push({ is_user_system: true, message: 'Em chào anh/chị, em có thể giúp được gì cho anh/chị không ạ?' }); saveSession(); } else if (data.message === 'NO_USER') { $scope.chatSupport.roomchat.is_online = false; $scope.chatSupport.roomchat.messages.push({ is_user_system: true, no_user: true, message: 'Hiện tại không có Nhân viên tư vấn nào online. Anh/chị xin vui lòng gửi câu hỏi tại <a href="/lien-he"> liên hệ</a>. Chúng tôi sẽ giải đáp sớm nhất có thể. Thân !' }); } }, 0); }); socket.on('message', function (data) { $timeout(function () { if ($scope.chatSupport.roomchat.messages[$scope.chatSupport.roomchat.messages.length - 1].type) { $scope.chatSupport.roomchat.messages.splice($scope.chatSupport.roomchat.messages.length - 1, 1); } $scope.chatSupport.roomchat.messages.push({ is_user_system: data.is_user_system, message: data.message }); saveSession(); $(function () { $('#ChatPanel').animate({ scrollTop: $("#ChatPanel")[0].scrollHeight }, 500); }); }); }); socket.on('disconnected', function (data) { $timeout(function () { if (!data.is_online) { $scope.chatSupport.roomchat.is_online = false; } if ($scope.chatSupport.roomchat.messages[$scope.chatSupport.roomchat.messages.length - 1].type) { $scope.chatSupport.roomchat.messages[$scope.chatSupport.roomchat.messages.length - 1].type = 'disconnect'; } else { $scope.chatSupport.roomchat.messages.push({ type: 'disconnect' }); } $(function () { $('#ChatPanel').animate({ scrollTop: $("#ChatPanel")[0].scrollHeight }, 500); }); }); }); socket.on('reconnect', function (data) { $timeout(function () { $scope.chatSupport.roomchat.is_online = true; if ($scope.chatSupport.roomchat.messages[$scope.chatSupport.roomchat.messages.length - 1].type) { $scope.chatSupport.roomchat.messages[$scope.chatSupport.roomchat.messages.length - 1].type = 'reconnect'; } else { $scope.chatSupport.roomchat.messages.push({ type: 'reconnect' }); } $(function () { $('#ChatPanel').animate({ scrollTop: $("#ChatPanel")[0].scrollHeight }, 500); }); }); }); } function send() { angular.element("#messContent").focus(); if ($scope.chatSupport.messageInput.length > 0) $scope.chatSupport.socket.emit('message', { room: $scope.chatSupport.roomchat.room, message: $scope.chatSupport.messageInput, }); $scope.chatSupport.messageInput = ''; }; }])