<!--
    Copyright (c) Microsoft Corporation. All rights reserved. Licensed under
    the MIT License. See LICENSE in the project root for license information.
-->
<UserControl x:Class="TerminalApp.SnippetsPaneContent"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:SettingsModel="using:Microsoft.Terminal.Settings.Model"
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             xmlns:local="using:TerminalApp"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             xmlns:model="using:Microsoft.Terminal.Settings.Model"
             xmlns:mtu="using:Microsoft.Terminal.UI"
             xmlns:mux="using:Microsoft.UI.Xaml.Controls"
             AutomationProperties.LocalizedControlType="pane"
             mc:Ignorable="d">

    <UserControl.Resources>
        <ResourceDictionary>

            <Style x:Key="PlayButtonTemplate"
                   TargetType="Button">
                <Setter Property="Margin" Value="0" />
                <Setter Property="Padding" Value="4" />
                <Setter Property="BorderBrush" Value="Transparent" />
                <Setter Property="Background" Value="Transparent" />

                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="Button">
                            <Border x:Name="ButtonBaseElement"
                                    Padding="{TemplateBinding Padding}"
                                    AutomationProperties.AccessibilityView="Raw"
                                    Background="{TemplateBinding Background}"
                                    BackgroundSizing="{TemplateBinding BackgroundSizing}"
                                    BorderBrush="{TemplateBinding BorderBrush}"
                                    BorderThickness="{TemplateBinding BorderThickness}"
                                    CornerRadius="{TemplateBinding CornerRadius}">
                                <Viewbox Width="14"
                                         Height="14">
                                    <Grid>
                                        <FontIcon x:Name="ButtonBackgroundIcon"
                                                  FontFamily="{ThemeResource SymbolThemeFontFamily}"
                                                  Foreground="{ThemeResource PlayButtonHoveredColor}"
                                                  Glyph="&#xF5b0;"
                                                  Visibility="Collapsed" />
                                        <FontIcon x:Name="ButtonOutlineIcon"
                                                  FontFamily="{ThemeResource SymbolThemeFontFamily}"
                                                  Foreground="{ThemeResource PlayButtonNormalColor}"
                                                  Glyph="&#xE768;" />
                                    </Grid>
                                </Viewbox>

                                <VisualStateManager.VisualStateGroups>
                                    <VisualStateGroup x:Name="CommonStates">

                                        <VisualState x:Name="Normal">
                                            <VisualState.Setters>
                                                <Setter Target="ButtonBackgroundIcon.Visibility" Value="Collapsed" />
                                            </VisualState.Setters>
                                        </VisualState>

                                        <VisualState x:Name="PointerOver">
                                            <VisualState.Setters>
                                                <Setter Target="ButtonBackgroundIcon.Visibility" Value="Visible" />
                                            </VisualState.Setters>
                                        </VisualState>

                                        <VisualState x:Name="Disabled" />
                                    </VisualStateGroup>

                                    <VisualStateGroup x:Name="PlayButtonStates">
                                        <VisualState x:Name="Ready">
                                            <VisualState.Setters>
                                                <Setter Target="ButtonBackgroundIcon.Glyph" Value="&#xF5b0;" />
                                                <Setter Target="ButtonOutlineIcon.Glyph" Value="&#xE768;" />
                                                <Setter Target="StatusProgress.IsActive" Value="False" />
                                            </VisualState.Setters>
                                        </VisualState>
                                    </VisualStateGroup>

                                </VisualStateManager.VisualStateGroups>
                            </Border>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>

            </Style>

            <DataTemplate x:Key="TaskItemTemplate"
                          x:DataType="local:FilteredTask">
                <mux:TreeViewItem x:Name="rootItem"
                                  AutomationProperties.HelpText="{x:Bind Input, Mode=OneWay}"
                                  AutomationProperties.Name="{x:Bind FilteredCommand.Item.Name, Mode=OneWay}"
                                  ItemsSource="{x:Bind Children, Mode=OneWay}"
                                  KeyUp="_treeItemKeyUpHandler"
                                  Visibility="{x:Bind Visibility, Mode=OneWay}">
                    <Grid AutomationProperties.AccessibilityView="Raw">
                        <Grid.RowDefinitions>
                            <RowDefinition Height="*" />
                            <!--  Name  -->
                            <RowDefinition Height="*" />
                            <!--  Input  -->
                            <RowDefinition Height="0" />
                            <!--  Input gets put here when we're a nested command, to hide it  -->
                        </Grid.RowDefinitions>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="Auto" />
                            <ColumnDefinition Width="*" />
                        </Grid.ColumnDefinitions>


                        <Button x:Uid="SnippetPlayButton"
                                Grid.Row="0"
                                Grid.RowSpan="1"
                                Grid.Column="0"
                                Margin="-28,0,0,0"
                                Padding="3"
                                VerticalAlignment="Bottom"
                                Background="Transparent"
                                BorderBrush="Transparent"
                                Click="_runCommandButtonClicked"
                                Style="{StaticResource PlayButtonTemplate}"
                                Visibility="{x:Bind mtu:Converters.InvertedBooleanToVisibility(HasChildren), Mode=OneWay}">

                            <Button.Content>
                                <FontIcon FontFamily="{ThemeResource SymbolThemeFontFamily}"
                                          FontSize="12"
                                          Glyph="&#xE768;" />
                                <!--
                                    xE768 is Play, which is just an outline.
                                    xF5B0 is PlaySolid, also a good option. Seemed
                                    better to have a lightweight outline though
                                -->
                            </Button.Content>

                            <Button.Resources>
                                <ResourceDictionary>
                                    <ResourceDictionary.ThemeDictionaries>
                                        <ResourceDictionary x:Key="Light">
                                            <SolidColorBrush x:Key="ButtonForegroundPointerOver"
                                                             Color="{StaticResource SystemAccentColor}" />
                                            <SolidColorBrush x:Key="ButtonForegroundPressed"
                                                             Color="{StaticResource SystemAccentColor}" />
                                        </ResourceDictionary>
                                        <ResourceDictionary x:Key="Dark">
                                            <SolidColorBrush x:Key="ButtonForegroundPointerOver"
                                                             Color="{StaticResource SystemAccentColor}" />
                                            <SolidColorBrush x:Key="ButtonForegroundPressed"
                                                             Color="{StaticResource SystemAccentColor}" />
                                        </ResourceDictionary>
                                        <ResourceDictionary x:Key="HighContrast">
                                            <SolidColorBrush x:Key="ButtonBackground"
                                                             Color="{ThemeResource SystemColorButtonFaceColor}" />
                                            <SolidColorBrush x:Key="ButtonBackgroundPointerOver"
                                                             Color="{ThemeResource SystemColorHighlightColor}" />
                                            <SolidColorBrush x:Key="ButtonBackgroundPressed"
                                                             Color="{ThemeResource SystemColorHighlightColor}" />
                                            <SolidColorBrush x:Key="ButtonForeground"
                                                             Color="{ThemeResource SystemColorButtonTextColor}" />
                                            <SolidColorBrush x:Key="ButtonForegroundPointerOver"
                                                             Color="{ThemeResource SystemColorHighlightTextColor}" />
                                            <SolidColorBrush x:Key="ButtonForegroundPressed"
                                                             Color="{ThemeResource SystemColorHighlightTextColor}" />
                                        </ResourceDictionary>
                                    </ResourceDictionary.ThemeDictionaries>
                                </ResourceDictionary>
                            </Button.Resources>
                        </Button>

                        <local:HighlightedTextControl Grid.Column="1"
                                                      HorizontalAlignment="Left"
                                                      HighlightedRuns="{x:Bind FilteredCommand.NameHighlights, Mode=OneWay}"
                                                      IsTabStop="False"
                                                      Text="{x:Bind FilteredCommand.Item.Name, Mode=OneWay}" />

                        <!--
                            BODGY: I can't choose different templates if this item is nested or not.
                            (See https://github.com/microsoft/microsoft-ui-xaml/issues/2121)
                            But what I can do, is toss the text into a 0-height row to hide it.
                        -->
                        <TextBlock Grid.Row="{x:Bind Row, Mode=OneWay}"
                                   Grid.Column="1"
                                   Margin="12,0,12,6"
                                   FontFamily="Cascadia Mono, Consolas"
                                   Style="{ThemeResource BodyTextBlockStyle}"
                                   Text="{x:Bind Input}"
                                   Visibility="{Binding ElementName=rootItem, Path=IsSelected}" />
                    </Grid>
                </mux:TreeViewItem>
            </DataTemplate>

            <ResourceDictionary.ThemeDictionaries>
                <!--  same as in MainPage, this is SolidBackgroundFillColorTertiary  -->
                <ResourceDictionary x:Key="Dark">
                    <Color x:Key="PageBackground">#282828</Color>
                    <Color x:Key="PlayButtonHoveredColor">#90ef90</Color>
                    <Color x:Key="PlayButtonNormalColor">#8888</Color>
                </ResourceDictionary>
                <ResourceDictionary x:Key="Light">
                    <Color x:Key="PageBackground">#F9F9F9</Color>
                    <Color x:Key="PlayButtonHoveredColor">#257f01</Color>
                    <Color x:Key="PlayButtonNormalColor">#88222222</Color>
                </ResourceDictionary>
                <ResourceDictionary x:Key="HighContrast">
                    <!--  Define resources for HighContrast mode here  -->
                    <StaticResource x:Key="PageBackground"
                                    ResourceKey="SystemColorWindowColorBrush" />
                    <StaticResource x:Key="PlayButtonHoveredColor"
                                    ResourceKey="SystemColorHighlightColor" />
                    <StaticResource x:Key="PlayButtonNormalColor"
                                    ResourceKey="SystemColorHighlightColor" />
                </ResourceDictionary>

            </ResourceDictionary.ThemeDictionaries>

        </ResourceDictionary>
    </UserControl.Resources>

    <!--  Don't allow the user to focus the root pane, but do allow individual controls to be focused  -->
    <!--  TabFocusNavigation="Cycle" is load-bearing: otherwise, tab focus disappears to nowhere off the play button  -->
    <Grid AllowFocusOnInteraction="False"
          AutomationProperties.AccessibilityView="Raw"
          Background="{ThemeResource PageBackground}"
          TabFocusNavigation="Cycle">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
            <RowDefinition Height="Auto" />
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>

        <Grid Grid.Row="0"
              Margin="4"
              HorizontalAlignment="Stretch">
            <TextBlock x:Name="_title"
                       x:Uid="SnippetPaneTitle"
                       HorizontalAlignment="Left"
                       FontSize="24" />
            <Button x:Uid="CloseSnippetsPaneButton"
                    HorizontalAlignment="Right"
                    Click="_closePaneClick">

                <Button.Content>
                    <FontIcon FontFamily="{ThemeResource SymbolThemeFontFamily}"
                              FontSize="12"
                              Glyph="&#xE8BB;" />
                </Button.Content>
            </Button>
        </Grid>

        <TextBlock Grid.Row="1"
                   Margin="8,16,8,8"
                   TextWrapping="WrapWholeWords"
                   Visibility="{x:Bind mtu:Converters.InvertedBooleanToVisibility(HasSnippets), Mode=OneWay}">
            <Run x:Uid="SnippetsPaneNoneFoundHeader" />
            <LineBreak />
            <Run x:Uid="SnippetsPaneNoneFoundDetails" />
        </TextBlock>

        <TextBox x:Name="_filterBox"
                 x:Uid="SnippetsFilterBox"
                 Grid.Row="1"
                 Margin="8,0,8,8"
                 AllowFocusOnInteraction="True"
                 TextChanged="_filterTextChanged"
                 Visibility="{x:Bind HasSnippets, Mode=OneWay}">
            <TextBox.ContextFlyout>
                <mtu:TextMenuFlyout />
            </TextBox.ContextFlyout>
        </TextBox>

        <mux:TreeView x:Name="_treeView"
                      Grid.Row="2"
                      AllowFocusOnInteraction="True"
                      CanDragItems="False"
                      CanReorderItems="False"
                      ItemInvoked="_treeItemInvokedHandler"
                      ItemTemplate="{StaticResource TaskItemTemplate}"
                      Visibility="{x:Bind HasSnippets, Mode=OneWay}" />
    </Grid>

</UserControl>
