@using VisionBuilder.UI.Common
@implements IDisposable

<div class="single-camera-control">
    <div class="camera-header">
        <div class="camera-header-preview">
            <span class="camera-label">@_cameraLabel</span>
        </div>
        <div class="camera-header-errors">
            <span class="errors-label">Errors</span>
        </div>
        <div class="camera-header-stats"></div>
        <div class="camera-header-buttons"></div>
    </div>

    <div class="camera-body">
        <div class="camera-preview-area">
            <PreviewWindow ViewModel="@ViewModel?.PreviewVm" />
        </div>
        <div class="camera-divider"></div>
        <div class="camera-errors-area">
            <ErrorPreview ViewModel="@ViewModel?.ErrorsVm" />
        </div>
        <div class="camera-divider"></div>
        <div class="camera-stats-area">
            <Stats ViewModel="@ViewModel?.StatisticsVm" />
        </div>
        <div class="camera-buttons-area">
            <div class="camera-buttons-stack">
                <MudButton Variant="Variant.Outlined" Color="Color.Primary" FullWidth="true"
                           Class="camera-btn"
                           Disabled="@(!_canSelectRecipe)"
                           OnClick="@OnSelectRecipe">
                    @_currentRecipeName
                </MudButton>
                @if (_canStart)
                {
                    <MudButton Variant="Variant.Filled" Color="Color.Primary" FullWidth="true"
                               Class="camera-btn"
                               OnClick="@OnStart">
                        Start
                    </MudButton>
                }
                @if (_canStop)
                {
                    <MudButton Variant="Variant.Filled" Color="Color.Primary" FullWidth="true"
                               Class="camera-btn"
                               OnClick="@OnStop">
                        Stop
                    </MudButton>
                }
                @if (_showPauseButton && _canPause)
                {
                    <MudButton Variant="Variant.Outlined" Color="Color.Primary" FullWidth="true"
                               Class="camera-btn"
                               OnClick="@OnPause">
                        Pause
                    </MudButton>
                }
                @if (_showPauseButton && _canResume)
                {
                    <MudButton Variant="Variant.Outlined" Color="Color.Primary" FullWidth="true"
                               Class="camera-btn"
                               OnClick="@OnResume">
                        Resume
                    </MudButton>
                }
                @if (_canHotReload)
                {
                    <MudButton Variant="Variant.Outlined" Color="Color.Primary" FullWidth="true"
                               Class="camera-btn"
                               OnClick="@OnHotReload">
                        Hot Reload
                    </MudButton>
                }
            </div>
        </div>
    </div>
</div>