Ça a l'air que DotNet Aspire c'est ben sweet.
This commit is contained in:
@@ -0,0 +1,18 @@
|
||||
@page "/counter"
|
||||
|
||||
<PageTitle>Counter</PageTitle>
|
||||
|
||||
<h1>Counter</h1>
|
||||
|
||||
<p role="status">Current count: @currentCount</p>
|
||||
|
||||
<button class="btn btn-primary" @onclick="IncrementCount">Click me</button>
|
||||
|
||||
@code {
|
||||
private int currentCount = 0;
|
||||
|
||||
private void IncrementCount()
|
||||
{
|
||||
currentCount++;
|
||||
}
|
||||
}
|
@@ -0,0 +1,36 @@
|
||||
@page "/Error"
|
||||
@using System.Diagnostics
|
||||
|
||||
<PageTitle>Error</PageTitle>
|
||||
|
||||
<h1 class="text-danger">Error.</h1>
|
||||
<h2 class="text-danger">An error occurred while processing your request.</h2>
|
||||
|
||||
@if (ShowRequestId)
|
||||
{
|
||||
<p>
|
||||
<strong>Request ID:</strong> <code>@RequestId</code>
|
||||
</p>
|
||||
}
|
||||
|
||||
<h3>Development Mode</h3>
|
||||
<p>
|
||||
Swapping to <strong>Development</strong> environment will display more detailed information about the error that occurred.
|
||||
</p>
|
||||
<p>
|
||||
<strong>The Development environment shouldn't be enabled for deployed applications.</strong>
|
||||
It can result in displaying sensitive information from exceptions to end users.
|
||||
For local debugging, enable the <strong>Development</strong> environment by setting the <strong>ASPNETCORE_ENVIRONMENT</strong> environment variable to <strong>Development</strong>
|
||||
and restarting the app.
|
||||
</p>
|
||||
|
||||
@code{
|
||||
[CascadingParameter]
|
||||
private HttpContext? HttpContext { get; set; }
|
||||
|
||||
private string? RequestId { get; set; }
|
||||
private bool ShowRequestId => !string.IsNullOrEmpty(RequestId);
|
||||
|
||||
protected override void OnInitialized() =>
|
||||
RequestId = Activity.Current?.Id ?? HttpContext?.TraceIdentifier;
|
||||
}
|
56
BlazorCanvas/BlazorCanvas.Server/Components/Pages/Home.razor
Normal file
56
BlazorCanvas/BlazorCanvas.Server/Components/Pages/Home.razor
Normal file
@@ -0,0 +1,56 @@
|
||||
@page "/"
|
||||
@using Blazor.Extensions
|
||||
@using Blazor.Extensions.Canvas
|
||||
@using Blazor.Extensions.Canvas.Canvas2D
|
||||
@using Blazor.Extensions.Canvas.WebGL
|
||||
@using BlazorCanvas.Server.Components.Data
|
||||
@using Newtonsoft.Json
|
||||
@using Newtonsoft.Json.Linq
|
||||
@inject CanvasService canvasService
|
||||
|
||||
<header style="padding: 5px;">
|
||||
<h3>Canvas Communautaire!</h3>
|
||||
<label>Couleur: </label>
|
||||
<select @bind="@canvasService.currentColor">
|
||||
<option value="Black" selected>Noir</option>
|
||||
<option value="Red">Rouge</option>
|
||||
<option value="Blue">Bleu</option>
|
||||
<option value="Green">Vert</option>
|
||||
<option value="Yellow">Jaune</option>
|
||||
<option value="DarkRed">Bourgogne</option>
|
||||
<option value="DarkBlue">Bleu nuit</option>
|
||||
<option value="DarkGreen">Vert forêt</option>
|
||||
<option value="LightBlue">Cyan</option>
|
||||
<option value="LightGreen">Jade</option>
|
||||
<option value="LightYellow">Beige</option>
|
||||
<option value="Gray">Gris</option>
|
||||
<option value="White">Blanc</option>
|
||||
</select>
|
||||
<label>Grosseur du trait: </label>
|
||||
<select @bind="@canvasService.pointSize">
|
||||
<option value="1" selected>1</option>
|
||||
<option value="2">2</option>
|
||||
<option value="4">4</option>
|
||||
<option value="8">8</option>
|
||||
<option value="16">16</option>
|
||||
<option value="32">32</option>
|
||||
</select>
|
||||
<label>Magnétisme: </label>
|
||||
<input type="checkbox" @bind="@canvasService.snap" />
|
||||
</header>
|
||||
<div @ref="canvasService.divCanvas" @onmousedown="canvasService.HandleMouse" @onmousemove="canvasService.HandleMouse" style="border:1px dotted #000000;">
|
||||
<BECanvas @ref="canvasService.myCanvas" Height="1080" Width="1920"></BECanvas>
|
||||
</div>
|
||||
<footer>
|
||||
© Cowboy Kim 2023
|
||||
</footer>
|
||||
|
||||
<script src="_content/Foundry.Extensions.Canvas/blazor.extensions.canvas.js"></script>
|
||||
<script>
|
||||
function getDivCanvasOffsets(el) {
|
||||
var obj = {};
|
||||
obj.offsetLeft = el.offsetLeft;
|
||||
obj.offsetTop = el.offsetTop;
|
||||
return JSON.stringify(obj);
|
||||
}
|
||||
</script>
|
@@ -0,0 +1,63 @@
|
||||
@page "/weather"
|
||||
|
||||
<PageTitle>Weather</PageTitle>
|
||||
|
||||
<h1>Weather</h1>
|
||||
|
||||
<p>This component demonstrates showing data.</p>
|
||||
|
||||
@if (forecasts == null)
|
||||
{
|
||||
<p><em>Loading...</em></p>
|
||||
}
|
||||
else
|
||||
{
|
||||
<table class="table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Date</th>
|
||||
<th>Temp. (C)</th>
|
||||
<th>Temp. (F)</th>
|
||||
<th>Summary</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
@foreach (var forecast in forecasts)
|
||||
{
|
||||
<tr>
|
||||
<td>@forecast.Date.ToShortDateString()</td>
|
||||
<td>@forecast.TemperatureC</td>
|
||||
<td>@forecast.TemperatureF</td>
|
||||
<td>@forecast.Summary</td>
|
||||
</tr>
|
||||
}
|
||||
</tbody>
|
||||
</table>
|
||||
}
|
||||
|
||||
@code {
|
||||
private WeatherForecast[]? forecasts;
|
||||
|
||||
protected override async Task OnInitializedAsync()
|
||||
{
|
||||
// Simulate asynchronous loading to demonstrate a loading indicator
|
||||
await Task.Delay(500);
|
||||
|
||||
var startDate = DateOnly.FromDateTime(DateTime.Now);
|
||||
var summaries = new[] { "Freezing", "Bracing", "Chilly", "Cool", "Mild", "Warm", "Balmy", "Hot", "Sweltering", "Scorching" };
|
||||
forecasts = Enumerable.Range(1, 5).Select(index => new WeatherForecast
|
||||
{
|
||||
Date = startDate.AddDays(index),
|
||||
TemperatureC = Random.Shared.Next(-20, 55),
|
||||
Summary = summaries[Random.Shared.Next(summaries.Length)]
|
||||
}).ToArray();
|
||||
}
|
||||
|
||||
private class WeatherForecast
|
||||
{
|
||||
public DateOnly Date { get; set; }
|
||||
public int TemperatureC { get; set; }
|
||||
public string? Summary { get; set; }
|
||||
public int TemperatureF => 32 + (int)(TemperatureC / 0.5556);
|
||||
}
|
||||
}
|
Reference in New Issue
Block a user