﻿<presentationManifest:LayoutControl
    x:Class="WinStore.UX.Controls.CollectionListPanel"
    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:local="using:WinStore.UX.Controls"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:presentationManifest="using:WinStore.UX.PresentationManifest"
    d:DesignHeight="300"
    d:DesignWidth="400"
    mc:Ignorable="d">

    <Grid>
        <VisualStateManager.VisualStateGroups>
            <VisualStateGroup x:ConnectionId='1' x:Name="DisplayStates">
                <VisualState x:ConnectionId='5' x:Name="Wide">
                    <VisualState.StateTriggers>
                        <AdaptiveTrigger MinWindowWidth="{StaticResource WideMinWidth}" />
                    </VisualState.StateTriggers>
                </VisualState>
                <VisualState x:ConnectionId='6' x:Name="MediumNarrow">
                    <VisualState.StateTriggers>
                        <AdaptiveTrigger MinWindowWidth="{StaticResource MediumNarrowMinWidth}" />
                    </VisualState.StateTriggers>
                    <Storyboard>
                        <!--Side Margins-->
                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="_leftGutterColumn" Storyboard.TargetProperty="Width">
                            <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource AppMarginMediumNarrowGridLength}" />
                        </ObjectAnimationUsingKeyFrames>
                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="_rightGutterColumn" Storyboard.TargetProperty="Width">
                            <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource AppMarginMediumNarrowGridLength}" />
                        </ObjectAnimationUsingKeyFrames>
                    </Storyboard>
                </VisualState>
                <VisualState x:ConnectionId='7' x:Name="Narrow">
                    <VisualState.StateTriggers>
                        <AdaptiveTrigger MinWindowWidth="{StaticResource NarrowMinWidth}" />
                    </VisualState.StateTriggers>
                    <Storyboard>
                        <!--Side Margins-->
                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="_leftGutterColumn" Storyboard.TargetProperty="Width">
                            <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource AppMarginNarrowGridLength}" />
                        </ObjectAnimationUsingKeyFrames>
                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="_rightGutterColumn" Storyboard.TargetProperty="Width">
                            <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource AppMarginNarrowGridLength}" />
                        </ObjectAnimationUsingKeyFrames>
                    </Storyboard>
                </VisualState>
            </VisualStateGroup>
			<VisualStateGroup x:ConnectionId='2' x:Name="WideTextStates">
				<VisualState x:ConnectionId='3' x:Name="NormalTextMode" />
				<VisualState x:ConnectionId='4' x:Name="WideTextMode">
					<Storyboard>
						<ObjectAnimationUsingKeyFrames Storyboard.TargetName="_viewAllButton" Storyboard.TargetProperty="(Grid.Row)">
							<DiscreteObjectKeyFrame KeyTime="0" Value="1" />
						</ObjectAnimationUsingKeyFrames>
					</Storyboard>
				</VisualState>
			</VisualStateGroup>
        </VisualStateManager.VisualStateGroups>
        <Grid.ColumnDefinitions>
            <ColumnDefinition x:ConnectionId='8' x:Name="_leftGutterColumn" Width="{StaticResource AppMarginWideGridLength}" />
            <ColumnDefinition Width="*" />
            <ColumnDefinition x:ConnectionId='9' x:Name="_rightGutterColumn" Width="{StaticResource AppMarginWideGridLength}" />
        </Grid.ColumnDefinitions>
		<Grid x:ConnectionId='10' x:Name="_panelGrid" Grid.Column="1">
			<Grid.RowDefinitions>
                <RowDefinition Height="Auto" />
				<RowDefinition Height="Auto" /> <!--Nothing's in here by default, but we'll put the view all button in there in wide text mode-->
                <RowDefinition Height="*" />
                <RowDefinition Height="Auto" />
            </Grid.RowDefinitions>

			<TextBlock x:ConnectionId='11'
                x:Name="_title"
                AutomationProperties.AutomationId="SectionTitle"
                Style="{StaticResource SubtitleTextBlockStyle}"
                Margin="0,7,0,0"
                HorizontalAlignment="Left"
                TextTrimming="CharacterEllipsis" 
                Foreground="{ThemeResource PrimaryForegroundBrush}"
                Text="Collections" />

			<HyperlinkButton x:ConnectionId='12'
                x:Name="_viewAllButton"
                AutomationProperties.AutomationId="SectionViewAllButton"
                x:Uid="ViewAllButton" 
                Style="{StaticResource HyperlinkButtonStyle}"
                Padding="8,2"
                HorizontalAlignment="Right"
                Visibility="Visible">
                <HyperlinkButton.RenderTransform>
                    <TranslateTransform X="8" Y="2"/>
                </HyperlinkButton.RenderTransform>
            </HyperlinkButton>
            
            <local:HandledHorizontalScrollViewer x:ConnectionId='13'
                x:Name="_handledScroller"
                Grid.Row="2"
                IsItemClickEnabled="True"/>

			<Rectangle Grid.Row="3" 
				Height="1" 
				Margin="0,10" 
				Fill="{ThemeResource BodyBackgroundStroke}"/>
        </Grid>
    </Grid>
</presentationManifest:LayoutControl>

