<ui:Page x:Class="AutoDarkModeApp.Pages.PageColorization"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
         xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
         xmlns:ui="http://schemas.modernwpf.com/2019"
         xmlns:p="clr-namespace:AutoDarkModeLib.Properties;assembly=AutoDarkModeLib"
         xmlns:local="clr-namespace:AutoDarkModeApp.Pages"
         xmlns:uc="clr-namespace:AutoDarkModeApp.Controls"
         mc:Ignorable="d"
         d:DesignWidth="700"
         Loaded="Page_Loaded"
         Title="PageColorization">
    <ui:Page.Resources>
        <Style TargetType="Grid"
               x:Key="DisabledDarkGridStyle">
            <Style.Triggers>
                <DataTrigger Binding="{Binding ElementName=SetGridDark, Path=IsEnabled}"
                             Value="False">
                    <Setter Property="Opacity"
                            Value="0.25" />
                </DataTrigger>
            </Style.Triggers>
        </Style><Style TargetType="Grid"
               x:Key="DisabledLightGridStyle">
            <Style.Triggers>
                <DataTrigger Binding="{Binding ElementName=SetGridLight, Path=IsEnabled}"
                             Value="False">
                    <Setter Property="Opacity"
                            Value="0.25" />
                </DataTrigger>
            </Style.Triggers>
        </Style>
    </ui:Page.Resources>

    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="0.4*" />
            <ColumnDefinition Width="10*"
                              MaxWidth="1000"
                              MinWidth="450" />
            <ColumnDefinition Width="0.4*" />
        </Grid.ColumnDefinitions>

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

        <TextBlock Grid.Row="1"
                   Grid.Column="1"
                   Name="TextBlockBackButton"
                   Margin="0,13,0,0"
                   FontFamily="Segoe MDL2 Assets"
                   FontSize="20"
                   Text="&#xe830;"
                   Cursor="Hand"
                   MouseDown="TextBlockBackButton_MouseDown" />

        <TextBlock Grid.Row="1"
                   Grid.Column="1"
                   Margin="35,0,0,0"
                   FontFamily="Segoe UI Semilight"
                   FontSize="30"
                   Text="{x:Static p:Resources.ColorizationTextBlockHeader}" />

        <uc:Card Grid.Row="3"
                 Grid.Column="1"
                 Margin="0,0,0,4"
                 Padding="30,15,0,15">
            <Grid>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="Auto" />
                    <ColumnDefinition Width="*" />
                    <ColumnDefinition Width="Auto" />
                </Grid.ColumnDefinitions>
                <TextBlock Grid.Column="0"
                           Text="{x:Static p:Resources.ColorizationEnableSwitch}"
                           VerticalAlignment="Center"
                           FontSize="14"
                           Padding="0,5,0,5" />
                <ui:ToggleSwitch Name="ToggleSwitchColorizationEnabled"
                                 OffContent="{x:Static p:Resources.ToggleSwitchOff}"
                                 OnContent="{x:Static p:Resources.ToggleSwitchOn}"
                                 Grid.Column="2"
                                 VerticalAlignment="Center"
                                 HorizontalAlignment="Right"
                                 Margin="0,5,0,5"
                                 Toggled="ToggleSwitchColorizationEnabled_Toggled" />
            </Grid>
        </uc:Card>

        <TextBlock Margin="0,15,0,10"
                   Name="LightThemeHeader"
                   Grid.Row="4"
                   Grid.Column="1"
                   FontFamily="Segoe UI Semibold"
                   FontSize="14"
                   Text="{x:Static p:Resources.lblLightTheme}" />

        <uc:Card Grid.Row="5"
                 Grid.Column="1"
                 Padding="30,18,15,15">

            <Expander FlowDirection="RightToLeft" Name="LightExpander">
                <Expander.Header>
                    <Grid Margin="0,0,0,0"
                          Cursor="Hand"
                          FlowDirection="LeftToRight"
                          VerticalAlignment="Center"
                          HorizontalAlignment="{Binding HorizontalAlignment, RelativeSource={RelativeSource AncestorType=ContentPresenter}, Mode=OneWayToSource}">
                        <Grid.RowDefinitions>
                            <RowDefinition Height="Auto"/>
                            <RowDefinition Height="Auto"/>
                        </Grid.RowDefinitions>
                        
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="Auto" />
                            <ColumnDefinition Width="*" />
                            <ColumnDefinition Width="Auto" />
                        </Grid.ColumnDefinitions>

                        <TextBlock FontSize="14"
                                   Grid.Row="0"
                                   Grid.Column="1"
                                   Text="{x:Static p:Resources.WallpaperComboBoxMode}"
                                   VerticalAlignment="Center" />

                        <ComboBox Name="LightAutoColorizationComboBox"
                                  Grid.Column="2"
                                  Grid.Row="0"
                                  SelectionChanged="LightAutoColorizationComboBox_SelectionChanged"
                                  MinWidth="120"
                                  SelectedIndex="0"
                                  Margin="0,0,5,0">
                            <ComboBoxItem Content="{x:Static p:Resources.Automatic}"
                                          Name="AutoLight" />
                            <ComboBoxItem Content="{x:Static p:Resources.Manual}"
                                          Name="ManualLight" />
                        </ComboBox>
                    </Grid>
                </Expander.Header>

                <ui:SimpleStackPanel Name="LightColorPickerStackPanel"
                                     Margin="0,15,0,0"
                                     FlowDirection="LeftToRight">

                    <Separator Margin="-30,0,-14,15"
                               Grid.Row="1"
                               Grid.ColumnSpan="3"
                               Background="{DynamicResource Win11Border}" />

                    <uc:ColorControlPanel x:Name="lightColorizationSetBox"
                                          ShowAlpha="False"
                                          ColorChanged="LightColorizationSetBox_ColorChanged"
                                          VerticalAlignment="Center" />

                    <Separator Margin="-30,10,-15,0"
                               Background="{DynamicResource Win11Border}" />

                    <Grid Margin="0,10,0,0"
                          Name="SetGridLight"
                          Style="{StaticResource DisabledLightGridStyle}">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="Auto" />
                            <ColumnDefinition Width="*" />
                            <ColumnDefinition Width="Auto" />
                        </Grid.ColumnDefinitions>

                        <TextBlock FontSize="14"
                                   Text="{x:Static p:Resources.ColorizationTextBlockUpdate}"
                                   VerticalAlignment="Center" />

                        <Button Content="{x:Static p:Resources.offsetButton}"
                                MinWidth="95"
                                Grid.Column="2"
                                Click="LightColorizationButton_Click"
                                Name="LightColorizationButton"/>

                    </Grid>

                </ui:SimpleStackPanel>
            </Expander>
        </uc:Card>

        <TextBlock Margin="0,25,0,10"
                   Name="DarkThemeHeader"
                   Grid.Row="6"
                   Grid.Column="1"
                   FontFamily="Segoe UI Semibold"
                   FontSize="14"
                   Text="{x:Static p:Resources.lblDarkTheme}" />

        <uc:Card Grid.Row="7"
                 Grid.Column="1"
                 Margin="0,0,0,0"
                 Padding="30,18,15,15">
            <ui:SimpleStackPanel>
                <Expander FlowDirection="RightToLeft" Name="DarkExpander">
                    <Expander.Header>
                        <Grid Margin="0,0,0,0"
                              Cursor="Hand"
                              FlowDirection="LeftToRight"
                              HorizontalAlignment="{Binding HorizontalAlignment, RelativeSource={RelativeSource AncestorType=ContentPresenter}, Mode=OneWayToSource}">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="Auto" />
                                <ColumnDefinition Width="*" />
                                <ColumnDefinition Width="Auto" />
                            </Grid.ColumnDefinitions>

                            <TextBlock FontSize="14"
                                       Grid.Column="1"
                                       Text="{x:Static p:Resources.WallpaperComboBoxMode}"
                                       VerticalAlignment="Center" />

                            <ComboBox Name="DarkAutoColorizationComboBox"
                                      Grid.Column="2"
                                      MinWidth="120"
                                      SelectionChanged="DarkAutoColorizationComboBox_SelectionChanged"
                                      SelectedIndex="0"
                                      Margin="0,0,5,0">
                                <ComboBoxItem Content="{x:Static p:Resources.Automatic}"
                                              Name="AutoDark" />
                                <ComboBoxItem Content="{x:Static p:Resources.Manual}"
                                              Name="ManualDark" />
                            </ComboBox>
                        </Grid>
                    </Expander.Header>


                    <ui:SimpleStackPanel Margin="0,15,0,0"
                                         FlowDirection="LeftToRight"
                                         Name="DarkColorPickerStackPanel">
                        
                        <Separator Margin="-30,0,-14,15"
                                   Grid.Row="1"
                                   Grid.ColumnSpan="3"
                                   Background="{DynamicResource Win11Border}" />

                        <uc:ColorControlPanel x:Name="darkColorizationSetBox"
                                              ShowAlpha="False"
                                              ColorChanged="DarkColorizationSetBox_ColorChanged"
                                              VerticalAlignment="Center" />

                        <Separator Margin="-30,10,-15,0"
                                   Background="{DynamicResource Win11Border}" />

                        <Grid Margin="0,10,0,0" Name="SetGridDark" Style="{StaticResource DisabledDarkGridStyle}">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="Auto" />
                                <ColumnDefinition Width="*" />
                                <ColumnDefinition Width="Auto" />
                            </Grid.ColumnDefinitions>

                            <TextBlock FontSize="14"
                                       Text="{x:Static p:Resources.ColorizationTextBlockUpdate}"
                                       VerticalAlignment="Center" />

                            <Button Content="{x:Static p:Resources.offsetButton}"
                                    MinWidth="95"
                                    Grid.Column="2"
                                    Click="DarkColorizationButton_Click"
                                    Name="DarkColorizationButton"/>

                        </Grid>
                    </ui:SimpleStackPanel>
                </Expander>
            </ui:SimpleStackPanel>
        </uc:Card>
    </Grid>
</ui:Page>
