<dialogs:PixiEditorPopup x:Class="PixiEditor.AvaloniaUI.Views.Windows.HelloTherePopup"
        x:ClassModifier="internal"
        xmlns="https://github.com/avaloniaui"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:ui="clr-namespace:PixiEditor.Extensions.UI;assembly=PixiEditor.Extensions"
        xmlns:system="clr-namespace:System;assembly=System.Runtime"
        xmlns:converters="clr-namespace:PixiEditor.AvaloniaUI.Helpers.Converters"
        xmlns:dataHolders="clr-namespace:PixiEditor.AvaloniaUI.Models.UserData"
        xmlns:panels="clr-namespace:PixiEditor.AvaloniaUI.Views.Panels"
        xmlns:xaml="clr-namespace:PixiEditor.AvaloniaUI.Models.Commands.XAML"
        xmlns:indicators1="clr-namespace:PixiEditor.AvaloniaUI.Views.Indicators"
        xmlns:newsFeed1="clr-namespace:PixiEditor.AvaloniaUI.Views.NewsFeed"
        xmlns:dialogs="clr-namespace:PixiEditor.AvaloniaUI.Views.Dialogs"
        xmlns:visuals="clr-namespace:PixiEditor.AvaloniaUI.Views.Visuals"
        xmlns:skiaSharp="clr-namespace:SkiaSharp;assembly=SkiaSharp"
        xmlns:ui1="clr-namespace:PixiEditor.AvaloniaUI.Helpers.UI"
        mc:Ignorable="d"
        Title="Hello there!" Height="662" Width="982" MinHeight="500" MinWidth="500"
        Loaded="HelloTherePopup_OnLoaded">

    <Window.Styles>
        <Style Selector="TextBlock">
            <Setter Property="Foreground" Value="White"/>
            <Setter Property="FontSize" Value="16"/>
        </Style>
    </Window.Styles>

    <DockPanel>
        <Grid Background="{DynamicResource ThemeBackgroundBrush}" x:Name="grid">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*"/>
                <ColumnDefinition Width="300"/>
            </Grid.ColumnDefinitions>

            <ScrollViewer Grid.Column="0"  VerticalScrollBarVisibility="Auto" Margin="3,0">
                <Grid Grid.Row="1" Margin="0,30,0,0">
                    <Grid.RowDefinitions>
                        <RowDefinition Height="90"/>
                        <RowDefinition Height="Auto"/>
                        <RowDefinition MinHeight="120"/>
                        <RowDefinition Height="Auto"/>
                    </Grid.RowDefinitions>

                    <Grid Grid.RowSpan="3" HorizontalAlignment="Right" VerticalAlignment="Center">
                        <CheckBox IsVisible="{Binding !NewsDisabled}"
                                  Width="40" Height="40" IsChecked="{Binding NewsPanelCollapsed}">
                        <CheckBox.Template>
                            <ControlTemplate TargetType="{x:Type CheckBox}">
                                <StackPanel Orientation="Horizontal" Focusable="False">
                                    <StackPanel.Background>
                                        <VisualBrush>
                                            <VisualBrush.Visual>
                                                <Ellipse Fill="{DynamicResource ThemeBackgroundBrush}" Width="20" Height="20"/>
                                            </VisualBrush.Visual>
                                        </VisualBrush>
                                    </StackPanel.Background>
                                    <Image Focusable="False" Cursor="Hand" x:Name="checkboxImage" Source="/Images/Chevron-right.png">
                                        <Image.RenderTransform>
                                            <RotateTransform Angle="180" CenterX="19" CenterY="20"/>
                                        </Image.RenderTransform>
                                    </Image>
                                    <ContentPresenter Focusable="False"/>
                                </StackPanel>

                                <!--<ControlTemplate.Triggers>
                                    <Trigger Property="IsChecked" Value="True">
                                        <Setter TargetName="checkboxImage" Property="RenderTransform">
                                            <Setter.Value>
                                                <RotateTransform Angle="0" CenterX="1" CenterY="0"/>
                                            </Setter.Value>
                                        </Setter>
                                    </Trigger>
                                </ControlTemplate.Triggers>-->
                            </ControlTemplate>
                        </CheckBox.Template>
                    </CheckBox>
                    </Grid>
                    <StackPanel Grid.Row="0" HorizontalAlignment="Center">
                        <Svg Path="/Images/PixiEditorLogoWithName.svg" Height="60" VerticalAlignment="Top"/>
                        <TextBlock HorizontalAlignment="Center" FontSize="20" FontWeight="Medium" Text="{Binding VersionText}"/>
                    </StackPanel>

                    <StackPanel Grid.Row="1" Orientation="Horizontal" HorizontalAlignment="Center">
                        <Button  Command="{Binding OpenFileCommand}" MinWidth="150" Margin="10"
                                ui:Translator.Key="OPEN_FILE"/>
                        <Button Command="{Binding OpenNewFileCommand}" MinWidth="150" Margin="10"
                                ui:Translator.Key="NEW_FILE"/>
                    </StackPanel>

                    <StackPanel Grid.Row="2" HorizontalAlignment="Center" Margin="0,30,0,0">
                        <TextBlock FontSize="23" FontWeight="SemiBold" HorizontalAlignment="Center"
                                   ui:Translator.Key="RECENT_FILES"/>
                        <TextBlock Margin="0,12.5,0,0" Foreground="LightGray" HorizontalAlignment="Center" 
                                   ui:Translator.Key="RECENT_EMPTY_TEXT">
                            <TextBlock.IsVisible>
                                <Binding Path="RecentlyOpened.Count"
                                         Converter="{converters:EqualityBoolToIsVisibleConverter}">
                                    <Binding.ConverterParameter>
                                        <system:Int32>0</system:Int32>
                                    </Binding.ConverterParameter>
                                </Binding>
                            </TextBlock.IsVisible>
                        </TextBlock>
                        <ItemsControl ItemsSource="{Binding RecentlyOpened}">
                            <ItemsControl.ItemTemplate>
                                <DataTemplate DataType="{x:Type dataHolders:RecentlyOpenedDocument}">
                                    <Grid>
                                        <StackPanel Margin="8,5,8,0">
                                            <Button Margin="0,10,0,0" HorizontalAlignment="Center"
                                                    Width="100" Height="100"
                                                    Padding="0"
                                                    Command="{Binding DataContext.OpenRecentCommand, RelativeSource={RelativeSource AncestorType=panels:AlignableWrapPanel}}"
                                                    CommandParameter="{Binding FilePath}"
                                                    x:Name="fileButton">
                                                <Grid Width="100" Height="100">
                                                    <visuals:SurfaceControl
                                                        Surface="{Binding PreviewBitmap}"
                                                        Margin="10"
                                                        Stretch="Uniform"
                                                        x:Name="image">
                                                        <ui:RenderOptionsBindable.BitmapInterpolationMode>
                                                            <MultiBinding Converter="{converters:WidthToBitmapScalingModeConverter}">
                                                                <Binding Path="PreviewBitmap.Size.X"/>
                                                                <Binding ElementName="image" Path="Width"/>
                                                            </MultiBinding>
                                                        </ui:RenderOptionsBindable.BitmapInterpolationMode>
                                                    </visuals:SurfaceControl>
                                                    <Border Grid.Row="1" Height="8" Width="8" x:Name="extensionBorder" Margin="5"
                                                            Background="{Binding FileExtension, Converter={converters:FileExtensionToColorConverter}}" 
                                                            VerticalAlignment="Bottom" HorizontalAlignment="Right">
                                                        <!--<Border.Style>
                                                            <Style TargetType="Border">
                                                                <Style.Triggers>
                                                                    <Trigger Property="IsMouseOver" Value="False">
                                                                        <Setter Property="CornerRadius" Value="2"/>
                                                                    </Trigger>
                                                                    <DataTrigger Binding="{Binding IsMouseOver, ElementName=fileButton}" Value="True">
                                                                        <DataTrigger.EnterActions>
                                                                            <BeginStoryboard Name="open">
                                                                                <Storyboard BeginTime="0:0:.1">
                                                                                    <DoubleAnimation Storyboard.TargetProperty="Height" By="8" To="70" BeginTime="0:0:.1" Duration="0:0:.3">
                                                                                        <DoubleAnimation.EasingFunction>
                                                                                            <ExponentialEase/>
                                                                                        </DoubleAnimation.EasingFunction>
                                                                                    </DoubleAnimation>
                                                                                    <DoubleAnimation Storyboard.TargetProperty="Width" By="8" To="100" Duration="0:0:.1">
                                                                                        <DoubleAnimation.EasingFunction>
                                                                                            <ExponentialEase/>
                                                                                        </DoubleAnimation.EasingFunction>
                                                                                    </DoubleAnimation>
                                                                                    <ThicknessAnimation Storyboard.TargetProperty="Margin" By="5" To="0" BeginTime="0:0:.1" Duration="0:0:.25">
                                                                                        <ThicknessAnimation.EasingFunction>
                                                                                            <ExponentialEase/>
                                                                                        </ThicknessAnimation.EasingFunction>
                                                                                    </ThicknessAnimation>
                                                                                </Storyboard>
                                                                            </BeginStoryboard>
                                                                        </DataTrigger.EnterActions>
                                                                        <DataTrigger.ExitActions>
                                                                            <BeginStoryboard Name="close">
                                                                                <Storyboard>
                                                                                    <DoubleAnimation Storyboard.TargetProperty="Height" By="70" To="8"  Duration="0:0:.2">
                                                                                        <DoubleAnimation.EasingFunction>
                                                                                            <ExponentialEase/>
                                                                                        </DoubleAnimation.EasingFunction>
                                                                                    </DoubleAnimation>
                                                                                    <DoubleAnimation Storyboard.TargetProperty="Width" By="100" To="8" BeginTime="0:0:.2" Duration="0:0:.1">
                                                                                        <DoubleAnimation.EasingFunction>
                                                                                            <ExponentialEase/>
                                                                                        </DoubleAnimation.EasingFunction>
                                                                                    </DoubleAnimation>
                                                                                    <ThicknessAnimation Storyboard.TargetProperty="Margin" By="0" To="5" Duration="0:0:.1">
                                                                                        <ThicknessAnimation.EasingFunction>
                                                                                            <ExponentialEase/>
                                                                                        </ThicknessAnimation.EasingFunction>
                                                                                    </ThicknessAnimation>
                                                                                </Storyboard>
                                                                            </BeginStoryboard>
                                                                        </DataTrigger.ExitActions>
                                                                        <Setter Property="CornerRadius" Value="0,0,4,4"/>
                                                                    </DataTrigger>
                                                                </Style.Triggers>
                                                            </Style>
                                                        </Border.Style>-->
                                                        <Grid HorizontalAlignment="Center" Margin="0,10,0,0" Opacity="0">
                                                            <!--<Grid.Style>
                                                                <Style TargetType="Grid">
                                                                    <Style.Triggers>
                                                                        <DataTrigger Binding="{Binding IsMouseOver, ElementName=fileButton}" Value="True">
                                                                            <DataTrigger.EnterActions>
                                                                                <BeginStoryboard Name="start">
                                                                                    <Storyboard BeginTime="0:0:.2">
                                                                                        <DoubleAnimation Storyboard.TargetProperty="Opacity" By="0" To="1" Duration="0:0:.4">
                                                                                            <DoubleAnimation.EasingFunction>
                                                                                                <PowerEase/>
                                                                                            </DoubleAnimation.EasingFunction>
                                                                                        </DoubleAnimation>
                                                                                    </Storyboard>
                                                                                </BeginStoryboard>
                                                                            </DataTrigger.EnterActions>
                                                                            <DataTrigger.ExitActions>
                                                                                <RemoveStoryboard BeginStoryboardName="start"/>
                                                                            </DataTrigger.ExitActions>
                                                                        </DataTrigger>
                                                                    </Style.Triggers>
                                                                </Style>
                                                            </Grid.Style>-->
                                                            <TextBlock x:Name="extension" VerticalAlignment="Top" Text="{Binding FileExtension}" FontSize="15" TextAlignment="Center"/>
                                                            <StackPanel Orientation="Horizontal" VerticalAlignment="Bottom" HorizontalAlignment="Center">
                                                                <StackPanel.Styles>
                                                                    <Style Selector="Button">
                                                                        <Setter Property="Margin" Value="0,0,0,5"/>
                                                                        <Setter Property="Width" Value="25"/>
                                                                        <Setter Property="Height" Value="25"/>
                                                                        <Setter Property="MinWidth" Value="25"/>
                                                                        <Setter Property="MinHeight" Value="25"/>
                                                                        <Setter Property="Background" Value="Transparent"/>
                                                                        </Style>
                                                                      <Style Selector="Button:hover">
                                                                          <Setter Property="Background" Value="#70FFFFFF"/>
                                                                      </Style>
                                                                </StackPanel.Styles>
                                                                <Button Command="{Binding DataContext.OpenInExplorerCommand, RelativeSource={RelativeSource AncestorType=panels:AlignableWrapPanel}}"
                                                                        CommandParameter="{Binding FilePath}"
                                                                        ToolTip.Tip="Open in File Explorer">
                                                                    <TextBlock Text="&#xEC50;" FontFamily="Segoe MDL2 Assets"
                                                                               TextAlignment="Center" FontSize="18"/>
                                                                </Button>
                                                                <Button Command="{xaml:Command Name=PixiEditor.File.RemoveRecent, UseProvided=True}"
                                                                        CommandParameter="{Binding FilePath}"
                                                                        ToolTip.Tip="Remove from list">
                                                                    <TextBlock Text="" FontFamily="{DynamicResource Feather}"
                                                                               TextAlignment="Center" FontSize="20"/>
                                                                </Button>
                                                            </StackPanel>
                                                        </Grid>
                                                    </Border>
                                                </Grid>
                                            </Button>

                                            <TextBlock Text="{Binding FileName}" ToolTip.Tip="{Binding FilePath}"
                                                       Width="110" TextAlignment="Center" TextTrimming="CharacterEllipsis"
                                                       FontSize="18" Margin="10,10,10,2" HorizontalAlignment="Center" />
                                        </StackPanel>
                                    </Grid>
                                </DataTemplate>
                            </ItemsControl.ItemTemplate>
                            <ItemsControl.ItemsPanel>
                                <ItemsPanelTemplate>
                                    <panels:AlignableWrapPanel HorizontalAlignment="Center" HorizontalContentAlignment="Center"/>
                                </ItemsPanelTemplate>
                            </ItemsControl.ItemsPanel>
                        </ItemsControl>
                    </StackPanel>

                    <panels:AlignableWrapPanel Grid.Row="3" HorizontalContentAlignment="Center" HorizontalAlignment="Center" Margin="0,5,0,15">
                        <Button Command="{xaml:Command PixiEditor.Links.OpenHyperlink, UseProvided=True}" CommandParameter="https://pixieditor.net"
                                ui:Translator.TooltipKey="WEBSITE"
                                Classes="SocialMediaButton" Tag="#e3002d"
                                Content="/Images/SocialMedia/WebsiteIcon.png"/>
                        <Button Command="{xaml:Command PixiEditor.Links.OpenHyperlink, UseProvided=True}" CommandParameter="https://discord.gg/tzkQFDkqQS"
                                Classes="SocialMediaButton" Tag="#5865F2" ui:Translator.TooltipKey="DISCORD"
                                Content="/Images/SocialMedia/DiscordIcon.png"/>
                        <Button Command="{xaml:Command PixiEditor.Links.OpenHyperlink, UseProvided=True}" CommandParameter="https://reddit.com/r/PixiEditor"
                                Classes="SocialMediaButton" Tag="#FF4500" ui:Translator.TooltipKey="REDDIT"
                                Content="/Images/SocialMedia/RedditIcon.png"/>
                        <Button Command="{xaml:Command PixiEditor.Links.OpenHyperlink, UseProvided=True}" CommandParameter="https://store.steampowered.com/app/2218560"
                                Classes="SocialMediaButton" Tag="#00adee" ui:Translator.TooltipKey="STEAM"
                                Content="/Images/SocialMedia/SteamIcon.png"/>
                        <Button Command="{xaml:Command PixiEditor.Links.OpenHyperlink, UseProvided=True}" CommandParameter="https://github.com/PixiEditor/PixiEditor"
                                Classes="SocialMediaButton" Tag="Black" ui:Translator.TooltipKey="GITHUB"
                                Content="/Images/SocialMedia/GitHubIcon.png"/>
                        <Button Command="{xaml:Command PixiEditor.Links.OpenHyperlink, UseProvided=True}" CommandParameter="https://www.youtube.com/channel/UCT5XvyvX1q5PAIaXfWmpsMQ"
                                Classes="SocialMediaButton" Tag="#FF0000" ui:Translator.TooltipKey="YOUTUBE"
                                Content="/Images/SocialMedia/YouTubeIcon.png"/>
                        <Button Command="{xaml:Command PixiEditor.Links.OpenHyperlink, UseProvided=True}"
                                IsVisible="{Binding ShowDonateButton}"
                                CommandParameter="https://opencollective.com/pixieditor"
                                Classes="SocialMediaButton" Tag="#d4af37" ui:Translator.TooltipKey="DONATE"
                                Content="/Images/SocialMedia/DonateIcon.png"/>
                        <Button Command="{xaml:Command PixiEditor.Links.OpenHyperlink, UseProvided=True}"
                                IsVisible="{Binding !ShowDonateButton}"
                                CommandParameter="https://store.steampowered.com/app/2435860/PixiEditor__Supporter_Pack/"
                                Classes="SocialMediaButton" Tag="#d4af37" ui:Translator.TooltipKey="BUY_SUPPORTER_PACK"
                                Content="/Images/SocialMedia/DonateIcon.png"/>
                    </panels:AlignableWrapPanel>
                </Grid>
            </ScrollViewer>

            <ScrollViewer Grid.Column="1"
                          IsVisible="{Binding !NewsPanelCollapsed}">
                <Border Padding="5" BorderThickness="3 0 0 0" BorderBrush="{DynamicResource ThemeBackgroundBrush}">
                    <Grid>
                        <indicators1:LoadingIndicator IsVisible="{Binding IsFetchingNews}"/>
                        <TextBlock ui:Translator.Key="FAILED_FETCH_NEWS" FontSize="20"
                                   VerticalAlignment="Center" TextAlignment="Center"
                                   IsVisible="{Binding Path=FailedFetchingNews}"/>
                        <StackPanel Orientation="Vertical" IsVisible="{Binding !IsFetchingNews}">
                            <TextBlock HorizontalAlignment="Center" ui:Translator.Key="NEWS" FontSize="18"/>
                            <ItemsControl ItemsSource="{Binding Path=News}">
                                <ItemsControl.ItemTemplate>
                                    <DataTemplate>
                                        <newsFeed1:NewsItem Margin="5" News="{Binding Path=.}"/>
                                    </DataTemplate>
                                </ItemsControl.ItemTemplate>
                            </ItemsControl>
                        </StackPanel>
                    </Grid>
                </Border>
            </ScrollViewer>
        </Grid>
    </DockPanel>
</dialogs:PixiEditorPopup>
