<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">

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

    <!-- MATERIAL SLOT TEMPLATE -->
    <!--////////////////////////////////////////////////////////////////////-->
    <ControlTemplate x:Key="Template.SlotMaterial" TargetType="{x:Type ListBoxItem}">

        <!-- This is the Material Slot parent container -->
        <Grid x:Name="SlotMaterial.Layout"
              Style="{DynamicResource Style.SlotInput.Layout}">

            <!-- STATE MANAGER -->
            <!-- This part defines the 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="SlotMaterial.Hover"
                                    Storyboard.TargetProperty="Visibility">
                                <DiscreteObjectKeyFrame KeyTime="0">
                                    <DiscreteObjectKeyFrame.Value>
                                        <Visibility>Visible</Visibility>
                                    </DiscreteObjectKeyFrame.Value>
                                </DiscreteObjectKeyFrame>
                            </ObjectAnimationUsingKeyFrames>

                            <DoubleAnimation
                                    Storyboard.TargetName="SlotMaterial.Hover"
                                    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="SlotMaterial.Layout"
                                    Storyboard.TargetProperty="Opacity"
                                    To="0.6"/>
                        </Storyboard>
                    </VisualState>
                </VisualStateGroup>
            </VisualStateManager.VisualStateGroups>

            <!-- This part displays the border and glow we show on hover over the slot -->
            <Border
                x:Name="SlotMaterial.Hover"
                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="SlotMaterial.Base"
                Style="{DynamicResource Style.SlotInput.Base}">

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

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

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

    <!-- MATERIAL SLOT DATA TEMPLATE -->
    <!--////////////////////////////////////////////////////////////////////-->
    <DataTemplate x:Key="Content.SlotMaterial">
        <!-- This part displays the content of the Material Slot - the item icon, amount owned and amount required -->
        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition Height="*"/>
                <RowDefinition Height="20"/>
            </Grid.RowDefinitions>

            <Image
                x:Name="Material.Icon"
                Style="{DynamicResource SlotItemIconStyle}"
                Source="{Binding Icon}"/>

            <Grid
                x:Name="Material.Amounts"
                Background="{DynamicResource Color.BorderSlot}"
                Grid.Row="1"
                HorizontalAlignment="Stretch"
                VerticalAlignment="Stretch">

                <TextBlock
                    Style="{DynamicResource Style.SlotInput.Amount}"
                    HorizontalAlignment="Center"
                    VerticalAlignment="Center">

                    <Run x:Name="Material.AmountOwned" Text="{Binding AmountOwned}"/>
                    <Run Text="/"/>
                    <Run x:Name="Material.DisplayAmountRequired" Text="{Binding DisplayAmountRequired}"/>
                </TextBlock>
            </Grid>
        </Grid>

        <!-- This trigger changes the color of Material.AmountOwned to red when the player doesn't have enough of this material to craft the recipe -->
        <DataTemplate.Triggers>
            <DataTrigger Binding="{Binding HasEnough}" Value="False">
                <Setter Property="Foreground" Value="{DynamicResource Color.TextError}" TargetName="Material.AmountOwned"/>
            </DataTrigger>
        </DataTemplate.Triggers>
    </DataTemplate>

    <!-- MATERIAL SLOT STYLE -->
    <!--////////////////////////////////////////////////////////////////////-->
    <Style x:Key="Style.SlotMaterial" TargetType="ListBoxItem" BasedOn="{StaticResource {x:Type ContentControl}}">
        <Setter Property="Focusable" Value="False" />
        <Setter Property="FocusVisualStyle" Value="{DynamicResource Style.Focus}" />
        <Setter Property="Template" Value="{StaticResource Template.SlotMaterial}" />
    </Style>
</ResourceDictionary>
