<ui:Page
    x:Class="ModernWpf.SampleApp.ControlPages.CommandBarPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:ui="http://schemas.modernwpf.com/2019"
    xmlns:sc="clr-namespace:SamplesCommon;assembly=SamplesCommon"
    mc:Ignorable="d">

    <ScrollViewer>
        <ui:SimpleStackPanel Style="{StaticResource ControlPageContentPanelStyle}">
            <sc:ControlExample HeaderText="A command bar with labels on the side free floating in a page">
                <StackPanel>
                    <ui:CommandBar x:Name="PrimaryCommandBar">
                        <ui:AppBarButton x:Name="addButton" Icon="Add" Label="Add" Click="OnElementClicked" />
                        <ui:AppBarButton x:Name="editButton" Icon="Edit" Label="Edit" Click="OnElementClicked" />
                        <ui:AppBarButton x:Name="shareButton" Icon="Share" Label="Share" Click="OnElementClicked" />
                        <ui:CommandBar.SecondaryCommands>
                            <ui:AppBarButton x:Name="settingsButton" Icon="Setting" Label="Settings" Click="OnElementClicked" />
                        </ui:CommandBar.SecondaryCommands>
                    </ui:CommandBar>
                    <TextBlock
                        x:Name="SelectedOptionText"
                        Padding="0,8,0,0" />
                </StackPanel>
                <sc:ControlExample.Options>
                    <ui:SimpleStackPanel Style="{StaticResource OptionsPanelStyle}">
                        <TextBlock Text="Modify content" />
                        <Button
                            Content="Add secondary commands"
                            Click="AddSecondaryCommands_Click" />
                        <Button
                            Content="Remove secondary commands"
                            Click="RemoveSecondaryCommands_Click" />
                        <CheckBox
                            Content="IsDynamicOverflowEnabled"
                            IsChecked="{Binding ElementName=PrimaryCommandBar, Path=IsDynamicOverflowEnabled}" />
                        <ComboBox
                            ui:ControlHelper.Header="DefaultLabelPosition"
                            ItemsSource="{Binding Source={x:Type ui:CommandBarDefaultLabelPosition}, Converter={StaticResource EnumValuesConverter}}"
                            SelectedItem="{Binding ElementName=PrimaryCommandBar, Path=DefaultLabelPosition}" />
                        <ComboBox
                            ui:ControlHelper.Header="OverflowButtonVisibility"
                            ItemsSource="{Binding Source={x:Type ui:CommandBarOverflowButtonVisibility}, Converter={StaticResource EnumValuesConverter}}"
                            SelectedItem="{Binding ElementName=PrimaryCommandBar, Path=OverflowButtonVisibility}" />
                    </ui:SimpleStackPanel>
                </sc:ControlExample.Options>
            </sc:ControlExample>

            <sc:ControlExample HeaderText="A command bar with labels on the bottom">
                <ui:CommandBar DefaultLabelPosition="Bottom">
                    <ui:AppBarToggleButton Icon="Shuffle" Label="Shuffle" />
                    <ui:AppBarToggleButton Icon="RepeatAll" Label="Repeat" />
                    <ui:AppBarSeparator />
                    <ui:AppBarButton Icon="Back" Label="Back" />
                    <ui:AppBarButton Icon="Stop" Label="Stop" />
                    <ui:AppBarButton Icon="Play" Label="Play" />
                    <ui:AppBarButton Icon="Forward" Label="Forward" />

                    <ui:CommandBar.SecondaryCommands>
                        <ui:AppBarButton Label="Like" />
                        <ui:AppBarButton Label="Dislike" />
                    </ui:CommandBar.SecondaryCommands>

                    <ui:CommandBar.Content>
                        <TextBlock
                            Text="Now playing..."
                            Margin="12,14" />
                    </ui:CommandBar.Content>
                </ui:CommandBar>
            </sc:ControlExample>
        </ui:SimpleStackPanel>
    </ScrollViewer>
</ui:Page>
