Add ViewBase class to Blazor UI; add code behind to GalaxyMap.razor; …

…delete placeholder Component1.razor. (#325)

FrEee.UI.Blazor/Views/GalaxyMap.razor

@@ -3,63 +3,7 @@
 @using System.Numerics
 @using FrEee.Extensions
 @using Excubo.Blazor.Canvas
-
-@code {
-	[Parameter]
-	public GalaxyMapViewModel VM { get; set; } = new();
-
-	/// <summary>
-	/// When the view model's properties change, update the UI.
-	/// </summary>
-	/// <param name="sender"></param>
-	/// <param name="e"></param>
-	private void ViewModelPropertyChanged(object? sender, PropertyChangedEventArgs e)
-	{
-		StateHasChanged();
-	}
-
-	protected override void OnInitialized()
-	{
-		VM.PropertyChanged += ViewModelPropertyChanged;
-	}
-
-	public void Dispose()
-	{
-		VM.PropertyChanged -= ViewModelPropertyChanged;
-	}
-
-	private Canvas helper_canvas;
-	private ElementReference normal_canvas;
-	protected override async Task OnAfterRenderAsync(bool firstRender)
-	{
-		var size = VM.Scale + 1;
-		var xoffset = VM.Width / 2d;
-		var yoffset = VM.Height / 2d;
-
-		await using (var ctx = await helper_canvas.GetContext2DAsync())
-		{
-			await ctx.ClearRectAsync(0, 0, VM.Width, VM.Height);
-			await ctx.SetTransformAsync(size, 0, 0, size, (xoffset + 0.5) * size, (yoffset + 0.5) * size);
-			await ctx.RestoreAsync();
-			await ctx.SaveAsync();
-			await ctx.StrokeStyleAsync("white");
-			await ctx.LineWidthAsync(0.1);
-			foreach (var connections in VM.WarpGraph.Connections)
-			{
-				var src = connections.Key;
-				foreach (var dest in connections.Value)
-				{
-					// TODO: display one way warps differently (arrows, incomplete lines, gradients?)
-					await ctx.MoveToAsync(src.Location.X, src.Location.Y);
-					await ctx.LineToAsync(dest.Location.X, dest.Location.Y);
-					await ctx.StrokeAsync();
-				}
-			}
-		}
-
-		await base.OnAfterRenderAsync(firstRender);
-	}
-}
+@inherits ViewBase<GalaxyMapViewModel>
 
 <div>
 	<div class="fill">
@@ -73,7 +17,8 @@
 		{
 			for (var y = VM.MinY; y <= VM.MaxY; y++)
 			{
-				var sysloc = VM.StarSystemLocations.SingleOrDefault(q => q.Location.X == x && q.Location.Y == y);
+				var sysloc = VM.StarSystemLocations
+					.SingleOrDefault(q => q.Location.X == x && q.Location.Y == y);
 				var row = y - VM.MinY + 1;
 				var col = x - VM.MinX + 1;
 				if (sysloc is not null)

FrEee.UI.Blazor/Views/GalaxyMap.razor.cs

@@ -0,0 +1,44 @@
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+using Excubo.Blazor.Canvas;
+using Microsoft.AspNetCore.Components;
+
+namespace FrEee.UI.Blazor.Views;
+
+public partial class GalaxyMap
+{
+	private Canvas helper_canvas;
+	private ElementReference normal_canvas;
+	protected override async Task OnAfterRenderAsync(bool firstRender)
+	{
+		var size = VM.Scale + 1;
+		var xoffset = VM.Width / 2d;
+		var yoffset = VM.Height / 2d;
+
+		await using (var ctx = await helper_canvas.GetContext2DAsync())
+		{
+			await ctx.ClearRectAsync(0, 0, VM.Width, VM.Height);
+			await ctx.SetTransformAsync(size, 0, 0, size, (xoffset + 0.5) * size, (yoffset + 0.5) * size);
+			await ctx.RestoreAsync();
+			await ctx.SaveAsync();
+			await ctx.StrokeStyleAsync("white");
+			await ctx.LineWidthAsync(0.1);
+			foreach (var connections in VM.WarpGraph.Connections)
+			{
+				var src = connections.Key;
+				foreach (var dest in connections.Value)
+				{
+					// TODO: display one way warps differently (arrows, incomplete lines, gradients?)
+					await ctx.MoveToAsync(src.Location.X, src.Location.Y);
+					await ctx.LineToAsync(dest.Location.X, dest.Location.Y);
+					await ctx.StrokeAsync();
+				}
+			}
+		}
+
+		await base.OnAfterRenderAsync(firstRender);
+	}
+}

FrEee.UI.Blazor/Views/ImageDisplay.razor

@@ -1,29 +1,8 @@
 @using System.Drawing
 @using System.ComponentModel
+@inherits ViewBase<ImageDisplayViewModel>
 
-@code {
-	[Parameter]
-	public ImageDisplayViewModel VM { get; set; } = new();
-
-	/// <summary>
-	/// When the view model's properties change, update the UI.
-	/// </summary>
-	/// <param name="sender"></param>
-	/// <param name="e"></param>
-	private void ViewModelPropertyChanged(object? sender, PropertyChangedEventArgs e)
-	{
-		StateHasChanged();
-	}
-
-	protected override void OnInitialized()
-	{
-		VM.PropertyChanged += ViewModelPropertyChanged;
-	}
-
-	public void Dispose()
-	{
-		VM.PropertyChanged -= ViewModelPropertyChanged;
-	}
-}
-
-<img src="@VM.ImageSource" @onclick="VM.OnClick" style="overflow: hidden; aspect-ratio: @(VM.AspectRatio); width: 100%; max-width: 100%; max-height: 100%"/>
+<img
+	src="@VM.ImageSource"
+	@onclick="VM.OnClick"
+	style="overflow: hidden; aspect-ratio: @(VM.AspectRatio); width: 100%; max-width: 100%; max-height: 100%" />

FrEee.UI.Blazor/Views/PieChart.razor

@@ -5,30 +5,7 @@
 
 @typeparam T where T : INumber<T>, IMultiplyOperators<T, int, T>, IDivisionOperators<T, int, T>
 
-@code {
-	[Parameter]
-	public PieChartViewModel<T> VM { get; set; } = new();
-
-	/// <summary>
-	/// When the view model's properties change, update the UI.
-	/// </summary>
-	/// <param name="sender"></param>
-	/// <param name="e"></param>
-	private void ViewModelPropertyChanged(object? sender, PropertyChangedEventArgs e)
-	{
-		StateHasChanged();
-	}
-
-	protected override void OnInitialized()
-	{
-		VM.PropertyChanged += ViewModelPropertyChanged;
-	}
-
-	public void Dispose()
-	{
-		VM.PropertyChanged -= ViewModelPropertyChanged;
-	}
-}
+@inherits ViewBase<PieChartViewModel<T>>
 
 <!--TODO: split into multiple divs, one for each pie slice, and add onclick handlers for each-->
 <div style="

FrEee.UI.Blazor/Views/ProgressBar.razor

@@ -1,30 +1,6 @@
 @using System.Drawing
 @using System.ComponentModel
-
-@code {
-	[Parameter]
-	public ProgressBarViewModel VM { get; set; } = new();
-
-	/// <summary>
-	/// When the view model's properties change, update the UI.
-	/// </summary>
-	/// <param name="sender"></param>
-	/// <param name="e"></param>
-	private void ViewModelPropertyChanged(object? sender, PropertyChangedEventArgs e)
-	{
-		StateHasChanged();
-	}
-
-	protected override void OnInitialized()
-	{
-		VM.PropertyChanged += ViewModelPropertyChanged;
-	}
-
-	public void Dispose()
-	{
-		VM.PropertyChanged -= ViewModelPropertyChanged;
-	}
-}
+@inherits ViewBase<ProgressBarViewModel>
 
 <div @onclick="VM.OnClick" style="display: grid; height: 36px; overflow: hidden">
 	<div class="fill" style="display: flex; flex-direction: row; grid-area: 1/1/1/1;">

FrEee.UI.Blazor/Views/ResourceDisplay.razor

@@ -1,30 +1,6 @@
 @using System.Drawing
 @using System.ComponentModel
-
-@code {
-	[Parameter]
-	public ResourceDisplayViewModel VM { get; set; } = new();
-
-	/// <summary>
-	/// When the view model's properties change, update the UI.
-	/// </summary>
-	/// <param name="sender"></param>
-	/// <param name="e"></param>
-	private void ViewModelPropertyChanged(object? sender, PropertyChangedEventArgs e)
-	{
-		StateHasChanged();
-	}
-
-	protected override void OnInitialized()
-	{
-		VM.PropertyChanged += ViewModelPropertyChanged;
-	}
-
-	public void Dispose()
-	{
-		VM.PropertyChanged -= ViewModelPropertyChanged;
-	}
-}
+@inherits ViewBase<ResourceDisplayViewModel>
 
 <div style="display: flex; flex-direction: row; justify-content: space-evenly; width: 100%; height: 24px; vertical-align: middle; overflow: hidden">
 	<div style="max-height: 100%; aspect-ratio: 1; margin: auto 0px 0px 0px; text-align: left">

FrEee.UI.Blazor/Views/ResourceQuantityDisplay.razor

@@ -1,30 +1,6 @@
 @using System.Drawing
 @using System.ComponentModel
-
-@code {
-	[Parameter]
-	public ResourceQuantityDisplayViewModel VM { get; set; } = new();
-
-	/// <summary>
-	/// When the view model's properties change, update the UI.
-	/// </summary>
-	/// <param name="sender"></param>
-	/// <param name="e"></param>
-	private void ViewModelPropertyChanged(object? sender, PropertyChangedEventArgs e)
-	{
-		StateHasChanged();
-	}
-
-	protected override void OnInitialized()
-	{
-		VM.PropertyChanged += ViewModelPropertyChanged;
-	}
-
-	public void Dispose()
-	{
-		VM.PropertyChanged -= ViewModelPropertyChanged;
-	}
-}
+@inherits ViewBase<ResourceQuantityDisplayViewModel>
 
 <div style="display: flex; flex-direction: row">
 	@foreach (var resourceVM in VM.ResourceViewModels)

FrEee.UI.Blazor/Views/ViewBase.cs

@@ -0,0 +1,44 @@
+using System;
+using System.Collections.Generic;
+using System.ComponentModel;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+using Microsoft.AspNetCore.Components;
+
+namespace FrEee.UI.Blazor.Views;
+
+/// <summary>
+/// Base class for Razor views in FrEee.
+/// </summary>
+/// <typeparam name="TVM"></typeparam>
+public class ViewBase<TVM>
+	: ComponentBase
+	where TVM : INotifyPropertyChanged, new()
+{
+	/// <summary>
+	/// The view model for this view.
+	/// </summary>
+	[Parameter]
+	public TVM VM { get; set; } = new();
+
+	/// <summary>
+	/// When the view model's properties change, update the UI.
+	/// </summary>
+	/// <param name="sender"></param>
+	/// <param name="e"></param>
+	private void ViewModelPropertyChanged(object? sender, PropertyChangedEventArgs e)
+	{
+		StateHasChanged();
+	}
+
+	protected override void OnInitialized()
+	{
+		VM.PropertyChanged += ViewModelPropertyChanged;
+	}
+
+	public void Dispose()
+	{
+		VM.PropertyChanged -= ViewModelPropertyChanged;
+	}
+}