<Window x:Class="PixiEditor.Views.Dialogs.HelloTherePopup"
        x:ClassModifier="internal"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        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:dataHolders="clr-namespace:PixiEditor.Models.DataHolders" xmlns:converters="clr-namespace:PixiEditor.Helpers.Converters"
        xmlns:sys="clr-namespace:System;assembly=System.Runtime"
        xmlns:uc="clr-namespace:PixiEditor.Views.UserControls"
        xmlns:cmds="clr-namespace:PixiEditor.Models.Commands.XAML"
        xmlns:local="clr-namespace:PixiEditor.Views.Dialogs"
        xmlns:models="clr-namespace:PixiEditor.Models"
        xmlns:views="clr-namespace:PixiEditor.Views"
        xmlns:helpers="clr-namespace:PixiEditor.Helpers"
        xmlns:ui="clr-namespace:PixiEditor.Extensions.UI;assembly=PixiEditor.Extensions"
        xmlns:newsFeed="clr-namespace:PixiEditor.Views.UserControls.NewsFeed"
        xmlns:gif="http://wpfanimatedgif.codeplex.com"
        mc:Ignorable="d" ShowInTaskbar="False"
        Title="Hello there!" Height="662" Width="982" MinHeight="500" MinWidth="500"
        d:DataContext="{d:DesignInstance local:HelloTherePopup}"
        WindowStyle="None" WindowStartupLocation="CenterScreen" Loaded="HelloTherePopup_OnLoaded"
        FlowDirection="{helpers:Localization FlowDirection}">

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

    <WindowChrome.WindowChrome>
        <WindowChrome CaptionHeight="35"  GlassFrameThickness="0.1"
                      ResizeBorderThickness="{x:Static SystemParameters.WindowResizeBorderThickness}"/>
    </WindowChrome.WindowChrome>

    <Window.CommandBindings>
        <CommandBinding Command="{x:Static SystemCommands.CloseWindowCommand}" CanExecute="CommandBinding_CanExecute"
                        Executed="CommandBinding_Executed_Close" />
    </Window.CommandBindings>

    <Grid Background="{StaticResource AccentColor}">
        <Grid.RowDefinitions>
            <RowDefinition Height="35" />
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="300" x:Name="newsColumn"/>
        </Grid.ColumnDefinitions>

        <DockPanel Grid.Row="0" Grid.ColumnSpan="2" Background="{StaticResource MainColor}">
            <Button DockPanel.Dock="Right" HorizontalAlignment="Right" Style="{StaticResource CloseButtonStyle}"
                    WindowChrome.IsHitTestVisibleInChrome="True" ToolTip="Close"
                    Command="{x:Static SystemCommands.CloseWindowCommand}" />
        </DockPanel>

        <ScrollViewer Grid.Column="0" Grid.Row="1" 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 Visibility="{Binding NewsDisabled, Converter={converters:InverseBoolToVisibilityConverter}}"
                              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="{StaticResource MainColor}" 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">
                    <StackPanel Orientation="Horizontal">
                        <Image Source="../../Images/PixiEditorLogo.png" Height="40" VerticalAlignment="Center"/>
                        <TextBlock FontSize="40" FontWeight="SemiBold" VerticalAlignment="Center" Margin="10,0,0,0">PixiEditor</TextBlock>
                    </StackPanel>
                    <TextBlock HorizontalAlignment="Center" FontSize="20" FontWeight="Medium" Text="{Binding VersionText}"/>
                </StackPanel>

                <StackPanel Grid.Row="1" Orientation="Horizontal" HorizontalAlignment="Center">
                    <Button Style="{StaticResource DarkRoundButton}" Command="{Binding OpenFileCommand}" MinWidth="150" Margin="10"
                            ui:Translator.Key="OPEN_FILE"/>
                    <Button Style="{StaticResource DarkRoundButton}" 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.Visibility>
                            <Binding Path="RecentlyOpened.Count"
                                     Converter="{converters:EqualityBoolToVisibilityConverter}">
                                <Binding.ConverterParameter>
                                    <sys:Int32/>
                                </Binding.ConverterParameter>
                            </Binding>
                        </TextBlock.Visibility>
                    </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=uc:AlignableWrapPanel}}"
                                                CommandParameter="{Binding FilePath}"
                                                Style="{StaticResource DarkRoundButton}"
                                                x:Name="fileButton">
                                            <Grid Width="100" Height="100">
                                                <Image Source="{Binding PreviewBitmap}" x:Name="image" Margin="20">
                                                    <RenderOptions.BitmapScalingMode>
                                                        <MultiBinding Converter="{converters:WidthToBitmapScalingModeConverter}">
                                                            <Binding Path="PreviewBitmap.PixelWidth"/>
                                                            <Binding ElementName="image" Path="ActualWidth"/>
                                                        </MultiBinding>
                                                    </RenderOptions.BitmapScalingMode>
                                                </Image>
                                                <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.Resources>
                                                                <Style TargetType="Button" BasedOn="{StaticResource BaseDarkButton}">
                                                                    <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"/>
                                                                    
                                                                    <Style.Triggers>
                                                                        <Trigger Property="IsMouseOver" Value="False">
                                                                            <Setter Property="Background" Value="Transparent"/>
                                                                        </Trigger>
                                                                        <Trigger Property="IsMouseOver" Value="True">
                                                                            <Setter Property="Background" Value="#70FFFFFF"/>
                                                                        </Trigger>
                                                                    </Style.Triggers>
                                                                </Style>
                                                            </StackPanel.Resources>
                                                            <Button Command="{Binding DataContext.OpenInExplorerCommand, RelativeSource={RelativeSource AncestorType=uc:AlignableWrapPanel}}"
                                                                    CommandParameter="{Binding FilePath}"
                                                                    ToolTip="Open in File Explorer">
                                                                <TextBlock Text="&#xEC50;" FontFamily="Segoe MDL2 Assets"
                                                                           TextAlignment="Center" FontSize="18"/>
                                                            </Button>
                                                            <Button Command="{cmds:Command Name=PixiEditor.File.RemoveRecent, UseProvided=True}"
                                                                    CommandParameter="{Binding FilePath}"
                                                                    ToolTip="Remove from list">
                                                                <TextBlock Text="" FontFamily="{StaticResource Feather}"
                                                                           TextAlignment="Center" FontSize="20"/>
                                                            </Button>
                                                        </StackPanel>
                                                    </Grid>
                                                </Border>
                                            </Grid>
                                        </Button>

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

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

        <ScrollViewer Grid.Row="1" Grid.Column="1"
                      Visibility="{Binding NewsPanelCollapsed, Converter={converters:InverseBoolToVisibilityConverter}}">
            <Border Padding="5" BorderThickness="3 0 0 0" BorderBrush="{StaticResource MainColor}">
                <Grid>
                    <Image gif:ImageBehavior.AnimatedSource="/Images/Processing.gif" HorizontalAlignment="Center" VerticalAlignment="Center"
                           Visibility="{Binding IsFetchingNews, Converter={converters:BoolToVisibilityConverter}}"
                           Height="50" gif:ImageBehavior.AnimationSpeedRatio="1.5"/>
                    <TextBlock ui:Translator.Key="FAILED_FETCH_NEWS" Foreground="White" FontSize="20"
                               VerticalAlignment="Center" TextAlignment="Center"
                               Visibility="{Binding Path=FailedFetchingNews, Converter={converters:BoolToVisibilityConverter}}"/>
                    <StackPanel Orientation="Vertical" Visibility="{Binding IsFetchingNews, Converter={converters:InverseBoolToVisibilityConverter}}">
                        <TextBlock HorizontalAlignment="Center" ui:Translator.Key="NEWS" FontSize="18"/>
                        <ItemsControl ItemsSource="{Binding Path=News}">
                            <ItemsControl.ItemTemplate>
                                <DataTemplate>
                                    <newsFeed:NewsItem Margin="5" News="{Binding Path=.}"/>
                                </DataTemplate>
                            </ItemsControl.ItemTemplate>
                        </ItemsControl>
                    </StackPanel>
                </Grid>
            </Border>
        </ScrollViewer>
    </Grid>
</Window>
