@page "/editor"

@inject SwalService SwalService
@inject PackageVersionService VersionManager
@inject IStringLocalizer<Editors> Localizer
@inject IOptionsMonitor<WebsiteOptions> WebsiteOption

<h3>@Localizer["EditorsTitle"]</h3>

<h4>@((MarkupString)Localizer["EditorsDescription"].Value)</h4>

<p>@((MarkupString)Localizer["EditorsTips"].Value)</p>

<Pre class="no-highlight mb-3">&lt;script src="_content/BootstrapBlazor.SummerNote/js/jquery-3.6.0.min.js"&gt;&lt;/script&gt;</Pre>

<Pre class="no-highlight mb-3">builder.Services.Configure&lt;HubOptions&gt;(option => option.MaximumReceiveMessageSize = null);</Pre>

<PackageTips Name="BootstrapBlazor.SummerNote" />

<DemoBlock Title="@Localizer["EditorNormalTitle"]" Introduction="@Localizer["EditorNormalIntro"]" Name="Normal">
    <section ignore>
        <p>@((MarkupString)Localizer["EditorNormalDescription"].Value)</p>
        <div class="form-control mb-3">@((MarkupString)Localizer["EditorNormalDiv"].Value)</div>
    </section>
    <Editor />
</DemoBlock>

<DemoBlock Title="@Localizer["EditorSubmitTitle"]" Introduction="@Localizer["EditorSubmitIntro"]" Name="Submit">
    <section ignore>
        <p>@((MarkupString)Localizer["EditorSubmitDescription"].Value)</p>
        <Button Text="@ButtonText" OnClick="ShowSubmit" class="mb-3"></Button>
        <textarea class="form-control mt-3">@EditorValue</textarea>
    </section>
    <Editor @bind-Value="@EditorValue" IsEditor="true" ShowSubmit="ShowSubmitButton" />
</DemoBlock>

<DemoBlock Title="@Localizer["EditorPlaceholderTitle"]" Introduction="@Localizer["EditorPlaceholderIntro"]" Name="Placeholder">
    <section ignore>@((MarkupString)Localizer["EditorPlaceholderDescription"].Value)</section>
    <Editor PlaceHolder="@Localizer["EditorEmptyPlaceholder"]" />
</DemoBlock>

<DemoBlock Title="@Localizer["EditorIsEditorTitle"]" Introduction="@Localizer["EditorIsEditorIntro"]" Name="IsEditor">
    <Editor IsEditor="true" OnFileUpload="OnFileUpload" />
</DemoBlock>

<DemoBlock Title="@Localizer["EditorHeightTitle"]" Introduction="@Localizer["EditorHeightIntro"]" Name="Height">
    <Editor IsEditor="true" Height="400" />
</DemoBlock>

<DemoBlock Title="@Localizer["EditorOnValueChangedTitle"]" Introduction="@Localizer["EditorOnValueChangedIntro"]" Name="OnValueChanged">
    <section ignore>@((MarkupString)Localizer["EditorOnValueChangedDescription"].Value)</section>
    <Editor @bind-Value="@ValueChangedValue" />
    <section ignore>
        <label class="form-label mt-3">@Localizer["EditorOnValueChangedLabel"]</label>
        <textarea class="form-control mt-3">@ValueChangedValue</textarea>
        <div class="mt-3">
            <Button OnClick="SetValue">Reset</Button>
        </div>
    </section>
</DemoBlock>

<DemoBlock Title="@Localizer["EditorCustomerToolbarButtonsTitle"]" Introduction="@Localizer["EditorCustomerToolbarButtonsIntro"]" Name="CustomerToolbarButtons">
    <section ignore>@((MarkupString)Localizer["EditorCustomerToolbarButtonsDescription"].Value)</section>
    <Editor IsEditor="true" OnClickButton="@PluginClick" CustomerToolbarButtons="@EditorPluginItems" />
</DemoBlock>

<DemoBlock Title="@Localizer["EditorToolbarItemsTitle"]" Introduction="@Localizer["EditorToolbarItemsIntro"]" Name="ToolbarItems">
    <section ignore>@((MarkupString)Localizer["EditorToolbarItemsDescription"].Value)</section>
    <Editor IsEditor="true" ToolbarItems="@ToolbarItems" />
</DemoBlock>

<DemoBlock Title="@Localizer["DoMethodAsyncTitle"]" Introduction="@Localizer["DoMethodAsyncIntro"]" Name="DoMethodAsync">
    <section ignore>@((MarkupString)Localizer["DoMethodAsyncDescription"].Value)</section>
    <Editor IsEditor="true" @ref="Editor" />
    <section ignore class="mt-3">
        <Button OnClick="InsertHtmlAsync">@Localizer["DoMethodAsyncButton1"]</Button>
        <Button OnClick="@(async () => await Editor.DoMethodAsync("formatH2", ""))">@Localizer["DoMethodAsyncButton2"]</Button>
        <Button OnClick="@(async () => await Editor.DoMethodAsync("insertImage", "https://www.blazor.zone/images/avatars/150-1.jpg", "tree"))">@Localizer["DoMethodAsyncButton3"]</Button>
        <Button OnClick="@OnGetCode">@Localizer["DoMethodAsyncButton4"]</Button>
    </section>
    <section ignore>
        <textarea class="form-control" rows="3" readonly>@_editorCode</textarea>
    </section>
</DemoBlock>

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