From d0ac061d18ccaa3d0dbee333b8c50eade08d3808 Mon Sep 17 00:00:00 2001 From: Egamorf Date: Sun, 13 Apr 2025 20:50:30 +0200 Subject: [PATCH 1/7] Ad select component to rempace old one --- .../Games/Filter/AdvancedGameFilter.razor | 41 ++++------ .../Games/Filter/AdvancedGameFilter.razor.cs | 6 +- .../Pages/Games/Filter/GameFilter.razor | 29 ++++---- .../Pages/Games/Filter/GameFilter.razor.cs | 46 +++++++++--- .../Pages/Games/Filter/GameFilterParams.cs | 21 ------ .../Pages/Games/GameBase.razor | 4 +- .../Pages/Games/GameBase.razor.cs | 5 +- .../Components/Select/SelectList.razor.css | 2 +- .../SelectList/Components/SelectRow.razor | 16 ++++ .../SelectList/Components/SelectRow.razor.cs | 16 ++++ .../SelectList/Components/SelectRow.razor.css | 45 +++++++++++ .../SelectList/Helpers/SelectHelper.cs | 19 +++++ .../SelectList/Models/SelectParams.cs | 12 +++ .../SelectList/Models/SelectTheme.cs | 10 +++ .../SelectList/Models/SelectType.cs | 7 ++ .../Shared/Components/SelectList/Select.razor | 41 ++++++++++ .../Components/SelectList/Select.razor.cs | 74 +++++++++++++++++++ .../Components/SelectList/Select.razor.css | 52 +++++++++++++ .../GameIdeas.Shared/Dto/GameFilterDto.cs | 25 ++++--- .../GameIdeas.Shared/Dto/SortPropertyDto.cs | 7 ++ .../GameIdeas.Shared/Dto/SortTypeDto.cs | 9 +++ 21 files changed, 394 insertions(+), 93 deletions(-) delete mode 100644 src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/GameFilterParams.cs create mode 100644 src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Components/SelectRow.razor create mode 100644 src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Components/SelectRow.razor.cs create mode 100644 src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Components/SelectRow.razor.css create mode 100644 src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Helpers/SelectHelper.cs create mode 100644 src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Models/SelectParams.cs create mode 100644 src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Models/SelectTheme.cs create mode 100644 src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Models/SelectType.cs create mode 100644 src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Select.razor create mode 100644 src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Select.razor.cs create mode 100644 src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Select.razor.css create mode 100644 src/GameIdeas/GameIdeas.Shared/Dto/SortPropertyDto.cs create mode 100644 src/GameIdeas/GameIdeas.Shared/Dto/SortTypeDto.cs diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/AdvancedGameFilter.razor b/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/AdvancedGameFilter.razor index 8c1dd8f..cd93cda 100644 --- a/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/AdvancedGameFilter.razor +++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/AdvancedGameFilter.razor @@ -1,45 +1,32 @@ @using GameIdeas.BlazorApp.Shared.Components.Select @using GameIdeas.BlazorApp.Shared.Components.Select.Models +@using GameIdeas.Shared.Dto +
@ResourcesKey.Filters
- + Theme="Theme" /> - + @bind-Values=GameFilter.Tags + Theme="Theme" />
- + @bind-Values=GameFilter!.Publishers + Theme="Theme" /> - - - - - - - + @bind-Values=GameFilter!.Developers + Theme="Theme" /> @ResourcesKey.LastAdd
\ No newline at end of file diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/AdvancedGameFilter.razor.cs b/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/AdvancedGameFilter.razor.cs index cb74ed4..2bc6859 100644 --- a/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/AdvancedGameFilter.razor.cs +++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/AdvancedGameFilter.razor.cs @@ -1,10 +1,12 @@ using GameIdeas.BlazorApp.Shared.Components.Select.Models; +using GameIdeas.Shared.Dto; using Microsoft.AspNetCore.Components; namespace GameIdeas.BlazorApp.Pages.Games.Filter; public partial class AdvancedGameFilter { - [Parameter] public GameFilterParams? GameFilterParams { get; set; } - [Parameter] public EventCallback GameFilterParamsChanged { get; set; } + [Parameter] public GameFilterDto? GameFilter { get; set; } + [Parameter] public EventCallback GameFilterChanged { get; set; } + private readonly SelectListTheme Theme = SelectListTheme.AdvancedFilter; } \ No newline at end of file diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/GameFilter.razor b/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/GameFilter.razor index 414cda9..6f501d2 100644 --- a/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/GameFilter.razor +++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/GameFilter.razor @@ -1,23 +1,22 @@ @using GameIdeas.BlazorApp.Shared.Components.Search @using GameIdeas.BlazorApp.Shared.Components.Select @using GameIdeas.BlazorApp.Shared.Components.Select.Models +@using GameIdeas.BlazorApp.Shared.Components.SelectList +@using GameIdeas.BlazorApp.Shared.Components.SelectList.Models @using GameIdeas.BlazorApp.Shared.Components.SliderRange @using GameIdeas.BlazorApp.Shared.Models @using GameIdeas.Shared.Dto -@using GameIdeas.Shared.Enum
- +
@@ -32,28 +31,28 @@
- +
-
-
+ @bind-Max=Value.MaxInterest + @bind-Min=Value.MinInterest />
diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/GameFilter.razor.cs b/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/GameFilter.razor.cs index 8ffe951..b2e9a0c 100644 --- a/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/GameFilter.razor.cs +++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/GameFilter.razor.cs @@ -1,4 +1,4 @@ -using GameIdeas.BlazorApp.Shared.Components.Select.Models; +using GameIdeas.BlazorApp.Shared.Components.SelectList.Models; using GameIdeas.BlazorApp.Shared.Components.SliderRange; using GameIdeas.BlazorApp.Shared.Models; using GameIdeas.Shared.Dto; @@ -10,19 +10,21 @@ namespace GameIdeas.BlazorApp.Pages.Games.Filter; public partial class GameFilter { - [Parameter] public GameFilterParams GameFilterParams { get; set; } = new(); - [Parameter] public EventCallback GameFilterParamsChanged { get; set; } + [Parameter] public GameFilterDto Value { get; set; } = new(); + [Parameter] public EventCallback ValueChanged { get; set; } [Parameter] public DisplayType DisplayType { get; set; } [Parameter] public EventCallback DisplayTypeChanged { get; set; } - private readonly IEnumerable> SortTypes = [ - new(SortType.Ascending, "Ascendant") { IsSelected = true }, - new(SortType.Descending, "Descendant") + private SelectParams SelectParams = new(); + + private readonly IEnumerable SortTypes = [ + new() { SortType = SortType.Ascending, Label = "Ascendant" }, + new() { SortType = SortType.Descending, Label = "Descendant" } ]; - - private readonly IEnumerable>> GameProperties = [ - new(game => game?.Title, "Nom") { IsSelected = true }, - new(game => game?.ReleaseDate, "Date de parution"), + + private readonly IEnumerable GameProperties = [ + new() { SortProperty = game => game.Title!, Label = "Titre" }, + new() { SortProperty = game => game.ReleaseDate!, Label = "Date de parution" } ]; private EditContext? EditContext; @@ -31,10 +33,20 @@ public partial class GameFilter protected override void OnInitialized() { - EditContext = new EditContext(GameFilterParams); + EditContext = new EditContext(Value); EditContext.OnFieldChanged += async (s, e) => { - await GameFilterParamsChanged.InvokeAsync(GameFilterParams); + await ValueChanged.InvokeAsync(Value); + }; + + SelectParams = new() + { + Headers = SortTypes, + GetHeaderLabel = header => header.Label, + DefaultHeader = SortTypes.FirstOrDefault(h => h.SortType == SortType.Ascending), + Items = GameProperties, + GetItemLabel = item => item.Label, + DefaultItem = GameProperties.FirstOrDefault(p => p.Label == "Titre") }; } @@ -43,4 +55,14 @@ public partial class GameFilter DisplayType = displayType; await DisplayTypeChanged.InvokeAsync(displayType); } + private async Task HandleSortTypeClicked(IEnumerable sortTypes) + { + Value.SortType = sortTypes.FirstOrDefault(); + await ValueChanged.InvokeAsync(Value); + } + private async Task HandleSortPropertyClicked(IEnumerable sortProperties) + { + Value.SortProperty = sortProperties.FirstOrDefault(); + await ValueChanged.InvokeAsync(Value); + } } \ No newline at end of file diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/GameFilterParams.cs b/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/GameFilterParams.cs deleted file mode 100644 index d95d5c4..0000000 --- a/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/GameFilterParams.cs +++ /dev/null @@ -1,21 +0,0 @@ -using GameIdeas.Shared.Enum; -using GameIdeas.Shared.Dto; - -namespace GameIdeas.BlazorApp.Pages.Games.Filter; - -public class GameFilterParams -{ - public SortType SortType { get; set; } = SortType.Ascending; - public Func? SortProperty { get; set; } - public string? SearchName { get; set; } - public IEnumerable? Platforms { get; set; } - public IEnumerable? Properties { get; set; } - public IEnumerable? Tags { get; set; } - public IEnumerable? Publishers { get; set; } - public IEnumerable? Developers { get; set; } - public IEnumerable? StorageSizes { get; set; } - public IEnumerable? LastModification { get; set; } - public IEnumerable? ReleaseDates { get; set; } - public int MaxRating { get; set; } = 5; - public int MinRating { get; set; } = 1; -} diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/GameBase.razor b/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/GameBase.razor index b72d4b0..1bd2393 100644 --- a/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/GameBase.razor +++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/GameBase.razor @@ -13,14 +13,14 @@ + @bind-Value=GameFilter/>
- +
diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/GameBase.razor.cs b/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/GameBase.razor.cs index 92aff27..3844579 100644 --- a/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/GameBase.razor.cs +++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/GameBase.razor.cs @@ -1,14 +1,15 @@ -using GameIdeas.BlazorApp.Pages.Games.Filter; using GameIdeas.BlazorApp.Shared.Components.Popup; using GameIdeas.BlazorApp.Shared.Models; +using GameIdeas.Shared.Dto; namespace GameIdeas.BlazorApp.Pages.Games; public partial class GameBase () { private DisplayType DisplayType = DisplayType.List; - private GameFilterParams GameFilterParams = new(); + private GameFilterDto GameFilter = new(); private Popup? ManualAddPopup; + private void HandleAddClicked(AddType addType) { switch (addType) diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Select/SelectList.razor.css b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Select/SelectList.razor.css index 56150db..d979b9a 100644 --- a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Select/SelectList.razor.css +++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Select/SelectList.razor.css @@ -18,7 +18,7 @@ flex-direction: column; border-radius: var(--small-radius); animation-name: fade-in; - animation-duration: 0.4s; + animation-duration: 0.2s; } .select-button { diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Components/SelectRow.razor b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Components/SelectRow.razor new file mode 100644 index 0000000..3a55b84 --- /dev/null +++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Components/SelectRow.razor @@ -0,0 +1,16 @@ +@using GameIdeas.BlazorApp.Shared.Components.SelectList.Helpers + +
+
+ @if (IsSelected == true) + { + + + + } +
+
+ @Label +
+
\ No newline at end of file diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Components/SelectRow.razor.cs b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Components/SelectRow.razor.cs new file mode 100644 index 0000000..d5fbfe3 --- /dev/null +++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Components/SelectRow.razor.cs @@ -0,0 +1,16 @@ +using GameIdeas.BlazorApp.Shared.Components.SelectList.Models; +using Microsoft.AspNetCore.Components; + +namespace GameIdeas.BlazorApp.Shared.Components.SelectList.Components; + +public partial class SelectRow +{ + [Parameter] public bool? IsSelected { get; set; } + [Parameter] public string? Label { get; set; } + [Parameter] public SelectTheme Theme { get; set; } + [Parameter] public EventCallback OnClick { get; set; } + private async Task HandleElementClicked() + { + await OnClick.InvokeAsync(); + } +} \ No newline at end of file diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Components/SelectRow.razor.css b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Components/SelectRow.razor.css new file mode 100644 index 0000000..a12a8b5 --- /dev/null +++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Components/SelectRow.razor.css @@ -0,0 +1,45 @@ +.select-element { + display: flex; + flex-direction: row; + width: auto; + gap: 6px; + height: 20px; + align-items: center; + padding: 2px 6px; +} + + .select-element:hover { + cursor: pointer; + background: var(--input-selected); + } + +.selected { + width: 12px; + min-width: 12px; + height: 12px; + min-height: 12px; + border: 1px solid var(--line); +} + + .selected svg { + display: block; + fill: var(--white) + } + +.label { + text-wrap: nowrap; + margin-right: 6px; +} + +/***** Navigation Theme *****/ +.navigation { + padding: 4px 8px; +} + + .navigation:hover { + background: var(--violet-selected); + } + + .navigation .selected { + display: none; + } \ No newline at end of file diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Helpers/SelectHelper.cs b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Helpers/SelectHelper.cs new file mode 100644 index 0000000..7e15185 --- /dev/null +++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Helpers/SelectHelper.cs @@ -0,0 +1,19 @@ +using GameIdeas.BlazorApp.Shared.Components.SelectList.Models; + +namespace GameIdeas.BlazorApp.Shared.Components.SelectList.Helpers; + +public static class SelectHelper +{ + public static string GetClassFromTheme(SelectTheme selectTheme) + { + return selectTheme switch + { + SelectTheme.Navigation => "navigation", + SelectTheme.Sort => "sort", + SelectTheme.Filter => "filter", + SelectTheme.AdvancedFilter => "advenced-filter", + SelectTheme.Creation => "creation", + _ => string.Empty + }; + } +} diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Models/SelectParams.cs b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Models/SelectParams.cs new file mode 100644 index 0000000..d06f35e --- /dev/null +++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Models/SelectParams.cs @@ -0,0 +1,12 @@ +namespace GameIdeas.BlazorApp.Shared.Components.SelectList.Models; + +public class SelectParams +{ + public IEnumerable Items { get; set; } = []; + public TItem? DefaultItem { get; set; } + public Func GetItemLabel { get; set; } = _ => string.Empty; + public IEnumerable Headers { get; set; } = []; + public THeader? DefaultHeader { get; set; } + public Func GetHeaderLabel { get; set; } = _ => string.Empty; + +} diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Models/SelectTheme.cs b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Models/SelectTheme.cs new file mode 100644 index 0000000..620118f --- /dev/null +++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Models/SelectTheme.cs @@ -0,0 +1,10 @@ +namespace GameIdeas.BlazorApp.Shared.Components.SelectList.Models; + +public enum SelectTheme +{ + Navigation, + Sort, + Filter, + AdvancedFilter, + Creation +} diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Models/SelectType.cs b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Models/SelectType.cs new file mode 100644 index 0000000..ef62f6d --- /dev/null +++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Models/SelectType.cs @@ -0,0 +1,7 @@ +namespace GameIdeas.BlazorApp.Shared.Components.SelectList.Models; + +public enum SelectType +{ + Single, + Multiple +} diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Select.razor b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Select.razor new file mode 100644 index 0000000..79c0cff --- /dev/null +++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Select.razor @@ -0,0 +1,41 @@ +@using GameIdeas.BlazorApp.Shared.Components.BackdropFilter +@using GameIdeas.BlazorApp.Shared.Components.SelectList.Components +@using GameIdeas.BlazorApp.Shared.Components.SelectList.Helpers + +@typeparam TItem +@typeparam THeader + +
+
+ @ChildContent +
+ +
+ @if (IsContentOpen) + { +
+ @foreach (var header in Params.Headers) + { + + } + + @if (Params.Headers.Any()) + { + + } + + @foreach (var item in Params.Items) + { + + } +
+ } +
+
+ + diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Select.razor.cs b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Select.razor.cs new file mode 100644 index 0000000..7ca25af --- /dev/null +++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Select.razor.cs @@ -0,0 +1,74 @@ +using GameIdeas.BlazorApp.Shared.Components.SelectList.Models; +using Microsoft.AspNetCore.Components; + +namespace GameIdeas.BlazorApp.Shared.Components.SelectList; + +public partial class Select +{ + [Parameter] public RenderFragment? ChildContent { get; set; } + [Parameter] public List Values { get; set; } = []; + [Parameter] public EventCallback> ValuesChanged { get; set; } + [Parameter] public List HeaderValues { get; set; } = []; + [Parameter] public EventCallback> HeaderValuesChanged { get; set; } + [Parameter] public SelectParams Params { get; set; } = new(); + [Parameter] public SelectTheme Theme { get; set; } + [Parameter] public SelectType Type { get; set; } = SelectType.Single; + [Parameter] public bool AlignRight { get; set; } = false; + + private bool IsContentOpen = false; + + public void Close() => + IsContentOpen = false; + + private void HandleButtonClicked() => + IsContentOpen = !IsContentOpen; + + private void HandleContentClosed() => + IsContentOpen = false; + + protected override void OnInitialized() + { + if (Params.DefaultItem != null) + { + Values.Add(Params.DefaultItem); + } + + if (Params.DefaultHeader != null) + { + HeaderValues.Add(Params.DefaultHeader); + } + } + + private async Task HandleValueClicked(TItem value) + { + if (Type != SelectType.Multiple) + { + Values?.Clear(); + } + + if (Values?.Contains(value) == true) + { + Values.Remove(value); + } + + Values?.Add(value); + await ValuesChanged.InvokeAsync(Values); + StateHasChanged(); + } + + private async Task HandleHeaderClicked(THeader header) + { + if (Type != SelectType.Multiple) + { + HeaderValues?.Clear(); + } + + if (HeaderValues?.Contains(header) == true) + { + HeaderValues.Remove(header); + } + + HeaderValues?.Add(header); + await HeaderValuesChanged.InvokeAsync(HeaderValues); + } +} \ No newline at end of file diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Select.razor.css b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Select.razor.css new file mode 100644 index 0000000..da81379 --- /dev/null +++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Select.razor.css @@ -0,0 +1,52 @@ +.select-container { + position: relative; +} + +.button { + z-index: var(--index-component) +} + +.dropdown { + overflow: auto; + margin-top: 4px; + position: absolute; + z-index: var(--index-dropdown); + border-radius: var(--small-radius); +} + + .dropdown.align-right { + right: 0; + } + +.content { + overflow: hidden; + display: flex; + flex-direction: column; + animation-name: fade-in; + animation-duration: 0.2s; +} + +.line { + display: none; +} + +/***** Navigation Theme *****/ +.content.navigation { + background: var(--violet); + box-shadow: var(--drop-shadow); +} + +/***** Sort Theme *****/ +.content.sort { + background: var(--dropdown-content); + box-shadow: var(--drop-shadow); + padding: 4px 0; +} + + .content.sort .line { + display: block; + margin: 2px 6px; + border-bottom: 2px solid var(--input-selected); + } + + diff --git a/src/GameIdeas/GameIdeas.Shared/Dto/GameFilterDto.cs b/src/GameIdeas/GameIdeas.Shared/Dto/GameFilterDto.cs index 25ba67c..1401e19 100644 --- a/src/GameIdeas/GameIdeas.Shared/Dto/GameFilterDto.cs +++ b/src/GameIdeas/GameIdeas.Shared/Dto/GameFilterDto.cs @@ -1,16 +1,19 @@ -namespace GameIdeas.Shared.Dto; + +namespace GameIdeas.Shared.Dto; public class GameFilterDto { - public IEnumerable? Platforms { get; set; } - public string? Name { get; set; } - public IEnumerable? Tags { get; set; } - public IEnumerable? Properties { get; set; } - public int? MinInterest { get; set; } - public int? MaxInterest { get; set; } + public SortTypeDto? SortType { get; set; } + public SortPropertyDto? SortProperty { get; set; } + public string? Title { get; set; } + public IEnumerable? Platforms { get; set; } + public IEnumerable? Properties { get; set; } + public IEnumerable? Tags { get; set; } + public IEnumerable? Publishers { get; set; } + public IEnumerable? Developers { get; set; } + public int MinInterest { get; set; } = 1; + public int MaxInterest { get; set; } = 5; public IEnumerable? ReleaseYears { get; set; } - public IEnumerable? PublisherIds { get; set; } - public IEnumerable? DeveloperIds { get; set; } - public IEnumerable? CreationUserIds { get; set; } - public IEnumerable? ModificationUserIds { get; set; } + public int? MinStorageSize { get; set; } + public int? MaxStorageSize { get; set; } } diff --git a/src/GameIdeas/GameIdeas.Shared/Dto/SortPropertyDto.cs b/src/GameIdeas/GameIdeas.Shared/Dto/SortPropertyDto.cs new file mode 100644 index 0000000..5f54704 --- /dev/null +++ b/src/GameIdeas/GameIdeas.Shared/Dto/SortPropertyDto.cs @@ -0,0 +1,7 @@ +namespace GameIdeas.Shared.Dto; + +public class SortPropertyDto +{ + public Func? SortProperty { get; set; } + public string Label { get; set; } = string.Empty; +} diff --git a/src/GameIdeas/GameIdeas.Shared/Dto/SortTypeDto.cs b/src/GameIdeas/GameIdeas.Shared/Dto/SortTypeDto.cs new file mode 100644 index 0000000..6c7b927 --- /dev/null +++ b/src/GameIdeas/GameIdeas.Shared/Dto/SortTypeDto.cs @@ -0,0 +1,9 @@ +using GameIdeas.Shared.Enum; + +namespace GameIdeas.Shared.Dto; + +public class SortTypeDto +{ + public SortType SortType { get; set; } = SortType.Ascending; + public string Label { get; set; } = string.Empty; +} -- 2.39.5 From bef0a0cc7ead9bc763be145efae5f0f1c0696398 Mon Sep 17 00:00:00 2001 From: Egamorf Date: Sun, 13 Apr 2025 21:03:14 +0200 Subject: [PATCH 2/7] Replace SelectList --- .../Pages/Games/Header/GameHeader.razor | 12 ++-- .../Pages/Games/Header/GameHeader.razor.cs | 30 +++++++--- .../Shared/Components/Select/SelectList.razor | 40 ------------- .../Components/Select/SelectList.razor.cs | 56 ------------------- .../Components/Select/SelectList.razor.css | 45 --------------- 5 files changed, 27 insertions(+), 156 deletions(-) delete mode 100644 src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Select/SelectList.razor delete mode 100644 src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Select/SelectList.razor.cs delete mode 100644 src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Select/SelectList.razor.css diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Header/GameHeader.razor b/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Header/GameHeader.razor index 515e557..40a95ab 100644 --- a/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Header/GameHeader.razor +++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Header/GameHeader.razor @@ -1,7 +1,7 @@ @using GameIdeas.BlazorApp.Pages.Games @using GameIdeas.BlazorApp.Shared.Components.Account -@using GameIdeas.BlazorApp.Shared.Components.Select -@using GameIdeas.BlazorApp.Shared.Components.Select.Models +@using GameIdeas.BlazorApp.Shared.Components.SelectList +@using GameIdeas.BlazorApp.Shared.Components.SelectList.Models @using GameIdeas.BlazorApp.Shared.Models @using GameIdeas.Resources @@ -22,15 +22,15 @@ - +
-
@ResourcesKey.Genres :
+
@ResourcesKey.Tags :
diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Components/GameCreationForm.razor.cs b/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Components/GameCreationForm.razor.cs index 97c0854..657b891 100644 --- a/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Components/GameCreationForm.razor.cs +++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Components/GameCreationForm.razor.cs @@ -1,4 +1,3 @@ -using GameIdeas.BlazorApp.Pages.Games.Gateways; using GameIdeas.BlazorApp.Shared.Components.Popup; using GameIdeas.BlazorApp.Shared.Components.Select.Models; using GameIdeas.BlazorApp.Shared.Components.Slider; @@ -12,8 +11,8 @@ namespace GameIdeas.BlazorApp.Pages.Games.Components; public partial class GameCreationForm { [Inject] private IJSRuntime Js { get; set; } = default!; - [Inject] private IGameGateway GameGateway { get; set; } = default!; [CascadingParameter] private Popup? Popup { get; set; } + [Parameter] public CategoriesDto Categories { get; set; } = new(); private GameDto GameDto = new(); private CategoriesDto CategoriesDto = new(); @@ -24,7 +23,6 @@ public partial class GameCreationForm protected override async Task OnInitializedAsync() { EditContext = new(GameDto); - CategoriesDto = await GameGateway.FetchCategories(); if (Popup != null) { diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/AdvancedGameFilter.razor b/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/AdvancedGameFilter.razor index cd93cda..17ec219 100644 --- a/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/AdvancedGameFilter.razor +++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/AdvancedGameFilter.razor @@ -1,32 +1,26 @@ -@using GameIdeas.BlazorApp.Shared.Components.Select -@using GameIdeas.BlazorApp.Shared.Components.Select.Models +@using GameIdeas.BlazorApp.Shared.Components.SelectList.Models +@using GameIdeas.BlazorApp.Shared.Components.SelectSearch @using GameIdeas.Shared.Dto
@ResourcesKey.Filters
- + - +
+ - + - + @ResourcesKey.LastAdd -
\ No newline at end of file +
diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/AdvancedGameFilter.razor.cs b/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/AdvancedGameFilter.razor.cs index 2bc6859..c1de509 100644 --- a/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/AdvancedGameFilter.razor.cs +++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/AdvancedGameFilter.razor.cs @@ -1,4 +1,4 @@ -using GameIdeas.BlazorApp.Shared.Components.Select.Models; +using GameIdeas.BlazorApp.Shared.Components.SelectList.Models; using GameIdeas.Shared.Dto; using Microsoft.AspNetCore.Components; @@ -6,7 +6,35 @@ namespace GameIdeas.BlazorApp.Pages.Games.Filter; public partial class AdvancedGameFilter { - [Parameter] public GameFilterDto? GameFilter { get; set; } + [Parameter] public GameFilterDto GameFilter { get; set; } = new(); + [Parameter] public CategoriesDto? Categories { get; set; } [Parameter] public EventCallback GameFilterChanged { get; set; } - private readonly SelectListTheme Theme = SelectListTheme.AdvancedFilter; + + private readonly SelectTheme Theme = SelectTheme.AdvancedFilter; + + private async Task HandlePublishersChanged(List args) + { + GameFilter.Publishers = args; + await GameFilterChanged.InvokeAsync(GameFilter); + } + private async Task HandleDevelopersChanged(List args) + { + GameFilter.Developers = args; + await GameFilterChanged.InvokeAsync(GameFilter); + } + private async Task HandlePropertiesChanged(List args) + { + GameFilter.Properties = args; + await GameFilterChanged.InvokeAsync(GameFilter); + } + private async Task HandleTagsChanged(List args) + { + GameFilter.Tags = args; + await GameFilterChanged.InvokeAsync(GameFilter); + } + private async Task HandlePlatformsChanged(List args) + { + GameFilter.Platforms = args; + await GameFilterChanged.InvokeAsync(GameFilter); + } } \ No newline at end of file diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/AdvancedGameFilter.razor.css b/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/AdvancedGameFilter.razor.css index b854400..d6db344 100644 --- a/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/AdvancedGameFilter.razor.css +++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/AdvancedGameFilter.razor.css @@ -8,7 +8,7 @@ box-sizing: border-box; width: 240px; border-left: 2px solid var(--line); - z-index: var(--index-component); + z-index: var(--index-content); } .duplicate { diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/GameFilter.razor b/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/GameFilter.razor index 6f501d2..22032e4 100644 --- a/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/GameFilter.razor +++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/GameFilter.razor @@ -1,8 +1,7 @@ @using GameIdeas.BlazorApp.Shared.Components.Search -@using GameIdeas.BlazorApp.Shared.Components.Select -@using GameIdeas.BlazorApp.Shared.Components.Select.Models @using GameIdeas.BlazorApp.Shared.Components.SelectList @using GameIdeas.BlazorApp.Shared.Components.SelectList.Models +@using GameIdeas.BlazorApp.Shared.Components.SelectSearch @using GameIdeas.BlazorApp.Shared.Components.SliderRange @using GameIdeas.BlazorApp.Shared.Models @using GameIdeas.Shared.Dto @@ -31,29 +30,24 @@
-
- +
- +
+ MaxChanged=HandleMaxChanged Max="Value.MaxInterest" + MinChanged=HandleMinChanged Min="Value.MinInterest" />
- diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/GameFilter.razor.cs b/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/GameFilter.razor.cs index b2e9a0c..2862ad4 100644 --- a/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/GameFilter.razor.cs +++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/GameFilter.razor.cs @@ -14,31 +14,24 @@ public partial class GameFilter [Parameter] public EventCallback ValueChanged { get; set; } [Parameter] public DisplayType DisplayType { get; set; } [Parameter] public EventCallback DisplayTypeChanged { get; set; } + [Parameter] public CategoriesDto? Categories { get; set; } - private SelectParams SelectParams = new(); - private readonly IEnumerable SortTypes = [ + private readonly List SortTypes = [ new() { SortType = SortType.Ascending, Label = "Ascendant" }, new() { SortType = SortType.Descending, Label = "Descendant" } ]; - private readonly IEnumerable GameProperties = [ + private readonly List GameProperties = [ new() { SortProperty = game => game.Title!, Label = "Titre" }, new() { SortProperty = game => game.ReleaseDate!, Label = "Date de parution" } ]; - private EditContext? EditContext; - private readonly SliderRangeParams SliderRangeParams = - new() { Min = 1, Max = 5 }; + private SelectParams SelectParams = new(); + private readonly SliderRangeParams SliderRangeParams = new() { Min = 1, Max = 5 }; protected override void OnInitialized() { - EditContext = new EditContext(Value); - EditContext.OnFieldChanged += async (s, e) => - { - await ValueChanged.InvokeAsync(Value); - }; - SelectParams = new() { Headers = SortTypes, @@ -65,4 +58,29 @@ public partial class GameFilter Value.SortProperty = sortProperties.FirstOrDefault(); await ValueChanged.InvokeAsync(Value); } + private async Task HandleTagsChanged(List args) + { + Value.Tags = args; + await ValueChanged.InvokeAsync(Value); + } + private async Task HandleMinChanged(int args) + { + Value.MinInterest = args; + await ValueChanged.InvokeAsync(Value); + } + private async Task HandleMaxChanged(int args) + { + Value.MaxInterest = args; + await ValueChanged.InvokeAsync(Value); + } + private async Task HandlePlatformsChanged(List args) + { + Value.Platforms = args; + await ValueChanged.InvokeAsync(Value); + } + private async Task HandleTitleChanged(string args) + { + Value.Title = args; + await ValueChanged.InvokeAsync(Value); + } } \ No newline at end of file diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/GameFilter.razor.css b/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/GameFilter.razor.css index f1df118..a7a9081 100644 --- a/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/GameFilter.razor.css +++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/GameFilter.razor.css @@ -3,7 +3,7 @@ flex-direction: row; gap: 8px; align-items: center; - z-index: var(--index-component); + z-index: var(--index-content); } .search-container { diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/GameBase.razor b/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/GameBase.razor index 1bd2393..e32a814 100644 --- a/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/GameBase.razor +++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/GameBase.razor @@ -12,7 +12,8 @@ @ResourcesKey.GamesIdeas - @@ -20,9 +21,9 @@
- + - + diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/GameBase.razor.cs b/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/GameBase.razor.cs index 3844579..f00fdd0 100644 --- a/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/GameBase.razor.cs +++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/GameBase.razor.cs @@ -1,15 +1,25 @@ +using GameIdeas.BlazorApp.Pages.Games.Gateways; using GameIdeas.BlazorApp.Shared.Components.Popup; using GameIdeas.BlazorApp.Shared.Models; using GameIdeas.Shared.Dto; +using Microsoft.AspNetCore.Components; namespace GameIdeas.BlazorApp.Pages.Games; public partial class GameBase () { + [Inject] private IGameGateway GameGateway { get; set; } = default!; + private DisplayType DisplayType = DisplayType.List; private GameFilterDto GameFilter = new(); private Popup? ManualAddPopup; + private CategoriesDto? Categories; + protected override async Task OnInitializedAsync() + { + Categories = await GameGateway.FetchCategories(); + await base.OnInitializedAsync(); + } private void HandleAddClicked(AddType addType) { switch (addType) diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Header/GameHeader.razor.cs b/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Header/GameHeader.razor.cs index 5fda18c..5b069a9 100644 --- a/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Header/GameHeader.razor.cs +++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Header/GameHeader.razor.cs @@ -26,7 +26,7 @@ public partial class GameHeader : ComponentBase { SelectParams = new() { - Items = AddTypes, + Items = AddTypes.ToList(), GetItemLabel = item => item.Value, }; diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Helpers/SelectHelper.cs b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Helpers/SelectHelper.cs index 7e15185..1edc57c 100644 --- a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Helpers/SelectHelper.cs +++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Helpers/SelectHelper.cs @@ -11,7 +11,7 @@ public static class SelectHelper SelectTheme.Navigation => "navigation", SelectTheme.Sort => "sort", SelectTheme.Filter => "filter", - SelectTheme.AdvancedFilter => "advenced-filter", + SelectTheme.AdvancedFilter => "advanced-filter", SelectTheme.Creation => "creation", _ => string.Empty }; diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Models/SelectParams.cs b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Models/SelectParams.cs index d06f35e..3493283 100644 --- a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Models/SelectParams.cs +++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Models/SelectParams.cs @@ -2,10 +2,10 @@ public class SelectParams { - public IEnumerable Items { get; set; } = []; + public List Items { get; set; } = []; public TItem? DefaultItem { get; set; } public Func GetItemLabel { get; set; } = _ => string.Empty; - public IEnumerable Headers { get; set; } = []; + public List Headers { get; set; } = []; public THeader? DefaultHeader { get; set; } public Func GetHeaderLabel { get; set; } = _ => string.Empty; diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Select.razor b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Select.razor index 79c0cff..50e39f4 100644 --- a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Select.razor +++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Select.razor @@ -14,23 +14,29 @@ @if (IsContentOpen) {
- @foreach (var header in Params.Headers) + @if (Params.Headers != null) { - + @foreach (var header in Params.Headers) + { + + } } - @if (Params.Headers.Any()) + @if (Params.Headers?.Any() == true) { } - @foreach (var item in Params.Items) + @if (Params.Items != null) { - + @foreach (var item in Params.Items) + { + + } }
} diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Select.razor.cs b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Select.razor.cs index 7ca25af..c8d7a0c 100644 --- a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Select.razor.cs +++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Select.razor.cs @@ -41,34 +41,39 @@ public partial class Select private async Task HandleValueClicked(TItem value) { - if (Type != SelectType.Multiple) + if (Type != SelectType.Multiple || Values == null) { - Values?.Clear(); + Values = []; } if (Values?.Contains(value) == true) { Values.Remove(value); } + else + { + Values!.Add(value); + } - Values?.Add(value); await ValuesChanged.InvokeAsync(Values); - StateHasChanged(); } private async Task HandleHeaderClicked(THeader header) { - if (Type != SelectType.Multiple) + if (Type != SelectType.Multiple || HeaderValues == null) { - HeaderValues?.Clear(); + HeaderValues = []; } if (HeaderValues?.Contains(header) == true) { HeaderValues.Remove(header); } + else + { + HeaderValues!.Add(header); + } - HeaderValues?.Add(header); await HeaderValuesChanged.InvokeAsync(HeaderValues); } } \ No newline at end of file diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Select.razor.css b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Select.razor.css index da81379..17be5e0 100644 --- a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Select.razor.css +++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectList/Select.razor.css @@ -12,6 +12,7 @@ position: absolute; z-index: var(--index-dropdown); border-radius: var(--small-radius); + width: 100%; } .dropdown.align-right { @@ -19,27 +20,52 @@ } .content { + background: var(--dropdown-content); overflow: hidden; display: flex; flex-direction: column; animation-name: fade-in; animation-duration: 0.2s; + box-shadow: var(--drop-shadow); } .line { display: none; } +.dropdown::-webkit-scrollbar { + width: 10px; +} + +.dropdown::-webkit-scrollbar-track { + background: var(--input-secondary); + border-radius: 0 var(--small-radius) var(--small-radius) 0; +} + +.dropdown::-webkit-scrollbar-thumb { + background: #555; + border-radius: var(--small-radius); +} + + .dropdown::-webkit-scrollbar-thumb:hover { + background: #777; + } + /***** Navigation Theme *****/ +.dropdown.navigation { + width: auto; +} + .content.navigation { background: var(--violet); - box-shadow: var(--drop-shadow); } /***** Sort Theme *****/ +.dropdown.sort { + width: auto; +} + .content.sort { - background: var(--dropdown-content); - box-shadow: var(--drop-shadow); padding: 4px 0; } diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectSearch/SelectSearch.razor b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectSearch/SelectSearch.razor new file mode 100644 index 0000000..77ef98b --- /dev/null +++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectSearch/SelectSearch.razor @@ -0,0 +1,19 @@ +@using GameIdeas.BlazorApp.Shared.Components.Search +@using GameIdeas.BlazorApp.Shared.Components.SelectList +@using GameIdeas.BlazorApp.Shared.Components.SelectList.Helpers +@using GameIdeas.BlazorApp.Shared.Components.SelectList.Models + +@typeparam TItem + + diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectSearch/SelectSearch.razor.cs b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectSearch/SelectSearch.razor.cs new file mode 100644 index 0000000..3b60f5d --- /dev/null +++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectSearch/SelectSearch.razor.cs @@ -0,0 +1,42 @@ +using GameIdeas.BlazorApp.Shared.Components.Search; +using GameIdeas.BlazorApp.Shared.Components.SelectList.Models; +using Microsoft.AspNetCore.Components; + +namespace GameIdeas.BlazorApp.Shared.Components.SelectSearch; + +public partial class SelectSearch +{ + [Parameter] public SelectTheme Theme { get; set; } + [Parameter] public List Items { get; set; } = []; + [Parameter] public Func GetLabel { get; set; } = _ => string.Empty; + [Parameter] public List Values { get; set; } = []; + [Parameter] public EventCallback> ValuesChanged { get; set; } + [Parameter] public string Placeholder { get; set; } = string.Empty; + + private SelectParams SelectParams = new(); + private SearchInput? SearchInput; + protected override void OnParametersSet() + { + SelectParams = new() + { + Items = Items, + GetItemLabel = GetLabel + }; + + base.OnParametersSet(); + } + private async Task HandleValuesChanged(IEnumerable values) + { + Values = values.ToList(); + await ValuesChanged.InvokeAsync(values.ToList()); + } + + private void HandleClearClicked() + { + Values = []; + } + private void HandleTextChanged() + { + Values = []; + } +} \ No newline at end of file diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectSearch/SelectSearch.razor.css b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectSearch/SelectSearch.razor.css new file mode 100644 index 0000000..83cac73 --- /dev/null +++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectSearch/SelectSearch.razor.css @@ -0,0 +1,17 @@ +/* Advanced filter */ +::deep .advanced-filter .search-container { + height: 24px; + background: var(--input-secondary); +} + + ::deep .advanced-filter .search-container input::placeholder { + color: #bbb; + } + +/* Creation */ +::deep .creation .search-container { + height: 24px; + background: var(--input-secondary); + border: solid 1px var(--input-selected); + box-sizing: border-box; +} diff --git a/src/GameIdeas/GameIdeas.Resources/CreateStaticResourceKey.cs b/src/GameIdeas/GameIdeas.Resources/CreateStaticResourceKey.cs index c904515..8f90fac 100644 --- a/src/GameIdeas/GameIdeas.Resources/CreateStaticResourceKey.cs +++ b/src/GameIdeas/GameIdeas.Resources/CreateStaticResourceKey.cs @@ -15,7 +15,7 @@ public class Translations (TranslationService translationService) public string LastAdd => translationService.Translate(nameof(LastAdd)); public string Research => translationService.Translate(nameof(Research)); public string Platforms => translationService.Translate(nameof(Platforms)); - public string Genres => translationService.Translate(nameof(Genres)); + public string Tags => translationService.Translate(nameof(Tags)); public string Publishers => translationService.Translate(nameof(Publishers)); public string Developers => translationService.Translate(nameof(Developers)); public string StorageSize => translationService.Translate(nameof(StorageSize)); @@ -57,7 +57,7 @@ public static class ResourcesKey public static string LastAdd => _instance?.LastAdd ?? throw new InvalidOperationException("ResourcesKey.LastAdd is not initialized."); public static string Research => _instance?.Research ?? throw new InvalidOperationException("ResourcesKey.Research is not initialized."); public static string Platforms => _instance?.Platforms ?? throw new InvalidOperationException("ResourcesKey.Platforms is not initialized."); - public static string Genres => _instance?.Genres ?? throw new InvalidOperationException("ResourcesKey.Genres is not initialized."); + public static string Tags => _instance?.Tags ?? throw new InvalidOperationException("ResourcesKey.Tags is not initialized."); public static string Publishers => _instance?.Publishers ?? throw new InvalidOperationException("ResourcesKey.Publishers is not initialized."); public static string Developers => _instance?.Developers ?? throw new InvalidOperationException("ResourcesKey.Developers is not initialized."); public static string StorageSize => _instance?.StorageSize ?? throw new InvalidOperationException("ResourcesKey.StorageSize is not initialized."); diff --git a/src/GameIdeas/GameIdeas.Shared/Dto/CategoriesDto.cs b/src/GameIdeas/GameIdeas.Shared/Dto/CategoriesDto.cs index 233a090..4d6583f 100644 --- a/src/GameIdeas/GameIdeas.Shared/Dto/CategoriesDto.cs +++ b/src/GameIdeas/GameIdeas.Shared/Dto/CategoriesDto.cs @@ -2,9 +2,9 @@ public class CategoriesDto { - public IEnumerable? Platforms { get; set; } - public IEnumerable? Properties { get; set; } - public IEnumerable? Tags { get; set; } - public IEnumerable? Developers { get; set; } - public IEnumerable? Publishers { get; set; } + public List? Platforms { get; set; } + public List? Properties { get; set; } + public List? Tags { get; set; } + public List? Developers { get; set; } + public List? Publishers { get; set; } } diff --git a/src/GameIdeas/GameIdeas.Shared/Dto/GameFilterDto.cs b/src/GameIdeas/GameIdeas.Shared/Dto/GameFilterDto.cs index 1401e19..d2922c2 100644 --- a/src/GameIdeas/GameIdeas.Shared/Dto/GameFilterDto.cs +++ b/src/GameIdeas/GameIdeas.Shared/Dto/GameFilterDto.cs @@ -6,14 +6,14 @@ public class GameFilterDto public SortTypeDto? SortType { get; set; } public SortPropertyDto? SortProperty { get; set; } public string? Title { get; set; } - public IEnumerable? Platforms { get; set; } - public IEnumerable? Properties { get; set; } - public IEnumerable? Tags { get; set; } - public IEnumerable? Publishers { get; set; } - public IEnumerable? Developers { get; set; } + public List? Platforms { get; set; } + public List? Properties { get; set; } + public List? Tags { get; set; } + public List? Publishers { get; set; } + public List? Developers { get; set; } public int MinInterest { get; set; } = 1; public int MaxInterest { get; set; } = 5; - public IEnumerable? ReleaseYears { get; set; } + public List? ReleaseYears { get; set; } public int? MinStorageSize { get; set; } public int? MaxStorageSize { get; set; } } diff --git a/src/GameIdeas/Server/GameIdeas.WebAPI/Files/GameIdeas.fr.json b/src/GameIdeas/Server/GameIdeas.WebAPI/Files/GameIdeas.fr.json index 5185f4f..a3ec135 100644 --- a/src/GameIdeas/Server/GameIdeas.WebAPI/Files/GameIdeas.fr.json +++ b/src/GameIdeas/Server/GameIdeas.WebAPI/Files/GameIdeas.fr.json @@ -11,7 +11,7 @@ "LastAdd": "Les ajouts récents", "Research": "Rechercher", "Platforms": "Plateformes", - "Genres": "Genres", + "Tags": "Genres", "Publishers": "Editeurs", "Developers": "Développeurs", "StorageSize": "Taille d'espace", diff --git a/src/GameIdeas/Server/GameIdeas.WebAPI/Services/CategoryService.cs b/src/GameIdeas/Server/GameIdeas.WebAPI/Services/CategoryService.cs index 5a1aefc..f3650a1 100644 --- a/src/GameIdeas/Server/GameIdeas.WebAPI/Services/CategoryService.cs +++ b/src/GameIdeas/Server/GameIdeas.WebAPI/Services/CategoryService.cs @@ -18,11 +18,11 @@ public class CategoryService(GameIdeasContext context, IMapper mapper) : ICatego return new() { - Platforms = mapper.Map>(platforms), - Properties = mapper.Map>(properties), - Tags = mapper.Map>(tags), - Developers = mapper.Map>(developers), - Publishers = mapper.Map>(publishers) + Platforms = mapper.Map>(platforms), + Properties = mapper.Map>(properties), + Tags = mapper.Map>(tags), + Developers = mapper.Map>(developers), + Publishers = mapper.Map>(publishers) }; } } -- 2.39.5 From e523b19f8e54b0093c6881c52d1999cf86aa3615 Mon Sep 17 00:00:00 2001 From: Egamorf Date: Sun, 13 Apr 2025 23:51:09 +0200 Subject: [PATCH 4/7] Using bind --- .../Games/Filter/AdvancedGameFilter.razor | 10 +++---- .../Games/Filter/AdvancedGameFilter.razor.cs | 23 +--------------- .../Pages/Games/Filter/GameFilter.razor | 10 +++---- .../Pages/Games/Filter/GameFilter.razor.cs | 26 +++---------------- 4 files changed, 15 insertions(+), 54 deletions(-) diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/AdvancedGameFilter.razor b/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/AdvancedGameFilter.razor index 17ec219..f0b5c3d 100644 --- a/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/AdvancedGameFilter.razor +++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/AdvancedGameFilter.razor @@ -7,20 +7,20 @@
+ @bind-Values=GameFilter.Platforms @bind-Values:after=HandleValueChanged Theme="Theme" Items="Categories?.Platforms" /> + @bind-Values=GameFilter.Tags @bind-Values:after=HandleValueChanged Theme="Theme" Items="Categories?.Tags" />
+ @bind-Values=GameFilter.Properties @bind-Values:after=HandleValueChanged Theme="Theme" Items="Categories?.Properties" /> + @bind-Values=GameFilter.Developers @bind-Values:after=HandleValueChanged Theme="Theme" Items="Categories?.Developers" /> + @bind-Values=GameFilter.Publishers @bind-Values:after=HandleValueChanged Theme="Theme" Items="Categories?.Publishers" /> @ResourcesKey.LastAdd diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/AdvancedGameFilter.razor.cs b/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/AdvancedGameFilter.razor.cs index c1de509..4585358 100644 --- a/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/AdvancedGameFilter.razor.cs +++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/AdvancedGameFilter.razor.cs @@ -12,29 +12,8 @@ public partial class AdvancedGameFilter private readonly SelectTheme Theme = SelectTheme.AdvancedFilter; - private async Task HandlePublishersChanged(List args) + private async Task HandleValueChanged() { - GameFilter.Publishers = args; - await GameFilterChanged.InvokeAsync(GameFilter); - } - private async Task HandleDevelopersChanged(List args) - { - GameFilter.Developers = args; - await GameFilterChanged.InvokeAsync(GameFilter); - } - private async Task HandlePropertiesChanged(List args) - { - GameFilter.Properties = args; - await GameFilterChanged.InvokeAsync(GameFilter); - } - private async Task HandleTagsChanged(List args) - { - GameFilter.Tags = args; - await GameFilterChanged.InvokeAsync(GameFilter); - } - private async Task HandlePlatformsChanged(List args) - { - GameFilter.Platforms = args; await GameFilterChanged.InvokeAsync(GameFilter); } } \ No newline at end of file diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/GameFilter.razor b/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/GameFilter.razor index 22032e4..02ac15a 100644 --- a/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/GameFilter.razor +++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/GameFilter.razor @@ -30,24 +30,24 @@
-
+ @bind-Values=Value.Platforms @bind-Values:after="HandleValueChanged" Theme="SelectTheme.Filter" Items="Categories?.Platforms" />
+ @bind-Values=Value.Tags @bind-Values:after="HandleValueChanged" Theme="SelectTheme.Filter" Items="Categories?.Tags" />
+ @bind-Max="Value.MaxInterest" @bind-Max:after="HandleValueChanged" + @bind-Min="Value.MinInterest" @bind-Min:after="HandleValueChanged" />
diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/GameFilter.razor.cs b/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/GameFilter.razor.cs index 2862ad4..4e580ca 100644 --- a/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/GameFilter.razor.cs +++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Filter/GameFilter.razor.cs @@ -48,39 +48,21 @@ public partial class GameFilter DisplayType = displayType; await DisplayTypeChanged.InvokeAsync(displayType); } + private async Task HandleSortTypeClicked(IEnumerable sortTypes) { Value.SortType = sortTypes.FirstOrDefault(); await ValueChanged.InvokeAsync(Value); } + private async Task HandleSortPropertyClicked(IEnumerable sortProperties) { Value.SortProperty = sortProperties.FirstOrDefault(); await ValueChanged.InvokeAsync(Value); } - private async Task HandleTagsChanged(List args) + + private async Task HandleValueChanged() { - Value.Tags = args; - await ValueChanged.InvokeAsync(Value); - } - private async Task HandleMinChanged(int args) - { - Value.MinInterest = args; - await ValueChanged.InvokeAsync(Value); - } - private async Task HandleMaxChanged(int args) - { - Value.MaxInterest = args; - await ValueChanged.InvokeAsync(Value); - } - private async Task HandlePlatformsChanged(List args) - { - Value.Platforms = args; - await ValueChanged.InvokeAsync(Value); - } - private async Task HandleTitleChanged(string args) - { - Value.Title = args; await ValueChanged.InvokeAsync(Value); } } \ No newline at end of file -- 2.39.5 From 0568382812f309eae61fde9c6b7d5009894e8adc Mon Sep 17 00:00:00 2001 From: Egamorf Date: Mon, 14 Apr 2025 00:18:51 +0200 Subject: [PATCH 5/7] Remove old multiple select list --- .../Games/Components/GameCreationForm.razor | 23 +++--- .../Components/GameCreationForm.razor.cs | 7 +- .../Pages/Games/Header/GameHeader.razor | 2 +- .../Select/Components/SelectListElement.razor | 15 ---- .../Components/SelectListElement.razor.cs | 15 ---- .../Components/SelectListElement.razor.css | 81 ------------------- .../Components/Select/Models/SelectElement.cs | 9 --- .../Components/Select/Models/SelectTheme.cs | 10 --- .../Select/MultipleSelectList.razor | 35 -------- .../Select/MultipleSelectList.razor.cs | 65 --------------- .../Select/MultipleSelectList.razor.css | 72 ----------------- .../Select/MultipleSelectList.razor.js | 19 ----- .../Shared/Components/SelectList/Select.razor | 4 +- .../Components/SelectList/Select.razor.cs | 1 - .../Components/SelectList/Select.razor.css | 11 +-- .../SelectSearch/SelectSearch.razor.css | 10 +-- src/GameIdeas/GameIdeas.Shared/Dto/GameDto.cs | 10 +-- 17 files changed, 31 insertions(+), 358 deletions(-) delete mode 100644 src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Select/Components/SelectListElement.razor delete mode 100644 src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Select/Components/SelectListElement.razor.cs delete mode 100644 src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Select/Components/SelectListElement.razor.css delete mode 100644 src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Select/Models/SelectElement.cs delete mode 100644 src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Select/Models/SelectTheme.cs delete mode 100644 src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Select/MultipleSelectList.razor delete mode 100644 src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Select/MultipleSelectList.razor.cs delete mode 100644 src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Select/MultipleSelectList.razor.css delete mode 100644 src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Select/MultipleSelectList.razor.js diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Components/GameCreationForm.razor b/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Components/GameCreationForm.razor index 0adb6db..c223842 100644 --- a/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Components/GameCreationForm.razor +++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Components/GameCreationForm.razor @@ -1,5 +1,4 @@ -@using GameIdeas.BlazorApp.Shared.Components.Select -@using GameIdeas.BlazorApp.Shared.Components.Select.Models +@using GameIdeas.BlazorApp.Shared.Components.SelectSearch @using GameIdeas.BlazorApp.Shared.Components.Slider @using GameIdeas.Shared.Dto @@ -20,13 +19,13 @@
@ResourcesKey.Developers :
- +
@ResourcesKey.Publishers :
- +
@@ -38,19 +37,19 @@
@ResourcesKey.Properties :
- +
@ResourcesKey.Tags :
- +
@ResourcesKey.Platforms :
- +
diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Components/GameCreationForm.razor.cs b/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Components/GameCreationForm.razor.cs index 657b891..e9ad565 100644 --- a/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Components/GameCreationForm.razor.cs +++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Components/GameCreationForm.razor.cs @@ -1,5 +1,5 @@ using GameIdeas.BlazorApp.Shared.Components.Popup; -using GameIdeas.BlazorApp.Shared.Components.Select.Models; +using GameIdeas.BlazorApp.Shared.Components.SelectList.Models; using GameIdeas.BlazorApp.Shared.Components.Slider; using GameIdeas.Shared.Dto; using Microsoft.AspNetCore.Components; @@ -12,12 +12,11 @@ public partial class GameCreationForm { [Inject] private IJSRuntime Js { get; set; } = default!; [CascadingParameter] private Popup? Popup { get; set; } - [Parameter] public CategoriesDto Categories { get; set; } = new(); + [Parameter] public CategoriesDto? Categories { get; set; } private GameDto GameDto = new(); - private CategoriesDto CategoriesDto = new(); private EditContext? EditContext; - private readonly SelectListTheme SelectListTheme = SelectListTheme.Creation; + private readonly SelectTheme Theme = SelectTheme.Creation; private readonly SliderParams SliderParams = new() { Gap = 1, Min = 1, Max = 5 }; protected override async Task OnInitializedAsync() diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Header/GameHeader.razor b/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Header/GameHeader.razor index 40a95ab..0f3349c 100644 --- a/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Header/GameHeader.razor +++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Pages/Games/Header/GameHeader.razor @@ -24,7 +24,7 @@
- +
diff --git a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectSearch/SelectSearch.razor.cs b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectSearch/SelectSearch.razor.cs index 5bcaa72..a9d03d7 100644 --- a/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectSearch/SelectSearch.razor.cs +++ b/src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SelectSearch/SelectSearch.razor.cs @@ -1,5 +1,6 @@ using GameIdeas.BlazorApp.Shared.Components.Search; -using GameIdeas.BlazorApp.Shared.Components.SelectList.Models; +using GameIdeas.BlazorApp.Shared.Components.Select.Models; +using GameIdeas.BlazorApp.Shared.Components.Select; using Microsoft.AspNetCore.Components; namespace GameIdeas.BlazorApp.Shared.Components.SelectSearch; @@ -15,6 +16,7 @@ public partial class SelectSearch private SelectParams SelectParams = new(); private SearchInput? SearchInput; + private Select? Select; protected override void OnParametersSet() { SelectParams = new() @@ -36,8 +38,9 @@ public partial class SelectSearch { Values = []; } - private void HandleTextChanged() + + private void HandleFocusIn() { - Values = []; + Select?.Open(); } } \ No newline at end of file -- 2.39.5