newosinadjango/osinaweb/static/js/osichat-admin/conversation.js

const admin_chat_ws_scheme = window.location.protocol === "https:" ? "wss" : "ws";
const protocol = window.location.protocol === "https:" ? "https" : "http";
const admin_chat_domain = "osina.ositcom.com";
let chatWebSocket;
const userId = document.getElementById('userId').textContent.trim();


function handleChatRoomClick(event) {
    const sessionId = event.currentTarget.getAttribute('data-session');
    const chatId = event.currentTarget.getAttribute('data-chatid');
    if (sessionId && chatId) {
        openConversation(sessionId, chatId);
    } else {
        console.error('Session ID not found for this chat room.');
    }
}

document.querySelectorAll('.chat-room').forEach(div => {
    div.addEventListener('click', handleChatRoomClick);
});

function appendTextAreaScript(domain, conversationContainer) {
    if (!document.querySelector(`script[src="${protocol}://${admin_chat_domain}/static/js/osichat-admin/textarea.js"]`)) {
        const textareaScript = document.createElement('script');
        textareaScript.type = 'text/javascript';
        textareaScript.src = `${protocol}://${admin_chat_domain}/static/js/osichat-admin/textarea.js`;
        conversationContainer.appendChild(textareaScript);
    }
}


function openConversation(sessionid, chatid) {
        if (chatWebSocket && chatWebSocket.readyState !== WebSocket.CLOSED) { //Close previous sockets
            chatWebSocket.close();
        }
        chatWebSocket = new WebSocket(`${admin_chat_ws_scheme}://${admin_chat_domain}/ws/osichat-admin/${sessionid}/${chatid}/`);
        chatWebSocket.onopen = function () {
            console.log('WebSocket connection to osichat established');
            chatWebSocket.send(JSON.stringify({ 'event_type': 'load_chat', 'client_type': 'website_admin' }));
        };
        function handleLoadChatEvent(data, chatWebSocket) {
            let chatDiv = document.getElementById('inner-conversation'); 
            chatDiv.innerHTML = data.html;
            appendTextAreaScript(admin_chat_domain, chatDiv);

            const sendMessageForm = document.querySelector('#sendMessage');
            sendMessageForm.addEventListener('submit', function (event) {
                event.preventDefault();
                const message = event.target.elements.message.value;
                const eventMessage = {
                    'event_type': 'send_message',
                    'message': message,
                    'user_id': userId
                };

                chatWebSocket.send(JSON.stringify(eventMessage));
                event.target.reset();
            });
        }

        chatWebSocket.onmessage = function (e) {
            const data = JSON.parse(e.data);
            switch (data.event_type) {
                case 'load_chat':
                    handleLoadChatEvent(data, chatWebSocket);
                    break;
                case 'send_message':
                    const messagesDiv = document.getElementById('messages_container');
                    messagesDiv.insertAdjacentHTML('beforeend', data.html);
                    if (!data.user) { // If it is sent by a guest play a notification sound for the guest
                        const notificationSound = document.getElementById('notification-sound');
                        notificationSound.play();
                    }
                    break;
                default:
                    console.log('Unknown event type:', data.event_type);
            }
        };

        chatWebSocket.onclose = function () {
            console.log('WebSocket connection to osichat closed');
        };

        chatWebSocket.onerror = function (error) {
            console.error('WebSocket error:', error);
        };
}