<UserControl
    d:DesignHeight="450"
    d:DesignWidth="800"
    mc:Ignorable="d"
    x:Class="PicView.Avalonia.Views.Main.SettingsView"
    x:DataType="viewModels:MainViewModel"
    xmlns="https://github.com/avaloniaui"
    xmlns:config="clr-namespace:PicView.Avalonia.Views.Config"
    xmlns:customControls="clr-namespace:PicView.Avalonia.CustomControls"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:viewModels="clr-namespace:PicView.Avalonia.ViewModels"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
    <Design.DataContext>
        <viewModels:MainViewModel />
    </Design.DataContext>
    <UserControl.Resources>
        <Thickness x:Key="TabMargin">20,5,40,0</Thickness>
        <Thickness x:Key="TabPadding">45,5,45,20</Thickness>
    </UserControl.Resources>
    <UserControl.ContextMenu>
        <ContextMenu x:Name="ContextMenu">
            <MenuItem
                Command="{CompiledBinding Tools.ShowSettingsFileCommand}"
                Foreground="{DynamicResource MainTextColor}"
                Header="UserSettings.json"
                x:Name="UserSettingsItem">
                <MenuItem.Icon>
                    <Image
                        Height="12"
                        Source="{StaticResource BracesImage}"
                        Width="12" />
                </MenuItem.Icon>
            </MenuItem>
            <MenuItem
                Command="{CompiledBinding Tools.ShowKeybindingsFileCommand}"
                Foreground="{DynamicResource MainTextColor}"
                Header="keybindings.json"
                x:Name="KeybindingsItem">
                <MenuItem.Icon>
                    <Image
                        Height="12"
                        Source="{StaticResource BracesImage}"
                        Width="12" />
                </MenuItem.Icon>
            </MenuItem>
            <MenuItem
                Command="{CompiledBinding Tools.ResetSettingsCommand}"
                Foreground="{DynamicResource MainTextColor}"
                Header="{CompiledBinding Translation.ResetButtonText.Value,
                                         Mode=OneWay}">
                <MenuItem.Icon>
                    <Image
                        Height="12"
                        Source="{StaticResource ResetImage}"
                        Width="12" />
                </MenuItem.Icon>
            </MenuItem>
            <Separator />
            <MenuItem Header="{CompiledBinding Translation.Close.Value, Mode=OneWay}" x:Name="CloseItem">
                <MenuItem.Icon>
                    <Path
                        Data="{StaticResource CloseGeometry}"
                        Fill="{DynamicResource MainTextColor}"
                        Height="12"
                        Stretch="Fill"
                        Width="12" />
                </MenuItem.Icon>
            </MenuItem>
        </ContextMenu>
    </UserControl.ContextMenu>
    <Panel Background="Transparent" Focusable="True">

        <TabControl
            Background="{DynamicResource TertiaryBackgroundColor}"
            BorderBrush="{DynamicResource MainBorderColor}"
            BorderThickness="0"
            Margin="0"
            Padding="0"
            TabStripPlacement="Left"
            x:Name="MainTabControl">
            <TabControl.Styles>
                <Styles>
                    <Style Selector="TabItem.headerStyle">
                        <Setter Property="HorizontalContentAlignment" Value="Left" />
                        <Setter Property="Padding" Value="12, 10" />
                        <Setter Property="Width" Value="225" />
                    </Style>
                    <Style Selector="Image.imageStyle">
                        <Setter Property="Margin" Value="2,0,8,0" />
                        <Setter Property="Width" Value="14" />
                        <Setter Property="Height" Value="14" />
                    </Style>
                </Styles>
            </TabControl.Styles>

            <!--  General Settings  -->
            <TabItem Classes="headerStyle" x:Name="GeneralSettingsTabItem">
                <TabItem.Header>
                    <StackPanel Orientation="Horizontal">
                        <Image Classes="imageStyle" Source="{StaticResource GeneralSettingsAltImage}" />
                        <TextBlock
                            Classes="txt txtShadow"
                            Foreground="{StaticResource SecondaryTextColor}"
                            Text="{Binding Translation.GeneralSettings.Value, Mode=OneWay}" />
                    </StackPanel>
                </TabItem.Header>
                <customControls:AutoScrollViewer Background="Transparent" Height="{Binding Path=Bounds.Height, ElementName=MainTabControl}">
                    <config:GeneralSettingsView Margin="{StaticResource TabMargin}" Padding="{StaticResource TabPadding}" />
                </customControls:AutoScrollViewer>
            </TabItem>

            <!--  Appearance Settings  -->
            <TabItem Classes="headerStyle" x:Name="AppearanceTabItem">
                <TabItem.Header>
                    <StackPanel Orientation="Horizontal">
                        <Image Classes="imageStyle" Source="{StaticResource PaletteAltImage}" />
                        <TextBlock
                            Classes="txt txtShadow"
                            Foreground="{StaticResource SecondaryTextColor}"
                            Text="{Binding Translation.Appearance.Value, Mode=OneWay}" />
                    </StackPanel>
                </TabItem.Header>
                <customControls:AutoScrollViewer Background="Transparent" Height="{Binding Path=Bounds.Height, ElementName=MainTabControl}">
                    <config:AppearanceView
                        Background="Transparent"
                        Margin="{StaticResource TabMargin}"
                        Padding="{StaticResource TabPadding}" />
                </customControls:AutoScrollViewer>
            </TabItem>

            <!--  UI Settings  -->
            <TabItem Classes="headerStyle" x:Name="InterfaceConfigurationTabItem">
                <TabItem.Header>
                    <StackPanel Orientation="Horizontal">
                        <Image Classes="imageStyle" Source="{StaticResource ColumnsSettingsAltImage}" />
                        <TextBlock
                            Classes="txt txtShadow"
                            Foreground="{StaticResource SecondaryTextColor}"
                            Text="{Binding Translation.InterfaceConfiguration.Value, Mode=OneWay}" />
                    </StackPanel>
                </TabItem.Header>
                <customControls:AutoScrollViewer Background="Transparent" Height="{Binding Path=Bounds.Height, ElementName=MainTabControl}">
                    <config:InterfaceConfigurationView
                        Background="Transparent"
                        Margin="{StaticResource TabMargin}"
                        Padding="{StaticResource TabPadding}" />
                </customControls:AutoScrollViewer>
            </TabItem>

            <!--  Image Settings  -->
            <TabItem Classes="headerStyle" x:Name="ImageTabItem">
                <TabItem.Header>
                    <StackPanel Orientation="Horizontal">
                        <Image Classes="imageStyle" Source="{StaticResource ImageSettingAltImage}" />
                        <TextBlock
                            Classes="txt txtShadow"
                            Foreground="{StaticResource SecondaryTextColor}"
                            Text="{Binding Translation.Image.Value, Mode=OneWay}" />
                    </StackPanel>
                </TabItem.Header>
                <customControls:AutoScrollViewer Background="Transparent" Height="{Binding Path=Bounds.Height, ElementName=MainTabControl}">
                    <config:ImageSettingsView
                        Background="Transparent"
                        Margin="{StaticResource TabMargin}"
                        Padding="{StaticResource TabPadding}" />
                </customControls:AutoScrollViewer>
            </TabItem>

            <!--  Window Settings  -->
            <TabItem Classes="headerStyle" x:Name="WindowTabItem">
                <TabItem.Header>
                    <StackPanel Orientation="Horizontal">
                        <Image Classes="imageStyle" Source="{StaticResource WindowAltImage}" />
                        <TextBlock
                            Classes="txt txtShadow"
                            Foreground="{StaticResource SecondaryTextColor}"
                            Text="{Binding Translation.Window.Value, Mode=OneWay}" />
                    </StackPanel>
                </TabItem.Header>
                <customControls:AutoScrollViewer Background="Transparent" Height="{Binding Path=Bounds.Height, ElementName=MainTabControl}">
                    <config:WindowSettingsView
                        Background="Transparent"
                        Margin="{StaticResource TabMargin}"
                        Padding="{StaticResource TabPadding}" />
                </customControls:AutoScrollViewer>
            </TabItem>

            <!--  Gallery Settings  -->
            <TabItem Classes="headerStyle" x:Name="GalleryTabItem">
                <TabItem.Header>
                    <StackPanel Orientation="Horizontal">
                        <Image Classes="imageStyle" Source="{StaticResource GalleryAltImage}" />
                        <TextBlock
                            Classes="txt txtShadow"
                            Foreground="{StaticResource SecondaryTextColor}"
                            Text="{CompiledBinding Translation.GallerySettings.Value,
                                                   Mode=OneWay}" />
                    </StackPanel>
                </TabItem.Header>
                <customControls:AutoScrollViewer Background="Transparent" Height="{Binding Path=Bounds.Height, ElementName=MainTabControl}">
                    <config:GalleryView
                        Background="Transparent"
                        Margin="{StaticResource TabMargin}"
                        Padding="{StaticResource TabPadding}" />
                </customControls:AutoScrollViewer>
            </TabItem>

            <!--  Slideshow Settings  -->
            <TabItem Classes="headerStyle" x:Name="SlideshowTabItem">
                <TabItem.Header>
                    <StackPanel Orientation="Horizontal">
                        <Image Classes="imageStyle" Source="{StaticResource SlideshowAltImage}" />
                        <TextBlock
                            Classes="txt txtShadow"
                            Foreground="{StaticResource SecondaryTextColor}"
                            Text="{CompiledBinding Translation.Slideshow.Value,
                                                   Mode=OneWay}" />
                    </StackPanel>
                </TabItem.Header>
                <customControls:AutoScrollViewer Background="Transparent" Height="{Binding Path=Bounds.Height, ElementName=MainTabControl}">
                    <config:SlideshowSettingsView
                        Background="Transparent"
                        Margin="{StaticResource TabMargin}"
                        Padding="{StaticResource TabPadding}" />
                </customControls:AutoScrollViewer>
            </TabItem>

            <!--  Navigation Settings  -->
            <TabItem Classes="headerStyle" x:Name="NavigationTabItem">
                <TabItem.Header>
                    <StackPanel Orientation="Horizontal">
                        <Image Classes="imageStyle" Source="{StaticResource SignPostAltImage}" />
                        <TextBlock
                            Classes="txt txtShadow"
                            Foreground="{StaticResource SecondaryTextColor}"
                            Text="{CompiledBinding Translation.Navigation.Value,
                                                   Mode=OneWay}" />
                    </StackPanel>
                </TabItem.Header>

                <customControls:AutoScrollViewer Background="Transparent" Height="{Binding Path=Bounds.Height, ElementName=MainTabControl}">
                    <config:NavigationView
                        Background="Transparent"
                        Margin="{StaticResource TabMargin}"
                        Padding="{StaticResource TabPadding}" />
                </customControls:AutoScrollViewer>
            </TabItem>

            <!--  Zoom Settings  -->
            <TabItem Classes="headerStyle">
                <TabItem.Header>
                    <StackPanel Orientation="Horizontal">
                        <Image Classes="imageStyle" Source="{StaticResource ZoomAltImage}" />
                        <TextBlock
                            Classes="txt txtShadow"
                            Foreground="{StaticResource SecondaryTextColor}"
                            Text="{CompiledBinding Translation.Zoom.Value,
                                                   Mode=OneWay}" />
                    </StackPanel>
                </TabItem.Header>
                <customControls:AutoScrollViewer Background="Transparent" Height="{Binding Path=Bounds.Height, ElementName=MainTabControl}">
                    <config:ZoomSettingsView
                        Background="Transparent"
                        Margin="{StaticResource TabMargin}"
                        Padding="{StaticResource TabPadding}" />
                </customControls:AutoScrollViewer>
            </TabItem>

            <!--  Mouse Settings  -->
            <TabItem Classes="headerStyle" x:Name="MouseTabItem">
                <TabItem.Header>
                    <StackPanel Orientation="Horizontal">
                        <Image Classes="imageStyle" Source="{StaticResource MouseWheelIcon}" />
                        <TextBlock
                            Classes="txt txtShadow"
                            Foreground="{StaticResource SecondaryTextColor}"
                            Text="{CompiledBinding Translation.Mouse.Value,
                                                   Mode=OneWay}" />
                    </StackPanel>
                </TabItem.Header>
                <customControls:AutoScrollViewer Background="Transparent" Height="{Binding Path=Bounds.Height, ElementName=MainTabControl}">
                    <config:MouseView
                        Background="Transparent"
                        Margin="{StaticResource TabMargin}"
                        Padding="{StaticResource TabPadding}" />
                </customControls:AutoScrollViewer>
            </TabItem>

            <!--  Language Settings  -->
            <TabItem Classes="headerStyle" x:Name="LanguageTabItem">
                <TabItem.Header>
                    <StackPanel Orientation="Horizontal">
                        <Image Classes="imageStyle" Source="{StaticResource LanguageSettingsAltImage}" />
                        <TextBlock
                            Classes="txt txtShadow"
                            Foreground="{StaticResource SecondaryTextColor}"
                            Text="{CompiledBinding Translation.Language.Value,
                                                   Mode=OneWay}" />
                    </StackPanel>
                </TabItem.Header>
                <customControls:AutoScrollViewer Background="Transparent" Height="{Binding Path=Bounds.Height, ElementName=MainTabControl}">
                    <config:LanguageView
                        Background="Transparent"
                        Margin="{StaticResource TabMargin}"
                        Padding="{StaticResource TabPadding}" />
                </customControls:AutoScrollViewer>
            </TabItem>

            <!--  Application Shortcuts  -->
            <TabItem Classes="headerStyle" x:Name="AppShortcutsTabItem">
                <TabItem.Header>
                    <StackPanel Orientation="Horizontal">
                        <Image
                            Classes="imageStyle"
                            Height="17"
                            Source="{StaticResource ShortcutsImageAlt}"
                            Width="17" />
                        <TextBlock
                            Classes="txt txtShadow"
                            Foreground="{StaticResource SecondaryTextColor}"
                            Text="{CompiledBinding Translation.ApplicationShortcuts.Value,
                                                   Mode=OneWay}" />
                    </StackPanel>
                </TabItem.Header>
                <Button
                    Background="{DynamicResource AltBackgroundHoverColor}"
                    BorderBrush="{DynamicResource SecondaryBorderColor}"
                    Classes="ButtonBorder hover"
                    Command="{CompiledBinding Window.ShowKeybindingsWindow}"
                    HorizontalAlignment="Left"
                    Margin="65,50,0,20"
                    Padding="0,0,7,0"
                    ToolTip.Tip="{CompiledBinding Translation.ApplicationShortcuts.Value,
                                                  Mode=OneWay}"
                    VerticalAlignment="Top"
                    Width="NaN">
                    <StackPanel Orientation="Horizontal">
                        <Image
                            Height="17"
                            Margin="9,0,12,0"
                            Source="{StaticResource ShortcutsImageAlt}"
                            Width="17" />
                        <TextBlock
                            Classes="txt"
                            Foreground="{StaticResource SecondaryTextColor}"
                            Text="{CompiledBinding Translation.ApplicationShortcuts.Value,
                                                   Mode=OneWay}" />
                    </StackPanel>
                </Button>
            </TabItem>

            <!--  File associations  -->
            <TabItem Classes="headerStyle" x:Name="FileAssociationsTabItem ">
                <TabItem.Header>
                    <StackPanel Orientation="Horizontal">
                        <Image
                            Classes="imageStyle"
                            Height="17"
                            Source="{StaticResource FileAssociationAltImage}"
                            Width="17" />
                        <TextBlock
                            Classes="txt"
                            Foreground="{StaticResource SecondaryTextColor}"
                            Text="{CompiledBinding Translation.FileAssociations.Value,
                                                   Mode=OneWay}" />
                    </StackPanel>
                </TabItem.Header>
                <customControls:AutoScrollViewer Background="Transparent" Height="{Binding Path=Bounds.Height, ElementName=MainTabControl}">
                    <config:FileAssociationsView
                        Background="Transparent"
                        Margin="{StaticResource TabMargin}"
                        Padding="45,0,0,0"
                        x:Name="FileAssociationsView" />
                </customControls:AutoScrollViewer>
            </TabItem>
        </TabControl>


    </Panel>
</UserControl>