Basically finished posts.razor

This commit is contained in:
BOT Alex 2023-05-17 00:16:04 +02:00
parent f67676a160
commit d7bf395612
7 changed files with 210 additions and 140 deletions

View File

@ -3,7 +3,7 @@ Microsoft Visual Studio Solution File, Format Version 12.00
# Visual Studio Version 17
VisualStudioVersion = 17.5.33502.453
MinimumVisualStudioVersion = 10.0.40219.1
Project("{FAE04EC0-301F-11D3-BF4B-00C04F79EFBC}") = "Otakians", "Otakians\Otakians.csproj", "{9C8667B5-07D0-4173-8C59-EE5A4265E62B}"
Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "Otakians", "Otakians\Otakians.csproj", "{9C8667B5-07D0-4173-8C59-EE5A4265E62B}"
EndProject
Global
GlobalSection(SolutionConfigurationPlatforms) = preSolution

View File

@ -0,0 +1,7 @@
@page "/Chatting"
<h1>2nd loading... Please wait</h1>
@code {
}

View File

@ -1,141 +1,11 @@
@page "/"
@inject HttpClient Http
<PageTitle>MudBlazorTime!</PageTitle>
<style>
/* Hide scrollbar */
::-webkit-scrollbar {
scrollbar-width: none;
display: none;
}
.scrollbar {
overflow-y: hidden;
scrollbar-width: none;
}
</style>
<MudOverlay @bind-Visible="isOverlayVisible" Style="backdrop-filter:blur(5px)" DarkBackground="true" AutoClose="true">
<MudPaper Elevation="3" Class="rounded-xl">
<MudImage Class="rounded-xl" Elevation="4" Src="@selectedPost.ImagePath" Width="750" Height="750"/>
<MudContainer Class="pa-5 d-flex align-center justify-content-start">
<MudText>
Damn
</MudText>
<MudSpacer/>
<MudIconButton Class="pa-4" Icon="@Icons.Material.Filled.Star" Variant="Variant.Filled" Color="Color.Primary"> text </MudIconButton>
</MudContainer>
</MudPaper>
</MudOverlay>
<MudButton Variant="Variant.Filled" Color="Color.Primary" OnClick="OpenOverlay">Show Overlay</MudButton>
<MudContainer Class="mt-16 px-8 overflow-hidden" MaxWidth="MaxWidth.False">
<MudGrid Spacing="6" Justify="Justify.Center">
@for (int i = 0; i < 200; i++)
{
Post post = (LoadedImages.Count > i) ? posts[i] : GetRandomPost();
<MudItem @onclick="() => ClickPost(post)">
<MudPaper Class="md-8" Style="position:relative">
<MudContainer Style="position:absolute;" Class="mt-4">
<MudText Style="background-color:rgba(0, 0, 0, 0.55); backdrop-filter:blur(2px)" Class="pl-2 rounded-t-lg" Color="Color.Secondary" Typo="Typo.h6">@("@" + post.Publisher)</MudText>
</MudContainer>
<MudContainer>
<MudImage Class="rounded-lg my-4" Src="@post.ImagePath" Height="250" Width="250"></MudImage>
</MudContainer>
</MudPaper>
</MudItem>
}
</MudGrid>
</MudContainer>
@inject NavigationManager NavManager
<h1>2nd loading... Please wait</h1>
@code {
public bool isOverlayVisible = false;
public void OpenOverlay()
protected override void OnInitialized()
{
isOverlayVisible = true;
StateHasChanged();
}
List<int> LoadedImages = new List<int>();
List<Post> posts = new List<Post>();
private Random random = new Random();
const int numImages = 211;
Post GetRandomPost()
{
int selectedPostNum;
reselect:
selectedPostNum = random.Next(1, numImages);
if (LoadedImages.Contains(selectedPostNum))
goto reselect;
LoadedImages.Add(selectedPostNum);
var selectedPost = new Post(selectedPostNum);
Console.WriteLine("Selected: " + selectedPost.Id);
posts.Add(selectedPost);
return selectedPost;
}
string GetImage(int imageIndex)
{
return $@"\images\AnimeImages\AnimeImage ({imageIndex}).jpeg";
}
protected override void OnAfterRender(bool firstRender)
{
}
// TODO: Add a "save post" button to each post.
static string[]? RandomUsernames;
protected override async Task OnInitializedAsync()
{
RandomUsernames = (await Http.GetStringAsync("RandomUsernames.txt")).Split("\n");
}
Post selectedPost = new Post(-1);
void ClickPost(Post post)
{
selectedPost = post;
isOverlayVisible = true;
}
public class Post
{
public Post(int imageIndex)
{
this.Id = imageIndex;
}
public int Id { get; set; }
public int ImageIndex { get => Id; }
public string ImagePath { get => $@"\images\AnimeImages\AnimeImage ({ImageIndex}).jpeg"; }
private string publisher = "Unknown";
public string Publisher
{
get
{
if (publisher == "Unknown" && RandomUsernames != null)
publisher = RandomUsernames[Id];
return publisher;
}
set
{
publisher = value;
}
}
NavManager.NavigateTo("/Posts");
}
}

192
Otakians/Pages/Posts.razor Normal file
View File

@ -0,0 +1,192 @@
@page "/Posts"
@inject HttpClient Http
@inject NavigationManager NavManager
<PageTitle>MudBlazorTime!</PageTitle>
<style>
/* Hide scrollbar */
::-webkit-scrollbar {
scrollbar-width: none;
display: none;
}
.scrollbar {
overflow-y: hidden;
scrollbar-width: none;
}
</style>
<MudOverlay @bind-Visible="isOverlayVisible" Style="backdrop-filter:blur(5px)" DarkBackground="true" AutoClose="true">
<MudPaper Elevation="3" Class="rounded-xl">
<MudImage Class="rounded-xl" Elevation="4" Src="@selectedPost.ImagePath" Width="500" Height="500"/>
<MudContainer Class="pa-5 d-flex align-center justify-content-start">
<MudText>
Damn
</MudText>
<MudSpacer/>
<MudIconButton Class="pa-4" Icon="@Icons.Material.Filled.Star" Variant="Variant.Filled" Color="Color.Primary"> text </MudIconButton>
</MudContainer>
</MudPaper>
</MudOverlay>
<MudOverlay @bind-Visible="isCreatePostWarningVisible" Style="backdrop-filter:blur(5px)" DarkBackground="true" AutoClose="true">
<MudPaper Class="pa-8">
<MudContainer Class="pa-0 d-flex justify-content-end">
<MudText Typo="Typo.h4">I am sorry</MudText>
<MudSpacer/>
<MudIcon Size="Size.Large" Icon="@Icons.Material.Filled.WarningAmber"/>
</MudContainer>
<MudText >Posting is restricted to Otakians+ users only.</MudText>
</MudPaper>
</MudOverlay>
<MudContainer Class="mt-16 px-8 overflow-hidden" MaxWidth="MaxWidth.False">
<MudContainer Class="d-flex justify-center">
<MudGrid Justify="Justify.Center">
<MudItem>
<MudButton OnClick="OpenCreatePostsWarning" Variant="Variant.Filled" Color="@Color.Tertiary">
<MudIcon Class="mr-1 ml-n1" Icon="@Icons.Material.Filled.Create"/>
<MudText>Create post</MudText>
</MudButton>
</MudItem>
<MudItem>
<MudButton Variant="Variant.Filled" Color="@Color.Primary" Disabled="@isRefreshing" OnClick="ReloadPage">
@if (isRefreshing)
{
<MudProgressCircular Class="ms-n1 mr-2" Size="Size.Small" Indeterminate="true" />
}
<MudText>Refresh</MudText>
</MudButton>
</MudItem>
</MudGrid>
</MudContainer>
<MudGrid Spacing="1" Justify="Justify.Center">
@for (int i = 0; i < 200; i++)
{
Post post = (LoadedImages.Count > i) ? posts[i] : GetRandomPost();
<MudItem Class="md-8" Style="position:relative">
<MudContainer Style="position:absolute;" Class="mt-4">
<MudText Style="background-color:rgba(0, 0, 0, 0.55); backdrop-filter:blur(2px); width: 250px;" Class="pl-2 rounded-t-lg" Color="Color.Secondary" Typo="Typo.h6">@("@" + post.Publisher)</MudText>
</MudContainer>
<MudContainer>
<MudImage @onclick="() => ClickPost(post)" Class="rounded-lg my-4" Style="cursor: pointer" Src="@post.ImagePath" ObjectFit="ObjectFit.Cover" Height="250" Width="250"></MudImage>
</MudContainer>
</MudItem>
}
</MudGrid>
</MudContainer>
<MudScrollToTop >
<MudFab Color="Color.Primary" StartIcon="@Icons.Material.Filled.ArrowUpward" />
</MudScrollToTop>
@code {
public bool isOverlayVisible = false;
bool isCreatePostWarningVisible = false;
bool isRefreshing = false;
public void OpenOverlay()
{
isOverlayVisible = true;
StateHasChanged();
}
public void OpenCreatePostsWarning()
{
isCreatePostWarningVisible = true;
StateHasChanged();
}
List<int> LoadedImages = new List<int>();
List<Post> posts = new List<Post>();
private Random random = new Random();
const int numImages = 211;
Post GetRandomPost()
{
int selectedPostNum;
reselect:
selectedPostNum = random.Next(1, numImages);
if (LoadedImages.Contains(selectedPostNum))
goto reselect;
LoadedImages.Add(selectedPostNum);
var selectedPost = new Post(selectedPostNum);
posts.Add(selectedPost);
return selectedPost;
}
string GetImage(int imageIndex)
{
return $@"\images\AnimeImages\AnimeImage ({imageIndex}).jpeg";
}
protected override void OnAfterRender(bool firstRender)
{
}
async void ReloadPage()
{
isRefreshing = true;
StateHasChanged();
await Task.Delay(500);
isRefreshing = false;
NavManager.NavigateTo("/");
}
// TODO: Add a "save post" button to each post.
static string[]? RandomUsernames;
protected override async Task OnInitializedAsync()
{
if (RandomUsernames == null)
RandomUsernames = (await Http.GetStringAsync("RandomUsernames.txt")).Split("\n");
}
Post selectedPost = new Post(-1);
void ClickPost(Post post)
{
selectedPost = post;
isOverlayVisible = true;
}
public class Post
{
public Post(int imageIndex)
{
this.Id = imageIndex;
}
public int Id { get; set; }
public int ImageIndex { get => Id; }
public string ImagePath { get => $@"\images\AnimeImages\AnimeImage ({ImageIndex}).jpeg"; }
private string publisher = "Unknown";
public string Publisher
{
get
{
if (publisher == "Unknown" && RandomUsernames != null)
publisher = RandomUsernames[Id];
return publisher;
}
set
{
publisher = value;
}
}
}
}

View File

@ -7,7 +7,8 @@
},
"dotnetRunMessages": true,
"inspectUri": "{wsProtocol}://{url.hostname}:{url.port}/_framework/debug/ws-proxy?browser={browserInspectUri}",
"applicationUrl": "https://localhost:7129;http://localhost:5222"
"applicationUrl": "http://localhost:5222",
"nativeDebugging": true
},
"IIS Express": {
"commandName": "IISExpress",

View File

@ -6,13 +6,13 @@
<MudAppBar Elevation="1">
<MudButton Variant="Variant.Filled" Color="Color.Primary" OnClick="AddUser">Primary</MudButton>
<MudSpacer />
<MudAvatar @onclick="ToggleDrawer" Variant="Variant.Outlined" Color="Color.Success" Class="mr-n2">BT</MudAvatar>
<MudAvatar @onclick="ToggleDrawer" Style="cursor:pointer;" Variant="Variant.Outlined" Color="Color.Success" Class="mr-n2">BT</MudAvatar>
</MudAppBar>
<MudDrawer @bind-Open="@openContentDrawer" ClipMode="DrawerClipMode.Always" Breakpoint="Breakpoint.Lg" PreserveOpenState="false" Elevation="1" Variant="@DrawerVariant.Mini" OpenMiniOnHover="true">
<MudNavMenu>
<MudNavLink Match="NavLinkMatch.All" Icon="@Icons.Material.Filled.Image">Posts</MudNavLink>
<MudNavLink Match="NavLinkMatch.All" Icon="@Icons.Material.Filled.LibraryBooks">Library</MudNavLink>
<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>
@ -20,7 +20,7 @@
<MudDrawer Anchor="Anchor.End" @bind-Open="@openProfileDrawer" ClipMode="DrawerClipMode.Always" Breakpoint="Breakpoint.Lg" PreserveOpenState="true" Elevation="1" Variant="@DrawerVariant.Temporary">
<MudNavMenu>
<MudNavLink Match="NavLinkMatch.All" Icon="@Icons.Material.Filled.Store">Store</MudNavLink>
<MudNavLink Match="NavLinkMatch.All" Icon="@Icons.Material.Filled.LibraryBooks">Library</MudNavLink>
<MudNavLink Match="NavLinkMatch.All" Icon="@Icons.Material.Filled.Chat">Library</MudNavLink>
<MudNavLink Match="NavLinkMatch.All" Icon="@Icons.Material.Filled.Group">Community</MudNavLink>
</MudNavMenu>
</MudDrawer>