Improve Win2D editor hover feedback

CODESTYLE.md

@@ -25,6 +25,7 @@ This repository follows the local `.editorconfig` and the style visible in the c
 ## Braces And Blocks
 
 - Use braces for multi-line bodies.
+- If nesting a for-loop under another for-loop, always include curly braces in the parent for-loop.
 - Omit braces for simple single-line embedded statements when readability stays clear.
 - Nested control flow with multi-line bodies should use braces at every multi-line level.
 - Keep opening braces on the next line for types, methods, properties, accessors, and control blocks.

src/ReactorMaintenance.Simulation/LevelEditor.cs

@@ -2,6 +2,7 @@
 
 public enum EEditorTool
 {
+    Cursor,
     Floor,
     Wall,
     Reactor,
@@ -32,6 +33,7 @@ public static class LevelEditor
 
         var cell = level.GetCell(position);
         cell = tool switch {
+            EEditorTool.Cursor => cell,
             EEditorTool.Floor => cell with { Terrain = ECellTerrain.Floor },
             EEditorTool.Wall => cell with {
                 Terrain = ECellTerrain.Wall,

src/ReactorMaintenance.Win2D/MainWindow.xaml

@@ -4,7 +4,6 @@
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
     xmlns:canvas="using:Microsoft.Graphics.Canvas.UI.Xaml"
     Title="Reactor Maintenance">
-
     <Grid Background="#16191D">
         <Grid.RowDefinitions>
             <RowDefinition Height="Auto" />
@@ -22,7 +21,7 @@
 
         <Grid Grid.Row="1" ColumnSpacing="0">
             <Grid.ColumnDefinitions>
-                <ColumnDefinition Width="220" />
+                <ColumnDefinition Width="260" />
                 <ColumnDefinition Width="*" />
                 <ColumnDefinition Width="300" />
             </Grid.ColumnDefinitions>
@@ -30,7 +29,22 @@
             <ScrollViewer Grid.Column="0" Background="#1C2126">
                 <StackPanel Padding="12" Spacing="10">
                     <TextBlock Text="Tools" FontSize="18" FontWeight="SemiBold" Foreground="#F4F1E8" />
-                    <ComboBox x:Name="ToolPicker" SelectionChanged="ToolPicker_SelectionChanged" />
+                    <ItemsControl x:Name="ToolPicker">
+                        <ItemsControl.ItemsPanel>
+                            <ItemsPanelTemplate>
+                                <ItemsWrapGrid Orientation="Horizontal" MaximumRowsOrColumns="2" />
+                            </ItemsPanelTemplate>
+                        </ItemsControl.ItemsPanel>
+                        <ItemsControl.ItemTemplate>
+                            <DataTemplate>
+                                <ToggleButton IsChecked="{Binding IsSelected, Mode=TwoWay}"
+                                             Checked="ToolToggle_Checked" ToolTipService.ToolTip="{Binding Label}"
+                                             Padding="5" Margin="0,0,8,8">
+                                    <Image Width="96" Height="96" Source="{Binding Icon}" Stretch="Uniform" />
+                                </ToggleButton>
+                            </DataTemplate>
+                        </ItemsControl.ItemTemplate>
+                    </ItemsControl>
                     <TextBlock Text="Brush applies to the selected cell." Foreground="#9EA7AE" TextWrapping="Wrap" />
                     <TextBlock Text="Left click paints. Use Robot to set the start position." Foreground="#9EA7AE"
                                TextWrapping="Wrap" />
@@ -41,10 +55,13 @@
                 <canvas:CanvasControl
                     x:Name="LevelCanvas"
                     ClearColor="#101215"
+                    CreateResources="LevelCanvas_CreateResources"
                     Draw="LevelCanvas_Draw"
                     PointerPressed="LevelCanvas_PointerPressed"
                     PointerMoved="LevelCanvas_PointerMoved"
-                    PointerReleased="LevelCanvas_PointerReleased" />
+                    PointerReleased="LevelCanvas_PointerReleased"
+                    PointerExited="LevelCanvas_PointerExited"
+                    PointerWheelChanged="LevelCanvas_PointerWheelChanged" />
             </Grid>
 
             <ScrollViewer Grid.Column="2" Background="#1C2126">
@@ -78,7 +95,15 @@
                             <DataTemplate>
                                 <Border BorderBrush="#46515A" BorderThickness="1" Padding="8" Margin="0,0,0,8"
                                         CornerRadius="3">
-                                    <TextBlock Text="{Binding Message}" Foreground="#F4F1E8" TextWrapping="Wrap" />
+                                    <Grid ColumnSpacing="8">
+                                        <Grid.ColumnDefinitions>
+                                            <ColumnDefinition Width="32" />
+                                            <ColumnDefinition Width="*" />
+                                        </Grid.ColumnDefinitions>
+                                        <Image Width="28" Height="28" Source="{Binding Icon}" />
+                                        <TextBlock Grid.Column="1" Text="{Binding Message}" Foreground="#F4F1E8"
+                                                   TextWrapping="Wrap" />
+                                    </Grid>
                                 </Border>
                             </DataTemplate>
                         </ItemsControl.ItemTemplate>

src/ReactorMaintenance.Win2D/MainWindow.xaml.cs

@@ -1,18 +1,17 @@
-using System.Numerics;
-using Windows.Foundation;
-using Windows.Storage;
-using Windows.Storage.Pickers;
-using Windows.UI;
-using Microsoft.Graphics.Canvas;
-using Microsoft.Graphics.Canvas.Geometry;
-using Microsoft.Graphics.Canvas.Text;
+using Microsoft.Graphics.Canvas;
+using Microsoft.Graphics.Canvas.UI;
 using Microsoft.Graphics.Canvas.UI.Xaml;
 using Microsoft.UI;
 using Microsoft.UI.Xaml;
 using Microsoft.UI.Xaml.Controls;
 using Microsoft.UI.Xaml.Input;
+using Microsoft.UI.Xaml.Media.Imaging;
 using ReactorMaintenance.Simulation;
 using System.Globalization;
+using Windows.Foundation;
+using Windows.Storage;
+using Windows.Storage.Pickers;
+using Windows.UI;
 using Windows.UI.Popups;
 using WinRT.Interop;
 
@@ -24,29 +23,74 @@ public sealed partial class MainWindow
     {
         public Rect CellRect(int x, int y)
         {
-            return new(OriginX + x * CellSize, OriginY + y * CellSize, CellSize, CellSize);
+            return new(OriginX + (x * CellSize), OriginY + (y * CellSize), CellSize, CellSize);
         }
 
         public Rect DualTileRect(int x, int y)
         {
-            return new(OriginX + (x - 0.5) * CellSize, OriginY + (y - 0.5) * CellSize, CellSize, CellSize);
+            return new(OriginX + ((x - 0.5) * CellSize), OriginY + ((y - 0.5) * CellSize), CellSize, CellSize);
         }
     }
 
+    private sealed record ForecastViewModel(BitmapImage Icon, string Message);
+
+    private sealed class EditorToolViewModel(EEditorTool tool, BitmapImage? icon, string label)
+    {
+        public EEditorTool Tool { get; } = tool;
+        public BitmapImage? Icon { get; } = icon;
+        public string Label { get; } = label;
+        public bool IsSelected { get; set; }
+    }
+
     public MainWindow()
     {
         InitializeComponent();
 
         m_Level = BuildStarterLevel();
-        ToolPicker.ItemsSource = Enum.GetValues<EEditorTool>();
-        ToolPicker.SelectedItem = m_SelectedTool;
+        m_EditorTools = Enum.GetValues<EEditorTool>().Select(tool => new EditorToolViewModel(tool, EditorToolIcon(tool), tool.ToString()) { IsSelected = tool == m_SelectedTool }).ToArray();
+        ToolPicker.ItemsSource = m_EditorTools;
         RefreshInspector();
     }
 
-    private void ToolPicker_SelectionChanged(object sender, SelectionChangedEventArgs e)
+    private void LevelCanvas_CreateResources(CanvasControl sender, CanvasCreateResourcesEventArgs args)
     {
-        if (ToolPicker.SelectedItem is EEditorTool tool)
-            m_SelectedTool = tool;
+        args.TrackAsyncAction(LoadImagesAsync(sender).AsAsyncAction());
+    }
+
+    private async Task LoadImagesAsync(CanvasControl sender)
+    {
+        m_TerrainTilemap = await LoadCanvasBitmapAsync(sender, "Images", "tilemap.png");
+        m_RobotSprite = await LoadCanvasBitmapAsync(sender, "Images", "Props", "robot.png");
+        m_LeakSprite = await LoadCanvasBitmapAsync(sender, "Images", "Props", "leak.png");
+        m_HeatSprite = await LoadCanvasBitmapAsync(sender, "Images", "Props", "heat.png");
+        m_FireSprite = await LoadCanvasBitmapAsync(sender, "Images", "Props", "fire.png");
+
+        m_PropSprites[ECellProp.Reactor] = await LoadCanvasBitmapAsync(sender, "Images", "Props", "reactor.png");
+        m_PropSprites[ECellProp.CoolingPump] = await LoadCanvasBitmapAsync(sender, "Images", "Props", "cooling-pump.png");
+        m_PropSprites[ECellProp.Generator] = await LoadCanvasBitmapAsync(sender, "Images", "Props", "generator.png");
+        m_PropSprites[ECellProp.PressureRegulator] = await LoadCanvasBitmapAsync(sender, "Images", "Props", "pressure-regulator.png");
+        m_PropSprites[ECellProp.DiagnosticTerminal] = await LoadCanvasBitmapAsync(sender, "Images", "Props", "diagnostic-terminal.png");
+        m_PropSprites[ECellProp.ControlTerminal] = await LoadCanvasBitmapAsync(sender, "Images", "Props", "control-terminal.png");
+
+        m_PipeTilemaps[EPipeMedium.Pressure] = await LoadCanvasBitmapAsync(sender, "Images", "Pipes", "pipe-pressure-tilemap.png");
+        m_PipeTilemaps[EPipeMedium.Coolant] = await LoadCanvasBitmapAsync(sender, "Images", "Pipes", "pipe-coolant-tilemap.png");
+        m_PipeTilemaps[EPipeMedium.Fuel] = await LoadCanvasBitmapAsync(sender, "Images", "Pipes", "pipe-fuel-tilemap.png");
+    }
+
+    private static async Task<CanvasBitmap> LoadCanvasBitmapAsync(CanvasControl sender, params string[] pathParts)
+    {
+        var path = Path.Combine([AppContext.BaseDirectory, .. pathParts]);
+        return await CanvasBitmap.LoadAsync(sender, path);
+    }
+
+    private void ToolToggle_Checked(object sender, RoutedEventArgs e)
+    {
+        if ((sender as FrameworkElement)?.DataContext is EditorToolViewModel tool)
+        {
+            m_SelectedTool = tool.Tool;
+            foreach (var editorTool in m_EditorTools)
+                editorTool.IsSelected = editorTool == tool;
+        }
     }
 
     private void New_Click(object sender, RoutedEventArgs e)
@@ -128,21 +172,122 @@ public sealed partial class MainWindow
 
     private void LevelCanvas_PointerPressed(object sender, PointerRoutedEventArgs e)
     {
-        m_Painting = true;
-        _ = LevelCanvas.CapturePointer(e.Pointer);
-        PaintAt(e.GetCurrentPoint(LevelCanvas).Position);
+        var point = e.GetCurrentPoint(LevelCanvas);
+        if (point.Properties.IsRightButtonPressed)
+        {
+            RemovePropAt(point.Position);
+            e.Handled = true;
+            return;
+        }
+
+        if (point.Properties.IsLeftButtonPressed)
+        {
+            _ = LevelCanvas.CapturePointer(e.Pointer);
+            m_LeftPointerDown = true;
+            m_LeftPointerDownPoint = point.Position;
+            m_LastPanPoint = point.Position;
+            m_DragExceededClickThreshold = false;
+            e.Handled = true;
+        }
     }
 
     private void LevelCanvas_PointerMoved(object sender, PointerRoutedEventArgs e)
     {
-        if (m_Painting)
-            PaintAt(e.GetCurrentPoint(LevelCanvas).Position);
+        var point = e.GetCurrentPoint(LevelCanvas);
+        if (m_LeftPointerDown)
+        {
+            var deltaX = point.Position.X - m_LastPanPoint.X;
+            var deltaY = point.Position.Y - m_LastPanPoint.Y;
+            m_LastPanPoint = point.Position;
+
+            var totalDeltaX = point.Position.X - m_LeftPointerDownPoint.X;
+            var totalDeltaY = point.Position.Y - m_LeftPointerDownPoint.Y;
+            if (Math.Sqrt((totalDeltaX * totalDeltaX) + (totalDeltaY * totalDeltaY)) > c_ClickPixelThreshold)
+                m_DragExceededClickThreshold = true;
+
+            m_PanX += deltaX;
+            m_PanY += deltaY;
+            ClampPan();
+            LevelCanvas.Invalidate();
+            e.Handled = true;
+            return;
+        }
+
+        SetHoveredCell(point.Position);
     }
 
     private void LevelCanvas_PointerReleased(object sender, PointerRoutedEventArgs e)
     {
-        m_Painting = false;
+        var point = e.GetCurrentPoint(LevelCanvas);
+        if (m_LeftPointerDown && !m_DragExceededClickThreshold)
+            SelectOrPaintAt(point.Position);
+
+        m_LeftPointerDown = false;
+        m_DragExceededClickThreshold = false;
         LevelCanvas.ReleasePointerCapture(e.Pointer);
+        e.Handled = true;
+    }
+
+    private void LevelCanvas_PointerExited(object sender, PointerRoutedEventArgs e)
+    {
+        ClearHoveredCell();
+    }
+
+    private void LevelCanvas_PointerWheelChanged(object sender, PointerRoutedEventArgs e)
+    {
+        var point = e.GetCurrentPoint(LevelCanvas);
+        var wheelDelta = point.Properties.MouseWheelDelta;
+        if (wheelDelta == 0)
+            return;
+
+        ZoomAt(point.Position, wheelDelta > 0 ? c_ZoomStep : 1 / c_ZoomStep);
+        e.Handled = true;
+    }
+
+    private void ZoomAt(Point point, double zoomFactor)
+    {
+        var oldLayout = GetLayout();
+        var cellX = (point.X - oldLayout.OriginX) / oldLayout.CellSize;
+        var cellY = (point.Y - oldLayout.OriginY) / oldLayout.CellSize;
+
+        m_Zoom = Math.Clamp(m_Zoom * zoomFactor, c_MinZoom, c_MaxZoom);
+        var newCellSize = GetBaseCellSize() * m_Zoom;
+        var originWithoutPan = GetCenteredOrigin(newCellSize);
+        m_PanX = point.X - originWithoutPan.X - (cellX * newCellSize);
+        m_PanY = point.Y - originWithoutPan.Y - (cellY * newCellSize);
+        ClampPan();
+        LevelCanvas.Invalidate();
+    }
+
+    private void SelectOrPaintAt(Point point)
+    {
+        if (m_SelectedTool == EEditorTool.Cursor)
+            SelectAt(point);
+        else
+            PaintAt(point);
+    }
+
+    private void SelectAt(Point point)
+    {
+        if (!TryGetGridPosition(point, out var position))
+            return;
+
+        m_SelectedCell = position;
+        RefreshInspector();
+        LevelCanvas.Invalidate();
+    }
+
+    private void RemovePropAt(Point point)
+    {
+        if (!TryGetGridPosition(point, out var position))
+            return;
+
+        var cell = m_Level.GetCell(position);
+        m_SelectedCell = position;
+        m_Level = m_Level.SetCell(position, cell with { Prop = ECellProp.None });
+        m_Level = m_Level with { Forecasts = m_Simulation.Forecast(m_Level) };
+        RefreshInspector();
+        LevelCanvas.Invalidate();
     }
 
     private void PaintAt(Point point)
@@ -165,147 +310,163 @@ public sealed partial class MainWindow
         drawing.Clear(ColorHelper.FromArgb(255, 16, 18, 21));
         DrawTerrain(drawing, layout);
         DrawCellOverlays(drawing, layout);
-        DrawGrid(drawing, layout);
+        //DrawGrid(drawing, layout);
         DrawRobot(drawing, layout);
     }
 
     private void DrawTerrain(CanvasDrawingSession drawing, CanvasLayout layout)
     {
         for (var y = 0; y <= m_Level.Height; y++)
-        for (var x = 0; x <= m_Level.Width; x++)
-            DrawDualTerrainTile(drawing, layout.DualTileRect(x, y), GetDualTileMask(x, y));
+        {
+            for (var x = 0; x <= m_Level.Width; x++)
+            {
+                DrawDualTerrainTile(drawing, layout.DualTileRect(x, y), GetDualTileMask(x, y));
+            }
+        }
     }
 
     private void DrawCellOverlays(CanvasDrawingSession drawing, CanvasLayout layout)
     {
         for (var y = 0; y < m_Level.Height; y++)
-        for (var x = 0; x < m_Level.Width; x++)
         {
-            var position = new GridPosition(x, y);
-            var cell = m_Level.GetCell(position);
-            var rect = layout.CellRect(x, y);
-
-            if (cell.HasPipe)
+            for (var x = 0; x < m_Level.Width; x++)
             {
-                var center = new Vector2((float)(rect.X + rect.Width / 2), (float)(rect.Y + rect.Height / 2));
-                var pipeColor = cell.Pipe switch {
-                    EPipeMedium.Coolant => Colors.DeepSkyBlue,
-                    EPipeMedium.Fuel => Colors.Goldenrod,
-                    EPipeMedium.Pressure => Colors.LightSteelBlue,
-                    _ => Colors.Transparent
-                };
-                drawing.DrawLine(center with { X = (float)rect.X + 6 }, center with { X = (float)(rect.X + rect.Width - 6) }, pipeColor, Math.Max(3, (float)rect.Width / 7));
-                drawing.DrawLine(center with { Y = (float)rect.Y + 6 }, center with { Y = (float)(rect.Y + rect.Height - 6) }, pipeColor, Math.Max(3, (float)rect.Width / 7));
+                var position = new GridPosition(x, y);
+                var cell = m_Level.GetCell(position);
+                var rect = layout.CellRect(x, y);
+
+                DrawPipe(drawing, position, cell, rect);
+
+                if (cell.LeakRate > 0)
+                    DrawImage(drawing, m_LeakSprite, Inset(rect, 0.12));
+
+                if (cell.Hazards.Heat > 0)
+                    DrawImage(drawing, m_HeatSprite, Inset(rect, 0.08), Math.Clamp(cell.Hazards.Heat / 10.0f, 0.35f, 0.9f));
+
+                if (cell.Hazards.Fire)
+                    DrawImage(drawing, m_FireSprite, Inset(rect, 0.08));
+
+                DrawCellProp(drawing, cell, rect);
+
+                if (m_HoveredCell == position)
+                    drawing.FillRectangle(rect, ColorHelper.FromArgb(72, 255, 255, 255));
+
+                if (m_SelectedCell == position)
+                    drawing.DrawRectangle(rect, Colors.White, 3);
             }
-
-            if (cell.LeakRate > 0)
-                drawing.DrawCircle(new((float)(rect.X + rect.Width - 10), (float)(rect.Y + 10)), 5, Colors.OrangeRed, 2);
-
-            if (cell.Hazards.Fire)
-                drawing.FillCircle(new((float)(rect.X + rect.Width * 0.5), (float)(rect.Y + rect.Height * 0.5)), (float)rect.Width * 0.24f, Colors.OrangeRed);
-
-            if (m_SelectedCell == position)
-                drawing.DrawRectangle(rect, Colors.White, 3);
-
-            DrawCellProp(drawing, cell, rect);
         }
     }
 
+    private void DrawPipe(CanvasDrawingSession drawing, GridPosition position, CellState cell, Rect rect)
+    {
+        if (!cell.HasPipe || !m_PipeTilemaps.TryGetValue(cell.Pipe, out var tilemap))
+            return;
+
+        var sourceRect = PipeTileSourceRect(GetPipeConnectionMask(position, cell.Pipe));
+        drawing.DrawImage(tilemap, rect, sourceRect, 1.0f, CanvasImageInterpolation.HighQualityCubic);
+    }
+
+    private int GetPipeConnectionMask(GridPosition position, EPipeMedium medium)
+    {
+        var mask = 0;
+        if (HasMatchingPipe(position with { Y = position.Y - 1 }, medium))
+            mask |= c_NorthConnection;
+
+        if (HasMatchingPipe(position with { X = position.X + 1 }, medium))
+            mask |= c_EastConnection;
+
+        if (HasMatchingPipe(position with { Y = position.Y + 1 }, medium))
+            mask |= c_SouthConnection;
+
+        if (HasMatchingPipe(position with { X = position.X - 1 }, medium))
+            mask |= c_WestConnection;
+
+        return mask;
+    }
+
+    private bool HasMatchingPipe(GridPosition position, EPipeMedium medium)
+    {
+        return m_Level.InBounds(position) && m_Level.GetCell(position).Pipe == medium;
+    }
+
+    private static Rect PipeTileSourceRect(int connectionMask)
+    {
+        var tileIndex = connectionMask switch {
+            0 => 0,
+            c_NorthConnection => 1,
+            c_EastConnection => 2,
+            c_SouthConnection => 3,
+            c_WestConnection => 4,
+            c_NorthConnection | c_EastConnection => 5,
+            c_EastConnection | c_SouthConnection => 6,
+            c_SouthConnection | c_WestConnection => 7,
+            c_WestConnection | c_NorthConnection => 8,
+            c_NorthConnection | c_SouthConnection => 9,
+            c_EastConnection | c_WestConnection => 10,
+            c_NorthConnection | c_EastConnection | c_SouthConnection => 11,
+            c_EastConnection | c_SouthConnection | c_WestConnection => 12,
+            c_SouthConnection | c_WestConnection | c_NorthConnection => 13,
+            c_WestConnection | c_NorthConnection | c_EastConnection => 14,
+            c_NorthConnection | c_EastConnection | c_SouthConnection | c_WestConnection => 15,
+            _ => throw new ArgumentOutOfRangeException(nameof(connectionMask), connectionMask, "Unsupported pipe connection mask.")
+        };
+
+        return new(
+            tileIndex % c_PipeTilemapColumns * c_PipeTilemapTileSize,
+            tileIndex / c_PipeTilemapColumns * c_PipeTilemapTileSize,
+            c_PipeTilemapTileSize,
+            c_PipeTilemapTileSize);
+    }
+
+    private static void DrawImage(CanvasDrawingSession drawing, CanvasBitmap? image, Rect rect, float opacity = 1)
+    {
+        if (image is not null)
+            drawing.DrawImage(image, rect, image.Bounds, opacity, CanvasImageInterpolation.HighQualityCubic);
+    }
+
+    private static Rect Inset(Rect rect, double fraction)
+    {
+        var inset = rect.Width * fraction;
+        return new(rect.X + inset, rect.Y + inset, rect.Width - inset * 2, rect.Height - inset * 2);
+    }
+
     private void DrawDualTerrainTile(CanvasDrawingSession drawing, Rect rect, int floorMask)
     {
-        var wallColor = ColorHelper.FromArgb(255, 54, 61, 68);
-        var floorColor = ColorHelper.FromArgb(255, 31, 36, 40);
+        if (m_TerrainTilemap is null)
+            return;
+
         var wallMask = c_AllCorners ^ floorMask;
-
-        drawing.FillRectangle(rect, floorColor);
-        DrawDualTerrainTile(drawing, rect, wallColor, floorColor, GetDualTerrainTileId(wallMask));
+        var sourceRect = TilemapSourceRect(wallMask);
+        drawing.DrawImage(m_TerrainTilemap, rect, sourceRect, 1.0f, CanvasImageInterpolation.HighQualityCubic);
     }
 
-    private static int GetDualTerrainTileId(int wallMask)
+    private static Rect TilemapSourceRect(int wallMask)
     {
-        return wallMask;
-    }
-
-    private static void DrawDualTerrainTile(CanvasDrawingSession drawing, Rect rect, Color wallColor, Color floorColor, int tileId)
-    {
-        if (tileId == 0)
-            return;
-
-        if (tileId == c_AllCorners)
-        {
-            drawing.FillRectangle(rect, wallColor);
-            return;
-        }
-
-        switch (tileId)
-        {
-            case c_TopLeftCorner:
-            case c_TopRightCorner:
-            case c_BottomLeftCorner:
-            case c_BottomRightCorner:
-                DrawTerrainCorner(drawing, rect, wallColor, tileId);
-                break;
-            case c_TopLeftCorner | c_TopRightCorner:
-                drawing.FillRectangle(new(rect.X, rect.Y, rect.Width, rect.Height / 2), wallColor);
-                break;
-            case c_BottomLeftCorner | c_BottomRightCorner:
-                drawing.FillRectangle(new(rect.X, rect.Y + rect.Height / 2, rect.Width, rect.Height / 2), wallColor);
-                break;
-            case c_TopLeftCorner | c_BottomLeftCorner:
-                drawing.FillRectangle(new(rect.X, rect.Y, rect.Width / 2, rect.Height), wallColor);
-                break;
-            case c_TopRightCorner | c_BottomRightCorner:
-                drawing.FillRectangle(new(rect.X + rect.Width / 2, rect.Y, rect.Width / 2, rect.Height), wallColor);
-                break;
-            case c_TopLeftCorner | c_BottomRightCorner:
-                DrawTerrainCorner(drawing, rect, wallColor, c_TopLeftCorner);
-                DrawTerrainCorner(drawing, rect, wallColor, c_BottomRightCorner);
-                break;
-            case c_TopRightCorner | c_BottomLeftCorner:
-                DrawTerrainCorner(drawing, rect, wallColor, c_TopRightCorner);
-                DrawTerrainCorner(drawing, rect, wallColor, c_BottomLeftCorner);
-                break;
-            default:
-                drawing.FillRectangle(rect, wallColor);
-                DrawTerrainCorner(drawing, rect, floorColor, c_AllCorners ^ tileId);
-                break;
-        }
-    }
-
-    private static void DrawTerrainCorner(CanvasDrawingSession drawing, Rect rect, Color color, int corner)
-    {
-        var radiusX = (float)rect.Width / 2;
-        var radiusY = (float)rect.Height / 2;
-        var center = corner switch {
-            c_TopLeftCorner => new Vector2((float)rect.X, (float)rect.Y),
-            c_TopRightCorner => new Vector2((float)(rect.X + rect.Width), (float)rect.Y),
-            c_BottomRightCorner => new Vector2((float)(rect.X + rect.Width), (float)(rect.Y + rect.Height)),
-            c_BottomLeftCorner => new Vector2((float)rect.X, (float)(rect.Y + rect.Height)),
-            _ => new Vector2((float)(rect.X + rect.Width / 2), (float)(rect.Y + rect.Height / 2))
-        };
-        var start = corner switch {
-            c_TopLeftCorner => new Vector2(center.X + radiusX, center.Y),
-            c_TopRightCorner => new Vector2(center.X, center.Y + radiusY),
-            c_BottomRightCorner => new Vector2(center.X - radiusX, center.Y),
-            c_BottomLeftCorner => new Vector2(center.X, center.Y - radiusY),
-            _ => center
-        };
-        var end = corner switch {
-            c_TopLeftCorner => new Vector2(center.X, center.Y + radiusY),
-            c_TopRightCorner => new Vector2(center.X - radiusX, center.Y),
-            c_BottomRightCorner => new Vector2(center.X, center.Y - radiusY),
-            c_BottomLeftCorner => new Vector2(center.X + radiusX, center.Y),
-            _ => center
+        var tilePosition = wallMask switch {
+            c_BottomLeftCorner => new(0, 0),
+            c_TopRightCorner | c_BottomRightCorner => new(1, 0),
+            c_TopLeftCorner | c_BottomLeftCorner | c_BottomRightCorner => new(2, 0),
+            c_BottomLeftCorner | c_BottomRightCorner => new(3, 0),
+            c_TopLeftCorner | c_BottomRightCorner => new(0, 1),
+            c_BottomLeftCorner | c_TopRightCorner | c_BottomRightCorner => new(1, 1),
+            c_AllCorners => new(2, 1),
+            c_TopLeftCorner | c_BottomLeftCorner | c_TopRightCorner => new(3, 1),
+            c_TopRightCorner => new(0, 2),
+            c_TopLeftCorner | c_TopRightCorner => new(1, 2),
+            c_TopLeftCorner | c_TopRightCorner | c_BottomRightCorner => new(2, 2),
+            c_BottomLeftCorner | c_TopLeftCorner => new(3, 2),
+            0 => new(0, 3),
+            c_BottomRightCorner => new(1, 3),
+            c_BottomLeftCorner | c_TopRightCorner => new(2, 3),
+            c_TopLeftCorner => new GridPosition(3, 3),
+            _ => throw new ArgumentOutOfRangeException(nameof(wallMask), wallMask, "Unsupported tile mask.")
         };
 
-        using var builder = new CanvasPathBuilder(drawing);
-        builder.BeginFigure(center);
-        builder.AddLine(start);
-        builder.AddArc(end, radiusX, radiusY, 0, CanvasSweepDirection.Clockwise, CanvasArcSize.Small);
-        builder.EndFigure(CanvasFigureLoop.Closed);
-
-        using var geometry = CanvasGeometry.CreatePath(builder);
-        drawing.FillGeometry(geometry, color);
+        return new(
+            tilePosition.X * c_TilemapTileSize,
+            tilePosition.Y * c_TilemapTileSize,
+            c_TilemapTileSize,
+            c_TilemapTileSize);
     }
 
     private int GetDualTileMask(int x, int y)
@@ -334,52 +495,29 @@ public sealed partial class MainWindow
 
     private void DrawCellProp(CanvasDrawingSession drawing, CellState cell, Rect rect)
     {
-        var text = cell.Prop switch {
-            ECellProp.Reactor => "R",
-            ECellProp.CoolingPump => "C",
-            ECellProp.Generator => "G",
-            ECellProp.PressureRegulator => "P",
-            ECellProp.DiagnosticTerminal => "D",
-            ECellProp.ControlTerminal => "T",
-            _ => string.Empty
-        };
-
-        if (string.IsNullOrEmpty(text))
-            return;
-
-        var propRect = new Rect(rect.X + rect.Width * 0.18, rect.Y + rect.Height * 0.18, rect.Width * 0.64, rect.Height * 0.64);
-        drawing.FillRoundedRectangle(propRect, 4, 4, PropColor(cell.Prop));
-        drawing.DrawRoundedRectangle(propRect, 4, 4, ColorHelper.FromArgb(210, 12, 14, 16), 2);
-
-        using var format = new CanvasTextFormat();
-        format.FontSize = Math.Max(14, (float)rect.Width * 0.34f);
-        format.HorizontalAlignment = CanvasHorizontalAlignment.Center;
-        format.VerticalAlignment = CanvasVerticalAlignment.Center;
-
-        drawing.DrawText(text, propRect, Colors.White, format);
+        if (m_PropSprites.TryGetValue(cell.Prop, out var sprite))
+            drawing.DrawImage(sprite, rect, sprite.Bounds, 1.0f, CanvasImageInterpolation.HighQualityCubic);
     }
 
     private void DrawGrid(CanvasDrawingSession drawing, CanvasLayout layout)
     {
         for (var x = 0; x <= m_Level.Width; x++)
         {
-            var xPos = (float)(layout.OriginX + x * layout.CellSize);
-            drawing.DrawLine(xPos, (float)layout.OriginY, xPos, (float)(layout.OriginY + m_Level.Height * layout.CellSize), ColorHelper.FromArgb(120, 91, 104, 115), 1);
+            var xPos = (float)(layout.OriginX + (x * layout.CellSize));
+            drawing.DrawLine(xPos, (float)layout.OriginY, xPos, (float)(layout.OriginY + (m_Level.Height * layout.CellSize)), ColorHelper.FromArgb(120, 91, 104, 115), 1);
         }
 
         for (var y = 0; y <= m_Level.Height; y++)
         {
-            var yPos = (float)(layout.OriginY + y * layout.CellSize);
-            drawing.DrawLine((float)layout.OriginX, yPos, (float)(layout.OriginX + m_Level.Width * layout.CellSize), yPos, ColorHelper.FromArgb(120, 91, 104, 115), 1);
+            var yPos = (float)(layout.OriginY + (y * layout.CellSize));
+            drawing.DrawLine((float)layout.OriginX, yPos, (float)(layout.OriginX + (m_Level.Width * layout.CellSize)), yPos, ColorHelper.FromArgb(120, 91, 104, 115), 1);
         }
     }
 
     private void DrawRobot(CanvasDrawingSession drawing, CanvasLayout layout)
     {
         var rect = layout.CellRect(m_Level.Robot.X, m_Level.Robot.Y);
-        var center = new Vector2((float)(rect.X + rect.Width / 2), (float)(rect.Y + rect.Height / 2));
-        drawing.FillCircle(center, (float)rect.Width * 0.28f, Colors.White);
-        drawing.DrawCircle(center, (float)rect.Width * 0.28f, Colors.Black, 2);
+        DrawImage(drawing, m_RobotSprite, rect);
     }
 
     private bool TryGetGridPosition(Point point, out GridPosition position)
@@ -391,28 +529,67 @@ public sealed partial class MainWindow
         return m_Level.InBounds(position);
     }
 
+    private void SetHoveredCell(Point point)
+    {
+        var hoveredCell = TryGetGridPosition(point, out var position) ? position : (GridPosition?)null;
+        if (m_HoveredCell == hoveredCell)
+            return;
+
+        m_HoveredCell = hoveredCell;
+        LevelCanvas.Invalidate();
+    }
+
+    private void ClearHoveredCell()
+    {
+        if (m_HoveredCell is null)
+            return;
+
+        m_HoveredCell = null;
+        LevelCanvas.Invalidate();
+    }
+
     private CanvasLayout GetLayout()
+    {
+        ClampPan();
+        var cellSize = GetBaseCellSize() * m_Zoom;
+        var centeredOrigin = GetCenteredOrigin(cellSize);
+        return new(cellSize, centeredOrigin.X + m_PanX, centeredOrigin.Y + m_PanY);
+    }
+
+    private double GetBaseCellSize()
     {
         var availableWidth = Math.Max(1, LevelCanvas.ActualWidth);
         var availableHeight = Math.Max(1, LevelCanvas.ActualHeight);
         var size = Math.Floor(Math.Min(availableWidth / m_Level.Width, availableHeight / m_Level.Height));
-        size = Math.Max(20, size);
-        var originX = Math.Max(0, (availableWidth - size * m_Level.Width) / 2);
-        var originY = Math.Max(0, (availableHeight - size * m_Level.Height) / 2);
-        return new(size, originX, originY);
+        return Math.Max(20, size);
     }
 
-    private static Color PropColor(ECellProp prop)
+    private Point GetCenteredOrigin(double cellSize)
     {
-        return prop switch {
-            ECellProp.Reactor => ColorHelper.FromArgb(255, 61, 76, 82),
-            ECellProp.CoolingPump => ColorHelper.FromArgb(255, 25, 79, 96),
-            ECellProp.Generator => ColorHelper.FromArgb(255, 86, 75, 35),
-            ECellProp.PressureRegulator => ColorHelper.FromArgb(255, 70, 78, 98),
-            ECellProp.DiagnosticTerminal => ColorHelper.FromArgb(255, 39, 84, 62),
-            ECellProp.ControlTerminal => ColorHelper.FromArgb(255, 80, 61, 91),
-            _ => Colors.Transparent
-        };
+        var availableWidth = Math.Max(1, LevelCanvas.ActualWidth);
+        var availableHeight = Math.Max(1, LevelCanvas.ActualHeight);
+        return new((availableWidth - (cellSize * m_Level.Width)) / 2, (availableHeight - (cellSize * m_Level.Height)) / 2);
+    }
+
+    private void ClampPan()
+    {
+        var cellSize = GetBaseCellSize() * m_Zoom;
+        var contentWidth = cellSize * m_Level.Width;
+        var contentHeight = cellSize * m_Level.Height;
+        var availableWidth = Math.Max(1, LevelCanvas.ActualWidth);
+        var availableHeight = Math.Max(1, LevelCanvas.ActualHeight);
+
+        m_PanX = ClampAxisPan(m_PanX, contentWidth, availableWidth);
+        m_PanY = ClampAxisPan(m_PanY, contentHeight, availableHeight);
+    }
+
+    private static double ClampAxisPan(double pan, double contentSize, double availableSize)
+    {
+        if (contentSize <= availableSize)
+            return 0;
+
+        var maxPan = (contentSize - availableSize) / 2;
+        return Math.Clamp(pan, -maxPan, maxPan);
     }
 
     private void RefreshInspector()
@@ -430,7 +607,63 @@ public sealed partial class MainWindow
         else
             CellText.Text = "No cell selected.";
 
-        ForecastList.ItemsSource = m_Level.Forecasts;
+        ForecastList.ItemsSource = m_Level.Forecasts.Select(forecast => new ForecastViewModel(FailureIcon(forecast.Kind), forecast.Message)).ToArray();
+    }
+
+    private static BitmapImage FailureIcon(EFailureKind kind)
+    {
+        return ImageFromOutputPath("Images", "Failures", FailureIconFileName(kind));
+    }
+
+    private static string FailureIconFileName(EFailureKind kind)
+    {
+        return kind switch {
+            EFailureKind.PipeBurst => "failure-pipe-burst.png",
+            EFailureKind.Ignition => "failure-ignition.png",
+            EFailureKind.Meltdown => "failure-meltdown.png",
+            EFailureKind.StabilityCollapse => "failure-stability-collapse.png",
+            EFailureKind.ReactorReady => "failure-reactor-ready.png",
+            _ => throw new ArgumentOutOfRangeException(nameof(kind), kind, "Unsupported failure kind.")
+        };
+    }
+
+    private static BitmapImage? EditorToolIcon(EEditorTool tool)
+    {
+        return tool switch {
+            EEditorTool.Cursor => PropImage("cursor.png"),
+            EEditorTool.Floor => PropImage("floor.png"),
+            EEditorTool.Wall => PropImage("wall.png"),
+            EEditorTool.Reactor => PropImage("reactor.png"),
+            EEditorTool.CoolingPump => PropImage("cooling-pump.png"),
+            EEditorTool.Generator => PropImage("generator.png"),
+            EEditorTool.PressureRegulator => PropImage("pressure-regulator.png"),
+            EEditorTool.DiagnosticTerminal => PropImage("diagnostic-terminal.png"),
+            EEditorTool.ControlTerminal => PropImage("control-terminal.png"),
+            EEditorTool.CoolantPipe => PipeImage("pipe-coolant-tilemap.png"),
+            EEditorTool.FuelPipe => PipeImage("pipe-fuel-tilemap.png"),
+            EEditorTool.PressurePipe => PipeImage("pipe-pressure-tilemap.png"),
+            EEditorTool.Leak => PropImage("leak.png"),
+            EEditorTool.Repair => PropImage("repair.png"),
+            EEditorTool.Heat => PropImage("heat.png"),
+            EEditorTool.Fire => PropImage("fire.png"),
+            EEditorTool.Robot => PropImage("robot.png"),
+            _ => throw new ArgumentOutOfRangeException(nameof(tool), tool, "Unsupported editor tool.")
+        };
+    }
+
+    private static BitmapImage PropImage(string fileName)
+    {
+        return ImageFromOutputPath("Images", "Props", fileName);
+    }
+
+    private static BitmapImage PipeImage(string fileName)
+    {
+        return ImageFromOutputPath("Images", "Pipes", fileName);
+    }
+
+    private static BitmapImage ImageFromOutputPath(params string[] pathParts)
+    {
+        return new(new(Path.Combine([AppContext.BaseDirectory, .. pathParts])));
     }
 
     private static LevelState BuildStarterLevel()
@@ -485,15 +718,42 @@ public sealed partial class MainWindow
         return level with { Forecasts = new SimulationEngine().Forecast(level) };
     }
 
-    private readonly SimulationEngine m_Simulation = new();
+    private const int c_TilemapTileSize = 512;
+    private const int c_PipeTilemapTileSize = 256;
+    private const int c_PipeTilemapColumns = 4;
     private const int c_TopLeftCorner = 1;
     private const int c_TopRightCorner = 2;
     private const int c_BottomLeftCorner = 4;
     private const int c_BottomRightCorner = 8;
     private const int c_AllCorners = c_TopLeftCorner | c_TopRightCorner | c_BottomLeftCorner | c_BottomRightCorner;
+    private const int c_NorthConnection = 1;
+    private const int c_EastConnection = 2;
+    private const int c_SouthConnection = 4;
+    private const int c_WestConnection = 8;
+    private const double c_MinZoom = 0.5;
+    private const double c_MaxZoom = 4;
+    private const double c_ZoomStep = 1.15;
+    private const double c_ClickPixelThreshold = 5;
+
+    private readonly SimulationEngine m_Simulation = new();
+    private readonly Dictionary<ECellProp, CanvasBitmap> m_PropSprites = [];
+    private readonly Dictionary<EPipeMedium, CanvasBitmap> m_PipeTilemaps = [];
     private StorageFile? m_CurrentFile;
     private LevelState m_Level;
-    private bool m_Painting;
+    private IReadOnlyList<EditorToolViewModel> m_EditorTools = [];
+    private bool m_LeftPointerDown;
+    private bool m_DragExceededClickThreshold;
+    private Point m_LeftPointerDownPoint;
+    private Point m_LastPanPoint;
+    private GridPosition? m_HoveredCell;
     private GridPosition? m_SelectedCell;
-    private EEditorTool m_SelectedTool = EEditorTool.Floor;
+    private EEditorTool m_SelectedTool = EEditorTool.Cursor;
+    private double m_Zoom = 1;
+    private double m_PanX;
+    private double m_PanY;
+    private CanvasBitmap? m_TerrainTilemap;
+    private CanvasBitmap? m_RobotSprite;
+    private CanvasBitmap? m_LeakSprite;
+    private CanvasBitmap? m_HeatSprite;
+    private CanvasBitmap? m_FireSprite;
 }

src/ReactorMaintenance.Win2D/ReactorMaintenance.Win2D.csproj

@@ -24,4 +24,10 @@
     <ItemGroup>
         <ProjectReference Include="..\ReactorMaintenance.Simulation\ReactorMaintenance.Simulation.csproj" />
     </ItemGroup>
+
+    <ItemGroup>
+        <Content Update="Images\**\*.png">
+            <CopyToOutputDirectory>PreserveNewest</CopyToOutputDirectory>
+        </Content>
+    </ItemGroup>
 </Project>