Use Terminal Logger

This commit is contained in:
Matt Parker
2025-08-01 19:02:26 +10:00
parent abc4213500
commit e3fb90a870
6 changed files with 97 additions and 11 deletions

View File

@@ -1,35 +1,45 @@
@using SharpIDE.Application.Features.Build
@using XtermBlazor
@inject BuildService BuildService
@inject IJSRuntime JsRuntime
@implements IDisposable
<div @ref="_logContainer" style="height: 15rem; overflow-y: auto; padding: 1rem; background-color: #303030; border: 1px solid #ccc;">
@foreach (var line in _outputLines)
{
<MudText Typo="Typo.body2">@line</MudText>
}
<div style="width: 100%">
<Xterm @ref="@_terminalRef" Options="@_options" />
</div>
@code {
private List<string> _outputLines = [];
private ElementReference _logContainer;
private Xterm _terminalRef;
private TerminalOptions _options = new TerminalOptions
{
CursorBlink = true,
CursorStyle = CursorStyle.Bar,
Columns = 140,
Theme =
{
Background = "#303030",
},
};
protected override async Task OnInitializedAsync()
{
BuildService.BuildStarted += ClearPreviousOutput;
await foreach (var logLine in BuildService.BuildOutputChannel.Reader.ReadAllAsync())
await foreach (var logLine in BuildService.BuildTextWriter.ConsoleChannel.Reader.ReadAllAsync())
{
_outputLines.Add(logLine);
await InvokeAsync(StateHasChanged);
await ScrollToBottomAsync();
await _terminalRef.Write(logLine);
}
}
private async Task ClearPreviousOutput()
{
_outputLines.Clear();
await _terminalRef.Clear();
await InvokeAsync(StateHasChanged);
}

View File

@@ -23,6 +23,7 @@
<PackageReference Include="Microsoft.AspNetCore.Components.WebView" Version="9.0.7" />
<PackageReference Include="MudBlazor" Version="8.10.0" />
<PackageReference Include="Photino.Blazor" Version="4.0.13" />
<PackageReference Include="XtermBlazor" Version="2.1.2" />
</ItemGroup>
<ItemGroup>

View File

@@ -7,6 +7,7 @@
<link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap" rel="stylesheet" />
<link href="_content/MudBlazor/MudBlazor.min.css" rel="stylesheet" />
<link href="css/app.css" rel="stylesheet" />
<link href="_content/XtermBlazor/XtermBlazor.min.css" rel="stylesheet" />
<link href="SharpIDE.Photino.styles.css" rel="stylesheet" />
</head>
<body>
@@ -19,6 +20,7 @@
</div>
<script src="scripts2.js"></script>
<script src="_content/XtermBlazor/XtermBlazor.min.js"></script>
<script src="_content/BlazorMonaco/jsInterop.js"></script>
<script src="_content/BlazorMonaco/lib/monaco-editor/min/vs/loader.js"></script>
<script src="_content/BlazorMonaco/lib/monaco-editor/min/vs/editor/editor.main.js"></script>