<ResourceDictionary
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:noesis="clr-namespace:NoesisGUIExtensions;assembly=Noesis.GUI.Extensions"
    xmlns:sys="clr-namespace:System;assembly=mscorlib"
    xmlns:system="clr-namespace:System;assembly=mscorlib">

    <ResourceDictionary.MergedDictionaries>
        <ResourceDictionary Source="Tooltip.xaml" />
    </ResourceDictionary.MergedDictionaries>

    <!-- TABS TEMPLATE -->
    <!--////////////////////////////////////////////////////////////////////-->
    <ControlTemplate x:Key="Template.Tabs" TargetType="TabControl">
        <Grid KeyboardNavigation.TabNavigation="Local">
            <Grid.RowDefinitions>
                <RowDefinition x:Name="Row0"/>
                <RowDefinition x:Name="Row1"/>
            </Grid.RowDefinitions>

            <Grid.ColumnDefinitions>
                <ColumnDefinition x:Name="Col0"/>
                <ColumnDefinition x:Name="Col1"/>
            </Grid.ColumnDefinitions>

            <!-- The HeaderPanelBase defines the base of the header panel and displays a semi-transparent background and border -->
            <!-- It takes the full width of whatever parent control it's nested in -->
            <Border
                x:Name="HeaderPanel.Base"
                Background="{DynamicResource Color.BackgroundTabs}"
                Padding="48,0,48,0" Height="96">

                <!-- The HeaderPanel handles the layout of the TabItem objects -->
                <TabPanel
                    x:Name="HeaderPanel"
                    Panel.ZIndex="1"
                    IsItemsHost="True"
                    KeyboardNavigation.TabIndex="1"/>
            </Border>

            <!-- The SelectedContentBorder defines the container that hosts the content of the currently selected tab  -->
            <Border
                x:Name="SelectedContentBorder"
                KeyboardNavigation.DirectionalNavigation="Contained"
                KeyboardNavigation.TabIndex="2"
                KeyboardNavigation.TabNavigation="Local"
                Padding="0,0,0,0">

                <!-- The PART_SelectedContentHost displays the content of the currently selected tab -->
                <ContentPresenter
                    x:Name="PART_SelectedContentHost"
                    ContentSource="SelectedContent"
                    HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                    VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
            </Border>
        </Grid>

        <!-- The TabStripPlacement trigger defines the position of the HeaderPanel relative to the selected tab content -->
        <!-- We're currently only triggering it when the value is set to Top which places the HeaderPanel above the selected tab content -->
        <!-- If needed, we can expand this in the future to place the HeaderPanel on the left, right or below the selected tab content -->
        <ControlTemplate.Triggers>
            <Trigger Property="TabStripPlacement" Value="Top">
                <Setter Property="Height" Value="Auto" TargetName="Row0"/>
                <Setter Property="Height" Value="*" TargetName="Row1"/>
                <Setter Property="Width" Value="*" TargetName="Col0"/>
                <Setter Property="Width" Value="0" TargetName="Col1"/>
                <Setter Property="Grid.Row" Value="0" TargetName="HeaderPanel"/>
                <Setter Property="Grid.Column" Value="0" TargetName="HeaderPanel"/>
                <Setter Property="Grid.Row" Value="1" TargetName="SelectedContentBorder"/>
                <Setter Property="Grid.Column" Value="0" TargetName="SelectedContentBorder"/>
            </Trigger>
        </ControlTemplate.Triggers>
    </ControlTemplate>

    <!-- TABS STYLE -->
    <!--////////////////////////////////////////////////////////////////////-->
    <Style x:Key="Style.Tabs" TargetType="TabControl" BasedOn="{StaticResource {x:Type ItemsControl}}">
        <Setter Property="OverridesDefaultStyle" Value="True"/>
        <Setter Property="Template" Value="{StaticResource Template.Tabs}"/>
        <Setter Property="FocusVisualStyle" Value="{x:Null}"/>
    </Style>

    <!-- TAB ITEM TEMPLATE -->
    <!--////////////////////////////////////////////////////////////////////-->
    <ControlTemplate x:Key="Template.TabItem" TargetType="TabItem">
        <Grid x:Name="TabItem.Layout" Height="96">

            <!-- The TabItem.Base defines the container of the TabItem -->
            <Border
                x:Name="TabItem.Base"
                Background="Transparent"
                BorderBrush="Transparent"
                Padding="40,16,40,0"
                MinWidth="224">

                <!-- The ContentHost renders the data used for the header of each control -->
                <ContentPresenter
                    x:Name="ContentHost"
                    ContentSource="Header"
                    TextElement.FontFamily="{DynamicResource Font.CoreSansBold}"
                    TextElement.FontSize="{DynamicResource Font.Size.Tabs}"
                    TextElement.Foreground="{DynamicResource Color.Text}"
                    VerticalAlignment="Center"
                    HorizontalAlignment="Center"/>
            </Border>

            <!-- The TabItem.Selector renders an arrow texture which is visible only when a TabItem is selected -->
            <Image
                x:Name="TabItem.Selector"
                Source="../Textures/Controls/TabSelector.png"
                VerticalAlignment="Bottom"
                Visibility="Hidden" Stretch="None"/>
        </Grid>

        <ControlTemplate.Triggers>

            <!-- This triggers changes the text color of the TabItem and displays a radial glow on its background when hovered -->
            <Trigger Property="IsMouseOver" Value="True">
                <Setter Property="Panel.ZIndex" Value="1"/>
                <Setter Property="TextElement.Foreground" Value="{DynamicResource Color.TextHover}" TargetName="ContentHost"/>
                <Setter Property="Background" Value="{DynamicResource Color.BackgroundTabItemHover}" TargetName="TabItem.Base"/>
            </Trigger>

            <!-- This triggers changes the text color of the TabItem, displays a radial glow on its background, -->
            <!-- and toggles on the TabItem.Selector arrow when the TabItem is selected -->
            <Trigger Property="IsSelected" Value="True">
                <Setter Property="Panel.ZIndex" Value="2"/>
                <Setter Property="Visibility" Value="Visible" TargetName="TabItem.Selector"/>
                <Setter Property="TextElement.Foreground" Value="{DynamicResource Color.TextSelected}" TargetName="ContentHost"/>
                <Setter Property="Background" TargetName="TabItem.Base">
                    <Setter.Value>
                        <ImageBrush ImageSource="../Textures/Controls/TabSelected.png" Stretch="None" AlignmentY="Bottom"/>
                    </Setter.Value>
                </Setter>
            </Trigger>

            <!-- This triggers changes the text color of the TabItem when it is disabled -->
            <Trigger Property="IsEnabled" Value="False">
                <Setter Property="TextElement.Foreground" Value="{DynamicResource Color.TextDisable}" TargetName="ContentHost"/>
            </Trigger>
        </ControlTemplate.Triggers>
    </ControlTemplate>

    <!-- TAB ITEM STYLE -->
    <!--////////////////////////////////////////////////////////////////////-->
    <Style x:Key="Style.TabItem" TargetType="TabItem" BasedOn="{StaticResource {x:Type HeaderedContentControl}}">
        <Setter Property="OverridesDefaultStyle" Value="True"/>
        <Setter Property="Template" Value="{StaticResource Template.TabItem}"/>
        <Setter Property="FocusVisualStyle" Value="{x:Null}"/>
    </Style>

    <!-- TABS ICONS ONLY TEMPLATE -->
    <!--////////////////////////////////////////////////////////////////////-->
    <ControlTemplate x:Key="Template.Tabs.IconsOnly" TargetType="TabControl">
        <Grid KeyboardNavigation.TabNavigation="Local">
            <Grid.RowDefinitions>
                <RowDefinition x:Name="Row0"/>
                <RowDefinition x:Name="Row1"/>
            </Grid.RowDefinitions>

            <Grid.ColumnDefinitions>
                <ColumnDefinition x:Name="Col0"/>
                <ColumnDefinition x:Name="Col1"/>
            </Grid.ColumnDefinitions>

            <!-- The HeaderPanelBase defines the base of the header panel and displays a border -->
            <!-- It takes the full width of whatever parent control it's nested in -->
            <Border
                x:Name="HeaderPanel.Base"
                Background="Transparent"
                BorderBrush="{DynamicResource Color.BorderTabs}"
                BorderThickness="0,0,0,2"
                Padding="0">

                <!-- The HeaderPanel handles the layout of the TabItem objects -->
                <TabPanel
                    x:Name="HeaderPanel"
                    Panel.ZIndex="1"
                    IsItemsHost="True"
                    KeyboardNavigation.TabIndex="1"/>
            </Border>

            <!-- The SelectedContentBorder defines the container that hosts the content of the currently selected tab  -->
            <Border
                x:Name="SelectedContentBorder"
                KeyboardNavigation.DirectionalNavigation="Contained"
                KeyboardNavigation.TabIndex="2"
                KeyboardNavigation.TabNavigation="Local"
                Padding="0,0,0,0">

                <!-- The PART_SelectedContentHost displays the content of the currently selected tab -->
                <ContentPresenter
                    x:Name="PART_SelectedContentHost"
                    ContentSource="SelectedContent"
                    HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                    VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
            </Border>
        </Grid>

        <!-- The TabStripPlacement trigger defines the position of the HeaderPanel relative to the selected tab content -->
        <!-- We're currently only triggering it when the value is set to Top which places the HeaderPanel above the selected tab content -->
        <!-- If needed, we can expand this in the future to place the HeaderPanel on the left, right or below the selected tab content -->
        <ControlTemplate.Triggers>
            <Trigger Property="TabStripPlacement" Value="Top">
                <Setter Property="Height" Value="Auto" TargetName="Row0"/>
                <Setter Property="Height" Value="*" TargetName="Row1"/>
                <Setter Property="Width" Value="*" TargetName="Col0"/>
                <Setter Property="Width" Value="0" TargetName="Col1"/>
                <Setter Property="Grid.Row" Value="0" TargetName="HeaderPanel"/>
                <Setter Property="Grid.Column" Value="0" TargetName="HeaderPanel"/>
                <Setter Property="Grid.Row" Value="1" TargetName="SelectedContentBorder"/>
                <Setter Property="Grid.Column" Value="0" TargetName="SelectedContentBorder"/>
            </Trigger>
        </ControlTemplate.Triggers>
    </ControlTemplate>

    <!-- TABS ICONS ONLY STYLE -->
    <!--////////////////////////////////////////////////////////////////////-->
    <Style x:Key="Style.Tabs.IconsOnly" TargetType="TabControl" BasedOn="{StaticResource {x:Type ItemsControl}}">
        <Setter Property="OverridesDefaultStyle" Value="True"/>
        <Setter Property="Template" Value="{StaticResource Template.Tabs.IconsOnly}"/>
        <Setter Property="FocusVisualStyle" Value="{x:Null}"/>
    </Style>

    <!-- TAB ITEM ICONS ONLY TEMPLATE -->
    <!--////////////////////////////////////////////////////////////////////-->
    <ControlTemplate x:Key="Template.TabItem.IconsOnly" TargetType="TabItem">
        <Grid x:Name="TabItem.Layout">

            <!-- The TabItem.Base defines the container of the TabItem -->
            <Border
                x:Name="TabItem.Base"
                Background="Transparent"
                BorderBrush="Transparent"
                Height="48"
                Padding="24,0,24,0">

                <!-- The ContentHost renders the data used for the header of each control -->
                <ContentPresenter
                    x:Name="ContentHost"
                    ContentSource="Header"
                    HorizontalAlignment="Center"
                    VerticalAlignment="Center"/>

                <!-- This displays a tooltip when the player hovers over the tab -->
                <ToolTipService.ToolTip>
                    <ToolTip Style="{StaticResource Style.Tooltip.Default}" Content="{StaticResource Content.Tooltip.TabItem}"/>
                </ToolTipService.ToolTip>
            </Border>

            <!-- The TabItem.Selector renders an arrow texture which is visible only when a TabItem is selected -->
            <Image
                x:Name="TabItem.Selector"
                Source="../Textures/Controls/TabSelectorIconsOnly.png"
                Width="72"
                Height="2"
                VerticalAlignment="Bottom"
                Margin="0,0,0,-2"
                Visibility="Hidden"/>
        </Grid>

        <ControlTemplate.Triggers>

            <!-- This triggers changes the text color of the TabItem and displays a radial glow on its background when hovered -->
            <Trigger Property="IsMouseOver" Value="True">
                <Setter Property="Panel.ZIndex" Value="1"/>
                <Setter Property="TextElement.Foreground" Value="{DynamicResource Color.TextHover}" TargetName="ContentHost"/>
                <Setter Property="Background" Value="{DynamicResource Color.BackgroundTabItemHover}" TargetName="TabItem.Base"/>
            </Trigger>

            <!-- This triggers changes the text color of the TabItem, displays a radial glow on its background, -->
            <!-- and toggles on the TabItem.Selector arrow when the TabItem is selected -->
            <Trigger Property="IsSelected" Value="True">
                <Setter Property="Panel.ZIndex" Value="2"/>
                <Setter Property="Visibility" Value="Visible" TargetName="TabItem.Selector"/>
                <Setter Property="TextElement.Foreground" Value="{DynamicResource Color.TextSelected}" TargetName="ContentHost"/>
                <Setter Property="Background" Value="{DynamicResource Color.BackgroundTabItemSelected}" TargetName="TabItem.Base"/>
            </Trigger>

            <!-- This triggers changes the text color of the TabItem when it is disabled -->
            <Trigger Property="IsEnabled" Value="False">
                <Setter Property="TextElement.Foreground" Value="{DynamicResource Color.TextDisable}" TargetName="ContentHost"/>
            </Trigger>
        </ControlTemplate.Triggers>
    </ControlTemplate>

    <!-- CREATIVE TABS DATA TEMPLATES -->
    <!--////////////////////////////////////////////////////////////////////-->
    <DataTemplate x:Key="Content.CreativeLibrary.TabItem">
        <Image
            Source="{Binding Icon}"
            Width="24"
            Height="24"
            HorizontalAlignment="Center"
            VerticalAlignment="Center"/>
    </DataTemplate>

    <DataTemplate x:Key="Content.CreativeLibrary.TabItem.Selected">
        <Image
            Source="{Binding IconSelected}"
            Width="24"
            Height="24"
            HorizontalAlignment="Center"
            VerticalAlignment="Center"/>
    </DataTemplate>

    <!-- CREATIVE TAB ITEMS STYLE -->
    <!--////////////////////////////////////////////////////////////////////-->
    <Style x:Key="Style.CreativeLibrary.TabItems" TargetType="TabItem" BasedOn="{StaticResource {x:Type HeaderedContentControl}}">
        <Setter Property="OverridesDefaultStyle" Value="True"/>
        <Setter Property="Template" Value="{DynamicResource Template.TabItem.IconsOnly}"/>
        <Setter Property="HeaderTemplate" Value="{DynamicResource Content.CreativeLibrary.TabItem}"/>
        <Setter Property="FocusVisualStyle" Value="{x:Null}"/>

        <Style.Triggers>
            <Trigger Property="IsSelected" Value="True">
                <Setter Property="HeaderTemplate" Value="{DynamicResource Content.CreativeLibrary.TabItem.Selected}"/>
            </Trigger>
        </Style.Triggers>
    </Style>

    <!-- TABS SMALL TEMPLATE -->
    <!--////////////////////////////////////////////////////////////////////-->
    <ControlTemplate x:Key="Template.Tabs.Small" TargetType="TabControl">
        <Grid KeyboardNavigation.TabNavigation="Local">
            <Grid.RowDefinitions>
                <RowDefinition x:Name="Row0"/>
                <RowDefinition x:Name="Row1"/>
            </Grid.RowDefinitions>

            <Grid.ColumnDefinitions>
                <ColumnDefinition x:Name="Col0"/>
                <ColumnDefinition x:Name="Col1"/>
            </Grid.ColumnDefinitions>

            <!-- The HeaderPanelBase defines the base of the header panel and displays a semi-transparent background and border -->
            <!-- It takes the full width of whatever parent control it's nested in -->
            <Border
                x:Name="HeaderPanel.Base"
                Padding="48,0,48,0">

                <Border.Background>
                    <LinearGradientBrush StartPoint="0,0.5" EndPoint="1,0.5">
                        <GradientStop Color="#001A2737" Offset="0"/>
                        <GradientStop Color="#001A2737" Offset="1"/>
                        <GradientStop Color="#FF1A2737" Offset="0.2"/>
                        <GradientStop Color="#FF1A2737" Offset="0.8"/>
                    </LinearGradientBrush>
                </Border.Background>

                <!-- The HeaderPanel handles the layout of the TabItem objects -->
                <TabPanel
                    x:Name="HeaderPanel"
                    Panel.ZIndex="1"
                    IsItemsHost="True"
                    KeyboardNavigation.TabIndex="1"/>
            </Border>

            <!-- The SelectedContentBorder defines the container that hosts the content of the currently selected tab  -->
            <Border
                x:Name="SelectedContentBorder"
                KeyboardNavigation.DirectionalNavigation="Contained"
                KeyboardNavigation.TabIndex="2"
                KeyboardNavigation.TabNavigation="Local"
                Padding="0">

                <!-- The PART_SelectedContentHost displays the content of the currently selected tab -->
                <ContentPresenter
                    x:Name="PART_SelectedContentHost"
                    ContentSource="SelectedContent"
                    HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                    VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
            </Border>
        </Grid>

        <!-- The TabStripPlacement trigger defines the position of the HeaderPanel relative to the selected tab content -->
        <!-- We're currently only triggering it when the value is set to Top which places the HeaderPanel above the selected tab content -->
        <!-- If needed, we can expand this in the future to place the HeaderPanel on the left, right or below the selected tab content -->
        <ControlTemplate.Triggers>
            <Trigger Property="TabStripPlacement" Value="Top">
                <Setter Property="Height" Value="Auto" TargetName="Row0"/>
                <Setter Property="Height" Value="*" TargetName="Row1"/>
                <Setter Property="Width" Value="*" TargetName="Col0"/>
                <Setter Property="Width" Value="0" TargetName="Col1"/>
                <Setter Property="Grid.Row" Value="0" TargetName="HeaderPanel"/>
                <Setter Property="Grid.Column" Value="0" TargetName="HeaderPanel"/>
                <Setter Property="Grid.Row" Value="1" TargetName="SelectedContentBorder"/>
                <Setter Property="Grid.Column" Value="0" TargetName="SelectedContentBorder"/>
            </Trigger>
        </ControlTemplate.Triggers>
    </ControlTemplate>

    <!-- TABS SMALL STYLE -->
    <!--////////////////////////////////////////////////////////////////////-->
    <Style x:Key="Style.Tabs.Small" TargetType="TabControl" BasedOn="{StaticResource {x:Type ItemsControl}}">
        <Setter Property="OverridesDefaultStyle" Value="True"/>
        <Setter Property="Template" Value="{StaticResource Template.Tabs.Small}"/>
        <Setter Property="FocusVisualStyle" Value="{x:Null}"/>
    </Style>

    <!-- TAB ITEM SMALL TEMPLATE -->
    <!--////////////////////////////////////////////////////////////////////-->
    <ControlTemplate x:Key="Template.TabItem.Small" TargetType="TabItem">
        <Grid x:Name="TabItem.Layout">

            <!-- The TabItem.Base defines the container of the TabItem -->
            <Border
                x:Name="TabItem.Base"
                Background="Transparent"
                BorderBrush="Transparent"
                Height="48"
                Padding="24,0,24,0">

                <!-- The ContentHost renders the data used for the header of each control -->
                <ContentPresenter
                    x:Name="ContentHost"
                    ContentSource="Header"
                    TextElement.FontFamily="{DynamicResource Font.LexendBold}"
                    TextElement.FontSize="{DynamicResource Font.Size.Medium}"
                    TextElement.Foreground="{DynamicResource Color.TextPlaceholder}"
                    VerticalAlignment="Center"
                    HorizontalAlignment="Center"/>
            </Border>
        </Grid>

        <ControlTemplate.Triggers>

            <!-- This triggers changes the text color of the TabItem when hovered -->
            <Trigger Property="IsMouseOver" Value="True">
                <Setter Property="Panel.ZIndex" Value="1"/>
                <Setter Property="TextElement.Foreground" Value="{DynamicResource Color.Text}" TargetName="ContentHost"/>
            </Trigger>

            <!-- This triggers changes the text color of the TabItem when the TabItem is selected -->
            <Trigger Property="IsSelected" Value="True">
                <Setter Property="Panel.ZIndex" Value="2"/>
                <Setter Property="TextElement.Foreground" Value="{DynamicResource Color.TextSelected}" TargetName="ContentHost"/>
            </Trigger>

            <!-- This triggers changes the text color of the TabItem when it is disabled -->
            <Trigger Property="IsEnabled" Value="False">
                <Setter Property="TextElement.Foreground" Value="{DynamicResource Color.TextDisable}" TargetName="ContentHost"/>
            </Trigger>
        </ControlTemplate.Triggers>
    </ControlTemplate>

    <!-- TAB ITEM SMALL STYLE -->
    <!--////////////////////////////////////////////////////////////////////-->
    <Style x:Key="Style.TabItem.Small" TargetType="TabItem" BasedOn="{StaticResource {x:Type HeaderedContentControl}}">
        <Setter Property="OverridesDefaultStyle" Value="True"/>
        <Setter Property="Template" Value="{StaticResource Template.TabItem.Small}"/>
        <Setter Property="FocusVisualStyle" Value="{x:Null}"/>
    </Style>
</ResourceDictionary>
