@page "/barcodereaders"

<h3>BarcodeReader 条码扫描</h3>

<h4>本组件通过调用摄像头对条码进行扫描，获取到条码内容条码/QR码</h4>

<p><b>特别注意：</b></p>
<ul class="ul-demo">
    <li>站点要启用 <code>https</code>，这是浏览器厂商要求的</li>
    <li>移动端 iOS 系统必须使用 <code>Safari</code> 浏览器，切换前/后摄像头要点一下关闭功能按钮</li>
    <li>安卓手机大概率需要原生系统浏览器，<code>Chrome</code> 是必定可以的，某些浏览器可能不兼容摄像头</li>
    <li>条码识别率与手机像素，条码大小，手机执行效率有关</li>
</ul>

<Block Title="基本用法" Introduction="通过摄像头进行扫码识别" CodeFile="barcode.1.html">
    <p>操作步骤：</p>
    <ul class="ul-demo">
        <li>点击开始打开摄像头</li>
        <li>对准条码进行扫描</li>
        <li>点击关闭按钮关闭摄像头</li>
    </ul>
    <BarcodeReader OnInit="@OnInit" OnResult="@OnResult" OnStart="@OnStart" OnClose="@OnClose" OnError="@OnError" />
    <Logger @ref="Trace" class="mt-3" />
</Block>

<Block Title="基本用法" Introduction="通过静态图片进行扫码识别" CodeFile="barcode.2.html">
    <p>操作步骤：</p>
    <ul class="ul-demo">
        <li>点击扫码弹出选择文件框</li>
        <li>选取包含条码图片</li>
        <li>开始识别条码</li>
    </ul>
    <BarcodeReader ScanType="@ScanType.Image" OnResult="@OnImageResult" OnError="@OnImageError" />
    <Logger @ref="Trace2" class="mt-3" />
</Block>

<Block Title="自动开始" Introduction="通过设置 <code>AutoStart</code> 参数设置自动开启摄像头" CodeFile="barcode.3.html">
    <p>操作步骤：</p>
    <ul class="ul-demo">
        <li>点击扫码弹出选择文件框</li>
        <li>选取包含条码图片</li>
        <li>开始识别条码</li>
    </ul>
    <BarcodeReader OnResult="@OnImageResult" OnError="@OnImageError" AutoStart="true" />
    <Logger @ref="Trace2" class="mt-3" />
</Block>

<AttributeTable Items="@GetAttributes()" />

// Copyright (c) Argo Zhang (argo@163.com). All rights reserved.
// Licensed under the Apache License, Version 2.0. See License.txt in the project root for license information.
// Website: https://www.blazor.zone or https://argozhang.github.io/

using BootstrapBlazor.Components;
using BootstrapBlazor.Shared.Common;
using BootstrapBlazor.Shared.Pages.Components;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;

namespace BootstrapBlazor.Shared.Pages
{
    /// <summary>
    /// 
    /// </summary>
    public sealed partial class BarcodeReaders
    {
        private Logger? Trace { get; set; }

        private Logger? Trace2 { get; set; }

        private Task OnInit(IEnumerable<DeviceItem> devices)
        {
            var cams = string.Join("", devices.Select(i => i.Label));
            Trace?.Log($"初始化摄像头完成 {cams}");
            return Task.CompletedTask;
        }

        private Task OnImageResult(string barcode)
        {
            Trace2?.Log($"扫描到条码 {barcode}");
            return Task.CompletedTask;
        }

        private Task OnImageError(string err)
        {
            Trace2?.Log($"发生错误 {err}");
            return Task.CompletedTask;
        }

        private Task OnResult(string barcode)
        {
            Trace?.Log($"扫描到条码 {barcode}");
            return Task.CompletedTask;
        }

        private Task OnError(string error)
        {
            Trace?.Log($"发生错误 {error}");
            return Task.CompletedTask;
        }

        private Task OnStart()
        {
            Trace?.Log($"打开摄像头");
            return Task.CompletedTask;
        }

        private Task OnClose()
        {
            Trace?.Log($"关闭摄像头");
            return Task.CompletedTask;
        }

        /// <summary>
        /// 获得属性
        /// </summary>
        /// <returns></returns>
        private IEnumerable<AttributeItem> GetAttributes() => new AttributeItem[]
        {
            new AttributeItem()
            {
                Name = "ButtonScanText",
                Description = "扫描按钮文字",
                Type = "string",
                ValueList = " - ",
                DefaultValue = "扫描"
            },
            new AttributeItem()
            {
                Name = "ButtonStopText",
                Description = "关闭按钮文字",
                Type = "string",
                ValueList = " - ",
                DefaultValue = "关闭"
            },
            new AttributeItem()
            {
                Name = "AutoStopText",
                Description = "自动关闭按钮文字",
                Type = "string",
                ValueList = " - ",
                DefaultValue = "自动关闭"
            },
            new AttributeItem()
            {
                Name = "DeviceLabel",
                Description = "设备列表前置标签文字",
                Type = "string",
                ValueList = " - ",
                DefaultValue = "摄像头"
            },
            new AttributeItem()
            {
                Name = "InitDevicesString",
                Description = "初始化设备列表文字",
                Type = "string",
                ValueList = " - ",
                DefaultValue = "正在识别摄像头"
            },
            new AttributeItem()
            {
                Name = "NotFoundDevicesString",
                Description = "未找到视频相关设备文字",
                Type = "string",
                ValueList = " - ",
                DefaultValue = "未找到视频相关设备"
            },
            new AttributeItem()
            {
                Name = "AutoStart",
                Description = "组件初始化时是否自动开启摄像头",
                Type = "boolean",
                ValueList = "true|false",
                DefaultValue = "false"
            },
            new AttributeItem()
            {
                Name = "AutoStop",
                Description = "扫描到条码后是否自动停止",
                Type = "boolean",
                ValueList = "true|false",
                DefaultValue = "false"
            },
            new AttributeItem()
            {
                Name = "ScanType",
                Description = "扫描方式摄像头或者图片",
                Type = "ScanType",
                ValueList = "Camera|Image",
                DefaultValue = "Camera"
            },
            new AttributeItem()
            {
                Name = "OnInit",
                Description = "初始化摄像头回调方法",
                Type = "Func<IEnumerable<Camera>, Task>",
                ValueList = " - ",
                DefaultValue = " - "
            },
            new AttributeItem()
            {
                Name = "OnResult",
                Description = "扫描到条码回调方法",
                Type = "Func<string, Task>",
                ValueList = " - ",
                DefaultValue = " - "
            },
            new AttributeItem()
            {
                Name = "OnStart",
                Description = "打开摄像头回调方法",
                Type = "Func<Task>",
                ValueList = " - ",
                DefaultValue = " - "
            },
            new AttributeItem()
            {
                Name = "OnClose",
                Description = "关闭摄像头回调方法",
                Type = "Func<Task>",
                ValueList = " - ",
                DefaultValue = " - "
            },
            new AttributeItem()
            {
                Name = "OnError",
                Description = "发生错误回调方法",
                Type = "Func<string, Task>",
                ValueList = " - ",
                DefaultValue = " - "
            }
        };
    }
}