PRJ-Game-Ideas/game-ideas
3
0
Fork 0
Code Issues 4 Pull Requests 1 Actions Packages Projects Releases Wiki Activity

Correct bunch of issues (#36)
All checks were successful
Game Ideas deploy / build-test-deploy (push) Successful in 1m28s
Details

Browse Source 
Reviewed-on: #36
This commit was merged in pull request #36.
This commit is contained in:
Egamorf
2025-04-29 23:49:11 +02:00
parent d3d16493e6
commit f3c9e1d9da
37 changed files with 246 additions and 186 deletions
Download Patch File Download Diff File Expand all files Collapse all files

27
src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/ButtonAdd/ButtonAdd.razor Normal file
View File

@@ -0,0 +1,27 @@
@using GameIdeas.BlazorApp.Shared.Components.Select
@using GameIdeas.BlazorApp.Shared.Components.Select.Models
@using GameIdeas.Shared.Constants
@using GameIdeas.BlazorApp.Shared.Models
@using Microsoft.AspNetCore.Components.Authorization
<AuthorizeView Roles="@GlobalConstants.ADMIN_MEMBER">
<Authorized>
<div class="add-buttons">
<div class="first-button button">
<svg class="button-icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
<path d="M19,13H13V19H11V13H5V11H11V5H13V11H19V13Z" />
</svg>
</div>
<Select @ref="SelectListAdd" TItem="KeyValuePair<AddType, string>" THeader="object"
ValuesChanged=HandleAddTypeClicked Params=SelectParams Theme="SelectTheme.Navigation">
<div class="second-button button">
<svg class="button-icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
<path d="M1 3H23L12 22" />
</svg>
</div>
</Select>
</div>
</Authorized>
</AuthorizeView>

37
src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/ButtonAdd/ButtonAdd.razor.cs Normal file
View File

@@ -0,0 +1,37 @@
using GameIdeas.BlazorApp.Shared.Components.Select.Models;
using GameIdeas.BlazorApp.Shared.Components.Select;
using GameIdeas.BlazorApp.Shared.Models;
using GameIdeas.Resources;
using Microsoft.AspNetCore.Components;
namespace GameIdeas.BlazorApp.Shared.Components.ButtonAdd;
public partial class ButtonAdd
{
[Parameter] public EventCallback<AddType> AddTypeChanged { get; set; }
private readonly Dictionary<AddType, string> AddTypes = new() {
{ AddType.Manual, ResourcesKey.ManualAdd },
{ AddType.Auto, ResourcesKey.AutoAdd }
};
private Select<KeyValuePair<AddType, string>, object>? SelectListAdd;
private SelectParams<KeyValuePair<AddType, string>, object> SelectParams = new();
protected override void OnInitialized()
{
SelectParams = new()
{
Items = [.. AddTypes],
GetItemLabel = item => item.Value
};
base.OnInitialized();
}
private async Task HandleAddTypeClicked(IEnumerable<KeyValuePair<AddType, string>> values)
{
SelectListAdd?.Close();
await AddTypeChanged.InvokeAsync(values.FirstOrDefault().Key);
}
}

37
src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/ButtonAdd/ButtonAdd.razor.css Normal file
View File

@@ -0,0 +1,37 @@
.add-buttons {
display: flex;
flex-direction: row;
background: var(--violet);
border-radius: var(--small-radius);
margin-right: 40px;
margin-left: 8px;
}
.button {
display: flex;
justify-content: center;
align-items: center;
width: 28px;
height: 28px;
}
.first-button {
border-right: 2px solid var(--violet-selected);
border-radius: var(--small-radius) 0 0 var(--small-radius);
overflow: hidden;
}
.second-button .button-icon {
padding: 6px;
border-radius: 0 var(--small-radius) var(--small-radius) 0;
overflow: hidden;
}
.button-icon {
fill: var(--white);
}
.button-icon:hover {
background: var(--violet-selected);
cursor: pointer;
}

22
src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Header/HeaderGameIdeas.razor Normal file
View File

@@ -0,0 +1,22 @@
 @using GameIdeas.BlazorApp.Pages.Games
@using GameIdeas.BlazorApp.Pages.UserMenu
@using GameIdeas.BlazorApp.Shared.Components.Select
@using GameIdeas.BlazorApp.Shared.Components.Select.Models
@using GameIdeas.BlazorApp.Shared.Models
@using GameIdeas.Resources
@using GameIdeas.Shared.Constants
@using Microsoft.AspNetCore.Components.Authorization
@inherits ComponentBase
<div class="header-tab">
<a href="/" class="icon-container">
<img src="icon.png" alt="Game Ideas">
</a>
<div class="content">
@ChildContent
</div>
<UserMenu />
</div>

12
src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Header/HeaderGameIdeas.razor.cs Normal file
View File

@@ -0,0 +1,12 @@
using GameIdeas.BlazorApp.Shared.Components.Select;
using GameIdeas.BlazorApp.Shared.Components.Select.Models;
using GameIdeas.BlazorApp.Shared.Models;
using GameIdeas.Resources;
using Microsoft.AspNetCore.Components;
namespace GameIdeas.BlazorApp.Shared.Components.Header;
public partial class HeaderGameIdeas : ComponentBase
{
[Parameter] public RenderFragment? ChildContent { get; set; }
}

28
src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Header/HeaderGameIdeas.razor.css Normal file
View File

@@ -0,0 +1,28 @@
.header-tab {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: flex-end;
padding: 0px 10px;
height: 40px;
}
.icon-container {
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
width: 40px;
height: 100%;
cursor: pointer;
}
.icon-container img {
max-height: 85%;
max-width: 85%;
}
.content {
width: 100%;
display: flex;
}

3
src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Search/SearchInput.razor.cs
View File

@@ -1,4 +1,5 @@
using GameIdeas.BlazorApp.Shared.Constants;
using GameIdeas.Shared.Constants;
using Microsoft.AspNetCore.Components;
namespace GameIdeas.BlazorApp.Shared.Components.Search;
@@ -21,7 +22,7 @@ public partial class SearchInput
Text = string.Empty;
Timer = new()
{
Interval = 500,
Interval = GlobalConstants.DELAY_INPUT_MS,
AutoReset = false,
};

15
src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Slider/Slider.razor
View File

@@ -1,11 +1,10 @@
<div class="container">
<div class="slider-track"></div>
<input type="range" id="min-range" style="@StatusColor(Value)" min="@Params.Min" max="@Params.Max"
@bind="@Value" @bind:event="oninput" @bind:after=HandleSlideOnInput />
<div class="input">
<div class="slider-track"></div>
<div class="values">
<span class="value">@Params.Min</span>
<span class="value">@Params.Max</span>
<input type="range" id="min-range" style="@StatusColor(Value)" min="@Params.Min" max="@Params.Max"
@bind="@Value" @bind:event="oninput" @bind:after=HandleSlideOnInput />
</div>
</div>
<span class="value">@Value</span>
</div>

21
src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/Slider/Slider.razor.css
View File

@@ -1,7 +1,7 @@
.container {
position: relative;
.input {
width: 100%;
z-index: 0
position: relative;
height: 2px;
}
input[type="range"] {
@@ -24,7 +24,6 @@ input[type="range"] {
margin: auto;
border-radius: 2px;
background: var(--input-primary);
}
input[type="range"]::-webkit-slider-runnable-track {
@@ -75,15 +74,13 @@ input[type="range"]::-ms-thumb {
}
.values {
display: flex;
position: absolute;
margin-top: 2px;
width: 100%;
font-weight: bold;
justify-content: space-between;
width: 1em;
}
.value {
width: 1em;
text-align:center;
.container {
gap: 8px;
width: 100%;
display: flex;
align-items: center;
}

12
src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SliderRange/SliderRange.razor
View File

@@ -1,13 +1,13 @@
<div class="container">
<div class="slider-track" style="@FillColor()"></div>
<input type="range" id="min-range" style="@StatusColor(Min)" min="@Params.Min" max="@Params.Max"
@bind="@Min" @bind:event="oninput" @bind:after=HandleSlideOnInput />
<input type="range" id="max-range" style="@StatusColor(Max)" min="@Params.Min" max="@Params.Max"
@bind="@Max" @bind:event="oninput" @bind:after=HandleSlideTwoInput />
<input type="range" id="min-range" style="@StatusColor(Value.Min)" min="@Params.Min" max="@Params.Max"
@bind="@Value.Min" @bind:event="oninput" @bind:after=HandleSlideOnInput />
<input type="range" id="max-range" style="@StatusColor(Value.Max)" min="@Params.Min" max="@Params.Max"
@bind="@Value.Max" @bind:event="oninput" @bind:after=HandleSlideTwoInput />
<div class="values">
<span class="value">@Min</span>
<span class="value">@Max</span>
<span class="value">@Value.Min</span>
<span class="value">@Value.Max</span>
</div>
</div>

50
src/GameIdeas/Client/GameIdeas.BlazorApp/Shared/Components/SliderRange/SliderRange.razor.cs
View File

@@ -1,44 +1,58 @@
using GameIdeas.Shared.Constants;
using GameIdeas.Shared.Dto;
using Microsoft.AspNetCore.Components;
using System.Threading.Tasks;
namespace GameIdeas.BlazorApp.Shared.Components.SliderRange;
public partial class SliderRange
{
[Parameter] public SliderRangeParams Params { get; set; } = new();
[Parameter] public int Max { get; set; }
[Parameter] public EventCallback<int> MaxChanged { get; set; }
[Parameter] public int Min { get; set; }
[Parameter] public EventCallback<int> MinChanged { get; set; }
[Parameter] public MinMaxDto Value { get; set; } = new() { Min = 1, Max = 5 };
[Parameter] public EventCallback<MinMaxDto> ValueChanged { get; set; }
private async Task HandleSlideTwoInput()
private System.Timers.Timer? Timer;
protected override void OnInitialized()
{
if (Max - Min <= Params.Gap)
Timer = new()
{
Min = Max - Params.Gap;
}
Interval = GlobalConstants.DELAY_INPUT_MS,
AutoReset = false,
};
await MaxChanged.InvokeAsync(Max);
Timer.Elapsed += async (_, _) => await ValueChanged.InvokeAsync(Value);
base.OnInitialized();
}
private async Task HandleSlideOnInput()
private void HandleSlideTwoInput()
{
if (Max - Min <= Params.Gap)
if (Value.Max - Value.Min <= Params.Gap)
{
Max = Min + Params.Gap;
Value.Min = Value.Max - Params.Gap;
}
await MinChanged.InvokeAsync(Min);
Timer?.Stop();
Timer?.Start();
}
private void HandleSlideOnInput()
{
if (Value.Max - Value.Min <= Params.Gap)
{
Value.Max = Value.Min + Params.Gap;
}
Timer?.Stop();
Timer?.Start();
}
private string FillColor()
{
var percent1 = (double)(Min - Params.Min) / (Params.Max - Params.Min) * 100;
var percent2 = (double)(Max - Params.Min) / (Params.Max - Params.Min) * 100;
var percent1 = (double?)(Value.Min - Params.Min) / (Params.Max - Params.Min) * 100;
var percent2 = (double?)(Value.Max - Params.Min) / (Params.Max - Params.Min) * 100;
return $"background: linear-gradient(to right, var(--line) {percent1}% , var(--violet) {percent1}% , var(--violet) {percent2}%, var(--line) {percent2}%)";
}
private string StatusColor(int value)
private string StatusColor(int? value)
{
string str = "--thumb-color: var({0});";