<!-- Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT License. See LICENSE in the project root for license information. -->
<local:TestPage
    x:Class="MUXControlsTestApp.PersonPicturePage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="clr-namespace:MUXControlsTestApp"
    xmlns:controls="http://schemas.modernwpf.com/2019"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">

    <Grid
        x:Name="rootGrid"
        Background="{DynamicResource SystemControlPageBackgroundAltHighBrush}"
        Margin="8">
        <Grid.ColumnDefinitions>
            <ColumnDefinition />
            <ColumnDefinition />
            <ColumnDefinition Width="*" />
        </Grid.ColumnDefinitions>

        <Grid.Resources>
            <CollectionViewSource x:Key="cvs" />
            <Style TargetType="StackPanel">
                <Setter Property="Margin" Value="4" />
            </Style>
            <Style TargetType="TextBlock">
                <Setter Property="VerticalAlignment" Value="Center" />
                <Setter Property="Margin" Value="0,0,4,0" />
            </Style>
        </Grid.Resources>

        <StackPanelEx
            HorizontalAlignment="Left"
            Style="{DynamicResource StandardGroupingStackPanel}">
            <TextBlock
                Text="Options"
                Style="{DynamicResource StandardGroupHeader}" />
            <StackPanel Orientation="Horizontal">
                <TextBlock Text="GroupGlyph:" />
                <CheckBox
                    x:Name="GroupCheckBox"
                    AutomationProperties.Name="GroupCheckBox"
                    Checked="GroupCheckBox_Checked"
                    Unchecked="GroupCheckBox_Unchecked" />
            </StackPanel>

            <StackPanel Orientation="Horizontal">
                <TextBlock Text="Initials:" />
                <TextBox
                    x:Name="InitialTextBox"
                    AutomationProperties.Name="InitialTextBox"
                    MaxLength="2"
                    TextChanged="InitialTextBox_TextChanged" />
            </StackPanel>

            <StackPanel Orientation="Horizontal">
                <TextBlock Text="DisplayName:" />
                <TextBox
                    x:Name="DisplayNameTextBox"
                    AutomationProperties.Name="DisplayNameTextBox"
                    TextChanged="DisplayNameTextBox_TextChanged" />
            </StackPanel>

            <StackPanel Orientation="Horizontal">
                <TextBlock Text="BadgeNumber:" />
                <TextBox
                    x:Name="BadgeNumberTextBox"
                    AutomationProperties.Name="BadgeNumberTextBox"
                    TextChanged="BadgeNumberTextBox_TextChanged" />
            </StackPanel>

            <StackPanel>
                <TextBlock Text="BadgeGlyph:" />
                <TextBox
                    x:Name="BadgeGlyphTextBox"
                    AutomationProperties.Name="BadgeGlyphTextBox"
                    TextChanged="BadgeGlyphTextBox_TextChanged" />
            </StackPanel>

            <!--<TextBlock Text="Contact:" />
            <StackPanel Orientation="Horizontal">
                <Button
                    x:Name="ContactBtn"
                    AutomationProperties.Name="ContactBtn"
                    Content="Set Contact"
                    Margin="0,0,10,0"
                    Click="ContactBtn_Click" />
                <Button
                    x:Name="ContactImageBtn"
                    AutomationProperties.Name="ContactImageBtn"
                    Content="Set Contact (w/ Image)"
                    Margin="10,0,10,0"
                    Click="ContactImageBtn_Click" />
                <Button
                    x:Name="ClearContactBtn"
                    AutomationProperties.Name="ClearContactBtn"
                    Content="Clear Contact"
                    Margin="10,0,10,0"
                    Click="ClearContactBtn_Click" />
            </StackPanel>-->

            <TextBlock Text="ImageSource:" />
            <StackPanel Orientation="Horizontal">
                <Button
                    x:Name="ImageBtn"
                    AutomationProperties.Name="ImageBtn"
                    Content="Set Image"
                    Margin="0,0,10,0"
                    Click="ImageBtn_Click" />
                <Button
                    x:Name="ClearImageBtn"
                    AutomationProperties.Name="ClearImageBtn"
                    Content="Clear Image"
                    Margin="10,0,10,0"
                    Click="ClearImageBtn_Click" />
            </StackPanel>

            <TextBlock Text="Size:" />
            <StackPanel Orientation="Horizontal">
                <Slider
                    x:Name="HeightSlider"
                    AutomationProperties.Name="HeightSlider"
                    controls:ControlHelper.Header="Height"
                    AutoToolTipPlacement="None"
                    Margin="10,0,10,0"
                    Maximum="130"
                    Minimum="70"
                    Value="{Binding Height, ElementName=TestPersonPicture, Mode=TwoWay}"
                    Width="50" />
                <Slider
                    x:Name="WidthSlider"
                    AutomationProperties.Name="WidthSlider"
                    controls:ControlHelper.Header="Width"
                    AutoToolTipPlacement="None"
                    Margin="10,0,10,0"
                    Maximum="130"
                    Minimum="70"
                    Value="{Binding Width, ElementName=TestPersonPicture, Mode=TwoWay}"
                    Width="50" />
                <CheckBox
                    x:Name="DimensionsMatch"
                    AutomationProperties.Name="DimensionsMatch"
                    Content="Height and width consistent"
                    IsChecked="True"
                    Margin="10,0,10,0" />
            </StackPanel>
        </StackPanelEx>

        <StackPanel Grid.Column="1">
            <TextBlock
                Text="Sample controls"
                Style="{DynamicResource StandardGroupHeader}" />

            <controls:PersonPicture
                x:Name="TestPersonPicture"
                AutomationProperties.Name="TestPersonPicture"
                SizeChanged="TestPersonPicture_SizeChanged" />

            <StackPanel Orientation="Horizontal">
                <ListView
                    x:Name="PeopleLV"
                    AutomationProperties.Name="PeopleLV"
                    Height="200"
                    Margin="10">
                    <ListViewItem>
                        <controls:PersonPicture
                            x:Name="PersonPicture0"
                            AutomationProperties.Name="PersonPicture0"
                            BadgeNumber="1"
                            BadgeGlyph="\uE765"
                            Initials="JB"
                            DisplayName="James Bond" />
                    </ListViewItem>
                    <ListViewItem>
                        <controls:PersonPicture
                            x:Name="PersonPicture1"
                            AutomationProperties.Name="PersonPicture1"
                            BadgeNumber="2"
                            BadgeGlyph="\uE766"
                            Initials="AP"
                            DisplayName="Austin Powers" />
                    </ListViewItem>
                    <ListViewItem>
                        <controls:PersonPicture
                            x:Name="PersonPicture2"
                            AutomationProperties.Name="PersonPicture2"
                            BadgeNumber="3"
                            BadgeGlyph="\uE767"
                            Initials="SA"
                            DisplayName="Steve Austin" />
                    </ListViewItem>
                    <ListViewItem>
                        <controls:PersonPicture
                            x:Name="PersonPicture3"
                            AutomationProperties.Name="PersonPicture3"
                            BadgeNumber="4"
                            BadgeGlyph="\uE768"
                            Initials="SJ"
                            DisplayName="Super Jaimie" />
                    </ListViewItem>
                    <ListViewItem>
                        <controls:PersonPicture
                            x:Name="PersonPicture4"
                            AutomationProperties.Name="PersonPicture4"
                            BadgeNumber="5"
                            BadgeGlyph="\uE769"
                            Initials="BB"
                            DisplayName="Bruce Banner" />
                    </ListViewItem>
                    <ListViewItem>
                        <controls:PersonPicture
                            x:Name="PersonPicture5"
                            AutomationProperties.Name="PersonPicture5"
                            BadgeNumber="6"
                            BadgeGlyph="\uE770"
                            Initials="BW"
                            DisplayName="Bruce Wayne" />
                    </ListViewItem>
                </ListView>

                <ListView
                    x:Name="PeopleGLV"
                    AutomationProperties.Name="PeopleGLV"
                    Height="250"
                    Margin="10"
                    ItemsSource="{Binding Source={StaticResource cvs}}">
                    <ListView.ItemTemplate>
                        <DataTemplate>
                            <controls:PersonPicture
                                BadgeNumber="{Binding BadgeNumber}"
                                Initials="{Binding Initials}"
                                DisplayName="{Binding DisplayName}" />
                        </DataTemplate>
                    </ListView.ItemTemplate>
                    <ListView.GroupStyle>
                        <GroupStyle>
                            <GroupStyle.HeaderTemplate>
                                <DataTemplate>
                                    <TextBlock Text="{Binding Name}" />
                                </DataTemplate>
                            </GroupStyle.HeaderTemplate>
                        </GroupStyle>
                    </ListView.GroupStyle>
                </ListView>
            </StackPanel>
            <TextBlock
                Text="Properties"
                Style="{DynamicResource StandardGroupHeader}" />
            <CheckBox
                x:Name="BgEllipseFilled"
                AutomationProperties.Name="BgEllipseFilled"
                Content="Control is showing an image"
                IsEnabled="False"
                IsChecked="False" />
        </StackPanel>
    </Grid>
</local:TestPage>
