117 lines
4.2 KiB
JavaScript
117 lines
4.2 KiB
JavaScript
$(document).ready(function() {
|
|
var chatform = $('#sendChatMessage');
|
|
var uploadForm = $('#uploadFile');
|
|
|
|
chatform.bind('submit', function(event) {
|
|
event.preventDefault(); // Prevent page reload
|
|
var msg = $("#chatMessage").val();
|
|
|
|
console.log("Submitting message:", msg);
|
|
|
|
var ajax_params = {
|
|
url: '/chat/sendMessage',
|
|
type: 'POST',
|
|
data: { chatMessage: msg },
|
|
success: function(response) {
|
|
console.log("Message sent successfully:", response);
|
|
$("#chatMessage").val("");
|
|
},
|
|
error: function(xhr, status, error) {
|
|
console.error("Error sending message:", error, status, xhr);
|
|
},
|
|
complete: function() {
|
|
console.log("AJAX request complete");
|
|
}
|
|
};
|
|
|
|
$.ajax(ajax_params);
|
|
return false;
|
|
});
|
|
|
|
uploadForm.bind('submit', function(event) {
|
|
event.preventDefault(); // Prevent page reload
|
|
|
|
var formData = new FormData(this); // Create FormData object
|
|
|
|
$.ajax({
|
|
url: '/chat/uploadFile',
|
|
type: 'POST',
|
|
data: formData,
|
|
processData: false, // Don't process the files
|
|
contentType: false, // Set content type to false as jQuery will tell the server its a query string request
|
|
success: function(response) {
|
|
console.log("File uploaded successfully:", response);
|
|
$("#file").val("");
|
|
},
|
|
error: function(xhr, status, error) {
|
|
console.error("Error uploading file:", error, status, xhr);
|
|
},
|
|
complete: function() {
|
|
console.log("AJAX request complete");
|
|
}
|
|
});
|
|
|
|
return false;
|
|
});
|
|
|
|
const eventSource = new EventSource('/chat/getMessageEvents');
|
|
eventSource.onmessage = function( event ) {
|
|
const message = JSON.parse( event.data );
|
|
|
|
var userPopup = "<div class='media'>" +
|
|
"<span class='pull-left'>" +
|
|
"<img class='media-object avatar-round-40' src='/"+message.avatar+"' alt=''>" +
|
|
"</span>" +
|
|
"<div class='media-body'>" +
|
|
"<h5 class='media-heading'>" +
|
|
"<strong>"+message.submittedByName+"</strong>" +
|
|
"</h5>" +
|
|
"<a href='/home/profile/"+message.submittedByName+"' class='btn btn-sm btn-primary' role='button'><i class='glyphicon glyphicon-open'></i> View Profile</a>" +
|
|
"</div>" +
|
|
"</div>";
|
|
|
|
$("#chatMessages").append(
|
|
"<span class='chat-time'>" +
|
|
new Date(message.submittedAt * 1000).toLocaleString('en-US', { month: 'long', day: 'numeric', hour: 'numeric', minute: 'numeric', hour12: true }) +
|
|
// new Date(message.submittedAt * 1000).toLocaleString() +
|
|
"</span> " +
|
|
'<a tabindex="0" role="button" data-toggle="popover" data-html="true" data-trigger="focus" title="'+message.submittedByName+'" data-content="'+userPopup+'">' +
|
|
message.submittedByName +
|
|
'</a> ' +
|
|
message.chatMessage + "<br>"
|
|
);
|
|
$("[data-toggle=popover]").popover();
|
|
$("#chatMessages").scrollTop($("#chatMessages")[0].scrollHeight);
|
|
};
|
|
|
|
eventSource.onerror = function(event) {
|
|
console.error('EventSource failed:', event);
|
|
};
|
|
|
|
window.addEventListener('beforeunload', function() {
|
|
eventSource.close();
|
|
});
|
|
|
|
window.addEventListener('unload', function() {
|
|
eventSource.close();
|
|
});
|
|
|
|
// function getUserProfile( id ) {
|
|
// var ajax_params = {
|
|
// url: '/api/users/find/' + id,
|
|
// type: 'GET',
|
|
// success: function(response) {
|
|
// console.log("User retrieved:", response);
|
|
// $("#chatMessage").val("");
|
|
// },
|
|
// error: function(xhr, status, error) {
|
|
// console.error("Error retrieved user:", error, status, xhr);
|
|
// },
|
|
// complete: function() {
|
|
// console.log("AJAX request complete");
|
|
// }
|
|
// };
|
|
// $.ajax(ajax_params);
|
|
// }
|
|
});
|