<Page x:Name="Page"
      x:Class="ForzaUI.A_DebugThumbnailEditor"
      xmlns:local="clr-namespace:ForzaUI"
      xmlns:System="clr-namespace:System;assembly=mscorlib"
      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" 
      mc:Ignorable="d"
      DataContext="{Binding RelativeSource={x:Static RelativeSource.Self}}">

    <Page.Resources>    	        
        <System:Double x:Key="A_Double_MaxSceneWidth">1920</System:Double>
        <System:Double x:Key="A_Double_MaxSceneHeight">1080</System:Double>

        <SolidColorBrush x:Key="A_Brush_BorderBrush" Color="{StaticResource A_Color_InactiveHeader_Text}" />
        <SolidColorBrush x:Key="A_Brush_GuidelineOuter" Color="{StaticResource A_Color_Tile_Selected}"/>
        <SolidColorBrush x:Key="A_Brush_GuidelineInner" Color="{StaticResource A_Color_Tile_LiveText}"/>
                
        <Style x:Key="A_Style_FZTextBlock_ControllerStyle" TargetType="local:FZTextBlock" BasedOn="{StaticResource A_Style_FZTextBlock_HorizonD}">
            <Setter Property="FontSize" Value="22"/>
            <Setter Property="Color" Value="{StaticResource A_Color_DriverListRowText}"/>
            <Setter Property="Effect" Value="{StaticResource A_DropShadowEffect_HelpBar}"/>
        </Style>

        <Style x:Key="A_Style_Button_ChangeCamera" TargetType="{x:Type local:FZButton}">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type local:FZButton}">
                        <local:FZTextBlock x:Name="FZTextBlock_ButtonContent"
                                            Text="{TemplateBinding Content}"
                                            Color="{StaticResource A_Color_Tile_Text}"
                                            Style="{StaticResource A_Style_FZTextBlock_Heading_Small_Tight}"/>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

        <Style x:Key="A_Style_ListBoxItem_List_ThumbEditor" TargetType="{x:Type ListBoxItem}" BasedOn="{StaticResource A_Style_ListBoxItem_TextMenu_NotFocusable}">
            <Setter Property="Height" Value="40"/>
        </Style>

    </Page.Resources>
    
           
	<Grid x:Name="LayoutRoot">
		<VisualStateManager.VisualStateGroups>
			<VisualStateGroup x:Name="ControlVisualStateGroup">
				<VisualState x:Name="MenuVisualState">
					<Storyboard>
						<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="StackPanel_CameraControls">
							<DiscreteObjectKeyFrame KeyTime="0" Value="{x:Static Visibility.Collapsed}"/>
						</ObjectAnimationUsingKeyFrames>
					</Storyboard>
				</VisualState>
				<VisualState x:Name="CameraVisualState">
					<Storyboard>
						<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="StackPanel_CameraControls">
							<DiscreteObjectKeyFrame KeyTime="0" Value="{x:Static Visibility.Visible}"/>
						</ObjectAnimationUsingKeyFrames>
					</Storyboard>
				</VisualState>
			</VisualStateGroup>
			<VisualStateGroup x:Name="ImageSizeVisualStateGroup">
				<VisualState x:Name="LargeImageVisualState">
					<Storyboard>
                        <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="Height" Storyboard.TargetName="Grid_Size">
                            <DiscreteDoubleKeyFrame KeyTime="0" Value="459"/>
                        </DoubleAnimationUsingKeyFrames>
                        <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="Width" Storyboard.TargetName="Grid_Size">
                            <DiscreteDoubleKeyFrame KeyTime="0" Value="816"/>
                        </DoubleAnimationUsingKeyFrames>
						<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="Height" Storyboard.TargetName="Grid_Viewport">
							<DiscreteDoubleKeyFrame KeyTime="0" Value="459"/>
						</DoubleAnimationUsingKeyFrames>
                        <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="Width" Storyboard.TargetName="Grid_Viewport">
                            <DiscreteDoubleKeyFrame KeyTime="0" Value="816"/>
                        </DoubleAnimationUsingKeyFrames>
                        <ThicknessAnimationUsingKeyFrames Storyboard.TargetProperty="Margin" Storyboard.TargetName="Rectangle_Safe">
                            <DiscreteThicknessKeyFrame KeyTime="0" Value="40,72,40,50"/>
                        </ThicknessAnimationUsingKeyFrames>
                        <ThicknessAnimationUsingKeyFrames Storyboard.TargetProperty="Margin" Storyboard.TargetName="Border_Red">
                            <DiscreteThicknessKeyFrame KeyTime="0" Value="80,0,80,52"/>
                        </ThicknessAnimationUsingKeyFrames>
                        <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="Height" Storyboard.TargetName="Border_Red">
                            <DiscreteDoubleKeyFrame KeyTime="0" Value="168"/>
                        </DoubleAnimationUsingKeyFrames>
                        <ThicknessAnimationUsingKeyFrames Storyboard.TargetProperty="Margin" Storyboard.TargetName="Border_Blue">
                            <DiscreteThicknessKeyFrame KeyTime="0" Value="120,0,120,52"/>
                        </ThicknessAnimationUsingKeyFrames>
                        <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="Height" Storyboard.TargetName="Border_Blue">
                            <DiscreteDoubleKeyFrame KeyTime="0" Value="84"/>
                        </DoubleAnimationUsingKeyFrames>
					</Storyboard>
				</VisualState>
				<VisualState x:Name="SmallImageVisualState">
					<Storyboard>
                        <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="Height" Storyboard.TargetName="Grid_Size">
                            <DiscreteDoubleKeyFrame KeyTime="0" Value="126"/>
                        </DoubleAnimationUsingKeyFrames>
                        <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="Width" Storyboard.TargetName="Grid_Size">
                            <DiscreteDoubleKeyFrame KeyTime="0" Value="224"/>
                        </DoubleAnimationUsingKeyFrames>
                        <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="Height" Storyboard.TargetName="Grid_Viewport">
                            <DiscreteDoubleKeyFrame KeyTime="0" Value="126"/>
                        </DoubleAnimationUsingKeyFrames>
                        <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="Width" Storyboard.TargetName="Grid_Viewport">
                            <DiscreteDoubleKeyFrame KeyTime="0" Value="224"/>
                        </DoubleAnimationUsingKeyFrames>
                        <ThicknessAnimationUsingKeyFrames Storyboard.TargetProperty="Margin" Storyboard.TargetName="Rectangle_Safe">
                            <DiscreteThicknessKeyFrame KeyTime="0" Value="10,6"/>
                        </ThicknessAnimationUsingKeyFrames>
                        <ThicknessAnimationUsingKeyFrames Storyboard.TargetProperty="Margin" Storyboard.TargetName="Border_Red">
                            <DiscreteThicknessKeyFrame KeyTime="0" Value="20,0,20,6"/>
                        </ThicknessAnimationUsingKeyFrames>
                        <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="Height" Storyboard.TargetName="Border_Red">
                            <DiscreteDoubleKeyFrame KeyTime="0" Value="54"/>
                        </DoubleAnimationUsingKeyFrames>
                        <ThicknessAnimationUsingKeyFrames Storyboard.TargetProperty="Margin" Storyboard.TargetName="Border_Blue">
                            <DiscreteThicknessKeyFrame KeyTime="0" Value="30,0,30,6"/>
                        </ThicknessAnimationUsingKeyFrames>
                        <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="Height" Storyboard.TargetName="Border_Blue">
                            <DiscreteDoubleKeyFrame KeyTime="0" Value="27"/>
                        </DoubleAnimationUsingKeyFrames>
					</Storyboard>
				</VisualState>
                <VisualState x:Name="WheelImageVisualState">
                    <Storyboard>
                        <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="Height" Storyboard.TargetName="Grid_Size">
                            <DiscreteDoubleKeyFrame KeyTime="0" Value="0"/>
                        </DoubleAnimationUsingKeyFrames>
                        <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="Width" Storyboard.TargetName="Grid_Size">
                            <DiscreteDoubleKeyFrame KeyTime="0" Value="0"/>
                        </DoubleAnimationUsingKeyFrames>
                        <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="Height" Storyboard.TargetName="Grid_Viewport">
                            <DiscreteDoubleKeyFrame KeyTime="0" Value="400"/>
                        </DoubleAnimationUsingKeyFrames>
                        <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="Width" Storyboard.TargetName="Grid_Viewport">
                            <DiscreteDoubleKeyFrame KeyTime="0" Value="400"/>
                        </DoubleAnimationUsingKeyFrames>
                        <ThicknessAnimationUsingKeyFrames Storyboard.TargetProperty="Margin" Storyboard.TargetName="Rectangle_Safe">
                            <DiscreteThicknessKeyFrame KeyTime="0" Value="0,0"/>
                        </ThicknessAnimationUsingKeyFrames>
                        <ThicknessAnimationUsingKeyFrames Storyboard.TargetProperty="Margin" Storyboard.TargetName="Border_Red">
                            <DiscreteThicknessKeyFrame KeyTime="0" Value="0"/>
                        </ThicknessAnimationUsingKeyFrames>
                        <ThicknessAnimationUsingKeyFrames Storyboard.TargetProperty="Margin" Storyboard.TargetName="Border_Blue">
                            <DiscreteThicknessKeyFrame KeyTime="0" Value="0"/>
                        </ThicknessAnimationUsingKeyFrames>
                        <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="Height" Storyboard.TargetName="Border_Blue">
                            <DiscreteDoubleKeyFrame KeyTime="0" Value="0"/>
                        </DoubleAnimationUsingKeyFrames>
                    </Storyboard>
                </VisualState>
			</VisualStateGroup>
		</VisualStateManager.VisualStateGroups>

        <local:FZMaterial x:Name="LightBackground" ImageSource="/ForzaUI;component/Textures/Anthem/Paintshop/Grid_Vignette_Light_BG.png" />

        <!-- Bars -->
        <ContentControl x:Name="BottomBar" Style="{StaticResource A_Style_ButtonBar}">
            <ContentControl x:Name="DefaultHelpPanel"
				    Style="{StaticResource A_Style_ContentControl_DefaultButtonBar}" />
        </ContentControl>
        
        <Border x:Name="Frame" Style="{StaticResource A_Style_Border_ScenePadding_Opus}">
            <Grid Style="{StaticResource A_Style_FrameworkElement_DefaultTransition_0}">
                <StackPanel Margin="0,-40,0,0" >
                    <Grid VerticalAlignment="Top">
                        <ContentControl x:Name="TitleBlock" Style="{StaticResource A_Style_ContentControl_ScreenTitleBlock}" Content="THUMBNAIL EDITOR" Tag="DEBUG" HorizontalAlignment="Left" />
                    </Grid>
        
                    <Grid x:Name="Grid_Body" Height="780" >
        	            <Grid x:Name="Grid_CameraViewport" VerticalAlignment="Top" Margin="0,16,0,0">
        		            <Grid.ColumnDefinitions>
        			            <ColumnDefinition Width="*"/>
        			            <ColumnDefinition Width="Auto"/>
        			            <ColumnDefinition Width="*"/>
        		            </Grid.ColumnDefinitions>
        		            <Grid x:Name="Grid_Viewport" Grid.Column="1" Width="100" Height="100" ClipToBounds="True">
                                <local:FZMaterial Color="{StaticResource A_Color_DarkPanelBackground}" GreedyMeasure="True" />

                                <ProgressBar x:Name="IdleIndicator" IsIndeterminate="True" Style="{StaticResource A_Style_ProgressBar_WaitSpinner}" Height="56" HorizontalAlignment="Center" VerticalAlignment="Center"/>	 

        			            <local:FZMaterial x:Name="ViewImageObject" GreedyMeasure="True" Stretch="UniformToFill" ImageSource="{Binding ViewImage}" HorizontalAlignment="Center" 
                                            VerticalAlignment="Center" Visibility="{Binding IsCarReady, Converter={StaticResource A_FZBooleanToVisibilityConverter}}" />
                                            
                                <Grid x:Name="Grid_Size" HorizontalAlignment="Center" Height="126" VerticalAlignment="Center" Width="224">
                                    <Rectangle x:Name="Rectangle_Frame" Stroke="{StaticResource A_Brush_BorderBrush}" StrokeThickness="4" Margin="-4"/>
                                    <Rectangle x:Name="Rectangle_Safe" Stroke="White" Opacity="0.25" StrokeThickness="2" Margin="0,0"/>
                                    <Border x:Name="Border_Red" BorderBrush="{StaticResource A_Brush_GuidelineOuter}" BorderThickness="2,0" Margin="20,0,20,6" Opacity="0.25" VerticalAlignment="Bottom" Height="54"/>
                                    <Border x:Name="Border_Blue" BorderBrush="{StaticResource A_Brush_GuidelineInner}" BorderThickness="2,0" Margin="30,0,30,6" Opacity="0.25" Height="27" VerticalAlignment="Bottom"/>
                                </Grid>
        		            </Grid>
            
                            <local:FZMaterial x:Name="ControlBackground" Color="{StaticResource A_Color_DarkPanelBackground}" 
                                            Grid.ColumnSpan="3" Grid.Column="2" Margin="10,4,0,0">
                                <Grid>
        		                    <StackPanel x:Name="StackPanel_CameraControls" Orientation="Vertical" Margin="8,40,0,0"> 
        			                    <StackPanel x:Name="StackPanel_LTS" HorizontalAlignment="Left" Margin="10,0,0,0" Orientation="Horizontal" Height="35">
        				                    <local:FZTextBlock x:Name="TextBlock_LTS" Text="L - Left/Right/Forward/Back" Style="{StaticResource A_Style_FZTextBlock_ControllerStyle}" VerticalAlignment="Center"/>
        			                    </StackPanel>
        			                    <StackPanel x:Name="StackPanel_RTS" HorizontalAlignment="Left" Margin="10,0,0,0" Orientation="Horizontal" Height="35">
        				                    <local:FZTextBlock x:Name="TextBlock_RTS" Text="R - Pivot/Tilt" Style="{StaticResource A_Style_FZTextBlock_ControllerStyle}" VerticalAlignment="Center"/>
        			                    </StackPanel>
        			                    <local:ControllerButtonControl x:Name="DPadVertical" Button="DPadVertical" Description="Camera Zoom"/>
        			                    <local:ControllerButtonControl x:Name="DPadHorizontal" Button="DPadHorizontal" Description="Camera Roll"/>
        			                    <local:ControllerButtonControl x:Name="L3" Button="L3" Description="Reset Camera Roll" HorizontalAlignment="Left" Height="37" Width="310.087"/>
        			                    <local:ControllerButtonControl x:Name="R3" Button="R3" Description="Debug Menu"/>
        			                    <local:ControllerButtonControl x:Name="LTrigger" Button="LTrigger" Description="Camera Down"/>
        			                    <local:ControllerButtonControl x:Name="RTrigger" Button="RTrigger" Description="Camera Up"/>
        		                    </StackPanel>
        		                    <local:FZMaterial Color="{StaticResource A_Color_DarkPanelHeader}" Height="40" Width="{Binding Path=ActualWidth, ElementName=ControlBackground}"
                                                        HorizontalAlignment="Left" VerticalAlignment="Top" >
        				                <local:FZTextBlock x:Name="TextBlock_CameraControlsLabel" Text="CAMERA CONTROLS" Margin="4,0" VerticalAlignment="Center" Style="{StaticResource A_Style_FZTextBlock_Heading_SmallActive}"/>
                                    </local:FZMaterial>
                                </Grid>
                            </local:FZMaterial>
        	            </Grid>
            
        	            <Grid x:Name="Grid_Menu" HorizontalAlignment="Center" VerticalAlignment="Bottom" Margin="0,0,0,-2">
        		            <Grid.ColumnDefinitions>
        			            <ColumnDefinition Width="498"/>
        			            <ColumnDefinition Width="502"/>
        			            <ColumnDefinition Width="*"/>
        			            <ColumnDefinition Width="250"/>
        		            </Grid.ColumnDefinitions>
        		            <Grid.RowDefinitions>
        			            <RowDefinition Height="*"/>
        			            <RowDefinition Height="*"/>
        		            </Grid.RowDefinitions>
                            <local:FZMaterial Color="{StaticResource A_Color_DarkPanelBackground}" Grid.Column="1">
        		                <StackPanel x:Name="StackPanel_CurrentSetting" Grid.Column="1">
        			                <local:FZTextBlock x:Name="TextBlock_CurrentSettingLabel" Text="CURRENT SETTING IN FILE" HorizontalAlignment="Center" Style="{StaticResource A_Style_FZTextBlock_Heading_SmallActive}" Margin="0,20,0,0" />
        			                <local:FZTextBlock x:Name="TextBlock_CurrentSetting" Text="{Binding SettingType}" HorizontalAlignment="Center" Style="{StaticResource A_Style_FZTextBlock_ControllerStyle}" Margin="0,10,0,25" />
        		                </StackPanel>
                            </local:FZMaterial>

                            <Decorator Grid.ColumnSpan="2" Grid.Row="1">
                                <local:CommonListBox x:Name="PART_StackPanel_List"  
                                                     VerticalAlignment="Top" 
                                                     HorizontalAlignment="Left" 
                                                     KeyboardNavigation.DirectionalNavigation="Contained" 
                                                     Style="{StaticResource A_Style_ListBox_List_Default}" 
                                                     ItemContainerStyle="{StaticResource A_Style_ListBoxItem_List_ThumbEditor}"
                                                     Width="1000"
                                                     Height="Auto">
                                    <local:FZButton x:Name="PART_Button_Camera" Style="{StaticResource A_Style_Button_ChangeCamera}" Content="CHANGE CAMERA" VerticalAlignment="Center" Margin="20,0" />
                                    <local:SpinnerControl x:Name="Car" WrapSelection="True"  Label="{Binding CarSpinnerLabel}" Style="{StaticResource A_Style_SpinnerControl_Default}" Margin="20,0" />
                                    <local:SpinnerControl x:Name="Size" Label="SIZE" Style="{StaticResource A_Style_SpinnerControl_Default}" Margin="20,0" />
                                    <local:SpinnerControl x:Name="Setting" Label="SETTING" Style="{StaticResource A_Style_SpinnerControl_Default}" Margin="20,0" />
                                </local:CommonListBox>
                            </Decorator>
        		            <Grid x:Name="Grid_MenuOptions" Grid.Column="2" Grid.RowSpan="2" Margin="20,0,0,10">
        			            <Grid.RowDefinitions>
        				            <RowDefinition Height="*"/>
        				            <RowDefinition Height="37"/>
        				            <RowDefinition Height="37"/>
        				            <RowDefinition Height="*"/>
        			            </Grid.RowDefinitions>
                                
                                <local:FZMaterial Color="{StaticResource A_Color_DarkPanelBackground}" Grid.Column="1">
        			                <Grid x:Name="Grid_CurrentOptions" Margin="6,0">
        				                <Grid.RowDefinitions>
        					                <RowDefinition Height="37"/>
        					                <RowDefinition Height="37"/>
                                            <RowDefinition Height="37"/>
                                            <RowDefinition Height="37"/>
        				                </Grid.RowDefinitions>
        				                <local:ControllerButtonControl x:Name="ControllerButtonControl_LBumper" Grid.Row="0" Button="LBumper" Description="Save Current Thumbnail"/>
        				                <local:ControllerButtonControl x:Name="ControllerButtonControl_Back" Grid.Row="1" Button="Back" Description="Generate All Thumbnails"/>
        				                <local:ControllerButtonControl x:Name="ControllerButtonControl_RBumper" Grid.Row="2" Button="RBumper" Description="Fast Scroll" Height="37" VerticalAlignment="Bottom" HorizontalAlignment="Left"/>
        			                    <local:ControllerButtonControl x:Name="ControllerButtonControl_Start" Grid.Row="3" Button="Start" Description="Toggle Stock/StockID/Garage"/>
        			                </Grid>
                                </local:FZMaterial>
                                <local:FZMaterial x:Name="Rectangle_ImageSizeBg" Grid.Row="1" Color="{StaticResource A_Color_DarkPanelHeader}" Margin="0,2,0,0" />
        			            <StackPanel x:Name="StackPanel_ImageSize" Grid.Row="1" Margin="6,0" Orientation="Horizontal" Width="277" HorizontalAlignment="Left">
        				            <local:FZTextBlock x:Name="TextBlock_Width" Text="{Binding ViewWidth, Converter={StaticResource A_NumUnitConverter_NoUnit_0dp}}" Style="{StaticResource A_Style_FZTextBlock_ControllerStyle}" VerticalAlignment="Center" Margin="20,0,0,0"/>
        				            <local:FZTextBlock x:Name="TextBlock_WidthLabel" Text="w" Style="{StaticResource A_Style_FZTextBlock_Heading_SmallActive}" VerticalAlignment="Center" Margin="0,0,15,0"/>
        				            <local:FZTextBlock x:Name="TextBlock_Height" Text="{Binding ViewHeight, Converter={StaticResource A_NumUnitConverter_NoUnit_0dp}}" Style="{StaticResource A_Style_FZTextBlock_ControllerStyle}" VerticalAlignment="Center" Margin="10,0,0,0"/>
        				            <local:FZTextBlock x:Name="TextBlock_HeightLabel" Text="h" Style="{StaticResource A_Style_FZTextBlock_Heading_SmallActive}" VerticalAlignment="Center" Margin="0,0,15,0"/>
        			            </StackPanel>
                                <local:FZMaterial x:Name="Rectangle_MenuCurrentSettingBg" Grid.Row="2" Color="{StaticResource A_Color_DarkPanelHeader}" Margin="0,2,0,0" />
        			            <local:FZTextBlock x:Name="TextBlock_MenuCurrentSetting" Grid.Row="2" Text="{Binding SettingType}" Style="{StaticResource A_Style_FZTextBlock_Heading_SmallActive}" VerticalAlignment="Center" Margin="20,0,15,0"/>
        		            </Grid>
        	            </Grid>
                    </Grid>
        	    </StackPanel>
            </Grid>
        </Border>
    </Grid>
</Page>