diff --git a/WotBlitzStatisticsPro.Blazor/Pages/PlayerInfoTanksTree.razor b/WotBlitzStatisticsPro.Blazor/Pages/PlayerInfoTanksTree.razor index 1688c4d..3b2d406 100644 --- a/WotBlitzStatisticsPro.Blazor/Pages/PlayerInfoTanksTree.razor +++ b/WotBlitzStatisticsPro.Blazor/Pages/PlayerInfoTanksTree.razor @@ -1,3 +1,34 @@ @inherits PlayerInfoTanksTreeBase; - - +
+ + @for (int i = 0; i < 3; i++) + { + + + + + + @TanksList.ToArray()[i].Name + + + + + } + +
diff --git a/WotBlitzStatisticsPro.Blazor/Pages/PlayerInfoTanksTreeBase.cs b/WotBlitzStatisticsPro.Blazor/Pages/PlayerInfoTanksTreeBase.cs index 8a94e25..f65fbaf 100644 --- a/WotBlitzStatisticsPro.Blazor/Pages/PlayerInfoTanksTreeBase.cs +++ b/WotBlitzStatisticsPro.Blazor/Pages/PlayerInfoTanksTreeBase.cs @@ -1,8 +1,11 @@ using MediatR; using Microsoft.AspNetCore.Components; using Microsoft.Extensions.Localization; +using System; using System.Collections.Generic; +using System.Threading.Tasks; using WotBlitzStatisticsPro.Blazor.GraphQl; +using WotBlitzStatisticsPro.Blazor.Services; namespace WotBlitzStatisticsPro.Blazor.Pages { @@ -17,5 +20,29 @@ namespace WotBlitzStatisticsPro.Blazor.Pages [Inject] public IMediator Mediator { get; set; } + [Inject] + public IMediaQueriesService MediaQueriesService { get; set; } + + public int FrameWidth { get; set; } + public int FrameHeigth { get; set; } + + public string FrameStyle + { + get + { + return $"min-height: {FrameHeigth}px; overflow-y: auto; overflow-x: auto;"; + } + } + + protected async override Task OnInitializedAsync() + { + var screenWidth = await MediaQueriesService.WindowWidth(); + var screenHeight = await MediaQueriesService.WindowHeight(); + + FrameWidth = Convert.ToInt32(((decimal)screenWidth) * 0.94m); + FrameHeigth = screenHeight - 390; + } + + } } diff --git a/WotBlitzStatisticsPro.Blazor/Services/IMediaQueriesService.cs b/WotBlitzStatisticsPro.Blazor/Services/IMediaQueriesService.cs index 58c4dd2..62fc67c 100644 --- a/WotBlitzStatisticsPro.Blazor/Services/IMediaQueriesService.cs +++ b/WotBlitzStatisticsPro.Blazor/Services/IMediaQueriesService.cs @@ -5,5 +5,9 @@ namespace WotBlitzStatisticsPro.Blazor.Services public interface IMediaQueriesService { ValueTask IsScreenWidthLessThen(long widthInPx); + + ValueTask WindowWidth(); + + ValueTask WindowHeight(); } } diff --git a/WotBlitzStatisticsPro.Blazor/Services/MediaQueriesService.cs b/WotBlitzStatisticsPro.Blazor/Services/MediaQueriesService.cs index 47eb2d9..468573c 100644 --- a/WotBlitzStatisticsPro.Blazor/Services/MediaQueriesService.cs +++ b/WotBlitzStatisticsPro.Blazor/Services/MediaQueriesService.cs @@ -16,5 +16,15 @@ namespace WotBlitzStatisticsPro.Blazor.Services { return _jsRuntime.InvokeAsync("mediaQueries.IsScreenWidthLessThen", widthInPx); } + + public ValueTask WindowHeight() + { + return _jsRuntime.InvokeAsync("mediaQueries.ScreenHeight"); + } + + public ValueTask WindowWidth() + { + return _jsRuntime.InvokeAsync("mediaQueries.ScreenWidth"); + } } } diff --git a/WotBlitzStatisticsPro.Blazor/wwwroot/media-queries.js b/WotBlitzStatisticsPro.Blazor/wwwroot/media-queries.js index 77458b7..25a0a66 100644 --- a/WotBlitzStatisticsPro.Blazor/wwwroot/media-queries.js +++ b/WotBlitzStatisticsPro.Blazor/wwwroot/media-queries.js @@ -3,4 +3,12 @@ mediaQueries.IsScreenWidthLessThen = function (width) { let mql = window.matchMedia(`(max-width: ${width}px)`); return mql.matches; -}; \ No newline at end of file +}; + +mediaQueries.ScreenWidth = function () { + return window.innerWidth; +} + +mediaQueries.ScreenHeight = function () { + return window.innerHeight; +} \ No newline at end of file