269 lines
15 KiB
XML
269 lines
15 KiB
XML
|
<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>
|