new
parent
671fbe34d3
commit
e9245d7849
Binary file not shown.
Binary file not shown.
Binary file not shown.
@ -1,88 +1,104 @@
|
|||||||
|
|
||||||
const chat_ws_scheme = window.location.protocol === "https:" ? "wss" : "ws";
|
const chat_ws_scheme = window.location.protocol === "https:" ? "wss" : "ws";
|
||||||
const domain = "192.168.1.106:8000";
|
const domain = "192.168.1.106:8000";
|
||||||
const osichatSocketUrl = `${chat_ws_scheme}://${domain}/ws/osichat/`;
|
console.log('hi')
|
||||||
const osichatSocket = new WebSocket(osichatSocketUrl);
|
// Function to fetch session ID
|
||||||
|
|
||||||
|
|
||||||
osichatSocket.onopen = () => {
|
async function fetchSessionID() {
|
||||||
console.log('WebSocket connection to osichat established');
|
try {
|
||||||
};
|
const response = await fetch('http://192.168.1.106:3000/get-client-session/');
|
||||||
|
const data = await response.json();
|
||||||
osichatSocket.onmessage = function (e) {
|
return data.session_id;
|
||||||
const data = JSON.parse(e.data);
|
} catch (error) {
|
||||||
if (data.event_type === 'load_chat') {
|
console.error('Error fetching session ID:', error);
|
||||||
const chatDiv = document.getElementById('osichat');
|
return 'Unknown';
|
||||||
const html = data.html;
|
|
||||||
chatDiv.innerHTML = html;
|
|
||||||
|
|
||||||
// Append the toggle tag
|
|
||||||
const script = document.createElement('script');
|
|
||||||
script.type = 'text/javascript';
|
|
||||||
script.src = `http://${domain}/static/js/osichat/chat-toggle.js`;
|
|
||||||
chatDiv.appendChild(script);
|
|
||||||
|
|
||||||
|
|
||||||
const startChatContainer = document.getElementById('startChat');
|
|
||||||
// If this container exists then the template returned was start-conversation.html, no conversation yet.
|
|
||||||
if (startChatContainer) {
|
|
||||||
startChatContainer.addEventListener('submit', function (event) {
|
|
||||||
event.preventDefault();
|
|
||||||
|
|
||||||
const guestName = event.target.elements.guest_name.value;
|
|
||||||
const guestMobileNumber = event.target.elements.guest_mobile_number.value;
|
|
||||||
|
|
||||||
const eventMessage = {
|
|
||||||
'event_type': 'start_conversation',
|
|
||||||
'guest_name': guestName,
|
|
||||||
'guest_mobile_number': guestMobileNumber,
|
|
||||||
};
|
|
||||||
|
|
||||||
osichatSocket.send(JSON.stringify(eventMessage));
|
|
||||||
|
|
||||||
event.target.reset();
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
const sendMessageContainer = document.getElementById('sendMessage');
|
|
||||||
if (sendMessageContainer) {
|
|
||||||
sendMessageContainer.addEventListener('submit', function (event) {
|
|
||||||
event.preventDefault();
|
|
||||||
console.log('i am here')
|
|
||||||
|
|
||||||
const message = event.target.elements.message.value;
|
|
||||||
|
|
||||||
const eventMessage = {
|
|
||||||
'event_type': 'send_message',
|
|
||||||
'message': message,
|
|
||||||
|
|
||||||
};
|
|
||||||
|
|
||||||
osichatSocket.send(JSON.stringify(eventMessage));
|
|
||||||
|
|
||||||
event.target.reset();
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
} else if (data.event_type === 'start_conversation') {
|
|
||||||
const chatDiv = document.getElementById('startChatContainer');
|
|
||||||
const html = data.html;
|
|
||||||
chatDiv.innerHTML = html;
|
|
||||||
|
|
||||||
} else if (data.event_type === 'send_message') {
|
|
||||||
const messagesDiv = document.getElementById('messages');
|
|
||||||
const html = data.html;
|
|
||||||
messagesDiv.insertAdjacentHTML('beforeend', html);
|
|
||||||
|
|
||||||
}
|
}
|
||||||
};
|
}
|
||||||
|
|
||||||
|
// Function to initialize WebSocket connection
|
||||||
|
async function initializeChatWebSocket() {
|
||||||
|
const session_id = await fetchSessionID();
|
||||||
|
const osichatSocketUrl = `${chat_ws_scheme}://${domain}/ws/osichat/${session_id}/`;
|
||||||
|
const osichatSocket = new WebSocket(osichatSocketUrl);
|
||||||
|
|
||||||
|
osichatSocket.onopen = () => {
|
||||||
|
console.log('WebSocket connection to osichat established');
|
||||||
|
};
|
||||||
|
|
||||||
|
osichatSocket.onmessage = function (e) {
|
||||||
|
const data = JSON.parse(e.data);
|
||||||
|
if (data.event_type === 'load_chat') {
|
||||||
|
const chatDiv = document.getElementById('osichat');
|
||||||
|
const html = data.html;
|
||||||
|
chatDiv.innerHTML = html;
|
||||||
|
|
||||||
|
// Append the toggle tag
|
||||||
|
const script = document.createElement('script');
|
||||||
|
script.type = 'text/javascript';
|
||||||
|
script.src = `http://${domain}/static/js/osichat/chat-toggle.js`;
|
||||||
|
chatDiv.appendChild(script);
|
||||||
|
|
||||||
|
const startChatContainer = document.getElementById('startChat');
|
||||||
|
// If this container exists then the template returned was start-conversation.html, no conversation yet.
|
||||||
|
if (startChatContainer) {
|
||||||
|
startChatContainer.addEventListener('submit', function (event) {
|
||||||
|
event.preventDefault();
|
||||||
|
|
||||||
|
const guestName = event.target.elements.guest_name.value;
|
||||||
|
const guestMobileNumber = event.target.elements.guest_mobile_number.value;
|
||||||
|
|
||||||
|
const eventMessage = {
|
||||||
|
'event_type': 'start_conversation',
|
||||||
|
'guest_name': guestName,
|
||||||
|
'guest_mobile_number': guestMobileNumber,
|
||||||
|
};
|
||||||
|
|
||||||
|
osichatSocket.send(JSON.stringify(eventMessage));
|
||||||
|
|
||||||
|
event.target.reset();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
const sendMessageContainer = document.getElementById('sendMessage');
|
||||||
|
if (sendMessageContainer) {
|
||||||
|
sendMessageContainer.addEventListener('submit', function (event) {
|
||||||
|
event.preventDefault();
|
||||||
|
|
||||||
|
const message = event.target.elements.message.value;
|
||||||
|
|
||||||
|
const eventMessage = {
|
||||||
|
'event_type': 'send_message',
|
||||||
|
'message': message,
|
||||||
|
};
|
||||||
|
|
||||||
|
osichatSocket.send(JSON.stringify(eventMessage));
|
||||||
|
|
||||||
|
event.target.reset();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
} else if (data.event_type === 'start_conversation') {
|
||||||
|
const chatDiv = document.getElementById('startChatContainer');
|
||||||
|
const html = data.html;
|
||||||
|
chatDiv.innerHTML = html;
|
||||||
|
|
||||||
|
} else if (data.event_type === 'send_message') {
|
||||||
|
const messagesDiv = document.getElementById('messages');
|
||||||
|
const html = data.html;
|
||||||
|
messagesDiv.insertAdjacentHTML('beforeend', html);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
osichatSocket.onclose = () => {
|
osichatSocket.onclose = () => {
|
||||||
console.log('WebSocket connection to osichat closed');
|
console.log('WebSocket connection to osichat closed');
|
||||||
};
|
};
|
||||||
|
|
||||||
osichatSocket.onerror = (error) => {
|
osichatSocket.onerror = (error) => {
|
||||||
console.log('WebSocket error:', error);
|
console.log('WebSocket error:', error);
|
||||||
};
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
document.addEventListener('DOMContentLoaded', () => {
|
||||||
|
initializeChatWebSocket();
|
||||||
|
});
|
||||||
|
@ -1,63 +1,66 @@
|
|||||||
const visitors_ws_scheme = window.location.protocol === "https:" ? "wss" : "ws";
|
const visitors_ws_scheme = window.location.protocol === "https:" ? "wss" : "ws";
|
||||||
const my_domain = "osina.ositcom.com";
|
const my_domain = "192.168.1.106:8000";
|
||||||
const visitorsSocketUrl = `${visitors_ws_scheme}://${my_domain}/ws/osichat/visitors/`;
|
|
||||||
|
async function fetchClientData() {
|
||||||
document.addEventListener('DOMContentLoaded', () => {
|
try {
|
||||||
function fetchClientData() {
|
const response = await fetch('https://osina.ositcom.com/get-client-ip/');
|
||||||
return fetch('https://osina.ositcom.com/get-client-ip/')
|
const data = await response.json();
|
||||||
.then(response => response.json())
|
return {
|
||||||
.then(data => ({
|
client_ip: data.ip,
|
||||||
client_ip: data.ip,
|
client_country: data.country
|
||||||
client_country: data.country
|
};
|
||||||
}))
|
} catch (error) {
|
||||||
.catch(error => {
|
console.error('Error fetching client data:', error);
|
||||||
console.error('Error fetching client data:', error);
|
return {
|
||||||
return {
|
client_ip: 'Unknown',
|
||||||
client_ip: 'Unknown',
|
client_country: 'Unknown'
|
||||||
client_country: 'Unknown'
|
};
|
||||||
};
|
}
|
||||||
});
|
}
|
||||||
}
|
|
||||||
|
|
||||||
function fetchSessionID() {
|
async function fetchSessionID() {
|
||||||
return fetch('https://ositcom.com/get-client-session/')
|
try {
|
||||||
.then(response => response.json())
|
const response = await fetch('http://192.168.1.106:3000/get-client-session/');
|
||||||
.then(data => data.session_id)
|
const data = await response.json();
|
||||||
.catch(error => {
|
return data.session_id;
|
||||||
console.error('Error fetching session ID:', error);
|
} catch (error) {
|
||||||
return 'Unknown';
|
console.error('Error fetching session ID:', error);
|
||||||
});
|
return 'Unknown';
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
function initializeWebSocket() {
|
async function initializeVisitorsWebSocket() {
|
||||||
const referrer = document.referrer;
|
console.log('Initializing WebSocket...');
|
||||||
|
|
||||||
Promise.all([fetchClientData(), fetchSessionID()]).then(([clientData, session_id]) => {
|
const referrer = document.referrer;
|
||||||
const visitorsSocket = new WebSocket(visitorsSocketUrl);
|
const clientData = await fetchClientData();
|
||||||
|
const session_id = await fetchSessionID();
|
||||||
|
const visitorsSocketUrl = `${visitors_ws_scheme}://${my_domain}/ws/osichat/visitors/`;
|
||||||
|
const visitorsSocket = new WebSocket(visitorsSocketUrl);
|
||||||
|
|
||||||
visitorsSocket.onopen = () => {
|
visitorsSocket.onopen = () => {
|
||||||
console.log('WebSocket connection to visitors established');
|
console.log('WebSocket connection to visitors established');
|
||||||
|
|
||||||
const event_message = {
|
const event_message = {
|
||||||
'event_type': 'new_visitor',
|
'event_type': 'new_visitor',
|
||||||
'referrer': referrer,
|
'referrer': referrer,
|
||||||
'url': window.location.href,
|
'url': window.location.href,
|
||||||
'client_ip': clientData.client_ip,
|
'client_ip': clientData.client_ip,
|
||||||
'client_country': clientData.client_country,
|
'client_country': clientData.client_country,
|
||||||
'session_id': session_id
|
'session_id': session_id
|
||||||
};
|
};
|
||||||
visitorsSocket.send(JSON.stringify(event_message));
|
visitorsSocket.send(JSON.stringify(event_message));
|
||||||
};
|
};
|
||||||
|
|
||||||
visitorsSocket.onclose = () => {
|
visitorsSocket.onclose = () => {
|
||||||
console.log('WebSocket connection to visitors closed');
|
console.log('WebSocket connection to visitors closed');
|
||||||
};
|
};
|
||||||
|
|
||||||
visitorsSocket.onerror = (error) => {
|
visitorsSocket.onerror = (error) => {
|
||||||
console.error('WebSocket error:', error);
|
console.error('WebSocket error:', error);
|
||||||
};
|
};
|
||||||
});
|
|
||||||
}
|
}
|
||||||
|
|
||||||
initializeWebSocket();
|
document.addEventListener('DOMContentLoaded', async () => {
|
||||||
});
|
initializeVisitorsWebSocket();
|
||||||
|
});
|
Loading…
Reference in New Issue