<UserControl
    x:Class="ClockRack.SettingsDialog"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:ClockRack"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    d:DesignHeight="300"
    d:DesignWidth="400">
    
    <UserControl.Resources>
        <Style x:Key="DialogCaptionTextStyle"
               TargetType="TextBlock"
               BasedOn="{StaticResource CaptionTextStyle}">
            <Setter Property="FontSize" Value="14.67" />
            <Setter Property="FontWeight" Value="SemiLight" />
            <Setter Property="Margin" Value="0 16 0 8" />
        </Style>
        
        <DataTemplate x:Key="colorItemTemplate">
            <!-- Element to NamedColor //////// SettingsDialog.ColorItem -->
            <StackPanel Orientation="Horizontal">
                <Rectangle Width="96" Height="24" Margin="12 6">
                    <Rectangle.Fill>
                        <SolidColorBrush Color="{Binding Color}" />
                    </Rectangle.Fill>
                </Rectangle>
                
                <TextBlock Text="{Binding Name}"
                           VerticalAlignment="Center" />
            </StackPanel>
        </DataTemplate>
    </UserControl.Resources>

    <!-- DataContext to TimeZoneClockViewModel -->
    <Border Background="{StaticResource ApplicationPageBackgroundThemeBrush}"
            BorderBrush="{StaticResource ApplicationForegroundThemeBrush}"
            BorderThickness="1"
            Padding="7 0 0 0"
            Width="384">
        <StackPanel Margin="24">
            <TextBlock Text="Ustawienia ClockRack dla"
                       Style="{StaticResource SubheaderTextStyle}"
                       TextAlignment="Center" />
            
            <TextBlock Text="{Binding Location}"
                       Style="{StaticResource SubheaderTextStyle}"
                       TextAlignment="Center"
                       Margin="0 0 0 12" />
            
            <!-- Lokalizacja -->
            <TextBlock Text="Lokalizacja"
                       Style="{StaticResource DialogCaptionTextStyle}" />
            
            <TextBox Name="locationTextBox"
                     Text="{Binding Location}"
                     TextChanged="OnLocationTextBoxTextChanged" />

            <!-- Strefa czasowa -->
            <TextBlock Text="Strefa czasowa"
                       Style="{StaticResource DialogCaptionTextStyle}" />

            <ComboBox Name="timeZoneComboBox"
                      SelectedValuePath="TimeZoneKey"
                      SelectedValue="{Binding TimeZoneKey, Mode=TwoWay}">
                <ComboBox.ItemTemplate>
                    <!-- Data to TimeZoneDisplayInfo -->
                    <DataTemplate>
                        <TextBlock Text="{Binding Display}" />
                    </DataTemplate>
                </ComboBox.ItemTemplate>
            </ComboBox>
            
            <!-- Kolor tła -->
            <TextBlock Text="Kolor zegara"
                       Style="{StaticResource DialogCaptionTextStyle}" />
            
            <ComboBox Name="foregroundComboBox"
                      ItemTemplate="{StaticResource colorItemTemplate}"
                      SelectedValuePath="Name"
                      SelectedValue="{Binding ForegroundName, Mode=TwoWay}" />
            
            <TextBlock Text="Kolor tła"
                       Style="{StaticResource DialogCaptionTextStyle}" />

            <ComboBox Name="backgroundComboBox"
                      ItemTemplate="{StaticResource colorItemTemplate}"
                      SelectedValuePath="Name"
                      SelectedValue="{Binding BackgroundName, Mode=TwoWay}" />
        </StackPanel>
    </Border>
</UserControl>
