hmaxnl/SharpRSS
1
0
Fork 0
mirror of https://github.com/hmaxnl/SharpRSS.git synced 2024-11-09 23:44:20 +01:00
Code Issues Actions Packages Projects Releases Wiki Activity

Fixed side bar UI.

Browse Source
This commit is contained in:
Max 2023-05-04 20:59:25 +02:00
parent 4ad5fd7adb
commit 493d20820a
5 changed files with 86 additions and 56 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
WebSharpRSS/Models/CategoryGuideItem.cs
View File

@ -3,7 +3,7 @@ using CodeHollow.FeedReader;
namespace WebSharpRSS.Models namespace WebSharpRSS.Models
{ {
public class CategoryGuideItem public class CategoryGuideItem : ISelectableGuideItem
{ {
public string CategoryTitle { get; set; } public string CategoryTitle { get; set; }
public string CategoryIcon { get; set; } public string CategoryIcon { get; set; }
@ -17,6 +17,6 @@ namespace WebSharpRSS.Models
public bool IsExpanded { get; set; } public bool IsExpanded { get; set; }
public bool IsSelected { get; set; } public bool IsSelected { get; set; }
public HashSet<Feed> Feeds { get; set; } = new HashSet<Feed>() { FeedReader.ReadAsync("http://fedoramagazine.org/feed/").Result }; public HashSet<FeedGuideItem> FeedItems { get; set; } = new HashSet<FeedGuideItem>() { new FeedGuideItem(FeedReader.ReadAsync("http://fedoramagazine.org/feed/").Result) };
} }
} }

15
WebSharpRSS/Models/FeedGuideItem.cs Normal file
View File

@ -0,0 +1,15 @@
using CodeHollow.FeedReader;
namespace WebSharpRSS.Models
{
public class FeedGuideItem : ISelectableGuideItem
{
public FeedGuideItem(Feed feed)
{
Feed = feed;
}
public readonly Feed Feed;
public bool IsSelected { get; set; }
public bool IsExpanded { get; set; }
}
}

14
WebSharpRSS/Models/FeedTreeItem.cs
View File

@ -1,14 +0,0 @@
using System.Collections.Generic;
using CodeHollow.FeedReader;
namespace WebSharpRSS.Models
{
public class FeedTreeItem
{
public FeedTreeItem(Feed feed)
{
_feed = feed;
}
private readonly Feed _feed;
}
}

8
WebSharpRSS/Models/ISelectableGuideItem.cs Normal file
View File

@ -0,0 +1,8 @@
namespace WebSharpRSS.Models
{
public interface ISelectableGuideItem
{
public bool IsSelected { get; set; }
public bool IsExpanded { get; set; }
}
}

101
WebSharpRSS/Shared/CategoryGuide.razor
View File

@ -2,39 +2,61 @@
@using CodeHollow.FeedReader @using CodeHollow.FeedReader
<style> <style>
.cat-item { .cat-item {
background: var(--background-color); background: var(--background-color);
tab-index: 0; tab-index: 0;
width: 100%; width: 100%;
display: flex; display: flex;
position: relative; position: relative;
box-sizing: border-box; box-sizing: border-box;
text-align: start; text-align: start;
align-items: center; align-items: center;
padding-top: 8px; padding-top: 8px;
padding-bottom: 8px; padding-bottom: 8px;
justify-content: flex-start; padding-left: 12px;
text-decoration: none; justify-content: flex-start;
text-decoration: none;
} }
.cat-item:hover { .cat-item:hover {
background: var(--hover-bg-color); background: var(--hover-bg-color);
} }
.cat-item-text { .cat-item-text {
flex: 1 1 auto; flex: 1 1 auto;
min-width: 0; min-width: 0;
} }
.cat-item-icon { .cat-item-icon {
display: inline-flex; display: inline-flex;
min-width: 56px; min-width: 56px;
flex-shrink: 0; flex-shrink: 0;
} }
.feed-item { .feed-item {
background: var(--background-color); background: var(--background-color);
tab-index: 1; tab-index: 0;
width: 100%;
display: flex;
position: relative;
box-sizing: border-box;
text-align: start;
align-items: center;
padding-top: 8px;
padding-bottom: 8px;
padding-left: 30px;
justify-content: flex-start;
text-decoration: none;
} }
.feed-item:hover { .feed-item:hover {
background: var(--hover-bg-color); background: var(--hover-bg-color);
} }
.feed-item-text {
flex: 1 1 auto;
min-width: 0;
}
.feed-item-icon {
display: inline-flex;
min-width: 56px;
flex-shrink: 0;
}
</style> </style>
<div> <div>
@ -42,8 +64,7 @@
@foreach (CategoryGuideItem catItem in Categories) @foreach (CategoryGuideItem catItem in Categories)
{ {
<div> <div>
<div @onclick="@(() => CatItemClicked(catItem))" class="cat-item mud-ripple" style="--hover-bg-color: @catItem.CategoryHexColor; --background-color: @(catItem.IsSelected ? catItem.CategoryHexColor : "transparent")"> <div @onclick="@(() => ItemClicked(catItem))" class="cat-item mud-ripple" style="--hover-bg-color: @catItem.CategoryHexColor; --background-color: @(catItem.IsSelected ? catItem.CategoryHexColor : "transparent")">
@*<MudListItem Icon="@catItem.CategoryIcon">@catItem.CategoryTitle</MudListItem>*@
<div class="cat-item-icon"> <div class="cat-item-icon">
<MudIcon Class="pointer-events-none" Icon="@catItem.CategoryIcon" Size="Size.Medium"/> <MudIcon Class="pointer-events-none" Icon="@catItem.CategoryIcon" Size="Size.Medium"/>
</div> </div>
@ -52,15 +73,16 @@
</div> </div>
</div> </div>
@* Feeds *@ @* Feeds *@
@if (catItem.IsExpanded && catItem.Feeds != null) @if (catItem.IsExpanded && catItem.FeedItems != null)
{ {
foreach (Feed feed in catItem.Feeds) foreach (FeedGuideItem feedItem in catItem.FeedItems)
{ {
<div class="cat-item mud-ripple" style="--hover-bg-color: @catItem.CategoryHexColor"> <div @onclick="() => ItemClicked(feedItem)" class="feed-item mud-ripple" style="--hover-bg-color: @catItem.CategoryHexColor; --background-color: @(feedItem.IsSelected ? catItem.CategoryHexColor : "transparent")">
@* Items *@ <div class="feed-item-icon">
<div @onclick="() => FeedItemClicked(feed)"> <MudImage ObjectFit="ObjectFit.Contain" Src="http://www.google.com/s2/favicons?domain=wikipedia.com"/>
@* Image *@ </div>
<MudText Class="pointer-events-none">@feed.Title</MudText> <div class="feed-item-text">
<MudText Class="pointer-events-none">@feedItem.Feed.Title</MudText>
</div> </div>
</div> </div>
} }
@ -76,10 +98,12 @@
public HashSet<CategoryGuideItem> Categories { get; set; } = new HashSet<CategoryGuideItem>(); public HashSet<CategoryGuideItem> Categories { get; set; } = new HashSet<CategoryGuideItem>();
[Parameter] [Parameter]
public Action<CategoryGuideItem> HandleCat { get; set; } public Action<CategoryGuideItem> HandleCat { get; set; }
[Parameter]
public Action<FeedGuideItem> FeedItemClicked { get; set; }
CategoryGuideItem? _selectedCategory; ISelectableGuideItem? _selectedCategory;
void CatItemClicked(CategoryGuideItem categoryItem) void ItemClicked(ISelectableGuideItem categoryItem)
{ {
categoryItem.IsExpanded = !categoryItem.IsExpanded; categoryItem.IsExpanded = !categoryItem.IsExpanded;
@ -90,13 +114,10 @@
_selectedCategory = categoryItem; _selectedCategory = categoryItem;
_selectedCategory.IsSelected = true; _selectedCategory.IsSelected = true;
} }
//TODO: Handle click! // Handle the click.
HandleCat(categoryItem); if (categoryItem is CategoryGuideItem catGuideItem)
HandleCat(catGuideItem);
/*if (categoryItem is FeedGuideItem feedGuideItem)
FeedItemClicked(feedGuideItem);*/
} }
void FeedItemClicked(Feed feed)
{
}
} }