<Page
    Foreground="{DynamicResource TextFillColorPrimaryBrush}"
    Loaded="TextToImagePage_OnLoaded"
    Title="TextToImagePage"
    d:DataContext="{d:DesignInstance Type=viewModels:TextToImageViewModel,
                                     IsDesignTimeCreatable=True}"
    d:DesignHeight="700"
    d:DesignWidth="1100"
    mc:Ignorable="d"
    ui:Design.Background="{DynamicResource ApplicationBackgroundBrush}"
    ui:Design.Foreground="{DynamicResource TextFillColorPrimaryBrush}"
    x:Class="StabilityMatrix.TextToImagePage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:local="clr-namespace:StabilityMatrix"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:ui="http://schemas.lepo.co/wpfui/2022/xaml"
    xmlns:viewModels="clr-namespace:StabilityMatrix.ViewModels"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">

    <Grid>
        <Grid Margin="20">
            <Grid.RowDefinitions>
                <RowDefinition Height="*" />
                <RowDefinition Height="Auto" />
            </Grid.RowDefinitions>

            <!--  Controls  -->
            <Grid>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="*" />
                    <ColumnDefinition Width="*" />
                </Grid.ColumnDefinitions>

                <ScrollViewer
                    HorizontalAlignment="Stretch"
                    Margin="8,8,8,16"
                    VerticalAlignment="Stretch">
                    <VirtualizingStackPanel>
                        <!--  Checkpoint  -->
                        <ui:Card
                            HorizontalAlignment="Stretch"
                            Margin="0,4"
                            Padding="8">
                            <Grid>
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="Auto" />
                                    <ColumnDefinition Width="*" />
                                </Grid.ColumnDefinitions>
                                <TextBlock
                                    FontSize="15"
                                    Grid.Column="0"
                                    Margin="8"
                                    Text="Model"
                                    VerticalAlignment="Center" />
                                <ComboBox
                                    DisplayMemberPath="FileName"
                                    Grid.Column="1"
                                    ItemsSource="{Binding DiffusionCheckpointFolder.CheckpointFiles}"
                                    Margin="8"
                                    MinWidth="200"
                                    SelectedValuePath="FileName" />
                            </Grid>
                        </ui:Card>
                        <!--  Prompt card  -->
                        <ui:Card
                            HorizontalAlignment="Stretch"
                            Margin="0,4"
                            Padding="8">
                            <StackPanel Margin="8">
                                <Label
                                    Content="Prompt"
                                    FontSize="14"
                                    Margin="2" />
                                <ui:AutoSuggestBox
                                    Margin="8"
                                    Name="PositivePromptBox"
                                    PlaceholderText="Prompt"
                                    QuerySubmitted="PositivePromptBox_OnQuerySubmitted"
                                    SuggestionChosen="PositivePromptBox_OnSuggestionChosen"
                                    TextChanged="PositivePromptBox_OnTextChanged" />
                                <Label
                                    Content="Negative Prompt"
                                    FontSize="14"
                                    Margin="2" />
                                <ui:AutoSuggestBox
                                    Margin="8"
                                    Name="NegativePromptBox"
                                    PlaceholderText="Negative Prompt"
                                    QuerySubmitted="NegativePromptBox_OnQuerySubmitted"
                                    SuggestionChosen="NegativePromptBox_OnSuggestionChosen"
                                    TextChanged="NegativePromptBox_OnTextChanged" />
                            </StackPanel>
                        </ui:Card>
                        <!--  Samplers and steps  -->
                        <ui:Card
                            HorizontalAlignment="Stretch"
                            Margin="0,4"
                            Padding="8">
                            <VirtualizingStackPanel>
                                <Grid Margin="8">
                                    <Grid.ColumnDefinitions>
                                        <ColumnDefinition Width="Auto" />
                                        <ColumnDefinition Width="Auto" />
                                        <ColumnDefinition Width="*" />
                                        <ColumnDefinition Width="Auto" />
                                    </Grid.ColumnDefinitions>
                                    <TextBlock
                                        FontSize="15"
                                        Grid.Column="0"
                                        Margin="8"
                                        Text="Sampler"
                                        VerticalAlignment="Center" />
                                    <ComboBox
                                        Grid.Column="1"
                                        ItemsSource="{Binding Samplers}"
                                        Margin="8"
                                        MinWidth="200" />
                                    <TextBlock
                                        FontSize="14"
                                        Grid.Column="2"
                                        HorizontalAlignment="Right"
                                        Margin="8"
                                        Text="Steps"
                                        VerticalAlignment="Center" />
                                    <TextBox
                                        FontSize="14"
                                        Grid.Column="3"
                                        Margin="8"
                                        Text="{Binding GenerationSteps}"
                                        VerticalAlignment="Bottom"
                                        Width="64" />
                                </Grid>

                                <Slider
                                    IsSnapToTickEnabled="True"
                                    Margin="8,0,8,8"
                                    Maximum="150"
                                    Minimum="0"
                                    TickFrequency="5"
                                    TickPlacement="BottomRight"
                                    Value="{Binding GenerationSteps}" />
                            </VirtualizingStackPanel>
                        </ui:Card>
                    </VirtualizingStackPanel>
                </ScrollViewer>

                <!--  Image Viewer  -->
                <ui:Card
                    Grid.Column="1"
                    HorizontalAlignment="Stretch"
                    Margin="8,8,8,16"
                    Padding="8"
                    VerticalAlignment="Top">
                    <Grid>
                        <Grid.RowDefinitions>
                            <RowDefinition Height="0.2*" />
                            <RowDefinition Height="0.7*" />
                        </Grid.RowDefinitions>
                        <StackPanel
                            Grid.Row="0"
                            Orientation="Vertical"
                            VerticalAlignment="Top">
                            <Label
                                Content="Image"
                                FontSize="14"
                                Margin="2" />
                            <ProgressBar
                                Maximum="100"
                                Value="{Binding ProgressValue, FallbackValue=10}"
                                Visibility="{Binding ProgressBarVisibility, FallbackValue=Visible}"
                                Width="500" />
                        </StackPanel>
                        <Grid
                            Background="{DynamicResource ApplicationBackgroundBrush}"
                            Grid.Row="1"
                            MinHeight="512"
                            VerticalAlignment="Stretch">
                            <ui:ProgressRing
                                Background="DarkRed"
                                Grid.Row="0"
                                Height="72"
                                HorizontalAlignment="Center"
                                IsIndeterminate="True"
                                Margin="8"
                                VerticalAlignment="Center"
                                Visibility="{Binding ProgressRingVisibility, FallbackValue=Collapsed}"
                                Width="72"
                                x:Name="ImageProgressRing" />
                            <Image
                                HorizontalAlignment="Stretch"
                                Margin="8"
                                Source="{Binding ImagePreview}"
                                Stretch="Uniform"
                                VerticalAlignment="Stretch"
                                Visibility="{Binding ImagePreviewVisibility, FallbackValue=Visible}" />
                        </Grid>
                    </Grid>
                </ui:Card>
            </Grid>

            <ui:Button
                Appearance="Primary"
                Command="{Binding TextToImageGenerateCommand}"
                Content="Generate Image"
                Grid.Row="1"
                HorizontalAlignment="Center"
                Name="TextToImageButton" />

        </Grid>
        <ContentPresenter x:Name="PageContentDialog" />
    </Grid>
</Page>
