<UserControl x:Class="Pulsar.Server.Controls.Wpf.HeatMapView"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             mc:Ignorable="d"
             d:DesignWidth="900"
             d:DesignHeight="620">
    <UserControl.Resources>
        <BooleanToVisibilityConverter x:Key="BoolToVisibilityConverter" />
        <SolidColorBrush x:Key="StatsBackgroundBrush" Color="#FFFFFFFF" />
        <SolidColorBrush x:Key="CardBackgroundBrush" Color="#FFF5F5F5" />
        <SolidColorBrush x:Key="CardBorderBrush" Color="#FFE0E0E0" />
        <SolidColorBrush x:Key="CardForegroundBrush" Color="#FF1F1F1F" />
        <SolidColorBrush x:Key="SectionHeaderBrush" Color="#FF1F1F1F" />
        <SolidColorBrush x:Key="MutedTextBrush" Color="#FF5F6368" />
        <SolidColorBrush x:Key="AccentBrush" Color="#FF1976D2" />
        <SolidColorBrush x:Key="PositiveAccentBrush" Color="#FF2E7D32" />
        <SolidColorBrush x:Key="NegativeAccentBrush" Color="#FFC62828" />
        <SolidColorBrush x:Key="ChartBackgroundBrush" Color="#FFFFFFFF" />
        <SolidColorBrush x:Key="ChartBorderBrush" Color="#FFE0E0E0" />
        <SolidColorBrush x:Key="ScrollBarTrackBrush" Color="#FFE5E5E5" />
        <SolidColorBrush x:Key="ScrollBarThumbBrush" Color="#FFB5B5B5" />
        <SolidColorBrush x:Key="ScrollBarThumbHoverBrush" Color="#FF9E9E9E" />
        <SolidColorBrush x:Key="ScrollBarThumbPressedBrush" Color="#FF7C7C7C" />
        <Style x:Key="RightAlignedCell" TargetType="TextBlock">
            <Setter Property="HorizontalAlignment" Value="Right" />
            <Setter Property="VerticalAlignment" Value="Center" />
        </Style>
        <Style x:Key="SlimScrollBarThumbStyle" TargetType="Thumb">
            <Setter Property="Background" Value="{DynamicResource ScrollBarThumbBrush}" />
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Thumb">
                        <Border Background="{TemplateBinding Background}" CornerRadius="4" />
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
            <Style.Triggers>
                <Trigger Property="IsMouseOver" Value="True">
                    <Setter Property="Background" Value="{DynamicResource ScrollBarThumbHoverBrush}" />
                </Trigger>
                <Trigger Property="IsDragging" Value="True">
                    <Setter Property="Background" Value="{DynamicResource ScrollBarThumbPressedBrush}" />
                </Trigger>
            </Style.Triggers>
        </Style>
        <ControlTemplate x:Key="SlimVerticalScrollBarTemplate" TargetType="ScrollBar">
            <Grid Background="{TemplateBinding Background}" Width="{TemplateBinding Width}">
                <Grid.RowDefinitions>
                    <RowDefinition Height="0" />
                    <RowDefinition Height="*" />
                    <RowDefinition Height="0" />
                </Grid.RowDefinitions>
                <Track x:Name="PART_Track"
                       Grid.Row="1"
                       IsDirectionReversed="True"
                       Orientation="Vertical"
                       Maximum="{TemplateBinding Maximum}"
                       Minimum="{TemplateBinding Minimum}"
                       Value="{TemplateBinding Value}"
                       ViewportSize="{TemplateBinding ViewportSize}">
                    <Track.Thumb>
                        <Thumb Style="{StaticResource SlimScrollBarThumbStyle}" />
                    </Track.Thumb>
                </Track>
            </Grid>
        </ControlTemplate>
        <ControlTemplate x:Key="SlimHorizontalScrollBarTemplate" TargetType="ScrollBar">
            <Grid Background="{TemplateBinding Background}" Height="{TemplateBinding Height}">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="0" />
                    <ColumnDefinition Width="*" />
                    <ColumnDefinition Width="0" />
                </Grid.ColumnDefinitions>
                <Track x:Name="PART_Track"
                       Grid.Column="1"
                       Orientation="Horizontal"
                       Maximum="{TemplateBinding Maximum}"
                       Minimum="{TemplateBinding Minimum}"
                       Value="{TemplateBinding Value}"
                       ViewportSize="{TemplateBinding ViewportSize}">
                    <Track.Thumb>
                        <Thumb Style="{StaticResource SlimScrollBarThumbStyle}" />
                    </Track.Thumb>
                </Track>
            </Grid>
        </ControlTemplate>
        <Style x:Key="SlimScrollBarStyle" TargetType="ScrollBar">
            <Setter Property="Background" Value="{DynamicResource ScrollBarTrackBrush}" />
            <Setter Property="Width" Value="10" />
            <Setter Property="Template" Value="{StaticResource SlimVerticalScrollBarTemplate}" />
            <Style.Triggers>
                <Trigger Property="Orientation" Value="Horizontal">
                    <Setter Property="Height" Value="10" />
                    <Setter Property="Width" Value="Auto" />
                    <Setter Property="Template" Value="{StaticResource SlimHorizontalScrollBarTemplate}" />
                </Trigger>
            </Style.Triggers>
        </Style>
    </UserControl.Resources>

    <Grid x:Name="LayoutRoot" Background="{StaticResource StatsBackgroundBrush}">
        <ScrollViewer VerticalScrollBarVisibility="Auto"
                      HorizontalScrollBarVisibility="Disabled"
                      Background="Transparent"
                      Visibility="{Binding IsContentVisible, Converter={StaticResource BoolToVisibilityConverter}}">
            <ScrollViewer.Resources>
                <Style TargetType="ScrollBar" BasedOn="{StaticResource SlimScrollBarStyle}" />
            </ScrollViewer.Resources>
            <StackPanel Margin="24">
                <TextBlock Text="Global presence"
                           FontSize="20"
                           FontWeight="SemiBold"
                           Foreground="{StaticResource SectionHeaderBrush}" />

                <ItemsControl ItemsSource="{Binding StatCards}" Margin="0,16,0,24">
                    <ItemsControl.ItemsPanel>
                        <ItemsPanelTemplate>
                            <UniformGrid Columns="2" />
                        </ItemsPanelTemplate>
                    </ItemsControl.ItemsPanel>
                    <ItemsControl.ItemTemplate>
                        <DataTemplate>
                            <Border Margin="8"
                                    Padding="16"
                                    CornerRadius="12"
                                    Background="{StaticResource CardBackgroundBrush}"
                                    BorderBrush="{StaticResource CardBorderBrush}"
                                    BorderThickness="1">
                                <StackPanel>
                                    <TextBlock Text="{Binding Title}"
                                               FontSize="14"
                                               FontWeight="SemiBold"
                                               Foreground="{StaticResource CardForegroundBrush}" />
                                    <TextBlock Text="{Binding Value}"
                                               FontSize="28"
                                               FontWeight="Bold"
                                               Margin="0,8,0,4"
                                               Foreground="{StaticResource AccentBrush}" />
                                    <TextBlock Text="{Binding Subtitle}"
                                               FontSize="12"
                                               Foreground="{StaticResource MutedTextBrush}"
                                               Opacity="0.7" />
                                </StackPanel>
                            </Border>
                        </DataTemplate>
                    </ItemsControl.ItemTemplate>
                </ItemsControl>

                <Grid Margin="0,0,0,24">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="2*" />
                        <ColumnDefinition Width="*" />
                    </Grid.ColumnDefinitions>

                    <Border Grid.Column="0"
                            Margin="0,0,12,0"
                            Padding="16"
                            CornerRadius="12"
                            Background="{StaticResource CardBackgroundBrush}"
                            BorderBrush="{StaticResource CardBorderBrush}"
                            BorderThickness="1">
                        <StackPanel>
                            <StackPanel Orientation="Horizontal" VerticalAlignment="Center" Margin="0,0,0,12">
                                <TextBlock Text="World heat map"
                                           FontSize="16"
                                           FontWeight="SemiBold"
                                           Foreground="{StaticResource SectionHeaderBrush}" />
                                <TextBlock Text="— Clients by country"
                                           FontSize="13"
                                           Margin="8,2,0,0"
                                           Foreground="{StaticResource MutedTextBrush}"
                                           Opacity="0.7" />
                            </StackPanel>
                            <ContentControl x:Name="MapHost"
                                            Height="360"
                                            HorizontalContentAlignment="Stretch"
                                            VerticalContentAlignment="Stretch" />
                            <TextBlock Text="Hotter regions indicate more connected clients."
                                       Margin="0,12,0,0"
                                       FontSize="12"
                                       Foreground="{StaticResource MutedTextBrush}" />
                        </StackPanel>
                    </Border>

                    <Border Grid.Column="1"
                            Padding="16"
                            CornerRadius="12"
                            Background="{StaticResource CardBackgroundBrush}"
                            BorderBrush="{StaticResource CardBorderBrush}"
                            BorderThickness="1">
                        <StackPanel>
                            <TextBlock Text="Top countries"
                                       FontSize="16"
                                       FontWeight="SemiBold"
                                       Foreground="{StaticResource SectionHeaderBrush}"
                                       Margin="0,0,0,12" />
                            <ListView x:Name="TopCountriesList"
                                      ItemsSource="{Binding TopCountries}"
                                      BorderBrush="{StaticResource CardBorderBrush}"
                                      BorderThickness="0"
                                      Background="Transparent"
                                      Foreground="{StaticResource CardForegroundBrush}"
                                      ScrollViewer.VerticalScrollBarVisibility="Auto">
                                <ListView.Resources>
                                    <Style TargetType="ScrollBar" BasedOn="{StaticResource SlimScrollBarStyle}" />
                                </ListView.Resources>
                                <ListView.View>
                                    <GridView AllowsColumnReorder="False">
                                        <GridViewColumn Width="36" Header="#" DisplayMemberBinding="{Binding Rank}" />
                                        <GridViewColumn Width="140" Header="Country" DisplayMemberBinding="{Binding Country}" />
                                        <GridViewColumn Width="60" Header="ISO" DisplayMemberBinding="{Binding Code}" />
                                        <GridViewColumn Width="80" Header="Clients" DisplayMemberBinding="{Binding Count}" />
                                        <GridViewColumn Width="80" Header="Share" DisplayMemberBinding="{Binding SharePercent}" />
                                    </GridView>
                                </ListView.View>
                            </ListView>
                        </StackPanel>
                    </Border>
                </Grid>

                <TextBlock Text="{Binding LastUpdated}"
                           Margin="0,16,0,0"
                           FontSize="12"
                           Foreground="{StaticResource MutedTextBrush}"
                           Opacity="0.7" />
            </StackPanel>
        </ScrollViewer>

        <Border Background="#AA000000"
                Visibility="{Binding IsLoading, Converter={StaticResource BoolToVisibilityConverter}}">
            <StackPanel HorizontalAlignment="Center" VerticalAlignment="Center">
                <TextBlock Text="Loading heat map..."
                           Foreground="White"
                           FontSize="18"
                           FontWeight="SemiBold"
                           TextAlignment="Center" />
            </StackPanel>
        </Border>

        <Border Background="#33FF0000"
                Visibility="{Binding HasError, Converter={StaticResource BoolToVisibilityConverter}}">
            <Border Background="{StaticResource CardBackgroundBrush}"
                    BorderBrush="{StaticResource CardBorderBrush}"
                    BorderThickness="1"
                    CornerRadius="12"
                    Padding="24"
                    HorizontalAlignment="Center"
                    VerticalAlignment="Center"
                    MaxWidth="420">
                <StackPanel>
                    <TextBlock Text="Unable to load heat map"
                               FontSize="18"
                               FontWeight="SemiBold"
                               Foreground="{StaticResource CardForegroundBrush}"
                               TextAlignment="Center" />
                    <TextBlock Text="{Binding ErrorMessage}"
                               Margin="0,12,0,0"
                               TextWrapping="Wrap"
                               Foreground="{StaticResource CardForegroundBrush}"
                               Opacity="0.8"
                               TextAlignment="Center" />
                </StackPanel>
            </Border>
        </Border>
    </Grid>
</UserControl>
