<UserControl x:Class="NETworkManager.Views.SettingsAppearanceView"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:Converter="clr-namespace:NETworkManager.Converters"
        xmlns:Validator="clr-namespace:NETworkManager.Validators"
        xmlns:metro="clr-namespace:MahApps.Metro;assembly=MahApps.Metro"
        xmlns:mah="http://metro.mahapps.com/winfx/xaml/controls"
        xmlns:IconPacks="http://metro.mahapps.com/winfx/xaml/iconpacks"
        xmlns:Documentation="clr-namespace:NETworkManager.Models.Documentation"
        mc:Ignorable="d">
    <UserControl.Resources>
        <!-- Converters -->
        <Converter:AppThemeToBrushConverter x:Key="AppThemeToBrushConverter" />
        <Converter:AppThemeToStringConverter x:Key="AppThemeToStringConverter" />
        <Converter:AccentToBrushConverter x:Key="AccentToBrushConverter" />
        <Converter:AccentToStringConverter x:Key="AccentToStringConverter" />
    </UserControl.Resources>
    <StackPanel>
        <TextBlock Style="{StaticResource HeaderTextBlock}" Text="{DynamicResource String_Header_Theme}"  />
        <ListView ScrollViewer.HorizontalScrollBarVisibility="Disabled" ItemsSource="{x:Static metro:ThemeManager.AppThemes}" VerticalAlignment="Top" BorderThickness="0" Margin="0,0,0,20" SelectionMode="Single" >
            <ListView.ItemTemplate>
                <DataTemplate>
                    <Rectangle Width="48" Height="48" Margin="-1,2" Fill="{Binding Converter={StaticResource AppThemeToBrushConverter}, ConverterParameter='Name'}" ToolTip="{Binding Converter={StaticResource AppThemeToStringConverter}, ConverterParameter='Name'}"/>
                </DataTemplate>
            </ListView.ItemTemplate>
            <ListView.ItemsPanel>
                <ItemsPanelTemplate>
                    <WrapPanel />
                </ItemsPanelTemplate>
            </ListView.ItemsPanel>
            <!-- BUGFIX This has to be set, to enable mouse wheel scrolling -->
            <ListBox.Template>
                <ControlTemplate>
                    <ItemsPresenter />
                </ControlTemplate>
            </ListBox.Template>
            <!-- /BUGFIX-->
            <ListView.SelectedItem>
                <Binding Path="AppThemeSelectedItem" Mode="TwoWay" UpdateSourceTrigger="PropertyChanged" />
            </ListView.SelectedItem>
        </ListView>
        <TextBlock Style="{StaticResource HeaderTextBlock}" Text="{DynamicResource String_Header_Accent}" />
        <ListView ScrollViewer.HorizontalScrollBarVisibility="Disabled" ItemsSource="{x:Static metro:ThemeManager.Accents}" BorderThickness="0" SelectionMode="Single" Margin="0,0,0,10">
            <ListView.ItemTemplate>
                <DataTemplate >
                    <Rectangle Width="48" Height="48" Margin="-1,2" Fill="{Binding Converter={StaticResource AccentToBrushConverter}, ConverterParameter='Name'}" ToolTip="{Binding Converter={StaticResource AccentToStringConverter}, ConverterParameter='Name'}"  />
                </DataTemplate>
            </ListView.ItemTemplate>
            <ListView.ItemsPanel>
                <ItemsPanelTemplate>
                    <WrapPanel />
                </ItemsPanelTemplate>
            </ListView.ItemsPanel>
            <!-- BUGFIX This has to be set, to enable mouse wheel scrolling -->
            <ListBox.Template>
                <ControlTemplate>
                    <ItemsPresenter />
                </ControlTemplate>
            </ListBox.Template>
            <!-- /BUGFIX-->
            <ListView.SelectedItem>
                <Binding Path="AccentSelectedItem" Mode="TwoWay" UpdateSourceTrigger="PropertyChanged" />
            </ListView.SelectedItem>
        </ListView>
        <StackPanel Orientation="Horizontal" Margin="0,0,0,20">
            <StackPanel.InputBindings>
                <MouseBinding Gesture="LeftClick" Command="{x:Static Documentation:DocumentationManager.OpenDocumentationCommand}" CommandParameter="HowTo_CreateCustomThemeAndAccent" />
            </StackPanel.InputBindings>
            <StackPanel.Style>
                <Style TargetType="{x:Type StackPanel}">
                    <Setter Property="TextBlock.Foreground" Value="{DynamicResource AccentColorBrush}" />
                    <Setter Property="Cursor" Value="Hand" />
                    <Style.Triggers>
                        <Trigger Property="IsMouseOver" Value="True">
                            <Setter Property="TextBlock.Foreground" Value="{DynamicResource BlackColorBrush}" />
                        </Trigger>
                    </Style.Triggers>
                </Style>
            </StackPanel.Style>
            <Rectangle Width="16" Height="20">
                <Rectangle.OpacityMask>
                    <VisualBrush Stretch="Uniform" Visual="{IconPacks:Material Kind=OpenInNew}"/>
                </Rectangle.OpacityMask>
                <Rectangle.Style>
                    <Style TargetType="{x:Type Rectangle}">
                        <Setter Property="Fill" Value="{DynamicResource AccentColorBrush}" />
                        <Style.Triggers>
                            <DataTrigger Binding="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type StackPanel}}, Path=IsMouseOver}" Value="True">
                                <Setter Property="Fill" Value="{DynamicResource BlackColorBrush}" />
                            </DataTrigger>
                        </Style.Triggers>
                    </Style>
                </Rectangle.Style>
            </Rectangle>
            <TextBlock Text="{DynamicResource String_DocumentationTitle_00002}" VerticalAlignment="Center" FontSize="14" Margin="10,0,0,0" />
        </StackPanel>
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*" />
                <ColumnDefinition Width="10" />
                <ColumnDefinition Width="Auto" />
            </Grid.ColumnDefinitions>
            <TextBlock Grid.Column="0" Style="{StaticResource HeaderTextBlock}" Text="{DynamicResource String_Header_Transparency}" />
            <Rectangle Grid.Column="2" Width="24" Height="24" ToolTip="{DynamicResource String_WarningMessage_SettingsGeneralAppearanceTransparency}" Style="{StaticResource WarnImageRectangle}" Margin="0,0,0,10">
                <Rectangle.Resources>
                    <Style TargetType="{x:Type ToolTip}" BasedOn="{StaticResource WarnToolTip}" />
                </Rectangle.Resources>
            </Rectangle>
        </Grid>
        <mah:ToggleSwitch Header="{DynamicResource String_EnableTransparency}" OnLabel="{DynamicResource String_ToggleSwitch_On}" OffLabel="{DynamicResource String_ToggleSwitch_Off}" IsChecked="{Binding EnableTransparency}" Margin="0,0,0,10"/>
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*" />
                <ColumnDefinition Width="Auto" />
            </Grid.ColumnDefinitions>
            <Slider Grid.Column="0" Minimum="10" MaxHeight="100" Value="{Binding Opacity}" IsEnabled="{Binding EnableTransparency}" Style="{DynamicResource FlatSlider}" VerticalAlignment="Center" ToolTip="{Binding Value, RelativeSource={RelativeSource Self}}" TickFrequency="1" IsSnapToTickEnabled="True" />
            <TextBox Grid.Column="1" Width="80" IsEnabled="{Binding EnableTransparency}" Style="{StaticResource DefaultTextBox}" TextAlignment="Center" Margin="10,0,0,0">
                <TextBox.Text>
                    <Binding Path="Opacity" Mode="TwoWay" UpdateSourceTrigger="PropertyChanged">
                        <Binding.ValidationRules>
                            <Validator:EmptyValidator ValidatesOnTargetUpdated="True" />
                            <Validator:OpacityTextboxValidator ValidatesOnTargetUpdated="True" />
                        </Binding.ValidationRules>
                    </Binding>
                </TextBox.Text>
            </TextBox>
        </Grid>
    </StackPanel>
</UserControl>
