@page "/carousels"
@inject IStringLocalizer<Carousels> Localizer

<h3>Carousel</h3>

<h4>In limited space, loop through the same type of pictures, text, and more</h4>

<DemoBlock Title="Basic usage" Introduction="A wide range of basic usages are used to bind components to an array of picture paths by setting the <code>Items </code> property values" Name="Normal">
    <Carousel Images="@Images" Width="280"></Carousel>
</DemoBlock>

<DemoBlock Title="Fade in and out" Introduction="By setting the <code> IsFade </code> property, the picture switches with a fade-in and fade-out effect" Name="Fade">
    <Carousel Images="@Images" Width="280" IsFade="true"></Carousel>
</DemoBlock>

<DemoBlock Title="Click on the image to call back the event" Introduction="After you set the <code> OnClick </code> property by setting, click <code> Image </code> to trigger the <code>OnClick </code> callback delegate" Name="OnClick">
    <Carousel Images="@Images" Width="280" IsFade="true" OnClick="@OnClick"></Carousel>
    <BlockLogger @ref="Trace" class="mt-3" />
</DemoBlock>

<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.Shared.Common;
using BootstrapBlazor.Shared.Components;
using System.Collections.Generic;
using System.Threading.Tasks;

namespace BootstrapBlazor.Shared.Samples;

/// <summary>
/// 
/// </summary>
public sealed partial class Carousels
{
    /// <summary>
    /// 
    /// </summary>
    private BlockLogger? Trace { get; set; }

    private static List<string> Images => new()
    {
        "_content/BootstrapBlazor.Shared/images/Pic0.jpg",
        "_content/BootstrapBlazor.Shared/images/Pic1.jpg",
        "_content/BootstrapBlazor.Shared/images/Pic2.jpg"
    };

    /// <summary>
    /// 
    /// </summary>
    /// <param name="imageUrl"></param>
    /// <returns></returns>
    private Task OnClick(string imageUrl)
    {
        Trace?.Log($"Image Clicked: {imageUrl}");
        return Task.CompletedTask;
    }

    /// <summary>
    /// 获得属性方法
    /// </summary>
    /// <returns></returns>
    private IEnumerable<AttributeItem> GetAttributes() => new AttributeItem[]
    {
            // TODO: 移动到数据库中
            new AttributeItem() {
                Name = "Images",
                Description = Localizer["Images"],
                Type = "IEnumerable<string>",
                ValueList = "—",
                DefaultValue = "—"
            },
            new AttributeItem() {
                Name = "IsFade",
                Description = Localizer["IsFade"],
                Type = "boolean",
                ValueList = " — ",
                DefaultValue = "false"
            },
            new AttributeItem() {
                Name = "Width",
                Description = Localizer["Width"],
                Type = "int",
                ValueList = " — ",
                DefaultValue = "—"
            },
            new AttributeItem() {
                Name = "OnClick",
                Description = Localizer["OnClick"],
                Type = "Func<string, Task>",
                ValueList = " — ",
                DefaultValue = " — "
            }
    };
}