<UserControl DataContext="{Binding (HUDData.Data), RelativeSource={RelativeSource Self}}" 
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             xmlns:local="clr-namespace:ForzaUI"
             xmlns:System="clr-namespace:System;assembly=mscorlib"
             x:Class="ForzaUI.HUDStagedAmbientEventControl">
    <UserControl.Resources>
        <ResourceDictionary>

            <Style x:Key="H_Style_FZTextBlock_Text" TargetType="FZTextBlock">
                <Setter Property="Color" Value="{StaticResource H_Color_Primary_White}"/>
                <Setter Property="FontFamily" Value="Horizon_A"/>
                <Setter Property="HorizontalAlignment" Value="Center"/>
                <Setter Property="VerticalAlignment" Value="Center"/>
            </Style>

            <!--Chevron Visuals START-->
            <Color x:Key="H_Color_Chevron_Disabled">#33FFFFFF</Color>
            <Color x:Key="H_Color_Chevron_Enabled_Chase">#FF36BBCC</Color>
            <Color x:Key="H_Color_Chevron_Disabled_Stroke">#00FFFFFF</Color>
            <Color x:Key="H_Color_Chevron_Enabled_Stroke">#80FFFFFF</Color>

            <local:OffsetKeyTime x:Key="A_KeyTime_ChevronEarn"
                                 KeyTime="0:0:0.10"
                                 Offset="0:0:0" />

            <local:UIStoryboard x:Key="A_Storyboard_NewChevronEarned" FillBehavior="HoldEnd">
                <ColorAnimationUsingKeyFrames FillBehavior="HoldEnd" Storyboard.TargetProperty="(local:FZMaterial.Color)" Storyboard.TargetName="ChevronFull">
                    <EasingColorKeyFrame KeyTime="{StaticResource A_KeyTime_ChevronEarn}" Value="{StaticResource H_Color_Chevron_Enabled_Chase}"/>
                </ColorAnimationUsingKeyFrames>
                <ColorAnimationUsingKeyFrames FillBehavior="HoldEnd" Storyboard.TargetProperty="(local:FZMaterial.Color)" Storyboard.TargetName="ChevronStroke">
                    <EasingColorKeyFrame KeyTime="{StaticResource A_KeyTime_ChevronEarn}" Value="{StaticResource H_Color_Chevron_Enabled_Stroke}"/>
                </ColorAnimationUsingKeyFrames>
                <DoubleAnimationUsingKeyFrames FillBehavior="HoldEnd" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="ChevronStroke">
                    <EasingDoubleKeyFrame KeyTime="{StaticResource A_KeyTime_ChevronEarn}" Value="1" />
                </DoubleAnimationUsingKeyFrames>
            </local:UIStoryboard>

            <DataTemplate x:Key="A_DataTemplate_TickerItemControl_Chevron">
                <DataTemplate.Triggers>
                    <DataTrigger Binding="{Binding Path=(local:TickerItemsControlItem.Reached)}"
                         Value="True">
                        <DataTrigger.EnterActions>
                            <local:BeginUIStoryboard x:Name="AnimateChevronEarned"
                                             Storyboard="{StaticResource A_Storyboard_NewChevronEarned}" />
                        </DataTrigger.EnterActions>
                        <DataTrigger.ExitActions>
                            <StopStoryboard BeginStoryboardName="AnimateChevronEarned"/>
                        </DataTrigger.ExitActions>
                    </DataTrigger>
                </DataTemplate.Triggers>
                <Grid x:Name="Chevron" RenderTransform="{ScaleTransform ScaleY=-1}" RenderTransformOrigin="0.5,0.5">
                    <local:FZMaterial x:Name="ChevronFull" Width="28" Height="16" ImageSource="/ForzaUI;component/Textures/Data_Bound/HUD/Chevron.png" Color="{StaticResource H_Color_Chevron_Disabled}"/>
                    <local:FZMaterial x:Name="ChevronStroke" Width="28" Height="16" ImageSource="/ForzaUI;component/Textures/Data_Bound/HUD/Chevron_Inner_Stroke.png" Opacity="0"/>
                </Grid>
            </DataTemplate>

            <Style x:Key="H_Style_TickerItemsControl_ChevronContainer" TargetType="{x:Type local:TickerItemsControl}">
                <Setter Property="Max" Value="{Binding StageCount}"/>
                <Setter Property="Value" Value="{Binding StageIndex}"/>
                <Setter Property="Width" Value="39"/>
                <Setter Property="Focusable" Value="False"/>
                <Setter Property="Visibility" Value="{Binding UsesStages, Converter={StaticResource A_FZBooleanToVisibilityConverter}}"/>
                <Setter Property="ItemTemplate" Value="{StaticResource A_DataTemplate_TickerItemControl_Chevron}"/>
                <Setter Property="Margin" Value="0,2"/>
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="{x:Type TickerItemsControl}">
                            <UniformGrid Columns="1" IsItemsHost="True" RenderTransform="{ScaleTransform ScaleY=-1}" RenderTransformOrigin="0.5,0.5"/>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
            <!--Chevron Visuals END-->

            <!--Progress Bar Visuals START-->
            <local:MappingConverter x:Key="A_MappingConverter_EventModeToColor" Default="{StaticResource H_Color_Primary_White}">
                <local:MappingConverterEntry Key="{x:Static local:EventMode.Chase}" Value="{StaticResource H_Color_Chevron_Enabled_Chase}" />
            </local:MappingConverter>

            <Style x:Key="H_Style_AmbientStage_ProgressBar"
                   TargetType="{x:Type ProgressBar}">
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="{x:Type ProgressBar}">
                            <DockPanel x:Name="PART_Track" >
                                <Grid x:Name="PART_Indicator" ClipToBounds="True" HorizontalAlignment="Left">
                                    <local:FZMaterial Color="{Binding EventMode, Converter={StaticResource A_MappingConverter_EventModeToColor}}"/>
                                </Grid>
                            </DockPanel>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
            <!--Progress Bar Visuals END-->

            <!--Progress Bar Text START-->
            <Style x:Key="A_Style_FZMaterial_FZRun_Icon" TargetType="local:FZMaterial">
                <Setter Property="RenderTransformOrigin" Value="0.5,0.5"/>
                <Setter Property="RenderTransform" Value="{SkewTransform AngleX={Convert {StaticResource A_SkewTransform_HUD_Italics_Angle}, Converter={StaticResource H_InvertConverter}}}"/>
                <Setter Property="Margin" Value="0,-3,-5,0"/>
                <Setter Property="Width" Value="40"/>
                <Setter Property="Height" Value="40"/>
            </Style>

            <Style x:Key="A_Style_FZRun_Progress_CREDITS" TargetType="{x:Type Control}">
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate>
                            <local:FZMaterial ImageSource="/ForzaUI;component/Textures/Anthem/Icons/CRIcon/CR_85_FilledCircle.png" Style="{StaticResource A_Style_FZMaterial_FZRun_Icon}"/>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>

            <Style x:Key="A_Style_FZRun_Progress_YELLOW" TargetType="local:FZRun">
                <Setter Property="Color" Value="{StaticResource H_Color_Primary_Yellow}"/>
            </Style>
            
            <MappingConverter x:Key="A_MarkupConverter_StageText">
                <MappingConverterEntry Key="{NoCase CREDITS}" Value="{StaticResource A_Style_FZRun_Progress_CREDITS}" />
                <MappingConverterEntry Key="{NoCase YELLOW}" Value="{StaticResource A_Style_FZRun_Progress_YELLOW}" />
            </MappingConverter>

            <Style x:Key="A_Style_FZTextBlock_ProgressText"
                   BasedOn="{StaticResource A_Style_FZTextBlock_HorizonA}"
                   TargetType="{x:Type local:FZTextBlock}">
                <Setter Property="Color" Value="#fff"/>
                <Setter Property="CapHeight" Value="35"/>
                <Setter Property="TextWrapping" Value="NoWrap"/>
                <Setter Property="LineAdjust" Value="-0.4"/>
                <Setter Property="VerticalAlignment" Value="Center"/>
                <Setter Property="HorizontalAlignment" Value="Center"/>
                <Setter Property="MarkupConverter" Value="{StaticResource A_MarkupConverter_StageText}"/>
            </Style>

            <Style x:Key="A_Style_FZTextBlock_StageText"
                   BasedOn="{StaticResource A_Style_FZTextBlock_ProgressText}"
                   TargetType="{x:Type local:FZTextBlock}">
                <Setter Property="Text" Value="{Binding StageText}" />
            </Style>

            <Style x:Key="A_Style_FZTextBlock_LevelText"
                   BasedOn="{StaticResource A_Style_FZTextBlock_ProgressText}"
                   TargetType="{x:Type local:FZTextBlock}">
                <Setter Property="Text" Value="{Binding LevelText}" />
            </Style>
            <!--Progress Bar Text END-->

            <!--StageIndexChanged Animation START-->
            <local:LinearTransformConverter x:Key="A_LinearTransformConverter_PanelGlowSoft" Add="10"/>
            <local:FZMaterialPresetRoundtangle x:Key="A_FZMaterialPreset_PanelBoom_Soft" CornerRadius="6" Softness="8" AlphaMode="Additive"/>
            <System:String x:Key="A_String_MinorBoomAudio">/Master/UI/Notification/HZ3_SFX_HUD_Notification_MinorBoom_01</System:String>

            <System:TimeSpan x:Key="A_TimeSpan_Flash_Bar_FadeInDuration">0:0:0.13</System:TimeSpan>
            <System:TimeSpan x:Key="A_TimeSpan_Flash_Bar_HoldDuration">0:0:2.00</System:TimeSpan>
            <System:TimeSpan x:Key="A_TimeSpan_Flash_Bar_FadeOutDuration_Half">0:0:0.12</System:TimeSpan>

            <KeyTime x:Key="A_TimeSpan_Flash_Bar_FadeInStart">0:0:0.0</KeyTime>
            <KeyTime x:Key="A_KeyTime_MinorNotification_SwapMid">0:0:0.133</KeyTime>
            <KeyTime x:Key="A_KeyTime_MinorNotification_SwapFlashEnd">0:0:0.583</KeyTime>

            <local:OffsetKeyTime x:Key="A_TimeSpan_Flash_Bar_FadeInEnd"
                     KeyTime="{StaticResource A_TimeSpan_Flash_Bar_FadeInStart}"
                     Offset="{StaticResource A_TimeSpan_Flash_Bar_FadeInDuration}"/>
            <local:OffsetKeyTime x:Key="A_TimeSpan_Flash_Bar_FadeHold"
                     KeyTime="{StaticResource A_TimeSpan_Flash_Bar_FadeInEnd}"
                     Offset="{StaticResource A_TimeSpan_Flash_Bar_HoldDuration}"/>
            <local:OffsetKeyTime x:Key="A_TimeSpan_Flash_Bar_FadeOutStart"
                     KeyTime="{StaticResource A_TimeSpan_Flash_Bar_FadeHold}"
                     Offset="0:0:0.0"/>
            <local:OffsetKeyTime x:Key="A_TimeSpan_Flash_Bar_FadeOutMid"
                     KeyTime="{StaticResource A_TimeSpan_Flash_Bar_FadeOutStart}"
                     Offset="{StaticResource A_TimeSpan_Flash_Bar_FadeOutDuration_Half}"/>
            <local:OffsetKeyTime x:Key="A_TimeSpan_Flash_Bar_FadeOutEnd"
                     KeyTime="{StaticResource A_TimeSpan_Flash_Bar_FadeOutMid}"
                     Offset="{StaticResource A_TimeSpan_Flash_Bar_FadeOutDuration_Half}"/>



            <local:UIStoryboard x:Key="A_Storyboard_PanelBoom">
                <local:UIStoryboard.TriggerAnimation>
                    <local:StartAudioTrigger local:TriggerAnimation.KeyTime="0:0:0.5"
                        EventName="{StaticResource A_String_MinorBoomAudio}"/>
                </local:UIStoryboard.TriggerAnimation>
                <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="PanelBoom">
                    <DiscreteDoubleKeyFrame KeyTime="0:0:0.0" Value="0"/>
                    <DiscreteDoubleKeyFrame KeyTime="0:0:0.01" Value="1"/>
                    <EasingDoubleKeyFrame  KeyTime="0:0:1.216" Value="0"/>
                </DoubleAnimationUsingKeyFrames>
                <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleX)" Storyboard.TargetName="PanelBoom" >
                    <DiscreteDoubleKeyFrame KeyTime="0:0:0.0" Value="1"/>
                    <DiscreteDoubleKeyFrame KeyTime="0:0:0.766" Value="1"/>
                    <EasingDoubleKeyFrame  KeyTime="0:0:1.216" Value="1.2"/>
                </DoubleAnimationUsingKeyFrames>
                <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleY)" Storyboard.TargetName="PanelBoom">
                    <DiscreteDoubleKeyFrame KeyTime="0:0:0.0" Value="1"/>
                    <DiscreteDoubleKeyFrame KeyTime="0:0:0.766" Value="1"/>
                    <EasingDoubleKeyFrame  KeyTime="0:0:1.216" Value="1.2"/>
                </DoubleAnimationUsingKeyFrames>
            </local:UIStoryboard>

            <local:UIStoryboard x:Key="A_Storyboard_BarFlash">
                <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)">
                    <EasingDoubleKeyFrame KeyTime="{StaticResource A_TimeSpan_Flash_Bar_FadeInStart}" Value="0.0" />
                    <EasingDoubleKeyFrame KeyTime="{StaticResource A_TimeSpan_Flash_Bar_FadeInEnd}" Value="1.0" />
                    <EasingDoubleKeyFrame KeyTime="{StaticResource A_TimeSpan_Flash_Bar_FadeHold}" Value="1.0" />
                    <EasingDoubleKeyFrame KeyTime="{StaticResource A_TimeSpan_Flash_Bar_FadeOutStart}" Value="1.0" />
                    <EasingDoubleKeyFrame KeyTime="{StaticResource A_TimeSpan_Flash_Bar_FadeOutMid}" Value="0.0" />
                    <EasingDoubleKeyFrame KeyTime="{StaticResource A_TimeSpan_Flash_Bar_FadeOutEnd}" Value="0.0" />
                </DoubleAnimationUsingKeyFrames>
            </local:UIStoryboard>

            <local:UIStoryboard x:Key="A_Storyboard_TextFlash">
                <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)">
                    <EasingDoubleKeyFrame KeyTime="{StaticResource A_TimeSpan_Flash_Bar_FadeInStart}" Value="0.0" />
                    <EasingDoubleKeyFrame KeyTime="{StaticResource A_TimeSpan_Flash_Bar_FadeInEnd}" Value="1.0" />
                    <EasingDoubleKeyFrame KeyTime="{StaticResource A_TimeSpan_Flash_Bar_FadeHold}" Value="1.0" />
                    <EasingDoubleKeyFrame KeyTime="{StaticResource A_TimeSpan_Flash_Bar_FadeOutStart}" Value="1.0" />
                    <EasingDoubleKeyFrame KeyTime="{StaticResource A_TimeSpan_Flash_Bar_FadeOutMid}" Value="0.0" />
                    <EasingDoubleKeyFrame KeyTime="{StaticResource A_TimeSpan_Flash_Bar_FadeOutEnd}" Value="0.0" />
                </DoubleAnimationUsingKeyFrames>
            </local:UIStoryboard>

            <local:UIStoryboard x:Key="A_Storyboard_TextReverseFlash">
                <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)">
                    <EasingDoubleKeyFrame KeyTime="{StaticResource A_TimeSpan_Flash_Bar_FadeInStart}" Value="0.0" />
                    <EasingDoubleKeyFrame KeyTime="{StaticResource A_TimeSpan_Flash_Bar_FadeInEnd}" Value="0.0" />
                    <EasingDoubleKeyFrame KeyTime="{StaticResource A_TimeSpan_Flash_Bar_FadeHold}" Value="0.0" />
                    <EasingDoubleKeyFrame KeyTime="{StaticResource A_TimeSpan_Flash_Bar_FadeOutStart}" Value="0.0" />
                    <EasingDoubleKeyFrame KeyTime="{StaticResource A_TimeSpan_Flash_Bar_FadeOutMid}" Value="0.0" />
                    <EasingDoubleKeyFrame KeyTime="{StaticResource A_TimeSpan_Flash_Bar_FadeOutEnd}" Value="1.0" />
                </DoubleAnimationUsingKeyFrames>
            </local:UIStoryboard>

            <Style x:Key="A_Style_FZMaterial_FlashBox"
                   TargetType="FZMaterial">
                <Setter Property="Opacity" Value="0"/>
                <Setter Property="Color" Value="{Binding EventMode, Converter={StaticResource A_MappingConverter_EventModeToColor}}"/>
            </Style>

            <!--StageIndexChanged Animation END-->
            
        </ResourceDictionary>
    </UserControl.Resources>

    <!--PART_StageIndexChanged-->
    <Grid x:Name="PART_LayoutRoot"
          HorizontalAlignment="Center" 
          VerticalAlignment="Bottom">
        <VisualStateManager.VisualStateGroups>
            <VisualStateGroup x:Name="VisualStateGroup">
                <VisualStateGroup.Transitions>
                    <VisualTransition GeneratedDuration="0:0:0.0"/>
                </VisualStateGroup.Transitions>
                <VisualState x:Name="PART_Hidden">
                    <Storyboard>
                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" 
                                                   Storyboard.TargetName="{x:Null}">
                            <DiscreteObjectKeyFrame KeyTime="0" Value="{x:Static Visibility.Hidden}"/>
                        </ObjectAnimationUsingKeyFrames>
                    </Storyboard>
                </VisualState>
                <VisualState Name="PART_Shown"/>
            </VisualStateGroup>
        </VisualStateManager.VisualStateGroups>

        <local:FZMaterial Width="320" Height="104"
                          Color="{StaticResource H_Color_Glass_Purple_20pc}"
                          Preset="{GlassRoundtangle BlurAmount=High}">
            <DockPanel>
                <local:FZMaterial DockPanel.Dock="Top" Height="34"
                  Color="{StaticResource H_Color_Glass_Purple_20pc}">
                    <local:FZTextBlock Style="{StaticResource H_Style_FZTextBlock_Text}"
                                       CapHeight="16"
                                       Text="{Binding TitleText}"/>
                </local:FZMaterial>

                <DockPanel>
                    <local:TickerItemsControl x:Name="LeftVerticalChevrons" 
                                              DockPanel.Dock="Left"
                                              Style="{StaticResource H_Style_TickerItemsControl_ChevronContainer}"/>

                    <local:TickerItemsControl x:Name="RightVerticalChevrons" 
                                              DockPanel.Dock="Right"
                                              Style="{StaticResource H_Style_TickerItemsControl_ChevronContainer}"/>

                    <Grid x:Name="ProgressBarRoot">
                        <FZMaterial x:Name="Glow"
                                    Style="{StaticResource H_Style_FZMaterial_Event_Zone_Glow}"
                                    Color="{Binding EventMode, Converter={StaticResource A_MappingConverter_EventModeToColor}}"
                                    Opacity="0"/>
                        <FZMaterial x:Name="Hatching"
                                    Style="{StaticResource H_Style_FZMaterial_Event_Hash_Background}"/>
                        <ProgressBar x:Name="ProgressBar"
                                     Minimum="0"
                                     Maximum="1"
                                     Style="{StaticResource H_Style_AmbientStage_ProgressBar}"
                                     Value="{Binding StageProgress}">
                            <local:EventFire.FzTriggers>
                                <local:EventFireTrigger Event="BarFlash" Storyboard="{StaticResource A_Storyboard_TextReverseFlash}"/>
                            </local:EventFire.FzTriggers>
                        </ProgressBar>

                        <Decorator RenderTransformOrigin="0.5,0.5" RenderTransform="{StaticResource A_SkewTransform_HUD_Italics}">
                            <local:FZTextBlock x:Name="StageText"
                                               Style="{StaticResource A_Style_FZTextBlock_StageText}">
                                <local:EventFire.FzTriggers>
                                    <local:EventFireTrigger Event="TextReverseFlash" Storyboard="{StaticResource A_Storyboard_TextReverseFlash}"/>
                                </local:EventFire.FzTriggers>
                            </local:FZTextBlock>
                        </Decorator>

                        <FZMaterial x:Name="FlashMaterial" Style="{StaticResource A_Style_FZMaterial_FlashBox}">
                            <local:EventFire.FzTriggers>
                                <local:EventFireTrigger Event="BarFlash" Storyboard="{StaticResource A_Storyboard_BarFlash}"/>
                            </local:EventFire.FzTriggers>
                        </FZMaterial>

                        <local:FZTextBlock x:Name="LevelText"
                                           Style="{StaticResource A_Style_FZTextBlock_LevelText}"
                                           Opacity="0">
                            <local:EventFire.FzTriggers>
                                <local:EventFireTrigger Event="TextFlash" Storyboard="{StaticResource A_Storyboard_TextFlash}"/>
                            </local:EventFire.FzTriggers>
                        </local:FZTextBlock>

                        <local:FZMaterial x:Name="PanelBoom"
                                          Width="{Binding ActualWidth, ElementName=PanelRoot, Converter={StaticResource A_LinearTransformConverter_PanelGlowSoft}}"
                                          Preset="{StaticResource A_FZMaterialPreset_PanelBoom_Soft}"
                                          Color="#FFFFFFFF"
                                          RenderTransformOrigin="0.5,0.5"
                                          Opacity="0"
                                          Margin="-5">
                            <local:FZMaterial.RenderTransform>
                                <TransformGroup>
                                    <ScaleTransform ScaleX="1" ScaleY="{Binding ScaleX, RelativeSource={RelativeSource Self}}"/>
                                    <TranslateTransform/>
                                </TransformGroup>
                            </local:FZMaterial.RenderTransform>
                            <local:EventFire.FzTriggers>
                                <local:EventFireTrigger Event="PanelBoomFlash" Storyboard="{StaticResource A_Storyboard_PanelBoom}"/>
                            </local:EventFire.FzTriggers>
                        </local:FZMaterial>
                    </Grid>

                </DockPanel>


            </DockPanel>
        </local:FZMaterial>

    </Grid>
    <local:EventFire.FzTriggers>
        <local:RaiseFzEvent EventName="BarFlash" EventFireTrigger.Event="PART_StageIndexChanged" EventFireTrigger.TargetName="ProgressBar"/>
        <local:RaiseFzEvent EventName="BarFlash" EventFireTrigger.Event="PART_StageIndexChanged" EventFireTrigger.TargetName="FlashMaterial"/>
        <local:RaiseFzEvent EventName="TextFlash" EventFireTrigger.Event="PART_StageIndexChanged" EventFireTrigger.TargetName="LevelText"/>
        <local:RaiseFzEvent EventName="TextReverseFlash" EventFireTrigger.Event="PART_StageIndexChanged" EventFireTrigger.TargetName="StageText"/>
        <local:RaiseFzEvent EventName="PanelBoomFlash" EventFireTrigger.Event="PART_StageIndexChanged" EventFireTrigger.TargetName="PanelBoom"/>
    </local:EventFire.FzTriggers>
</UserControl>