<UserControl
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:local="clr-namespace:ForzaUI"
    xmlns:System="clr-namespace:System;assembly=mscorlib"
    mc:Ignorable="d"
    x:Class="ForzaUI.DVRControls"
    x:Name="UserControl">


    <UserControl.Resources>
        <ResourceDictionary>

            <System:Double x:Key="A_Double_ReplayIcon_Width">64</System:Double>
            <System:Double x:Key="A_Double_ReplayIcon_Height">64</System:Double>
            <System:Double x:Key="A_Double_ReplayIcon_HalfWidth">32</System:Double>
            <System:Double x:Key="A_Double_ReplayIcon_HalfHeight">32</System:Double>

            <System:Double x:Key="A_Double_ReplayIcon_Opacity_Unselected">1.0</System:Double>

            <SolidColorBrush x:Key="A_Brush_TileOverlay_TranslucentBackground" Color="{StaticResource A_Color_Tile_Background}" />

            <Style x:Key="A_Style_FZMaterial_ReplayIcon_Background" BasedOn="{StaticResource A_Style_FZMaterial_AcrylicPanel_Tile_Background}" TargetType="local:FZMaterial">
                <Setter Property="Preset" Value="{StaticResource A_FZMaterialPresetRoundtangle_FlatPanel_OuterAll}" />
                <Setter Property="Color" Value="{StaticResource A_Color_WhitePanel}" />
            </Style>

            <Style x:Key="A_Style_FZMaterial_ReplayIcon_Background_Highlight" BasedOn="{StaticResource A_Style_FZMaterial_FlatPanel_Highlight}" TargetType="local:FZMaterial">
                <Setter Property="Preset" Value="{StaticResource A_FZMaterialPresetRoundtangle_GradientHighlight_OuterAll}" />
                <Setter Property="Color" Value="#FFFFFFFF" />
            </Style>

            <Color x:Key="A_Color_IconUnselected">#FF969696</Color>

            <Style x:Key="A_Style_FZMaterial_ReplayIcon" TargetType="local:FZMaterial">
                <Setter Property="Stretch" Value="Uniform"/>
                <Setter Property="Color" Value="{StaticResource A_Color_IconUnselected}"/>
                <Setter Property="Width" Value="{StaticResource A_Double_ReplayIcon_Width}"/>
                <Setter Property="Height" Value="{StaticResource A_Double_ReplayIcon_Height}"/>
                <Setter Property="Opacity" Value="{StaticResource A_Double_ReplayIcon_Opacity_Unselected}"/>

            </Style>

            <Style x:Key="A_Style_ButtonBase_Base"
                   TargetType="{x:Type ButtonBase}">
                <Setter Property="Background" Value="{StaticResource A_Brush_TileOverlay_TranslucentBackground}"/>
                <Setter Property="BorderThickness" Value="0"/>
                <Setter Property="Margin" Value="0,0,3,0"/>
                <Setter Property="HorizontalContentAlignment" Value="Center"/>
                <Setter Property="VerticalContentAlignment" Value="Center"/>
                <Setter Property="Padding" Value="1"/>
                <Setter Property="Height"  Value="{StaticResource A_Double_ReplayIcon_Height}" />
                <Setter Property="Width"   Value="{StaticResource A_Double_ReplayIcon_Width}"/>
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="{x:Type ButtonBase}">
                            <local:FZMaterial x:Name="Border"
                                              Style="{StaticResource A_Style_FZMaterial_AcrylicPanel_BodyPanel_Alt}">
                                <ContentPresenter x:Name="ContentPresenter" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}"
                                    RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"
                                    VerticalAlignment="{TemplateBinding VerticalContentAlignment}" Opacity="0.7"/>
                            </local:FZMaterial>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>

            <local:UIStoryboard x:Key="A_StoryBoard_Button_Focus"
                                DurationOverride="{StaticResource A_Duration_Button_Select}">
                <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(local:ZPanel.ZOffset)">
                    <EasingDoubleKeyFrame KeyTime="0:0:1"
                                          Value="{StaticResource A_Double_ZOffset_Acrylic}">
                        <EasingDoubleKeyFrame.EasingFunction>
                            <CircleEase />
                        </EasingDoubleKeyFrame.EasingFunction>
                    </EasingDoubleKeyFrame>
                </DoubleAnimationUsingKeyFrames>
                <Int32AnimationUsingKeyFrames Storyboard.TargetProperty="(local:ZPanel.ZIndex)">
                    <DiscreteInt32KeyFrame KeyTime="0:0:0"
                                           Value="2" />
                </Int32AnimationUsingKeyFrames>
                <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(local:ZPanel.Transform).(ScaleTransform3D.ScaleX)">
                    <EasingDoubleKeyFrame KeyTime="0:0:1"
                                          Value="1.15">
                        <EasingDoubleKeyFrame.EasingFunction>
                            <CircleEase />
                        </EasingDoubleKeyFrame.EasingFunction>
                    </EasingDoubleKeyFrame>
                </DoubleAnimationUsingKeyFrames>
                <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(local:ZPanel.Transform).(ScaleTransform3D.ScaleY)">
                    <EasingDoubleKeyFrame KeyTime="0:0:1"
                                          Value="1.15">
                        <EasingDoubleKeyFrame.EasingFunction>
                            <CircleEase />
                        </EasingDoubleKeyFrame.EasingFunction>
                    </EasingDoubleKeyFrame>
                </DoubleAnimationUsingKeyFrames>
            </local:UIStoryboard>

            <local:UIStoryboard x:Key="A_StoryBoard_Button_UnFocus"
                                DurationOverride="{StaticResource A_Duration_Button_Select}">
                <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(local:ZPanel.Transform).(ScaleTransform3D.ScaleX)">
                    <EasingDoubleKeyFrame KeyTime="0:0:1"
                                          Value="1.0">
                        <EasingDoubleKeyFrame.EasingFunction>
                            <CircleEase />
                        </EasingDoubleKeyFrame.EasingFunction>
                    </EasingDoubleKeyFrame>
                </DoubleAnimationUsingKeyFrames>
                <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(local:ZPanel.Transform).(ScaleTransform3D.ScaleY)">
                    <EasingDoubleKeyFrame KeyTime="0:0:1"
                                          Value="1.0">
                        <EasingDoubleKeyFrame.EasingFunction>
                            <CircleEase />
                        </EasingDoubleKeyFrame.EasingFunction>
                    </EasingDoubleKeyFrame>
                </DoubleAnimationUsingKeyFrames>
                <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(local:ZPanel.ZOffset)">
                    <EasingDoubleKeyFrame KeyTime="0:0:1"
                                          Value="0">
                        <EasingDoubleKeyFrame.EasingFunction>
                            <CircleEase />
                        </EasingDoubleKeyFrame.EasingFunction>
                    </EasingDoubleKeyFrame>
                </DoubleAnimationUsingKeyFrames>
                <Int32AnimationUsingKeyFrames Storyboard.TargetProperty="(local:ZPanel.ZIndex)">
                    <DiscreteInt32KeyFrame KeyTime="0:0:0"
                                         Value="1" />
                    <DiscreteInt32KeyFrame KeyTime="0:0:1"
                                          Value="0"/>
                </Int32AnimationUsingKeyFrames>
            </local:UIStoryboard>

            <Style x:Key="A_Style_Button_Clickable" BasedOn="{StaticResource A_Style_ButtonBase_Base}" TargetType="{x:Type ButtonBase}">
                <Setter Property="SnapsToDevicePixels" Value="true"/>
                <Setter Property="OverridesDefaultStyle" Value="true"/>
                <Setter Property="Background" Value="{StaticResource A_Brush_TileOverlay_TranslucentBackground}"/>
                <Setter Property="local:FocusOnMouseOverBehaviour.Self"
                        Value="True" />
                <Setter Property="local:ZPanel.Transform">
                    <Setter.Value>
                        <ScaleTransform3D CenterX="{StaticResource A_Double_ReplayIcon_HalfWidth}" CenterY="{StaticResource A_Double_ReplayIcon_HalfHeight}"/>
                    </Setter.Value>
                </Setter>
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="{x:Type ButtonBase}">
                            <ControlTemplate.Resources>
                                <Storyboard x:Key="OnClick1"/>
                            </ControlTemplate.Resources>
                            <Grid>
                                <local:FZMaterial x:Name="BackgroundImage"
                                                  Style="{StaticResource A_Style_FZMaterial_ReplayIcon_Background}">
                                    <local:FZMaterial x:Name="HighlightShadow" Style="{StaticResource A_Style_FZMaterial_HighlightShadow}" CaptureSubgraph="False">
                                        <local:FZMaterial x:Name="ButtonImage"
                                                          ImageSource="{Binding Tag, RelativeSource={RelativeSource TemplatedParent}}"
                                                          Style="{StaticResource A_Style_FZMaterial_ReplayIcon}"/>
                                    </local:FZMaterial>
                                </local:FZMaterial>
                            </Grid>
                            <ControlTemplate.Triggers>
                                <Trigger Property="IsKeyboardFocused" Value="True">
                                    <Setter Property="local:ZPanel.DisableClipping" Value="True" />
                                    <Setter TargetName="BackgroundImage" Property="Style" Value="{StaticResource A_Style_FZMaterial_ReplayIcon_Background_Highlight}" />
                                    <Setter TargetName="ButtonImage" Property="Color" Value="{StaticResource A_Color_White}"/>
                                    <Setter TargetName="HighlightShadow" Property="CaptureSubgraph" Value="True"/>
                                    <Trigger.EnterActions>
                                        <BeginStoryboard Storyboard="{StaticResource A_StoryBoard_Button_Focus}"/>
                                    </Trigger.EnterActions>
                                    <Trigger.ExitActions>
                                        <BeginStoryboard Storyboard="{StaticResource A_StoryBoard_Button_UnFocus}" />
                                    </Trigger.ExitActions>
                                </Trigger>
                            </ControlTemplate.Triggers>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>

            <Style x:Key="A_Style_Button_OpenMenu" BasedOn="{StaticResource A_Style_ButtonBase_Base}" TargetType="{x:Type ButtonBase}">
                <Setter Property="SnapsToDevicePixels" Value="true"/>
                <Setter Property="OverridesDefaultStyle" Value="true"/>
                <Setter Property="Background" Value="{StaticResource A_Brush_TileOverlay_TranslucentBackground}"/>
                <Setter Property="local:FocusOnMouseOverBehaviour.Self"
                        Value="True" />
                <Setter Property="local:ZPanel.Transform">
                    <Setter.Value>
                        <ScaleTransform3D CenterX="{StaticResource A_Double_ReplayIcon_HalfWidth}" CenterY="{StaticResource A_Double_ReplayIcon_HalfHeight}"/>
                    </Setter.Value>
                </Setter>
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="{x:Type ButtonBase}">
                            <ControlTemplate.Resources>
                                <Storyboard x:Key="OnClick1"/>
                            </ControlTemplate.Resources>
                            <Grid>
                                <local:FZMaterial x:Name="BackgroundImage"
                                                  Style="{StaticResource A_Style_FZMaterial_ReplayIcon_Background}">
                                    <local:FZMaterial x:Name="HighlightShadow" Style="{StaticResource A_Style_FZMaterial_HighlightShadow}" CaptureSubgraph="False">
                                        <local:FZMaterial x:Name="ButtonImage"
                                                          ImageSource="{Binding Tag, RelativeSource={RelativeSource TemplatedParent}}"
                                                          Style="{StaticResource A_Style_FZMaterial_ReplayIcon}"/>
                                    </local:FZMaterial>
                                </local:FZMaterial>

                            </Grid>
                            <ControlTemplate.Triggers>
                                <Trigger Property="IsKeyboardFocused" Value="True">
                                    <Setter Property="local:ZPanel.DisableClipping" Value="True" />
                                    <Setter TargetName="BackgroundImage" Property="Style" Value="{StaticResource A_Style_FZMaterial_ReplayIcon_Background_Highlight}" />
                                    <Setter TargetName="ButtonImage" Property="Color" Value="{StaticResource A_Color_White}"/>
                                    <Setter TargetName="HighlightShadow" Property="CaptureSubgraph" Value="True"/>
                                    <Trigger.EnterActions>
                                        <BeginStoryboard Storyboard="{StaticResource A_StoryBoard_Button_Focus}" />
                                    </Trigger.EnterActions>
                                    <Trigger.ExitActions>
                                        <BeginStoryboard Storyboard="{StaticResource A_StoryBoard_Button_UnFocus}" />
                                    </Trigger.ExitActions>
                                </Trigger>
                                <DataTrigger Binding="{Binding ShowCameraGroups, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type local:DVRControls}}}" Value="True">
                                    <Setter TargetName="ButtonImage" Property="Style" Value="{StaticResource A_Style_FZMaterial_ReplayIcon_Background_Highlight}"/>
                                </DataTrigger>

                            </ControlTemplate.Triggers>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>

            <Style x:Key="A_Style_ToggleButton_Default" BasedOn="{StaticResource A_Style_ButtonBase_Base}" TargetType="{x:Type ToggleButton}">
                <Setter Property="SnapsToDevicePixels" Value="true"/>
                <Setter Property="OverridesDefaultStyle" Value="true"/>
                <Setter Property="Background" Value="{StaticResource A_Brush_TileOverlay_TranslucentBackground}"/>
                <Setter Property="local:FocusOnMouseOverBehaviour.Self"
                        Value="True" />
                <Setter Property="local:ZPanel.Transform">
                    <Setter.Value>
                        <ScaleTransform3D CenterX="{StaticResource A_Double_ReplayIcon_HalfWidth}" CenterY="{StaticResource A_Double_ReplayIcon_HalfHeight}"/>
                    </Setter.Value>
                </Setter>
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="{x:Type ToggleButton}">
                            <Grid>
                                <local:FZMaterial x:Name="BackgroundImage"
                                                  Style="{StaticResource A_Style_FZMaterial_ReplayIcon_Background}">
                                    <local:FZMaterial x:Name="HighlightShadow" Style="{StaticResource A_Style_FZMaterial_HighlightShadow}" CaptureSubgraph="False">
                                        <Grid x:Name="OuterContainer">
                                            <local:FZMaterial x:Name="PauseImage"
                                                                        ImageSource="/Textures/Data_Bound/Replay_Icons/Pause.png"
                                                                        Style="{StaticResource A_Style_FZMaterial_ReplayIcon}"/>
                                            <local:FZMaterial x:Name="PlayImage"
                                                                    ImageSource="/Textures/Data_Bound/Replay_Icons/Play.png"
                                                                    Style="{StaticResource A_Style_FZMaterial_ReplayIcon}"/>
                                        </Grid>
                                    </local:FZMaterial>
                                </local:FZMaterial>
                            </Grid>
                            <ControlTemplate.Triggers>
                                <Trigger Property="IsChecked" Value="False">
                                    <Setter TargetName="PauseImage" Property="Visibility" Value="Visible"/>
                                    <Setter TargetName="PlayImage" Property="Visibility" Value="Hidden"/>
                                    <Setter Property="Tag" Value="Pause"/>
                                </Trigger>
                                <Trigger Property="IsChecked" Value="True">
                                    <Setter TargetName="PauseImage" Property="Visibility" Value="Hidden"/>
                                    <Setter TargetName="PlayImage" Property="Visibility" Value="Visible"/>
                                    <Setter Property="Tag" Value="Play"/>
                                </Trigger>
                                <Trigger Property="IsKeyboardFocused"
                                         Value="True">
                                    <Setter TargetName="BackgroundImage" Property="Style" Value="{StaticResource A_Style_FZMaterial_ReplayIcon_Background_Highlight}" />
                                    <Setter TargetName="PlayImage" Property="Color" Value="{StaticResource A_Color_White}"/>
                                    <Setter TargetName="PauseImage" Property="Color" Value="{StaticResource A_Color_White}"/>
                                    <Setter TargetName="HighlightShadow" Property="CaptureSubgraph" Value="True"/>
                                    <Setter Property="local:ZPanel.DisableClipping"
                                            Value="True" />
                                    <Trigger.EnterActions>
                                        <BeginStoryboard Storyboard="{StaticResource A_StoryBoard_Button_Focus}"/>
                                    </Trigger.EnterActions>
                                    <Trigger.ExitActions>
                                        <BeginStoryboard Storyboard="{StaticResource A_StoryBoard_Button_UnFocus}" />
                                    </Trigger.ExitActions>
                                </Trigger>
                            </ControlTemplate.Triggers>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>

            <Style x:Key="A_Style_SpinnerControl_NoLabel" TargetType="{x:Type local:SpinnerControl}">
                <Setter Property="Height" Value="39"/>
                <Setter Property="Margin" Value="0"/>
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="{x:Type local:SpinnerControl}">
                            <Grid x:Name="Grid_LayoutRoot" FocusManager.IsFocusScope="False">
                                <VisualStateManager.VisualStateGroups>
                                    <VisualStateGroup x:Name="LeftArrowStateGroup">
                                        <VisualState x:Name="PrevDisabled">
                                            <Storyboard>
                                                <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)"
                                                                               Storyboard.TargetName="Arrow_Left">
                                                    <EasingDoubleKeyFrame KeyTime="0"
                                                                          Value="0.0" />
                                                </DoubleAnimationUsingKeyFrames>
                                            </Storyboard>
                                        </VisualState>
                                        <VisualState x:Name="PrevEnabled"/>
                                    </VisualStateGroup>
                                    <VisualStateGroup x:Name="RightArrowStateGroup">
                                        <VisualState x:Name="NextDisabled">
                                            <Storyboard>
                                                <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)"
                                                                               Storyboard.TargetName="Arrow_Right">
                                                    <EasingDoubleKeyFrame KeyTime="0" Value="0.0"/>
                                                </DoubleAnimationUsingKeyFrames>
                                            </Storyboard>
                                        </VisualState>
                                        <VisualState x:Name="NextEnabled"/>
                                    </VisualStateGroup>
                                </VisualStateManager.VisualStateGroups>
                                <local:RoutedEventCommand x:Name="MouseLeaveCommand"
                                                          RoutedEvent="UIElement.MouseLeave"
                                                          Command="{Binding HideCameraGroupCommand, ElementName=UserControl}" />
                                <local:FZMaterial Style="{StaticResource A_Style_FZMaterial_ReplayIcon_Background_Highlight}"
                                                  local:RoutedEventCommand.Action="{Binding ElementName=MouseLeaveCommand}">

                                    <local:FZMaterial Style="{StaticResource A_Style_FZMaterial_HighlightShadow}" CaptureSubgraph="True">
                                        <Grid>
                                            <Grid x:Name="LeftArrowContainer"
                                                  HorizontalAlignment="Left"
                                                  VerticalAlignment="Center" Margin="1,2,0,2">
                                                <local:FZButton x:Name="Arrow_Left"
                                                        Command="{TemplateBinding PrevSelectCommand}"
                                                        Style="{StaticResource A_Style_Button_SpinnerArrowButton}">
                                                    <ContentControl Style="{StaticResource A_Style_Arrow_Left}"
                                                                    HorizontalAlignment="Left"
                                                                    Margin="-4,0,0,0"
                                                                    Focusable="False" />
                                                </local:FZButton>
                                            </Grid>
                                            <local:FZTextBlock x:Name="PART_Text"
                                                                Text="{Binding SelectedItem, RelativeSource={RelativeSource TemplatedParent}}"
                                                                Style="{StaticResource A_Style_FZTextBlock_HeaderBlock}"
                                                                CapHeight="16"
                                                                FontFamily="Horizon_A"
                                                                VerticalAlignment="Center"
                                                                HorizontalAlignment="Center"
                                                                Margin="15,0,15,2" />
                                            <Grid x:Name="RightArrowContainer"
                                                  HorizontalAlignment="Right"
                                                  VerticalAlignment="Center" Margin="0,2,2,2">
                                                <local:FZButton x:Name="Arrow_Right"
                                                        Command="{TemplateBinding NextSelectCommand}"
                                                        Style="{StaticResource A_Style_Button_SpinnerArrowButton}">
                                                    <ContentControl Style="{StaticResource A_Style_Arrow_Right}"
                                                                    HorizontalAlignment="Right"
                                                                    Margin="0,0,-6,0"
                                                                    Focusable="False" />
                                                </local:FZButton>
                                            </Grid>
                                        </Grid>
                                    </local:FZMaterial>
                                </local:FZMaterial>
                            </Grid>
                            <ControlTemplate.Triggers>
                            </ControlTemplate.Triggers>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>

            <Storyboard x:Key="PlayText">
                <StringAnimationUsingKeyFrames Storyboard.TargetProperty="(local:FZTextBlock.Text)" Storyboard.TargetName="DescriptionTxt">
                    <DiscreteStringKeyFrame KeyTime="0" Value="{local:Loc InGame.IDS_Play}"/>
                </StringAnimationUsingKeyFrames>
            </Storyboard>
            <Storyboard x:Key="PauseText">
                <StringAnimationUsingKeyFrames Storyboard.TargetProperty="(local:FZTextBlock.Text)" Storyboard.TargetName="DescriptionTxt">
                    <DiscreteStringKeyFrame KeyTime="0" Value="{local:Loc InGame.IDS_Pause}"/>
                </StringAnimationUsingKeyFrames>
            </Storyboard>

        </ResourceDictionary>
    </UserControl.Resources>

    <UserControl.Triggers>
        <EventTrigger RoutedEvent="Keyboard.GotKeyboardFocus" SourceName="RestartBtn">
            <BeginStoryboard>
                <Storyboard>
                    <StringAnimationUsingKeyFrames Storyboard.TargetProperty="(local:FZTextBlock.Text)" Storyboard.TargetName="DescriptionTxt">
                        <DiscreteStringKeyFrame KeyTime="0" Value="{local:Loc InGame.IDS_Restart}"/>
                    </StringAnimationUsingKeyFrames>
                </Storyboard>
            </BeginStoryboard>
        </EventTrigger>
        <EventTrigger RoutedEvent="Keyboard.GotKeyboardFocus" SourceName="RewindBtn">
            <BeginStoryboard>
                <Storyboard>
                    <StringAnimationUsingKeyFrames Storyboard.TargetProperty="(local:FZTextBlock.Text)" Storyboard.TargetName="DescriptionTxt">
                        <DiscreteStringKeyFrame KeyTime="0" Value="{local:Loc InGame.IDS_SkipBack}"/>
                    </StringAnimationUsingKeyFrames>
                </Storyboard>
            </BeginStoryboard>
        </EventTrigger>
        <!-- can't convince the xaml to check whether PausePlayToggle IsChecked or not 
                need to toggle between InGame.IDS_Play and InGame.IDS_Pause-->
        <EventTrigger RoutedEvent="Keyboard.GotKeyboardFocus" SourceName="PausePlayToggleBtn">
            <BeginStoryboard>
                <Storyboard>
                    <StringAnimationUsingKeyFrames Storyboard.TargetProperty="(local:FZTextBlock.Text)" Storyboard.TargetName="DescriptionTxt">
                        <DiscreteStringKeyFrame KeyTime="0" Value="{local:Loc InGame.IDS_Pause}"/>
                    </StringAnimationUsingKeyFrames>
                </Storyboard>
            </BeginStoryboard>
        </EventTrigger>
        <EventTrigger RoutedEvent="Keyboard.GotKeyboardFocus" SourceName="FastForwardBtn">
            <BeginStoryboard>
                <Storyboard>
                    <StringAnimationUsingKeyFrames Storyboard.TargetProperty="(local:FZTextBlock.Text)" Storyboard.TargetName="DescriptionTxt">
                        <DiscreteStringKeyFrame KeyTime="0" Value="{local:Loc InGame.IDS_SkipForward}"/>
                    </StringAnimationUsingKeyFrames>
                </Storyboard>
            </BeginStoryboard>
        </EventTrigger>
        <EventTrigger RoutedEvent="Keyboard.GotKeyboardFocus" SourceName="CamerasBtn">
            <BeginStoryboard>
                <Storyboard>
                    <StringAnimationUsingKeyFrames Storyboard.TargetProperty="(local:FZTextBlock.Text)" Storyboard.TargetName="DescriptionTxt">
                        <DiscreteStringKeyFrame KeyTime="0" Value="{local:Loc InGame.IDS_CameraType}"/>
                    </StringAnimationUsingKeyFrames>
                </Storyboard>
            </BeginStoryboard>
        </EventTrigger>
        <EventTrigger RoutedEvent="Keyboard.GotKeyboardFocus" SourceName="TelemetryBtn">
            <BeginStoryboard>
                <Storyboard>
                    <StringAnimationUsingKeyFrames Storyboard.TargetProperty="(local:FZTextBlock.Text)" Storyboard.TargetName="DescriptionTxt">
                        <DiscreteStringKeyFrame KeyTime="0" Value="{local:Loc InGame.IDS_Telemetry}"/>
                    </StringAnimationUsingKeyFrames>
                </Storyboard>
            </BeginStoryboard>
        </EventTrigger>
        <EventTrigger RoutedEvent="Keyboard.GotKeyboardFocus" SourceName="MovieBtn">
            <BeginStoryboard>
                <Storyboard>
                    <StringAnimationUsingKeyFrames Storyboard.TargetProperty="(local:FZTextBlock.Text)" Storyboard.TargetName="DescriptionTxt">
                        <DiscreteStringKeyFrame KeyTime="0" Value="{local:Loc InGame.IDS_Movie}"/>
                    </StringAnimationUsingKeyFrames>
                </Storyboard>
            </BeginStoryboard>
        </EventTrigger>
        <EventTrigger RoutedEvent="Keyboard.GotKeyboardFocus" SourceName="PhotoBtn">
            <BeginStoryboard>
                <Storyboard>
                    <StringAnimationUsingKeyFrames Storyboard.TargetProperty="(local:FZTextBlock.Text)" Storyboard.TargetName="DescriptionTxt">
                        <DiscreteStringKeyFrame KeyTime="0" Value="{local:Loc InGame.IDS_TakePhoto}"/>
                    </StringAnimationUsingKeyFrames>
                </Storyboard>
            </BeginStoryboard>
        </EventTrigger>
        <EventTrigger RoutedEvent="Keyboard.GotKeyboardFocus" SourceName="ExitBtn">
            <BeginStoryboard>
                <Storyboard>
                    <StringAnimationUsingKeyFrames Storyboard.TargetProperty="(local:FZTextBlock.Text)" Storyboard.TargetName="DescriptionTxt">
                        <DiscreteStringKeyFrame KeyTime="0" Value="{local:Loc InGame.IDS_Exit}"/>
                    </StringAnimationUsingKeyFrames>
                </Storyboard>
            </BeginStoryboard>
        </EventTrigger>
    </UserControl.Triggers>

    <Grid x:Name="LayoutRoot">
        <Grid.RowDefinitions>
            <RowDefinition Height="*" />
            <RowDefinition Height="*" />
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto" />
        </Grid.ColumnDefinitions>

        <local:FZMaterial x:Name="DescriptionContainer"
                          Height="39"
                          Grid.Row="0"
                          Style="{StaticResource A_Style_FZMaterial_FlatPanel_HeaderPill}"
                          Margin="0,0,0,6">
            <local:FZTextBlock x:Name="DescriptionTxt"
                               Style="{StaticResource A_Style_FZTextBlock_HeaderBlock}" CapHeight="16"
                               Color="{StaticResource A_Color_SubHeader_Text}" Margin="20,0"
                               FontFamily="Horizon_A"
                               VerticalAlignment="Center"
                               HorizontalAlignment="Center"/>
        </local:FZMaterial>

        <local:SpinnerControl x:Name="CameraSpinner"
                              Grid.Row="2"
                              MinWidth="{Binding Path=ActualWidth, ElementName=ButtonContainer}"
                              Style="{StaticResource A_Style_SpinnerControl_NoLabel}"
                              ItemsSource="{Binding CameraGroupOptions, ElementName=UserControl}"
                              SelectedIndex="{Binding CameraGroupIndex, ElementName=UserControl}"
                              Visibility="{Binding ShowCameraGroups, ElementName=UserControl, Converter={StaticResource A_FZBooleanToVisibilityConverter}}"
                              Margin="0,0,0,0"/>

        <StackPanel Orientation="Horizontal" Grid.Row="1" Margin="0,0,0,6">
            <StackPanel x:Name="ButtonContainer" Orientation="Horizontal" KeyboardNavigation.DirectionalNavigation="Contained">
                <local:FZButton x:Name="RestartBtn"
                        Style="{StaticResource A_Style_Button_Clickable}"
                        Visibility="{Binding ReplayMode, ElementName=UserControl, Converter={StaticResource A_FZBooleanToVisibilityConverter}}"
                        Tag="/Textures/Data_Bound/Replay_Icons/Restart.png" />
                <local:FZButton x:Name="RewindBtn"
                        Style="{StaticResource A_Style_Button_Clickable}"
                        Visibility="Collapsed"
                        Tag="/Textures/Data_Bound/Replay_Icons/Icon_Rewind.png"/>
                <!-- Not part of Anthem's design: Visibility="{Binding CanSkip, ElementName=UserControl, Converter={StaticResource A_FZBooleanToVisibilityConverter}}" -->
                <ToggleButton x:Name="PausePlayToggleBtn"
                              Style="{StaticResource A_Style_ToggleButton_Default}"
                              IsChecked="{Binding IsPaused, ElementName=UserControl}"
                              Visibility="{Binding ReplayMode, ElementName=UserControl, Converter={StaticResource A_FZBooleanToVisibilityConverter}}"/>
                <local:FZButton x:Name="FastForwardBtn" Style="{StaticResource A_Style_Button_Clickable}"
                        Visibility="Collapsed"
                        Tag="/Textures/Data_Bound/Replay_Icons/Icon_FastForward.png"/>
                <!-- Not part of Anthem's design: Visibility="{Binding CanSkip, ElementName=UserControl, Converter={StaticResource A_FZBooleanToVisibilityConverter}}" -->
                <local:FZButton x:Name="CamerasBtn"
                        Style="{StaticResource A_Style_Button_OpenMenu}"
                        ClickMode="Release"
                        Tag="/Textures/Data_Bound/Replay_Icons/Game_Camera.png"/>
                <local:FZButton x:Name="TelemetryBtn"
                        Style="{StaticResource A_Style_Button_Clickable}"
                        Visibility="Collapsed"
                        Tag="/Textures/Data_Bound/Replay_Icons/Icon_Telemetry.png" />
                <local:FZButton x:Name="MovieBtn"
                        Style="{StaticResource A_Style_Button_Clickable}"
                        Visibility="Collapsed"
                        Tag="/Textures/Data_Bound/Replay_Icons/Icon_Movie.png">
                </local:FZButton>
                <local:FZButton x:Name="PhotoBtn"
                        Style="{StaticResource A_Style_Button_Clickable}"
                        Visibility="{Binding CanExportPhoto, ElementName=UserControl, Converter={StaticResource A_FZBooleanToVisibilityConverter}}"
                        Tag="/Textures/Data_Bound/Replay_Icons/Photo_Mode.png" />
                <local:FZButton x:Name="ExitBtn"
                        Style="{StaticResource A_Style_Button_Clickable}"
                        Margin="0,0,0,0"
                        Tag="/Textures/Data_Bound/Replay_Icons/Exit.png" />
            </StackPanel>
        </StackPanel>
    </Grid>
</UserControl>
