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

chat, theme changes, bugfixes

Browse Source
This commit is contained in:
NoobishSVK
2024-03-01 14:15:05 +01:00
parent e9b7c2a77f
commit 67ff5af341
16 changed files with 612 additions and 82 deletions
Download Patch File Download Diff File Expand all files Collapse all files

101
web/js/chat.js Normal file
View File

@@ -0,0 +1,101 @@
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() {
};
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>
`;
messages.append(chatMessage);
if($('#chat-chatbox').is(':visible')) {
$('#chat-chatbox').scrollTop($('#chat-chatbox')[0].scrollHeight);
} else {
if(messageData.history !== true) {
chatMessageCount++;
$('.chat-messages-count').text(chatMessageCount);
$('.chatbutton').removeClass('bg-color-2').addClass('bg-color-4');
}
}
}
console.log(messageData);
};
$('.chat-send-message-btn').click(function() {
sendMessage();
});
$('#chat-nickname-save').click(function() {
let currentNickname = $('#chat-nickname').val();
localStorage.setItem('nickname', currentNickname);
$('#chat-identity-nickname').text(localStorage.getItem('nickname'));
$('#chat-nickname').blur();
});
$('.chatbutton').click(function() {
$('#chat-chatbox').scrollTop($('#chat-chatbox')[0].scrollHeight);
chatMessageCount = 0;
$('#chat-messages-count').text(chatMessageCount);
$('.chatbutton').removeClass('bg-color-4').addClass('bg-color-2');
$('#chat-send-message').focus();
});
$('#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').length > 0) {
$('#chat-nickname').val(localStorage.getItem('nickname'));
$('#chat-identity-nickname').text(localStorage.getItem('nickname'));
}
});
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()
};
chatSocket.send(JSON.stringify(messageData));
input.val('');
}
}

44
web/js/confighandler.js
View File

@@ -1,6 +1,17 @@
function submitData() {
const webserverIp = $('#webserver-ip').val() || '0.0.0.0';
const webserverPort = $('#webserver-port').val() || '8080';
const tuningLimit = $('#tuning-limit').is(":checked") || false;
const tuningLowerLimit = $('#tuning-lower-limit').val() || '0';
const tuningUpperLimit = $('#tuning-upper-limit').val() || '108';
let presets = [];
presets.push($('#preset1').val() || '87.5');
presets.push($('#preset2').val() || '87.5');
presets.push($('#preset3').val() || '87.5');
presets.push($('#preset4').val() || '87.5');
let banlist = [];
validateAndAdd(banlist);
const xdrdIp = $('#xdrd-ip').val() || '127.0.0.1';
const xdrdPort = $('#xdrd-port').val() || '7373';
@@ -34,6 +45,11 @@ function submitData() {
webserver: {
webserverIp,
webserverPort,
tuningLimit,
tuningLowerLimit,
tuningUpperLimit,
presets,
banlist
},
xdrd: {
xdrdIp,
@@ -76,6 +92,7 @@ function submitData() {
data: JSON.stringify(data),
success: function (message) {
alert(message);
console.log(data);
},
error: function (error) {
console.error(error);
@@ -96,6 +113,18 @@ function submitData() {
.then(data => {
$('#webserver-ip').val(data.webserver.webserverIp);
$('#webserver-port').val(data.webserver.webserverPort);
$('#tuning-limit').prop("checked", data.webserver.tuningLimit);
$('#tuning-lower-limit').val(data.webserver.tuningLowerLimit || "");
$('#tuning-upper-limit').val(data.webserver.tuningUpperLimit || "");
if(Array.isArray(data.webserver.presets)) {
$('#preset1').val(data.webserver.presets[0] || "");
$('#preset2').val(data.webserver.presets[1] || "");
$('#preset3').val(data.webserver.presets[2] || "");
$('#preset4').val(data.webserver.presets[3] || "");
}
$('#ip-addresses').val(data.webserver.banlist?.join('\n') || "");
$('#xdrd-ip').val(data.xdrd.xdrdIp);
$('#xdrd-port').val(data.xdrd.xdrdPort);
@@ -143,3 +172,18 @@ function submitData() {
console.error('Error fetching data:', error.message);
});
}
function validateAndAdd(banlist) {
var textarea = $('#ip-addresses');
var ipAddresses = textarea.val().split('\n');
// Regular expression to validate IP address
var ipRegex = /^(?:[0-9]{1,3}\.){3}[0-9]{1,3}$/;
ipAddresses.forEach(function(ip) {
if (ipRegex.test(ip)) {
banlist.push(ip);
}
});
}

5
web/js/init.js
View File

@@ -8,8 +8,11 @@ function getInitialSettings() {
// Use the received data (data.qthLatitude, data.qthLongitude) as needed
localStorage.setItem('qthLatitude', data.qthLatitude);
localStorage.setItem('qthLongitude', data.qthLongitude);
localStorage.setItem('audioPort', data.audioPort);
localStorage.setItem('streamEnabled', data.streamEnabled);
localStorage.setItem('preset1', data.presets[0]);
localStorage.setItem('preset2', data.presets[1]);
localStorage.setItem('preset3', data.presets[2]);
localStorage.setItem('preset4', data.presets[3]);
},
error: function (error) {
console.error('Error:', error);

30
web/js/main.js
View File

@@ -313,7 +313,13 @@ function updateCanvas(parsedData, signalChart) {
socket.onmessage = (event) => {
parsedData = JSON.parse(event.data);
updatePanels(parsedData);
data.push(parsedData.signal);
if(localStorage.getItem("smoothSignal") == 'true') {
const sum = signalData.reduce((acc, strNum) => acc + parseFloat(strNum), 0);
const averageSignal = sum / signalData.length;
data.push(averageSignal);
} else {
data.push(parsedData.signal);
}
};
function compareNumbers(a, b) {
@@ -365,13 +371,13 @@ function checkKey(e) {
if (socket.readyState === WebSocket.OPEN) {
switch (e.keyCode) {
case 66: // Back to previous frequency
socket.send("T" + (previousFreq * 1000));
tuneTo(previousFreq);
break;
case 82: // RDS Reset (R key)
socket.send("T" + (currentFreq.toFixed(1) * 1000));
tuneTo(Number(currentFreq));
break;
case 38:
socket.send("T" + (Math.round(currentFreq*1000) + ((currentFreq > 30) ? 10 : 1)));
socket.send("T" + (Math.round(currentFreq*1000) + ((currentFreq > 30) ? 10 : 1)));
break;
case 40:
socket.send("T" + (Math.round(currentFreq*1000) - ((currentFreq > 30) ? 10 : 1)));
@@ -382,6 +388,22 @@ function checkKey(e) {
case 39:
tuneUp();
break;
case 112: // F1
e.preventDefault();
tuneTo(Number(localStorage.getItem('preset1')));
break;
case 113: // F2
e.preventDefault();
tuneTo(Number(localStorage.getItem('preset2')));
break;
case 114: // F3
e.preventDefault();
tuneTo(Number(localStorage.getItem('preset3')));
break;
case 115: // F4
e.preventDefault();
tuneTo(Number(localStorage.getItem('preset4')));
break;
default:
// Handle default case if needed
break;

53
web/js/modal.js
View File

@@ -1,33 +1,56 @@
$(document).ready(function() {
// Cache jQuery objects for reuse
var modal = $("#myModal");
var modalPanel = $(".modal-panel");
var chatPanel = $(".modal-panel-chat");
var chatOpenBtn = $(".chatbutton");
var openBtn = $("#settings");
var closeBtn = $("#closeModal, #closeModalButton");
var closeBtn = $(".closeModal, .closeModalButton");
// Function to open the modal
function openModal() {
modal.css("display", "block");
modalPanel.css("display", "block");
setTimeout(function() {
modal.css("opacity", 1);
}, 10);
}
// Function to close the modal
function closeModal() {
modal.css("opacity", 0);
function openChat() {
modal.css("display", "block");
chatPanel.css("display", "block");
setTimeout(function() {
modal.css("display", "none");
}, 300);
modal.css("opacity", 1);
}, 10);
}
// Event listeners for the open and close buttons
openBtn.on("click", openModal);
closeBtn.on("click", closeModal);
// Close the modal when clicking outside of it
$(document).on("click", function(event) {
if ($(event.target).is(modal)) {
closeModal();
}
});
// Function to close the modal
function closeModal() {
modal.css("opacity", 0);
setTimeout(function() {
modal.css("display", "none");
modalPanel.css("display", "none");
chatPanel.css("display", "none");
}, 300);
}
// Event listeners for the open and close buttons
openBtn.on("click", openModal);
chatOpenBtn.on("click", openChat);
closeBtn.on("click", closeModal);
// Close the modal when clicking outside of it
$(document).on("click", function(event) {
if ($(event.target).is(modal)) {
closeModal();
}
});
// Close the modal when pressing ESC key
$(document).on("keydown", function(event) {
if (event.key === "Escape") {
closeModal();
}
});
});

14
web/js/settings.js
View File

@@ -1,4 +1,4 @@
var currentVersion = 'v1.1.0 [27.2.2024]';
var currentVersion = 'v1.1.1 [1.3.2024]';
/**
* Themes
@@ -8,13 +8,13 @@
*/
const themes = {
theme1: ['rgba(32, 34, 40, 1)', 'rgba(88, 219, 171, 1)', 'rgba(255, 255, 255, 1)' ], // Retro (Default)
theme2: [ 'rgba(31, 12, 12, 1)', 'rgba(255, 112, 112, 1)', 'rgba(255, 255, 255, 1)' ], // Red
theme3: [ 'rgba(18, 28, 12, 1)', 'rgba(169, 255, 112, 1)', 'rgba(255, 255, 255, 1)' ], // Green
theme4: [ 'rgba(12, 28, 27, 1)', 'rgba(104, 247, 238, 1)', 'rgba(255, 255, 255, 1)' ], // Cyan
theme5: [ 'rgba(23, 17, 6, 1)', 'rgba(245, 182, 66, 1)', 'rgba(255, 255, 255, 1)' ], // Orange
theme6: [ 'rgba(33, 9, 29, 1)', 'rgba(237, 81, 211, 1)', 'rgba(255, 255, 255, 1)' ], // Pink
theme2: [ 'rgba(21, 32, 33, 1)', 'rgba(203, 202, 165, 1)', 'rgba(255, 255, 255, 1)' ], // Cappuccino
theme3: [ 'rgba(18, 18, 12, 1)', 'rgba(169, 255, 112, 1)', 'rgba(255, 255, 255, 1)' ], // Nature
theme4: [ 'rgba(12, 28, 27, 1)', 'rgba(104, 247, 238, 1)', 'rgba(255, 255, 255, 1)' ], // Ocean
theme5: [ 'rgba(23, 17, 6, 1)', 'rgba(245, 182, 66, 1)', 'rgba(255, 255, 255, 1)' ], // Terminal
theme6: [ 'rgba(33, 9, 29, 1)', 'rgba(250, 82, 141, 1)', 'rgba(255, 255, 255, 1)' ], // Nightlife
theme7: [ 'rgba(13, 11, 26, 1)', 'rgba(128, 105, 250, 1)', 'rgba(255, 255, 255, 1)' ], // Blurple
theme8: [ 'rgba(252, 186, 3, 1)', 'rgba(0, 0, 0, 1)', 'rgba(0, 0, 0, 1)' ], // Sunny
theme8: [ 'rgba(252, 186, 3, 1)', 'rgba(0, 0, 0, 1)', 'rgba(0, 0, 0, 1)' ], // Construction
theme9: [ 'rgba(0, 0, 0, 1)', 'rgba(204, 204, 204, 1)', 'rgba(255, 255, 255, 1)' ], // AMOLED
};

1
web/js/webserver.js
View File

@@ -2,3 +2,4 @@ $.getScript('./js/main.js');
$.getScript('./js/dropdown.js');
$.getScript('./js/modal.js');
$.getScript('./js/settings.js');
$.getScript('./js/chat.js');