Skip to content

show history chat #1

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
Run37927 wants to merge 3 commits into
base: main
Choose a base branch
from
Open

show history chat #1

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
7b2b94a
show history chat
Run37927 Mar 24, 2024
ca65fe7
uaifauh
Run37927 Mar 24, 2024
4a3eecb
idhiu
Run37927 Mar 25, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
25 changes: 12 additions & 13 deletions Hubs/ChatHub.cs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -179,20 +179,18 @@ public async Task SendMessage(string user, string message)
// Get the messages from the Database
public async Task ChatHistory()
{
// Get the language of requesting user
var connectionId = Context.ConnectionId;
var language = _userPreferences[connectionId].Language;

// Get the last 10 messages from the database that match language
var lastMessages = _context.Messages.Where(m => m.Language == language).OrderByDescending(m => m.SentDate).Take(10).ToList();
var language = _userPreferences.ContainsKey(connectionId) ? _userPreferences[connectionId].Language : "en"; // Default to English if not set

// Fetch the last N messages from the database that match the language
var lastMessages = _context.Messages
.OrderByDescending(m => m.SentDate)
.Take(20) // Adjust the number of messages as needed
.ToList();
lastMessages.Reverse();

// Check if the user wants to receive notifications
if (_userPreferences[connectionId].ReceiveNotifications)
{
// Send the messages to the user
await Clients.Client(connectionId).SendAsync("ReceiveChatHistory", lastMessages, _userPreferences[connectionId].Language);
}
// Send the messages to the user
await Clients.Client(connectionId).SendAsync("ReceiveChatHistory", lastMessages);
}


Expand Down Expand Up @@ -288,11 +286,12 @@ private async Task<string> GenerateSummaryAsync(List<string> messages)
}

// Override OnConnectedAsync to track connections
public override Task OnConnectedAsync()
public override async Task OnConnectedAsync()
{
_logger.LogInformation("Connection ID: " + Context.ConnectionId);
_userPreferences.Add(Context.ConnectionId, new UserPreferences());
return base.OnConnectedAsync();
await base.OnConnectedAsync();
await ChatHistory();
}

// Override OnDisconnectedAsync to clean up when a connection is lost
Expand Down
41 changes: 21 additions & 20 deletions Pages/Index.cshtml
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,26 +1,27 @@
@page
<div class="container">
<div class="chat-container">
<div id="messagesList" class="messages-list">
@* messages will be inserted here *@
</div>
<div class="chat-input-group">
Language: <select id="languageSelect">
<option value="en-US">English</option>
<option value="fr-FR">French</option>
<option value="es-ES">Spanish</option>
<!-- Add other languages as needed -->
</select>
User: <input type="text" id="userInput" class="user-input" />
</div>
<div class="chat-input-group">
Message: <input type="text" id="messageInput" class="message-input" />
<input type="button" id="sendButton" value="Send" />
</div>
<div>
<input type="button" id="historyButton" value="History" />
</div>
<div class="chat-container">
<div id="messagesList" class="messages-list">
@* messages will be inserted here *@
</div>
<div class="chat-input-group">
Language:
<select id="languageSelect">
<option value="en-US">English</option>
<option value="fr-FR">French</option>
<option value="es-ES">Spanish</option>
<!-- Add other languages as needed -->
</select>
User: <input type="text" id="userInput" class="user-input" />
</div>
<div class="chat-input-group">
Message: <input type="text" id="messageInput" class="message-input" />
<input type="button" id="sendButton" value="Send" />
</div>
<!-- <div>
<input type="button" id="historyButton" value="History" />
</div> -->
</div>
</div>
<script src="~/lib/signalr/dist/browser/signalr.js"></script>
<script src="~/js/chat.js"></script>
41 changes: 22 additions & 19 deletions Pages/Shared/_Layout.cshtml
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,32 +1,34 @@
<!DOCTYPE html>
<html lang="en">

<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>@ViewData["Title"] - SignalrChat</title>
<title>@ViewData["Title"] - SupaChat</title>
<link rel="stylesheet" href="~/lib/bootstrap/dist/css/bootstrap.min.css" />
<link rel="stylesheet" href="~/css/site.css" asp-append-version="true" />
<link rel="stylesheet" href="~/SignalrChat.styles.css" asp-append-version="true" />
</head>

<body>
<header>
<nav class="navbar navbar-expand-sm navbar-toggleable-sm navbar-light bg-white border-bottom box-shadow mb-3">
<div class="container">
<a class="navbar-brand" asp-area="" asp-page="/Index">SignalrChat</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target=".navbar-collapse" aria-controls="navbarSupportedContent"
aria-expanded="false" aria-label="Toggle navigation">
<a class="navbar-brand" asp-area="" asp-page="/Index">SupaChat</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target=".navbar-collapse"
aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="navbar-collapse collapse d-sm-inline-flex justify-content-between">
<ul class="navbar-nav flex-grow-1">
<li class="nav-item">
<a class="nav-link text-dark" asp-area="" asp-page="/Index">Home</a>
</li>
<li class="nav-item">
<a class="nav-link text-dark" asp-area="" asp-page="/Privacy">Privacy</a>
</li>
</ul>
</div>
@* <div class="navbar-collapse collapse d-sm-inline-flex justify-content-between">
<ul class="navbar-nav flex-grow-1">
<li class="nav-item">
<a class="nav-link text-dark" asp-area="" asp-page="/Index">Home</a>
</li>
<li class="nav-item">
<a class="nav-link text-dark" asp-area="" asp-page="/Privacy">Privacy</a>
</li>
</ul>
</div> *@
</div>
</nav>
</header>
Expand All @@ -36,16 +38,17 @@
</main>
</div>

<footer class="border-top footer text-muted">
<div class="container">
&copy; 2024 - SignalrChat - <a asp-area="" asp-page="/Privacy">Privacy</a>
</div>
</footer>
@* <footer class="border-top footer text-muted">
<div class="container">
&copy; 2024 - SignalrChat - <a asp-area="" asp-page="/Privacy">Privacy</a>
</div>
</footer> *@

<script src="~/lib/jquery/dist/jquery.min.js"></script>
<script src="~/lib/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
<script src="~/js/site.js" asp-append-version="true"></script>

@await RenderSectionAsync("Scripts", required: false)
</body>

</html>
Binary file modified app.db
View file
Open in desktop
Binary file not shown.
11 changes: 9 additions & 2 deletions wwwroot/css/site.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -23,6 +23,14 @@ html {
padding: 10px;
background-color: #181818;
border-radius: 8px;
/* Hide scrollbar for Webkit browsers like Chrome and Safari */
&::-webkit-scrollbar {
display: none;
}

/* Hide scrollbar for IE, Edge, and Firefox */
-ms-overflow-style: none; /* IE and Edge */
scrollbar-width: none; /* Firefox */
}

/* Styles for individual chat messages */
Expand Down Expand Up @@ -135,9 +143,8 @@ html {
/* Overriding Bootstrap's navbar to fit dark theme */
.navbar {
background-color: #242424 !important; /* Dark background for the navbar */
border-bottom: 1px solid #444; /* Slight contrast for the bottom border */
border-bottom: 1px solid rgba(68, 68, 68, 0.5) !important; /* Darker border with more transparency */
}

.navbar-brand,
.nav-link {
color: #e0e0e0 !important; /* Light text color for legibility */
Expand Down
64 changes: 50 additions & 14 deletions wwwroot/js/chat.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -45,10 +45,43 @@ connection.on("ReceiveTranslation", function (messageId, translation, language)
translatedContent.textContent = `Translation: ${translation}`;
});

connection.on("ReceiveChatHistory", function (messageList, language) {
console.log(messageList);
});
connection.on("ReceiveChatHistory", function (messages, language) {
console.log("i see messages", messages);
var messagesList = document.getElementById("messagesList");
messages.forEach(function (message) {
// Create elements for the message, header, and content
var messageContainer = document.createElement("div");
messageContainer.classList.add("message-container");

var messageHeader = document.createElement("div");
messageHeader.classList.add("message-header");
var timestamp = new Date(message.sentDate).toLocaleTimeString(); // Assuming 'sentDate' is the correct property
messageHeader.textContent = `${message.senderName} · ${timestamp}`;

var messageContent = document.createElement("div");
messageContent.classList.add("message-content");
messageContent.textContent = message.content; // Assuming 'content' is the correct property

// Append the header and content to the message container
messageContainer.appendChild(messageHeader);
messageContainer.appendChild(messageContent);

// Check if translation is needed (based on the current language and message language)
if (language !== currentLanguage && message.language !== currentLanguage) {
var translatedContent = document.createElement("div");
translatedContent.classList.add("translated-content");
translatedContent.textContent = "Translation: Loading..."; // Placeholder text
messageContainer.appendChild(translatedContent);
// You might need to handle actual translation loading here
}

// Append the message container to the message list
messagesList.appendChild(messageContainer);
});

// Scroll to the bottom of the chat window to show the most recent messages
messagesList.scrollTop = messagesList.scrollHeight;
});

connection.on("ReceiveSummary", function (summary) {
var messageContainer = document.createElement("div");
Expand Down Expand Up @@ -77,13 +110,16 @@ connection.start().then(function () {
document.getElementById("sendButton").addEventListener("click", function (event) {
var user = document.getElementById("userInput").value;
var message = document.getElementById("messageInput").value;
connection.invoke("SendMessage", user, message).catch(function (err) {
return console.error(err.toString());
});
event.preventDefault();
if (message.trim() !== '') { // Ensure we don't send empty messages
connection.invoke("SendMessage", user, message).catch(function (err) {
return console.error(err.toString());
});
// Clear the message input field after sending the message
document.getElementById("messageInput").value = '';
}
event.preventDefault(); // Prevent the form from submitting in a traditional way
});

document.getElementById("languageSelect").addEventListener("change", function() {
document.getElementById("languageSelect").addEventListener("change", function () {
currentLanguage = this.value;
updateLanguagePreference(this.value);
});
Expand All @@ -96,8 +132,8 @@ function updateLanguagePreference(language) {
});
}

document.getElementById("historyButton").addEventListener("click", function() {
connection.invoke("ChatHistory").catch(function (err) {
return console.error(err.toString());
});
});
// document.getElementById("historyButton").addEventListener("click", function () {
// connection.invoke("ChatHistory").catch(function (err) {
// return console.error(err.toString());
// });
// });