/
Index.razor
59 lines (51 loc) · 1.5 KB
/
Index.razor
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
@page "/"
@implements IAsyncDisposable
@inject Html5QrcodeReader cameraBarcodeReader
<PageTitle>Pro Mode</PageTitle>
<h2>@foundBarcode</h2>
@if (cameraBarcodeReader is not null)
{
<div class="mt-2 text-center">
<div id="reader" class="mx-auto mb-2" style="width:300px"></div>
@if (cameraBarcodeReader.IsCameraInitialized)
{
<button @onclick="() => cameraBarcodeReader.Stop()" class="btn btn-danger">Turn off camera</button>
}
else
{
<button @onclick="() => cameraBarcodeReader.Start()" class="btn btn-primary">Turn on camera</button>
}
</div>
}
else
{
<p>Loading camera...</p>
}
@code {
bool processingScan;
string? foundBarcode = "Here you will see scanned barcode...";
public async void HandleBarcodeScanDebounced(string barcode)
{
if (processingScan)
return;
processingScan = true;
await HandleBarcodeScan(barcode);
await Task.Delay(1500);
processingScan = false;
}
public async Task HandleBarcodeScan(string barcode)
{
foundBarcode = barcode.Trim();
await InvokeAsync(StateHasChanged);
}
protected override void OnAfterRender(bool firstRender)
{
if (firstRender)
cameraBarcodeReader.OnBarcodeScan += HandleBarcodeScanDebounced;
}
public async ValueTask DisposeAsync()
{
cameraBarcodeReader.OnBarcodeScan -= HandleBarcodeScanDebounced;
await cameraBarcodeReader.Stop();
}
}