Added chatting
This commit is contained in:
BOT Alex
parent
2b8cc84053
commit
f6956dfaa0
|
|
@ -11,11 +11,22 @@
|
|||
</NotFound>
|
||||
</Router>
|
||||
|
||||
@*<MudThemeProvider @bind-IsDarkMode="@_isDarkMode" Theme="MyCustomTheme" />*@
|
||||
<MudThemeProvider @bind-IsDarkMode="@_isDarkMode" />
|
||||
<MudDialogProvider />
|
||||
<MudSnackbarProvider />
|
||||
|
||||
@code {
|
||||
private MudTheme _theme = new();
|
||||
//public static MudTheme MyCustomTheme = new MudTheme()
|
||||
// {
|
||||
// PaletteDark = new PaletteDark()
|
||||
// {
|
||||
// Dark = Colors.Pink.Lighten3,
|
||||
// Background = Colors.Pink.Lighten1,
|
||||
// AppbarBackground = Colors.Pink.Darken4,
|
||||
// DrawerBackground = Colors.Pink.Darken4,
|
||||
// Surface = Colors.Pink.Lighten2,
|
||||
// }
|
||||
//};
|
||||
private bool _isDarkMode = true;
|
||||
}
|
||||
|
|
@ -8,7 +8,7 @@
|
|||
|
||||
<MudLayout Class="overflow-hidden">
|
||||
<MudAppBar Elevation="1">
|
||||
<MudButton Variant="Variant.Filled" Color="Color.Primary" OnClick="RegisterAccount">Clear cookies</MudButton>
|
||||
<MudButton Variant="Variant.Filled" Color="Color.Primary" Disabled=true>Debug button</MudButton>
|
||||
<MudSpacer />
|
||||
@if (!isLoggedIn)
|
||||
{
|
||||
|
|
@ -28,7 +28,6 @@
|
|||
<MudNavMenu>
|
||||
<MudNavLink Match="NavLinkMatch.All" Href="/Posts" Icon="@Icons.Material.Filled.Image">Posts</MudNavLink>
|
||||
<MudNavLink Match="NavLinkMatch.All" Href="/Chatting" Icon="@Icons.Material.Filled.Chat">Chat</MudNavLink>
|
||||
<MudNavLink Match="NavLinkMatch.All" Icon="@Icons.Material.Filled.Group">Community</MudNavLink>
|
||||
</MudNavMenu>
|
||||
</MudDrawer>
|
||||
|
||||
|
|
@ -37,7 +36,7 @@
|
|||
{
|
||||
<MudPaper Class="ma-2">
|
||||
<MudStack Spacing="0" Class="justify-center">
|
||||
<MudButton Class="ma-4" Variant="Variant.Outlined" Color="Color.Error" OnClick="Logout">Logout</MudButton>
|
||||
<MudButton Class="ma-4" Variant="Variant.Filled" Color="Color.Error" OnClick="Logout">Logout</MudButton>
|
||||
</MudStack>
|
||||
</MudPaper>
|
||||
}
|
||||
|
|
@ -45,8 +44,8 @@
|
|||
{
|
||||
<MudPaper Class="ma-2">
|
||||
<MudStack Spacing="0" Class="justify-center">
|
||||
<MudButton Class="ma-4" Variant="Variant.Outlined" Color="Color.Primary" OnClick="ShowLogIn">Sign-in</MudButton>
|
||||
<MudButton Class="ma-4" Variant="Variant.Outlined" Color="Color.Success" OnClick="ShowSignUp">Sign-up</MudButton>
|
||||
<MudButton Class="ma-4" Variant="Variant.Filled" Color="Color.Primary" OnClick="ShowLogIn">Sign-in</MudButton>
|
||||
<MudButton Class="ma-4" Variant="Variant.Filled" Color="Color.Success" OnClick="ShowSignUp">Sign-up</MudButton>
|
||||
</MudStack>
|
||||
</MudPaper>
|
||||
}
|
||||
|
|
@ -245,6 +244,7 @@
|
|||
|
||||
protected override async Task OnInitializedAsync()
|
||||
{
|
||||
StateHasChanged();
|
||||
CheckLoggedin();
|
||||
}
|
||||
|
||||
|
|
@ -253,10 +253,9 @@
|
|||
string? name = await localStorage.GetItemAsStringAsync("User");
|
||||
if (name == null) return;
|
||||
|
||||
Snackbar.Add("Successfully logged in!", Severity.Success);
|
||||
|
||||
Program.LoggedInName = name;
|
||||
isLoggedIn = true;
|
||||
Snackbar.Add($"Successfully logged in as: {Program.LoggedInName}.", Severity.Success);
|
||||
StateHasChanged();
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -3,6 +3,8 @@
|
|||
@inject NavigationManager NavManager
|
||||
@inject HttpClient Http
|
||||
@inject IJSRuntime JSRuntime
|
||||
@inject ISnackbar Snackbar
|
||||
@inject MessageService messageService
|
||||
|
||||
<style>
|
||||
.bottom-start {
|
||||
|
|
@ -23,7 +25,7 @@
|
|||
{
|
||||
Message message = messages[i];
|
||||
|
||||
if ("dumb zhen" == message.Name)
|
||||
if (Program.LoggedInName != null && Program.LoggedInName == message.Name)
|
||||
{
|
||||
<MudStack Class="px-4 py-2 d-flex" Justify="Justify.FlexEnd" Row="true" AlignItems="AlignItems.End">
|
||||
<MudStack>
|
||||
|
|
@ -31,7 +33,7 @@
|
|||
<MudText Typo="Typo.body1" Class="px-2 pt-2" Style="max-width: 320px;">@message.Content</MudText>
|
||||
<MudText Class="pa-1 pr-2" Align="Align.End" Style="font-size: 10px;">@("@" + message.Name)</MudText>
|
||||
</MudPaper>
|
||||
<MudText Class="mt-n3" Align="Align.End" Style="font-size: 10px;">@(DateTime.Now.ToString("dd/MM/yyyy HH:mm", danishCulture))</MudText>
|
||||
<MudText Class="mt-n3" Align="Align.End" Style="font-size: 10px;">@(DateTimeOffset.FromUnixTimeSeconds(message.DatePosted).ToString("dd/MM HH:mm", danishCulture))</MudText>
|
||||
</MudStack>
|
||||
</MudStack>
|
||||
}
|
||||
|
|
@ -43,7 +45,7 @@
|
|||
<MudText Typo="Typo.body1" Class="px-2 pt-2" Style="max-width: 320px;">@message.Content</MudText>
|
||||
<MudText Class="pa-1" Style="font-size: 10px;">@("@" + message.Name)</MudText>
|
||||
</MudPaper>
|
||||
<MudText Class="mt-n3 pl-1" Style="font-size: 10px;">@(DateTime.Now.ToString("dd/MM HH:mm", danishCulture))</MudText>
|
||||
<MudText Class="mt-n3 pl-1" Style="font-size: 10px;">@(DateTimeOffset.FromUnixTimeSeconds(message.DatePosted).ToString("dd/MM HH:mm", danishCulture))</MudText>
|
||||
</MudStack>
|
||||
</MudStack>
|
||||
}
|
||||
|
|
@ -51,16 +53,16 @@
|
|||
}
|
||||
|
||||
</MudPaper>
|
||||
<MudContainer Class="d-flex pa-0">
|
||||
<MudTextField Class="my-1" @bind-Value="TextValue" Label="Filled" Variant="Variant.Filled" Margin="Margin.Dense"></MudTextField>
|
||||
<MudButton Class="my-1" Variant="Variant.Filled" Color="Color.Primary" Disabled="isSending" OnClick="SendMessage">
|
||||
<MudContainer Class="d-flex pa-0 mb-n1">
|
||||
<MudTextField Class="my-1" HelperText="Messages cannot be deleted!" HelperTextOnFocus=true Counter="25" @bind-Value="TextValue" MaxLength="32" Immediate="true" Validation="@(new Func<string, IEnumerable<string>>(MaxCharacters))" Disabled="@(Program.LoggedInName == null)" Label="@((Program.LoggedInName == null) ? "Sign-in to send messages" : "Message")" Variant="Variant.Filled" AdornmentColor="@Color.Primary" Margin="Margin.Dense"></MudTextField>
|
||||
<MudButton Class="mt-1 mb-7" Variant="Variant.Filled" Color="Color.Primary" Disabled="@(Program.LoggedInName == null || isSending)" OnClick="SendMessage">
|
||||
@if (isSending)
|
||||
{
|
||||
<MudProgressCircular Class="ms-n1 mr-2" Size="Size.Small" Indeterminate="true" />
|
||||
}
|
||||
else
|
||||
{
|
||||
<MudIcon Icon="@Icons.Material.Rounded.Send" Class="mr-1"/>
|
||||
<MudIcon Icon="@Icons.Material.Rounded.Send" Class="mr-1" />
|
||||
}
|
||||
Send
|
||||
</MudButton>
|
||||
|
|
@ -78,17 +80,39 @@
|
|||
isSending = true;
|
||||
StateHasChanged();
|
||||
await Task.Delay(3000);
|
||||
//isSending = false;
|
||||
messages = null;
|
||||
|
||||
if (string.IsNullOrWhiteSpace(TextValue))
|
||||
{
|
||||
Snackbar.Add("Missing input text?", Severity.Error);
|
||||
return;
|
||||
}
|
||||
|
||||
var message = new Message
|
||||
{
|
||||
Content = TextValue,
|
||||
DatePosted = DateTimeOffset.Now.ToUnixTimeSeconds(),
|
||||
Name = Program.LoggedInName
|
||||
};
|
||||
|
||||
await messageService.AddMessage(message);
|
||||
TextValue = string.Empty;
|
||||
messages = await messageService.GetMessages();
|
||||
isSending = false;
|
||||
NavManager.NavigateTo("/");
|
||||
NavManager.NavigateTo("/Chatting");
|
||||
}
|
||||
|
||||
private IEnumerable<string> MaxCharacters(string ch)
|
||||
{
|
||||
if (!string.IsNullOrEmpty(ch) && 32 < ch?.Length)
|
||||
yield return "Max 32 characters";
|
||||
}
|
||||
|
||||
Message[]? messages;
|
||||
|
||||
protected override async Task OnInitializedAsync()
|
||||
{
|
||||
messages = (await Http.GetFromJsonAsync<Message[]>("https://globalchat-4a89f-default-rtdb.europe-west1.firebasedatabase.app/Database/Messages.json"));
|
||||
messages = await messageService.GetMessages();
|
||||
|
||||
StartLoop();
|
||||
}
|
||||
|
|
@ -103,9 +127,10 @@
|
|||
|
||||
while (isLooping)
|
||||
{
|
||||
messages = (await Http.GetFromJsonAsync<Message[]>("https://globalchat-4a89f-default-rtdb.europe-west1.firebasedatabase.app/Database/Messages.json"));
|
||||
messages = await messageService.GetMessages();
|
||||
Console.WriteLine("Chat updated!");
|
||||
|
||||
await Task.Delay(100000); // Delay for 1 second before the next iteration
|
||||
await Task.Delay(10000);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -24,6 +24,8 @@ internal class Program
|
|||
builder.Services.AddBlazoredLocalStorage(config =>
|
||||
config.JsonSerializerOptions.WriteIndented = true); // local storage
|
||||
|
||||
builder.Services.AddScoped<MessageService>();
|
||||
|
||||
await builder.Build().RunAsync();
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,48 @@
|
|||
using System;
|
||||
using System.Net.Http;
|
||||
using System.Net.Http.Json;
|
||||
using System.Threading.Tasks;
|
||||
using static Otakians.Pages.Chatting;
|
||||
|
||||
public class MessageService
|
||||
{
|
||||
private readonly HttpClient _httpClient;
|
||||
private const string ApiUrl = "https://globalchat-4a89f-default-rtdb.europe-west1.firebasedatabase.app/Database.json";
|
||||
|
||||
public MessageService(HttpClient httpClient)
|
||||
{
|
||||
_httpClient = httpClient;
|
||||
}
|
||||
|
||||
public async Task<Message[]?> GetMessages()
|
||||
{
|
||||
try
|
||||
{
|
||||
var rawMaybe = await _httpClient.GetFromJsonAsync<Dictionary<string, Message>>(ApiUrl);
|
||||
|
||||
if (rawMaybe == null) return null;
|
||||
|
||||
Message[] messages = rawMaybe.Values.ToArray();
|
||||
Array.Reverse(messages);
|
||||
return messages;
|
||||
}
|
||||
catch (Exception ex)
|
||||
{
|
||||
// Handle exception appropriately (e.g., log, display an error message)
|
||||
throw ex;
|
||||
}
|
||||
}
|
||||
|
||||
public async Task AddMessage(Message message)
|
||||
{
|
||||
try
|
||||
{
|
||||
await _httpClient.PostAsJsonAsync(ApiUrl, message);
|
||||
}
|
||||
catch (Exception ex)
|
||||
{
|
||||
// Handle exception appropriately (e.g., log, display an error message)
|
||||
throw ex;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -9,8 +9,6 @@
|
|||
<link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap" rel="stylesheet" />
|
||||
<link href="_content/MudBlazor/MudBlazor.min.css" rel="stylesheet" />
|
||||
<link href="css/MudBlazor.min.css" rel="stylesheet" />
|
||||
|
||||
|
||||
<!-- If you add any scoped CSS files, uncomment the following to load them
|
||||
<link href="Otakians.styles.css" rel="stylesheet" /> -->
|
||||
</head>
|
||||
|
|
|
|||
Loading…
Reference in New Issue