<Page
    x:Class="MyDriving.UWP.Views.ProfileView"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:controls="using:MyDriving.UWP.Controls"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">

    <Grid Background="{StaticResource MainBackgroundColor2}">
        <ScrollViewer VerticalScrollBarVisibility="Hidden">
            <StackPanel Margin="24,24,24,24">

                <Grid >
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="*" />
                        <ColumnDefinition Width="*" />
                    </Grid.ColumnDefinitions>

                    <Grid.RowDefinitions>
                        <RowDefinition Height="*" />
                        <RowDefinition Height="*" />
                    </Grid.RowDefinitions>

                    <controls:CirclePercentage x:Name="CirclePercentage" Grid.RowSpan="2" Grid.Column="0" VerticalAlignment="Center" HorizontalAlignment="Center" DataContext="{x:Bind profileViewModel.DrivingSkills, Mode=OneWay}"/>
                    <Ellipse Grid.RowSpan="2" Width="100" Height="100">
                        <Ellipse.Fill>
                            <ImageBrush x:Name="ProfileImage" ImageSource="{x:Bind profileViewModel.Settings.UserProfileUrl, Mode=OneWay, Converter={StaticResource ImageSourceConverter}}"/>
                        </Ellipse.Fill>
                    </Ellipse>

                    <TextBlock Name="DrivingSkills" Text="{x:Bind profileViewModel.DrivingSkills, Mode=OneWay, Converter={StaticResource StringFormatConverter}, ConverterParameter=' {0}% '}"   
                                     Grid.Column="1" FontFamily="SegoeUI" FontSize="32" Foreground="{StaticResource BrandColor}" TextWrapping="Wrap"/>
                    <StackPanel Grid.Column="1" Grid.Row="1">
                        <TextBlock Name="DrivingSkillsMessage2" Text="{x:Bind profileViewModel.DrivingSkillsPlacementBucket.Description,  Converter={StaticResource StringFormatConverter}, ConverterParameter='Driving skills: {0}', Mode=OneWay}"   
                                    FontFamily="SegoeUI-Light" FontSize="16" Foreground="White" TextWrapping="Wrap" />
                    </StackPanel>
                </Grid>

                <Border Margin="0,6,0,0" />
                <controls:ProfileViewTabControl x:Name="TotalDistanceTab" DataContext="{x:Bind profileViewModel.TotalDistanceDisplay, Mode=OneWay}" />

                <controls:ProfileViewTabControl x:Name="TotalTimeTab" DataContext="{x:Bind profileViewModel.TotalTimeDisplay, Mode=OneWay}" />

                <controls:ProfileViewTabControl x:Name="MaxSpeedTab" DataContext="{x:Bind profileViewModel.MaxSpeedDisplay, Mode=OneWay}" />

                <controls:ProfileViewTabControl x:Name="FuelConsumptionTab" DataContext="{x:Bind profileViewModel.FuelDisplay, Mode=OneWay}" />

                <controls:ProfileViewTabControl x:Name="HardBreaksTab" DataContext="{x:Bind profileViewModel.HardStops, Mode=OneWay, Converter={StaticResource StringFormatConverter}, ConverterParameter=' {0}  times'}" />

                <controls:ProfileViewTabControl x:Name="HardAccelTab" DataContext="{x:Bind profileViewModel.HardAccelerations, Mode=OneWay, Converter={StaticResource StringFormatConverter}, ConverterParameter=' {0}  times'}" />

                <controls:ProfileViewTabControl x:Name="TotalTripsTab" DataContext="{x:Bind profileViewModel.TotalTrips, Mode=OneWay}" />

            </StackPanel>
        </ScrollViewer>

    </Grid>
</Page>
