<!-- Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT License. See LICENSE in the project root for license information. -->
<ui:Page
    x:Class="MUXControlsTestApp.Samples.Selection.GroupedSample"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:ui="http://schemas.modernwpf.com/2019"
    xmlns:controls="clr-namespace:ModernWpf.Controls;assembly=ModernWpf.Controls"
    xmlns:local="clr-namespace:MUXControlsTestApp.Samples.Selection">

    <Page.Resources>
        <controls:RecyclePool x:Key="RecyclePool" />
        <controls:SelectionModel x:Key="selectionModel" />
        <local:BoolToBrushConverter x:Key="boolToBrushConterter" />
        <local:BoolToVisibilityConverter x:Key="boolToVisibilityConterter" />
        <controls:FlowLayout x:Key="flowLayout" />
        <controls:RecyclingElementFactory
            x:Key="SharedElementFactory"
            SelectTemplateKey="OnSelectTemplateKey">
            <controls:RecyclingElementFactory.RecyclePool>
                <controls:RecyclePool />
            </controls:RecyclingElementFactory.RecyclePool>
            <controls:RecyclingElementFactory.Templates>
                <DataTemplate x:Key="RepeaterGroupTemplate">
                    <StackPanel>
                        <ui:ListViewHeaderItem
                            x:Name="groupHeader"
                            Content="{Binding}" />
                        <controls:ItemsRepeater
                            x:Name="groupRepeater"
                            Layout="{StaticResource flowLayout}"
                            ItemTemplate="{DynamicResource SharedElementFactory}"
                            ElementPrepared="groupRepeater_ElementPrepared"
                            ElementIndexChanged="groupRepeater_ElementIndexChanged"
                            ItemsSource="{Binding}" />
                    </StackPanel>
                </DataTemplate>
                <DataTemplate x:Key="RepeaterItemTemplate">
                    <local:GroupedRepeaterItem
                        x:Name="templateRoot"
                        SelectionModel="{StaticResource selectionModel}">
                        <Border
                            Background="{Binding ElementName=templateRoot, Path=IsSelected, Converter={StaticResource boolToBrushConterter}}"
                            HorizontalAlignment="Stretch"
                            Width="100"
                            Height="100"
                            BorderThickness="1"
                            BorderBrush="LightGray">
                            <Grid>
                                <ui:SymbolIcon
                                    Symbol="Accept"
                                    Visibility="{Binding ElementName=templateRoot, Path=IsSelected, Converter={StaticResource boolToVisibilityConterter}}"
                                    HorizontalAlignment="Right"
                                    VerticalAlignment="Top"
                                    Width="20"
                                    Height="20"
                                    Margin="5" />
                                <TextBlock
                                    Text="{Binding}"
                                    HorizontalAlignment="Center"
                                    VerticalAlignment="Center" />
                            </Grid>
                        </Border>
                    </local:GroupedRepeaterItem>
                </DataTemplate>
            </controls:RecyclingElementFactory.Templates>
        </controls:RecyclingElementFactory>
    </Page.Resources>

    <Grid Background="{DynamicResource SystemControlPageBackgroundAltHighBrush}">
        <Grid.RowDefinitions>
            <RowDefinition Height="auto" />
            <RowDefinition Height="auto" />
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>

        <StackPanel Orientation="Horizontal">
            <ToggleButton
                x:Name="multipleSelection"
                IsChecked="False"
                Checked="OnMultipleSelectionClicked"
                Unchecked="OnMultipleSelectionClicked">
                Multiple
            </ToggleButton>
            <Button
                Content="Back"
                Click="OnBackClicked" />
            <Button
                Content="TreeView"
                Click="OnTreeViewClicked" />
        </StackPanel>

        <!-- Details view for selected item -->
        <StackPanel
            Grid.Row="1"
            Orientation="Horizontal">
            <TextBlock Text="SelectedItem:" />
            <!--<TextBlock Text="{Binding ElementName=selectionModel, Path=SelectedItem}"  Margin="0,0,10,0"/>-->
            <TextBlock Text="{Binding SelectedItem, Source={StaticResource selectionModel}, Mode=OneWay}" />
        </StackPanel>

        <controls:ItemsRepeaterScrollHost Grid.Row="2">
            <ScrollViewer>
                <local:SelectionContainer SelectionModel="{StaticResource selectionModel}">
                    <controls:ItemsRepeater
                        x:Name="repeater"
                        Layout="{StaticResource flowLayout}"
                        ItemTemplate="{StaticResource SharedElementFactory}" />
                </local:SelectionContainer>
            </ScrollViewer>
        </controls:ItemsRepeaterScrollHost>
    </Grid>
</ui:Page>
