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

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

// FUNCTIONS TO SHOW & HIDE THE LOADER
function showLoader() {
    const roomsLoader = document.getElementById('roomsLoader');
    if (roomsLoader) {
        roomsLoader.classList.remove('hidden');
    }
}

function hideLoader() {
    const roomsLoader = document.getElementById('roomsLoader');
    if (roomsLoader) {
        roomsLoader.classList.add('hidden');
    }
}


function appendInnerConversationScript(div) {
    const innerConversationScript = document.createElement('script');
    innerConversationScript.type = 'text/javascript';
    innerConversationScript.src = `${protocol}://${admin_chat_domain}/static/js/osichat-admin/inner-conversation.js`;
    div.appendChild(innerConversationScript);
}





function getRooms(){
    osichatroomsSocket = new WebSocket(`${admin_chat_ws_scheme}://${admin_chat_domain}/ws/osichat/rooms/`);

    osichatroomsSocket.onopen = function () {
        console.log('WebSocket connection to rooms established');
        hideLoader();
        osichatroomsSocket.send(JSON.stringify({
            'event_type': 'set_client_type',
            'client_type': 'website_admin',
            'user_id': userId
        }));
    };

    osichatroomsSocket.onmessage = function (e) {
        const data = JSON.parse(e.data);
        const leftDiv = document.getElementById('widgetLeftSide');
        switch (data.event_type) {
            case 'get_chats':
                leftDiv.innerHTML = data.html;
                appendInnerConversationScript(leftDiv);
                break;
            case 'new_update':
                    const roomsContainer = document.getElementById('chatrooms');
                    const chatRoomDiv = roomsContainer.querySelector(`.chat-room[data-roomid='${data.chatroom_id}']`);
        
                    if (chatRoomDiv) {
                        chatRoomDiv.remove();  // Remove the existing chat room div
                    }

                    // Insert the new chat room HTML at the top of the container
                    const newChatRoomDiv = document.createElement('div');
                    newChatRoomDiv.innerHTML = data.html;
                    roomsContainer.insertAdjacentElement('afterbegin', newChatRoomDiv.firstElementChild);

                    if (parseInt(currentChatId) === parseInt(data.chatroom_id)) { 
                        const unreadIndicator = roomsContainer.querySelector(`.unread[data-roomid='${data.chatroom_id}']`);
                        if (unreadIndicator) {
                            unreadIndicator.classList.add('hidden');  
                        }
                        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();

                        }
                    } else {
                        const unreadIndicator = roomsContainer.querySelector(`.unread[data-roomid='${data.chatroom_id}']`);
                        if (unreadIndicator) {
                            unreadIndicator.classList.remove('hidden');  
                        }
                        if (!data.user) { // If it is sent by a guest play a notification sound for the guest
                            const notificationSound = document.getElementById('out-notification-sound');
                            notificationSound.play();
                        }
                    }


                    appendInnerConversationScript(leftDiv);
                    break;
        
            default:
                console.log('Unknown event type:', data.event_type);
        }
    };

    osichatroomsSocket.onclose = function () {
        showLoader();
        setTimeout(() => {
            console.log('Attempting to reconnect to WebSocket...');
            getRooms();
        }, 2000);
    };

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

    window.addEventListener('offline', () => {
        showLoader();
        if (osichatroomsSocket) {
            osichatroomsSocket.close();
        }
    });

}

getRooms();