kuba/fm-dx-webserver
1
0
Fork 0
mirror of https://github.com/KubaPro010/fm-dx-webserver.git synced 2026-02-27 06:23:53 +01:00
Code Issues Activity

bugfixes, refactor, code removal

Browse Source
This commit is contained in:
NoobishSVK
2024-03-25 23:23:14 +01:00
parent fc52b211b7
commit 7f483770f2
20 changed files with 342 additions and 737 deletions
Download Patch File Download Diff File Expand all files Collapse all files

155
web/js/chat.js
View File

@@ -1,105 +1,88 @@
var chatUrl = new URL('chat', window.location.href);
chatUrl.protocol = chatUrl.protocol.replace('http', 'ws');
var chatSocketAddress = chatUrl.href;
var chatSocket = new WebSocket(chatSocketAddress);
let chatMessageCount = 0;
$(document).ready(function() {
chatSocket.onopen = function() {
};
const chatSocket = new WebSocket(`ws://${window.location.host}/chat`);
let chatMessageCount = 0;
const chatMessages = $('#chat-chatbox');
const chatMessagesCount = $('.chat-messages-count');
const chatButton = $('.chatbutton');
const chatSendInput = $('#chat-send-message');
const chatIdentityNickname = $('#chat-identity-nickname');
const chatNicknameInput = $('#chat-nickname');
const chatNicknameSave = $('#chat-nickname-save');
chatSocket.onmessage = function(event) {
var messages = $('#chat-chatbox');
let messageData = JSON.parse(event.data); // Parse event.data to access its properties
let isAdmin = messageData.admin ? '<span style="color: lime">[ADMIN]</span>' : ''; // Add '[ADMIN] ' if messageData.admin is true, otherwise empty string
// Check if the message type is 'clientIp'
if (messageData.type === 'clientIp') {
// Fill the client IP into the element with ID #chat-ip
$('#chat-admin').html(isAdmin);
$('#chat-identity-nickname').attr('title', messageData.ip)
} else {
let chatMessage = `
<span class="color-2">[${messageData.time}]</span>
${isAdmin} <strong class="color-5" title="IP Address: ${messageData.ip}">${messageData.nickname}</strong>: <span style="color: var(--color-text-2);">${$('<div/>').text(messageData.message).html()}</span><br>
`;
const messageData = JSON.parse(event.data);
const isAdmin = messageData.admin ? '<span style="color: lime">[ADMIN]</span>' : '';
messages.append(chatMessage);
if($('#chat-chatbox').is(':visible')) {
setTimeout(function() {
$('#chat-chatbox').scrollTop($('#chat-chatbox')[0].scrollHeight);
}, 100)
if (messageData.type === 'clientIp') {
chatIdentityNickname.html(isAdmin + " " + savedNickname.length > 0 ? savedNickname : 'Anonymous User');
chatIdentityNickname.attr('title', messageData.ip);
} else {
if(messageData.history !== true) {
chatMessageCount++;
$('.chat-messages-count').text(chatMessageCount);
$('.chatbutton').removeClass('bg-color-2').addClass('bg-color-4');
const chatMessage = `
<span class="color-2">[${messageData.time}]</span>
${isAdmin} <strong class="color-5" title="IP Address: ${messageData.ip}">${messageData.nickname}</strong>:
<span style="color: var(--color-text-2);">${$('<div/>').text(messageData.message).html()}</span><br>
`;
chatMessages.append(chatMessage);
if (chatMessages.is(':visible')) {
setTimeout(function() {
chatMessages.scrollTop(chatMessages[0].scrollHeight);
}, 100);
} else {
if (!messageData.history) {
chatMessageCount++;
chatMessagesCount.text(chatMessageCount);
chatButton.removeClass('bg-color-2').addClass('bg-color-4');
}
}
}
}
};
};
$('.chat-send-message-btn').click(function() {
sendMessage();
$('.chat-send-message-btn').click(sendMessage);
chatNicknameSave.click(function() {
const currentNickname = chatNicknameInput.val();
localStorage.setItem('nickname', currentNickname);
chatIdentityNickname.text(currentNickname.length > 0 ? currentNickname : 'Anonymous User');
chatNicknameInput.blur();
});
chatButton.click(function() {
chatMessageCount = 0;
chatMessagesCount.text(chatMessageCount);
chatButton.removeClass('bg-color-4').addClass('bg-color-2');
chatSendInput.focus();
setTimeout(function() {
chatMessages.scrollTop(chatMessages[0].scrollHeight);
}, 100);
});
$('#chat-nickname-save').click(function() {
let currentNickname = $('#chat-nickname').val();
localStorage.setItem('nickname', currentNickname);
$('#chat-identity-nickname').text(localStorage.getItem('nickname'));
$('#chat-nickname').blur();
chatNicknameInput.keypress(function(event) {
if (event.which === 13) {
chatNicknameSave.trigger('click');
}
});
$('.chatbutton').click(function() {
chatMessageCount = 0;
$('.chat-messages-count').text(chatMessageCount);
$('.chatbutton').removeClass('bg-color-4').addClass('bg-color-2');
$('#chat-send-message').focus();
setTimeout(function() {
$('#chat-chatbox').scrollTop($('#chat-chatbox')[0].scrollHeight);
}, 100)
chatSendInput.keypress(function(event) {
if (event.which === 13) {
sendMessage();
}
});
$('#chat-nickname').keypress(function(event) {
if (event.which == 13) { // 13 is the keycode for Enter key
$('#chat-nickname-save').trigger('click');
}
});
$('#chat-send-message').keypress(function(event) {
if (event.which == 13) { // 13 is the keycode for Enter key
sendMessage();
}
});
if(localStorage.getItem('nickname')) {
$('#chat-nickname').val(localStorage.getItem('nickname'));
$('#chat-identity-nickname').text(localStorage.getItem('nickname'));
// Load nickname from localStorage on page load
const savedNickname = localStorage.getItem('nickname');
if (savedNickname) {
chatNicknameInput.val(savedNickname);
}
});
function sendMessage() {
var input = $('#chat-send-message');
var nickname = localStorage.getItem('nickname');
if (nickname && nickname.length > 1) {
// Only assign the nickname if it exists in localStorage and is longer than one character
nickname = nickname;
} else {
// Otherwise, use the default nickname
nickname = 'Anonymous user';
}
if (input.val().trim() !== '') {
var messageData = {
nickname: nickname,
message: input.val()
};
const nickname = chatNicknameInput.val().trim() || 'Anonymous user';
const message = chatSendInput.val().trim();
if (message) {
const messageData = { nickname, message };
chatSocket.send(JSON.stringify(messageData));
input.val('');
}
}
chatSendInput.val('');
}
}