<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:system="clr-namespace:System;assembly=mscorlib"
    xmlns:i="http://schemas.microsoft.com/expression/2010/interactivity"
    xmlns:ei="http://schemas.microsoft.com/expression/2010/interactions"
    xmlns:b="http://schemas.microsoft.com/xaml/behaviors"
    xmlns:ui="clr-namespace:ht.UI">

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

    <!-- HOTBAR SLOT TEMPLATE -->
    <!--////////////////////////////////////////////////////////////////////-->
    <ControlTemplate x:Key="Template.SlotHotbar" TargetType="{x:Type ListBoxItem}">
        <ContentControl Padding="0" Focusable="False">

            <!-- STATE MANAGER -->
            <!-- This part defines the Hotbar Slot states and the animations they trigger -->
            <VisualStateManager.VisualStateGroups>
                <VisualStateGroup Name="CommonStates">

                    <!-- NORMAL STATE -->
                    <VisualState Name="Normal"/>

                    <!-- HOVERED STATE -->
                    <VisualState Name="MouseOver">
                        <Storyboard>
                            <ObjectAnimationUsingKeyFrames
                                    Storyboard.TargetName="SlotHotbarHovered"
                                    Storyboard.TargetProperty="Visibility">
                                <DiscreteObjectKeyFrame KeyTime="0">
                                    <DiscreteObjectKeyFrame.Value>
                                        <Visibility>Visible</Visibility>
                                    </DiscreteObjectKeyFrame.Value>
                                </DiscreteObjectKeyFrame>
                            </ObjectAnimationUsingKeyFrames>

                            <DoubleAnimation
                                    Storyboard.TargetName="SlotHotbarHovered"
                                    Storyboard.TargetProperty="Opacity"
                                    To="1"
                                    Duration="0:0:0.2">
                                <DoubleAnimation.EasingFunction>
                                    <QuarticEase EasingMode="EaseOut"/>
                                </DoubleAnimation.EasingFunction>
                            </DoubleAnimation>

                            <DoubleAnimation
                                    Storyboard.TargetName="BorderHoveredScale"
                                    Storyboard.TargetProperty="(ScaleTransform.ScaleX)"
                                    To="1"
                                    Duration="0:0:0.2">
                                <DoubleAnimation.EasingFunction>
                                    <PowerEase EasingMode="EaseOut" Power="4"/>
                                </DoubleAnimation.EasingFunction>
                            </DoubleAnimation>

                            <DoubleAnimation
                                    Storyboard.TargetName="BorderHoveredScale"
                                    Storyboard.TargetProperty="(ScaleTransform.ScaleY)"
                                    To="1"
                                    Duration="0:0:0.2">
                                <DoubleAnimation.EasingFunction>
                                    <PowerEase EasingMode="EaseOut" Power="4"/>
                                </DoubleAnimation.EasingFunction>
                            </DoubleAnimation>
                        </Storyboard>
                    </VisualState>

                    <!-- PRESSED STATE -->
                    <VisualState Name="Pressed"/>

                    <!-- DISABLED STATE -->
                    <VisualState Name="Disabled">
                        <Storyboard>
                            <DoubleAnimation
                                    Storyboard.TargetName="SlotHotbarLayout"
                                    Storyboard.TargetProperty="Opacity"
                                    To="0.6"/>
                        </Storyboard>
                    </VisualState>
                </VisualStateGroup>
            </VisualStateManager.VisualStateGroups>

            <!-- This is the Hotbar Slot parent container -->
            <Grid x:Name="SlotHotbarLayout"
                Style="{DynamicResource SlotLayoutStyle}">

                <!-- This part displays the border and glow we show on hover over the Hotbar Slot -->
                <Border
                    x:Name="SlotHotbarHovered"
                    Style="{DynamicResource SlotHoveredStyle}"
                    Visibility="Hidden"
                    Opacity="0"
                    RenderTransformOrigin="0.5,0.5">

                    <Border.RenderTransform>
                        <TransformGroup>
                            <ScaleTransform x:Name="BorderHoveredScale" ScaleX="0.9" ScaleY="0.9"/>
                        </TransformGroup>
                    </Border.RenderTransform>
                </Border>

                <!-- This displays the default background  -->
                <Border
                    x:Name="SlotHotbarBase"
                    Style="{DynamicResource SlotBaseStyle}">

                    <!-- This displays the internal slot border -->
                    <Border
                        x:Name="SlotHotbarBorder"
                        Style="{DynamicResource SlotBorderStyle}">

                        <!-- This grid serves to stack the Hotbar Slot background and border that appear when the
                                slot is selected, below the Hotbar Slot content -->
                        <Grid x:Name="SlotHotbarWrapper">

                            <!-- This part displays the background and border we show when the Hotbar Slot is selected -->
                            <Border
                                x:Name="SlotHotbarSelected"
                                Style="{DynamicResource SlotSelectedStyle}"
                                Visibility="Hidden"
                                Opacity="0"
                                RenderTransformOrigin="0.5,0.5">

                                <Border.RenderTransform>
                                    <TransformGroup>
                                        <ScaleTransform x:Name="SlotHotbarSelectedScale" ScaleX="0.9" ScaleY="0.9"/>
                                    </TransformGroup>
                                </Border.RenderTransform>
                            </Border>

                            <!-- The ContentPresenter renders content inside of the item -->
                            <ContentPresenter
                                HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
                        </Grid>
                    </Border>
                </Border>

                <!-- This displays a texture when the slot is the new stack target when manually splitting a stack -->
                <!-- Highlighting the slot helps players identify where their splitted stack will be placed -->
                <Border
                    x:Name="SlotHotbarHighlight"
                    Style="{DynamicResource SlotHighlightStyle}">

                    <Image Source="../Textures/Inventory/SlotHighlight.png" Stretch="Uniform"/>
                </Border>
            </Grid>

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

            <b:Interaction.Triggers>
                <!-- This allows the player to DoubleClick to equip the item in the slot -->
                <b:EventTrigger EventName="MouseDoubleClick">
                    <b:InvokeCommandAction
                        Command="{Binding DataContext.EquipItem, ElementName=Root}"
                        CommandParameter="{Binding}">
                    </b:InvokeCommandAction>
                </b:EventTrigger>

                <!-- These two triggers change the opacity of the slot based on whether the slot is the source of a gamepad move -->
                <b:DataTrigger Binding="{Binding IsGamepadSource}" Value="True">
                    <b:ChangePropertyAction PropertyName="Opacity" Value="0.5" TargetName="SlotHotbarLayout"/>
                </b:DataTrigger>

                <b:DataTrigger Binding="{Binding IsGamepadSource}" Value="False">
                    <b:ChangePropertyAction PropertyName="Opacity" Value="1" TargetName="SlotHotbarLayout"/>
                </b:DataTrigger>
            </b:Interaction.Triggers>
        </ContentControl>

        <ControlTemplate.Triggers>
            <!-- This DataTrigger starts an animation that shows the HotbarSlotSelected element when the player has the item in hand,
                and another animation that hides the HotbarSlotSelected when the item is not in the player's hand.
                This is basically how we achieve a Selected state for the Hotbar Slot -->
            <DataTrigger Binding="{Binding InHand}" Value="True">
                <DataTrigger.EnterActions>
                    <BeginStoryboard>
                        <Storyboard>
                            <ObjectAnimationUsingKeyFrames
                                    Storyboard.TargetName="SlotHotbarSelected"
                                    Storyboard.TargetProperty="Visibility">
                                <DiscreteObjectKeyFrame KeyTime="0">
                                    <DiscreteObjectKeyFrame.Value>
                                        <Visibility>Visible</Visibility>
                                    </DiscreteObjectKeyFrame.Value>
                                </DiscreteObjectKeyFrame>
                            </ObjectAnimationUsingKeyFrames>

                            <DoubleAnimation
                                    Storyboard.TargetName="SlotHotbarSelected"
                                    Storyboard.TargetProperty="Opacity"
                                    To="1"
                                    Duration="0:0:0.2">
                                <DoubleAnimation.EasingFunction>
                                    <PowerEase EasingMode="EaseOut" Power="3"/>
                                </DoubleAnimation.EasingFunction>
                            </DoubleAnimation>

                            <DoubleAnimation
                                    Storyboard.TargetName="SlotHotbarSelectedScale"
                                    Storyboard.TargetProperty="(ScaleTransform.ScaleX)"
                                    To="1"
                                    Duration="0:0:0.15">
                                <DoubleAnimation.EasingFunction>
                                    <PowerEase EasingMode="EaseOut" Power="4"/>
                                </DoubleAnimation.EasingFunction>
                            </DoubleAnimation>

                            <DoubleAnimation
                                    Storyboard.TargetName="SlotHotbarSelectedScale"
                                    Storyboard.TargetProperty="(ScaleTransform.ScaleY)"
                                    To="1"
                                    Duration="0:0:0.15">
                                <DoubleAnimation.EasingFunction>
                                    <PowerEase EasingMode="EaseOut" Power="4"/>
                                </DoubleAnimation.EasingFunction>
                            </DoubleAnimation>
                        </Storyboard>
                    </BeginStoryboard>
                </DataTrigger.EnterActions>

                <DataTrigger.ExitActions>
                    <BeginStoryboard>
                        <Storyboard>
                            <ObjectAnimationUsingKeyFrames
                                    Storyboard.TargetName="SlotHotbarSelected"
                                    Storyboard.TargetProperty="Visibility">
                                <DiscreteObjectKeyFrame KeyTime="0">
                                    <DiscreteObjectKeyFrame.Value>
                                        <Visibility>Hidden</Visibility>
                                    </DiscreteObjectKeyFrame.Value>
                                </DiscreteObjectKeyFrame>
                            </ObjectAnimationUsingKeyFrames>

                            <DoubleAnimation
                                    Storyboard.TargetName="SlotHotbarSelected"
                                    Storyboard.TargetProperty="Opacity"
                                    To="0">
                            </DoubleAnimation>

                            <DoubleAnimation
                                    Storyboard.TargetName="SlotHotbarSelectedScale"
                                    Storyboard.TargetProperty="(ScaleTransform.ScaleX)"
                                    To="0.9">
                            </DoubleAnimation>

                            <DoubleAnimation
                                    Storyboard.TargetName="SlotHotbarSelectedScale"
                                    Storyboard.TargetProperty="(ScaleTransform.ScaleY)"
                                    To="0.9">
                            </DoubleAnimation>
                        </Storyboard>
                    </BeginStoryboard>
                </DataTrigger.ExitActions>
            </DataTrigger>
        </ControlTemplate.Triggers>
    </ControlTemplate>

    <!-- HOTBAR SLOT DATA TEMPLATE -->
    <!--////////////////////////////////////////////////////////////////////-->
    <DataTemplate x:Key="Content.SlotHotbar">
        <Grid>
            <Image
                x:Name="ItemIcon"
                Style="{DynamicResource SlotItemIconStyle}"
                Source="{Binding Item.Icon}"/>

            <TextBlock
                x:Name="ItemAmount"
                Style="{DynamicResource SlotItemAmountStyle}"
                Text="{Binding Item.DisplayAmount}"/>

            <Border
                x:Name="SlotHotbarIndexWrapper"
                Style="{DynamicResource SlotIndexWrapperStyle}">

                <TextBlock
                    x:Name="SlotHotbarIndex"
                    Style="{DynamicResource SlotItemIndex}"
                    Text="{Binding VisualIndex}"/>
            </Border>
        </Grid>
    </DataTemplate>

    <!-- HOTBAR SLOT STYLE -->
    <!--////////////////////////////////////////////////////////////////////-->
    <Style x:Key="Style.SlotHotbar" TargetType="ListBoxItem" BasedOn="{StaticResource {x:Type ContentControl}}">
        <Setter Property="Focusable" Value="True" />
        <Setter Property="FocusVisualStyle" Value="{DynamicResource Style.Focus}" />
        <Setter Property="Template" Value="{StaticResource Template.SlotHotbar}"/>
        <Setter Property="ContextMenu" Value="{DynamicResource ContextMenu.Slot}" />

        <!-- This trigger ensures that the context menu is only shown if there's an item in the slot -->
        <Style.Triggers>
            <DataTrigger Binding="{Binding Item.Asset.EntityId}" Value="0">
                <Setter Property="ContextMenu" Value="{x:Null}"/>
            </DataTrigger>

            <DataTrigger Binding="{Binding IsGamepadTarget}" Value="True">
                <Setter Property="Template" Value="{DynamicResource Template.SlotGamepad}"/>
            </DataTrigger>
        </Style.Triggers>
    </Style>
</ResourceDictionary>
