mirror of
https://github.com/DrMboga/WotBlitzStatisticsBlazor.git
synced 2026-10-21 02:17:20 +02:00
feat: Real cards in a tree
This commit is contained in:
Mikhail Shabanov committed
1 parent
10f9dc1557
commit
dd4dedd787
3 files changed
+181
-78
No files matched your search
@@ -0,0 +1,37 @@
|
||||
using System;
|
||||
using WotBlitzStatisticsPro.Blazor.GraphQl;
|
||||
|
||||
namespace WotBlitzStatisticsPro.Blazor.Model
|
||||
{
|
||||
public class TankTreeItem
|
||||
{
|
||||
public long TankId { get; set; }
|
||||
|
||||
public int Tier { get; set; }
|
||||
|
||||
public int Row { get; set; }
|
||||
|
||||
public string TankTypeId { get; set; }
|
||||
|
||||
public bool IsPremium { get; set; }
|
||||
|
||||
public bool IsResearched { get; set; }
|
||||
|
||||
public string PreviewImage { get; set; }
|
||||
|
||||
public string Name { get; set; }
|
||||
|
||||
public MarkOfMastery? MarkOfMastery { get; set; }
|
||||
|
||||
public decimal? WinRate { get; set; }
|
||||
|
||||
public decimal? AvgDamage { get; set; }
|
||||
|
||||
public long? Battles { get; set; }
|
||||
|
||||
public DateTimeOffset? LastBattleTime { get; set; }
|
||||
|
||||
public Decimal PriceCredit { get; set; }
|
||||
|
||||
}
|
||||
}
|
||||
@@ -1,4 +1,5 @@
|
||||
@using WotBlitzStatisticsPro.Blazor.Helpers
|
||||
@using System.Linq
|
||||
@inherits PlayerInfoTanksTreeBase;
|
||||
<div style="overflow-y: auto; overflow-x: auto;">
|
||||
<svg
|
||||
@@ -18,88 +19,88 @@
|
||||
>
|
||||
</rect>
|
||||
}
|
||||
@for (int i = 0; i < 3; i++)
|
||||
@if (TreeItems != null)
|
||||
{
|
||||
<!-- Tank card svg-->
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
x="20"
|
||||
y="@(i * (CardWidth + 20) + 20)"
|
||||
width="@CardWidth"
|
||||
height="@CardHeigth">
|
||||
<g>
|
||||
<!--Rect fill = #275950 - researched, #2E353B - unresearched, #66502b - prem-->
|
||||
<rect
|
||||
x="0"
|
||||
y="0"
|
||||
@for (int tier = 1; tier < 11; tier++)
|
||||
{
|
||||
@foreach (var tank in TreeItems.Where(t => t.Tier == tier).OrderBy(t => t.Row).ToList())
|
||||
{
|
||||
<!-- Tank card svg-->
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
x="@((tier - 1) * (CardWidth + 40) + 20)"
|
||||
y="@(tank.Row * (CardHeigth + 20) + 20)"
|
||||
width="@CardWidth"
|
||||
height="@CardHeigth"
|
||||
rx="10"
|
||||
ry="10"
|
||||
fill="@(i == 0 ? "#275950" : (i == 1 ? "#2E353B" : "#66502b"))"
|
||||
>
|
||||
</rect>
|
||||
|
||||
<!--Tank type-->
|
||||
<image x="7" y="7" width="25" height="25" href="@TanksList.ToArray()[i].TankTypeId.TankTypeAsset(i == 2)"/>
|
||||
<!--Tank tier-->
|
||||
<text x="33" y="4" fill="@(i == 2 ? @Constants.ClanTagColor : "white")" text-anchor="start" alignment-baseline="before-edge" font-family="Segoe UI" font-size="19">
|
||||
@TanksList.ToArray()[i].Tier.RomanNumber()
|
||||
</text>
|
||||
<!--TankImage-->
|
||||
<image x="@((CardWidth - 95) / 2)" y="@((CardHeigth - 70) / 2)" width="95" height="70" href="@TanksList.ToArray()[i].PreviewImage"/>
|
||||
<!--TankName-->
|
||||
<text x="33" y="@(CardHeigth - 25)" fill="@(i == 2 ? @Constants.ClanTagColor : "white")" text-anchor="start" alignment-baseline="before-edge" font-family="Segoe UI" font-size="12">
|
||||
@TanksList.ToArray()[i].Name
|
||||
</text>
|
||||
|
||||
<!--Researched: Mastery, Winrate, AvgDmg, Battles, LastBattle-->
|
||||
@if (i == 0 || i == 2)
|
||||
{
|
||||
height="@CardHeigth">
|
||||
<g>
|
||||
<!--Mastery-->
|
||||
<image x="7" y="@(CardHeigth - 26)" width="20" height="20" href="@TanksList.ToArray()[i].MarkOfMastery.IconAsset()"/>
|
||||
<!--Winrate-->
|
||||
<image x="7" y="40" width="20" height="20" href="icons/details.wins.scale-200.png"/>
|
||||
<text x="32" y="40" fill="white" text-anchor="start" alignment-baseline="before-edge" font-family="Segoe UI" font-size="12">
|
||||
@(TanksList.ToArray()[i].WinRate.ToString("N0"))%
|
||||
<!--Rect fill = #275950 - researched, #2E353B - unresearched, #66502b - prem-->
|
||||
<rect
|
||||
x="0"
|
||||
y="0"
|
||||
width="@CardWidth"
|
||||
height="@CardHeigth"
|
||||
rx="10"
|
||||
ry="10"
|
||||
fill="@(tank.IsResearched ? (tank.IsPremium ? "#66502b" : "#275950") : "#2E353B")">
|
||||
</rect>
|
||||
|
||||
<!--Tank type-->
|
||||
<image x="7" y="7" width="25" height="25" href="@tank.TankTypeId.TankTypeAsset(tank.IsPremium)"/>
|
||||
<!--Tank tier-->
|
||||
<text x="33" y="4" fill="@(tank.IsPremium ? Constants.ClanTagColor : "white")" text-anchor="start" alignment-baseline="before-edge" font-family="Segoe UI" font-size="19">
|
||||
@tank.Tier.RomanNumber()
|
||||
</text>
|
||||
<line x1="8" y1="60" x2="58" y2="60" style="@($"stroke:{TanksList.ToArray()[i].WinRate.ScaleColor()};stroke-width:3")"/>
|
||||
<!--AvgDmg-->
|
||||
<image x="@(CardWidth - 62)" y="40" width="20" height="20" href="icons/damage.scale-200.png"/>
|
||||
<text x="@(CardWidth - 37)" y="40" fill="white" text-anchor="start" alignment-baseline="before-edge" font-family="Segoe UI" font-size="12">
|
||||
@TanksList.ToArray()[i].AvgDamage.ToString("N0")
|
||||
</text>
|
||||
<!--Battles-->
|
||||
<image x="@(CardWidth - 62)" y="9" width="20" height="20" href="icons/details.battles.scale-200.png"/>
|
||||
<text x="@(CardWidth - 37)" y="9" fill="white" text-anchor="start" alignment-baseline="before-edge" font-family="Segoe UI" font-size="12">
|
||||
@TanksList.ToArray()[i].Battles.ToString("N0")
|
||||
</text>
|
||||
<!--Last battle-->
|
||||
<image x="@(CardWidth - 83)" y="@(CardHeigth - 23)" width="16" height="16" href="icons/calendar.scale-200.png"/>
|
||||
<text x="@(CardWidth - 60)" y="@(CardHeigth - 23)" fill="white" text-anchor="start" alignment-baseline="before-edge" font-family="Segoe UI" font-size="12">
|
||||
@TanksList.ToArray()[i].LastBattleTime.ToString("d")
|
||||
<!--TankImage-->
|
||||
<image x="@((CardWidth - 95) / 2)" y="@((CardHeigth - 70) / 2)" width="95" height="70" href="@tank.PreviewImage"/>
|
||||
<!--TankName-->
|
||||
<text x="33" y="@(CardHeigth - 25)" fill="@(tank.IsPremium ? Constants.ClanTagColor : "white")" text-anchor="start" alignment-baseline="before-edge" font-family="Segoe UI" font-size="12">
|
||||
@tank.Name
|
||||
</text>
|
||||
|
||||
<!--Researched: Mastery, Winrate, AvgDmg, Battles, LastBattle-->
|
||||
@if (tank.IsResearched && tank.MarkOfMastery.HasValue && tank.WinRate.HasValue && tank.AvgDamage.HasValue && tank.Battles.HasValue && tank.LastBattleTime.HasValue)
|
||||
{
|
||||
<g>
|
||||
<!--Mastery-->
|
||||
<image x="7" y="@(CardHeigth - 26)" width="20" height="20" href="@tank.MarkOfMastery.Value.IconAsset()"/>
|
||||
<!--Winrate-->
|
||||
<image x="7" y="40" width="20" height="20" href="icons/details.wins.scale-200.png"/>
|
||||
<text x="32" y="40" fill="white" text-anchor="start" alignment-baseline="before-edge" font-family="Segoe UI" font-size="12">
|
||||
@(tank.WinRate.Value.ToString("N0"))%
|
||||
</text>
|
||||
<line x1="8" y1="60" x2="58" y2="60" style="@($"stroke:{tank.WinRate.Value.ScaleColor()};stroke-width:3")"/>
|
||||
<!--AvgDmg-->
|
||||
<image x="@(CardWidth - 62)" y="40" width="20" height="20" href="icons/damage.scale-200.png"/>
|
||||
<text x="@(CardWidth - 37)" y="40" fill="white" text-anchor="start" alignment-baseline="before-edge" font-family="Segoe UI" font-size="12">
|
||||
@tank.AvgDamage.Value.ToString("N0")
|
||||
</text>
|
||||
<!--Battles-->
|
||||
<image x="@(CardWidth - 62)" y="9" width="20" height="20" href="icons/details.battles.scale-200.png"/>
|
||||
<text x="@(CardWidth - 37)" y="9" fill="white" text-anchor="start" alignment-baseline="before-edge" font-family="Segoe UI" font-size="12">
|
||||
@tank.Battles.Value.ToString("N0")
|
||||
</text>
|
||||
<!--Last battle-->
|
||||
<image x="@(CardWidth - 83)" y="@(CardHeigth - 23)" width="16" height="16" href="icons/calendar.scale-200.png"/>
|
||||
<text x="@(CardWidth - 60)" y="@(CardHeigth - 23)" fill="white" text-anchor="start" alignment-baseline="before-edge" font-family="Segoe UI" font-size="12">
|
||||
@tank.LastBattleTime.Value.ToString("d")
|
||||
</text>
|
||||
</g>
|
||||
}
|
||||
<!--Unresearched: XP, Credits-->
|
||||
@if (!tank.IsResearched)
|
||||
{
|
||||
<g>
|
||||
<!--Credits-->
|
||||
<image x="@(CardWidth - 84)" y="@(CardHeigth - 23)" width="20" height="20" href="icons/encyclopedia.vehicle.credits.scale-200.png"/>
|
||||
<text x="@(CardWidth - 60)" y="@(CardHeigth - 23)" fill="white" text-anchor="start" alignment-baseline="before-edge" font-family="Segoe UI" font-size="12">
|
||||
@((tank.PriceCredit / 1000).ToString("N0")) K
|
||||
</text>
|
||||
</g>
|
||||
}
|
||||
</g>
|
||||
}
|
||||
<!--Unresearched: XP, Credits-->
|
||||
@if (i == 1)
|
||||
{
|
||||
<g>
|
||||
<!--XP-->
|
||||
<image x="@(CardWidth - 84)" y="9" width="20" height="20" href="icons/xp.avg.scale-200.png"/>
|
||||
<text x="@(CardWidth - 60)" y="9" fill="white" text-anchor="start" alignment-baseline="before-edge" font-family="Segoe UI" font-size="12">
|
||||
203.5 K
|
||||
</text>
|
||||
<!--Credits-->
|
||||
<image x="@(CardWidth - 84)" y="@(CardHeigth - 23)" width="20" height="20" href="icons/encyclopedia.vehicle.credits.scale-200.png"/>
|
||||
<text x="@(CardWidth - 60)" y="@(CardHeigth - 23)" fill="white" text-anchor="start" alignment-baseline="before-edge" font-family="Segoe UI" font-size="12">
|
||||
8 500 K
|
||||
</text>
|
||||
</g>
|
||||
}
|
||||
</g>
|
||||
</svg>
|
||||
</svg>
|
||||
}
|
||||
}
|
||||
}
|
||||
</svg>
|
||||
</div>
|
||||
@@ -41,6 +41,10 @@ namespace WotBlitzStatisticsPro.Blazor.Pages
|
||||
public int CardWidth { get; } = 200;
|
||||
public int CardHeigth { get; } = 120;
|
||||
|
||||
public List<TankTreeItem> TreeItems { get; set; } = new();
|
||||
|
||||
public string SelectedNation { get; set; } = "germany";
|
||||
|
||||
public string FrameStyle
|
||||
{
|
||||
get
|
||||
@@ -56,8 +60,8 @@ namespace WotBlitzStatisticsPro.Blazor.Pages
|
||||
// TODO: Move it to the Nation selector handler
|
||||
try
|
||||
{
|
||||
string nationId = "germany";
|
||||
VehiclesLibrary = await GraphQlBackendService.GetVehiclesByNation(nationId);
|
||||
VehiclesLibrary = await GraphQlBackendService.GetVehiclesByNation(SelectedNation);
|
||||
BuildTree();
|
||||
}
|
||||
catch (System.Exception e)
|
||||
{
|
||||
@@ -71,5 +75,66 @@ namespace WotBlitzStatisticsPro.Blazor.Pages
|
||||
{
|
||||
return SvgHelper.CalculateTextBlockSize(text, fontFace, fontSize).Width;
|
||||
}
|
||||
|
||||
private void BuildTree()
|
||||
{
|
||||
TreeItems.Clear();
|
||||
var vehiclesTree = VehiclesLibrary.Where(v => v.IsPremium == false).ToList();
|
||||
for (int tier = 1; tier < 11; tier++)
|
||||
{
|
||||
var vehiclesByTier = vehiclesTree.Where(v => v.Tier == tier).ToList();
|
||||
int row = 0;
|
||||
foreach (var vehicleFromDictionary in vehiclesByTier)
|
||||
{
|
||||
var treeItem = new TankTreeItem
|
||||
{
|
||||
Tier = tier,
|
||||
TankId = vehicleFromDictionary.TankId,
|
||||
Name = vehicleFromDictionary.Name,
|
||||
PriceCredit = vehicleFromDictionary.PriceCredit,
|
||||
PreviewImage = vehicleFromDictionary.PreviewImage,
|
||||
TankTypeId = vehicleFromDictionary.TypeId,
|
||||
IsPremium = false,
|
||||
Row = row
|
||||
};
|
||||
var researched = TanksList.FirstOrDefault(t => t.TankId == treeItem.TankId);
|
||||
treeItem.IsResearched = researched != null;
|
||||
if (researched != null)
|
||||
{
|
||||
treeItem.MarkOfMastery = researched.MarkOfMastery;
|
||||
treeItem.WinRate = researched.WinRate;
|
||||
treeItem.AvgDamage = researched.AvgDamage;
|
||||
treeItem.Battles = researched.Battles;
|
||||
treeItem.LastBattleTime = researched.LastBattleTime;
|
||||
}
|
||||
|
||||
TreeItems.Add(treeItem);
|
||||
row++;
|
||||
}
|
||||
}
|
||||
// TODO: build matrix and connections
|
||||
|
||||
// Adding prem tanks
|
||||
foreach (var prem in TanksList.Where(t => t.IsPremium && t.TankNationId == SelectedNation))
|
||||
{
|
||||
int row = TreeItems.Count(i => i.Tier == prem.Tier) + 1;
|
||||
TreeItems.Add(new TankTreeItem
|
||||
{
|
||||
Tier = prem.Tier,
|
||||
TankId = prem.TankId,
|
||||
Name = prem.Name,
|
||||
PreviewImage = prem.PreviewImage,
|
||||
TankTypeId = prem.TankTypeId,
|
||||
IsPremium = true,
|
||||
MarkOfMastery = prem.MarkOfMastery,
|
||||
WinRate = prem.WinRate,
|
||||
AvgDamage = prem.AvgDamage,
|
||||
Battles = prem.Battles,
|
||||
LastBattleTime = prem.LastBattleTime,
|
||||
IsResearched = true,
|
||||
Row = row
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
Reference in new issue
Block a user