From 7106f3b978c6a8d023f3f54bf1f1a28fbfff2758 Mon Sep 17 00:00:00 2001
From: leo <longshuang@msn.cn>
Date: Thu, 7 Jan 2021 00:29:10 +0800
Subject: [PATCH] feature<Launcher>: add ChromeTabShape; new titlebar theme for
 Launcher

---
 src/Helpers/ChromeTabShape.cs  | 38 +++++++++++++++
 src/Resources/Themes/Dark.xaml |  4 +-
 src/UI/Launcher.xaml           | 84 +++++++++++++---------------------
 src/UI/Launcher.xaml.cs        |  3 +-
 4 files changed, 74 insertions(+), 55 deletions(-)
 create mode 100644 src/Helpers/ChromeTabShape.cs

diff --git a/src/Helpers/ChromeTabShape.cs b/src/Helpers/ChromeTabShape.cs
new file mode 100644
index 00000000..e9d81c97
--- /dev/null
+++ b/src/Helpers/ChromeTabShape.cs
@@ -0,0 +1,38 @@
+using System;
+using System.Windows;
+using System.Windows.Media;
+using System.Windows.Shapes;
+
+namespace SourceGit.Helpers {
+
+    /// <summary>
+    ///     Chrome like tab shape
+    /// </summary>
+    public class ChromeTabShape : Shape {
+        protected override Geometry DefiningGeometry => MakeGeometry();
+
+        public ChromeTabShape() {
+            Stretch = Stretch.None;
+            StrokeThickness = 0;
+        }
+
+        private Geometry MakeGeometry() {
+            var geo = new StreamGeometry();
+            var cornerSize = new Size(4, 4);
+            var cornerAngle = Math.PI / 2; 
+            using (var ctx = geo.Open()) {
+                ctx.BeginFigure(new Point(-5.1, ActualHeight), true, true);
+                ctx.ArcTo(new Point(-1.1, ActualHeight - 4), cornerSize, cornerAngle, false, SweepDirection.Counterclockwise, false, true);
+                ctx.LineTo(new Point(-1.1, 4), false, true);
+                ctx.ArcTo(new Point(2.9, 0), cornerSize, cornerAngle, false, SweepDirection.Clockwise, false, true);
+                ctx.LineTo(new Point(ActualWidth - 2.9, 0), false, true);
+                ctx.ArcTo(new Point(ActualWidth + 1.1, 4), cornerSize, cornerAngle, false, SweepDirection.Clockwise, false, true);
+                ctx.LineTo(new Point(ActualWidth + 1.1, ActualHeight - 4), false, true);
+                ctx.ArcTo(new Point(ActualWidth + 5.1, ActualHeight), cornerSize, cornerAngle, false, SweepDirection.Counterclockwise, false, true);
+            }
+
+            geo.Freeze();
+            return geo;
+        }
+    }
+}
diff --git a/src/Resources/Themes/Dark.xaml b/src/Resources/Themes/Dark.xaml
index 37748cfc..3ea26cf5 100644
--- a/src/Resources/Themes/Dark.xaml
+++ b/src/Resources/Themes/Dark.xaml
@@ -3,10 +3,10 @@
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
     <SolidColorBrush x:Key="Brush.Logo" Color="#FFF05133"/>
 
-    <SolidColorBrush x:Key="Brush.TitleBar" Color="#FF303030"/>
+    <SolidColorBrush x:Key="Brush.TitleBar" Color="#FF202020"/>
     <SolidColorBrush x:Key="Brush.Window" Color="#FF252525"/>
     <SolidColorBrush x:Key="Brush.NewPageHover" Color="#FF404040"/>
-    <SolidColorBrush x:Key="Brush.PageTabHover" Color="#80505050"/>
+    <SolidColorBrush x:Key="Brush.PageTabHover" Color="#FF404040"/>
     <SolidColorBrush x:Key="Brush.Popup" Color="#FF252525"/>
     <SolidColorBrush x:Key="Brush.Contents" Color="#FF1B1B1B"/>
     <SolidColorBrush x:Key="Brush.Badge" Color="#FF8F8F8F"/>
diff --git a/src/UI/Launcher.xaml b/src/UI/Launcher.xaml
index ca27e7f9..df9fc0a0 100644
--- a/src/UI/Launcher.xaml
+++ b/src/UI/Launcher.xaml
@@ -6,6 +6,7 @@
         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
         xmlns:source="clr-namespace:SourceGit"
         xmlns:local="clr-namespace:SourceGit.UI"
+        xmlns:helpers="clr-namespace:SourceGit.Helpers"
         xmlns:converters="clr-namespace:SourceGit.Converters"
         mc:Ignorable="d"
         MinWidth="800" MinHeight="600"
@@ -37,7 +38,7 @@
         </Border.Style>
         
         <!-- Window Content -->
-        <Grid Background="{StaticResource Brush.Window}">
+        <Grid>
             <Grid.RowDefinitions>
                 <RowDefinition Height="32"/>
                 <RowDefinition Height="*"/>
@@ -50,6 +51,12 @@
                     <ColumnDefinition Width="200"/>
                 </Grid.ColumnDefinitions>
 
+                <Border Grid.Column="0" Grid.ColumnSpan="3" Height="4" VerticalAlignment="Bottom" Margin="0,0,0,-4" Background="{StaticResource Brush.TitleBar}">
+                    <Border.Effect>
+                        <DropShadowEffect ShadowDepth="1" Direction="90" Opacity=".5" Color="Black"/>
+                    </Border.Effect>
+                </Border>
+
                 <!-- Tabs -->
                 <ScrollViewer x:Name="openedTabsScroller" Grid.Column="0" HorizontalScrollBarVisibility="Hidden" VerticalScrollBarVisibility="Disabled" CanContentScroll="True">
                     <TabControl x:Name="openedTabs" Padding="0" SnapsToDevicePixels="True" ItemsSource="{Binding ElementName=me, Path=Tabs}" SizeChanged="OpenedTabsSizeChanged">
@@ -58,16 +65,16 @@
                                 <Setter Property="Template">
                                     <Setter.Value>
                                         <ControlTemplate TargetType="{x:Type TabControl}">
-                                            <StackPanel Orientation="Horizontal" Margin="6,4,4,0">
+                                            <StackPanel Orientation="Horizontal" Margin="8,4,4,0">
                                                 <StackPanel Orientation="Horizontal" IsItemsHost="True" SnapsToDevicePixels="True" KeyboardNavigation.TabIndex="1"/>
-                                                <Button Margin="4,0,0,0" Click="NewTab" ToolTip="NEW PAGE" Width="24" Height="24" WindowChrome.IsHitTestVisibleInChrome="True">
+                                                <Button Margin="4,0,0,0" Click="NewTab" ToolTip="NEW PAGE" WindowChrome.IsHitTestVisibleInChrome="True">
                                                     <Button.Style>
                                                         <Style TargetType="{x:Type Button}" BasedOn="{x:Null}">
                                                             <Setter Property="Opacity" Value="1"/>
                                                             <Setter Property="Template">
                                                                 <Setter.Value>
                                                                     <ControlTemplate>
-                                                                        <Border x:Name="newTabBG" BorderThickness="0" Background="Transparent" CornerRadius="2">
+                                                                        <Border x:Name="newTabBG" Width="20" Height="20" BorderThickness="0" Background="Transparent" CornerRadius="2">
                                                                             <Path Width="14" Height="14" Style="{StaticResource Style.Icon}" Data="{StaticResource Icon.NewTab}" Fill="{StaticResource Brush.FG1}"/>
                                                                         </Border>
 
@@ -82,7 +89,7 @@
                                                         </Style>
                                                     </Button.Style>
                                                 </Button>
-                                            </StackPanel>                                            
+                                            </StackPanel>
                                         </ControlTemplate>
                                     </Setter.Value>
                                 </Setter>
@@ -90,7 +97,7 @@
                         </TabControl.Style>
 
                         <TabControl.Resources>
-                            <converters:IntToRepoColor x:Key="IntToRepoColor"/>                            
+                            <converters:IntToRepoColor x:Key="IntToRepoColor"/>
                         </TabControl.Resources>
 
                         <TabControl.ItemTemplate>
@@ -163,28 +170,21 @@
                                 <Setter Property="Template">
                                     <Setter.Value>
                                         <ControlTemplate TargetType="{x:Type TabItem}">
-                                            <Grid SnapsToDevicePixels="True" WindowChrome.IsHitTestVisibleInChrome="True" ToolTip="{Binding Tooltip}">
-                                                <Border x:Name="BG" Margin="-1,0" SnapsToDevicePixels="True" Background="Transparent" CornerRadius="4,4,0,0"/>
+                                            <Grid x:Name="Container" SnapsToDevicePixels="True" WindowChrome.IsHitTestVisibleInChrome="True" ToolTip="{Binding Tooltip}">
+                                                <helpers:ChromeTabShape 
+                                                    x:Name="BG" 
+                                                    Width="{Binding ElementName=Container,Path=ActualWidth}"
+                                                    Height="{Binding ElementName=Container,Path=ActualHeight}"
+                                                    Fill="Transparent">
+                                                    <helpers:ChromeTabShape.Effect>
+                                                        <DropShadowEffect ShadowDepth="1" Direction="90" Opacity=".5" Color="Black"/>
+                                                    </helpers:ChromeTabShape.Effect>
+                                                </helpers:ChromeTabShape>
 
-                                                <Path
-                                                    x:Name="CornerLeft"
-                                                    Width="6"
-                                                    Height="6"
-                                                    HorizontalAlignment="Left"
-                                                    VerticalAlignment="Bottom"
-                                                    Margin="-6,0,0,0"
-                                                    Data="M 0,6 L 6,6 6,0 C 6,0 6,6 0,6 Z"
-                                                    Fill="Transparent"/>
-
-                                                <Path
-                                                    x:Name="CornerRight"
-                                                    Width="6"
-                                                    Height="6"
-                                                    HorizontalAlignment="Right"
-                                                    VerticalAlignment="Bottom"
-                                                    Margin="0,0,-6,0"
-                                                    Data="M 0,0 L 0,6 6,6 C 6,6 0,6 0,0 Z"
-                                                    Fill="Transparent"/>
+                                                <Border
+                                                    x:Name="Hover"
+                                                    Margin="-1,0"
+                                                    Background="Transparent"/>
 
                                                 <ContentPresenter 
                                                     x:Name="ContentSite"
@@ -202,33 +202,13 @@
                                             <ControlTemplate.Triggers>
                                                 <Trigger Property="IsSelected" Value="True">
                                                     <Setter Property="Panel.ZIndex" Value="2"/>
-                                                    <Setter TargetName="BG" Property="Background" Value="{StaticResource Brush.Window}"/>
-                                                    <Setter TargetName="CornerLeft" Property="Fill" Value="{StaticResource Brush.Window}"/>
-                                                    <Setter TargetName="CornerRight" Property="Fill" Value="{StaticResource Brush.Window}"/>
+                                                    <Setter TargetName="BG" Property="Fill" Value="{StaticResource Brush.Window}"/>
                                                 </Trigger>
-                                                
+
                                                 <Trigger Property="IsSelected" Value="False">
                                                     <Setter Property="Panel.ZIndex" Value="-1"/>
-                                                </Trigger>
-
-                                                <MultiTrigger>
-                                                    <MultiTrigger.Conditions>
-                                                        <Condition Property="IsSelected" Value="False"/>
-                                                        <Condition Property="IsMouseOver" Value="True"/>
-                                                    </MultiTrigger.Conditions>
-                                                    <Setter Property="Panel.ZIndex" Value="1"/>
-                                                    <Setter TargetName="BG" Property="Background" Value="{StaticResource Brush.PageTabHover}"/>
-                                                    <Setter TargetName="CornerLeft" Property="Fill" Value="{StaticResource Brush.PageTabHover}"/>
-                                                    <Setter TargetName="CornerRight" Property="Fill" Value="{StaticResource Brush.PageTabHover}"/>
-                                                </MultiTrigger>
-
-                                                <MultiTrigger>
-                                                    <MultiTrigger.Conditions>
-                                                        <Condition Property="IsSelected" Value="False"/>
-                                                        <Condition Property="IsMouseOver" Value="False"/>
-                                                    </MultiTrigger.Conditions>
                                                     <Setter TargetName="Splitter" Property="Visibility" Value="Visible"/>
-                                                </MultiTrigger>
+                                                </Trigger>
                                             </ControlTemplate.Triggers>
                                         </ControlTemplate>
                                     </Setter.Value>
@@ -241,7 +221,7 @@
                         </TabControl.ItemContainerStyle>
                     </TabControl>
                 </ScrollViewer>
-                
+
                 <!-- Tab scroller -->
                 <StackPanel x:Name="openedTabsOpts" Grid.Column="1" VerticalAlignment="Bottom" Orientation="Horizontal" Height="28" Margin="4,0,0,0" WindowChrome.IsHitTestVisibleInChrome="True">
                     <Button Click="ScrollToLeft">
@@ -304,7 +284,7 @@
             </Grid>
 
             <!-- Pages -->
-            <ItemsControl Grid.Row="1" ItemsSource="{Binding ElementName=me, Path=Tabs}">
+            <ItemsControl Grid.Row="1" ItemsSource="{Binding ElementName=me, Path=Tabs}" Background="{StaticResource Brush.Window}">
                 <ItemsControl.ItemsPanel>
                     <ItemsPanelTemplate>
                         <Grid/>
diff --git a/src/UI/Launcher.xaml.cs b/src/UI/Launcher.xaml.cs
index 5fe02917..2f30b00b 100644
--- a/src/UI/Launcher.xaml.cs
+++ b/src/UI/Launcher.xaml.cs
@@ -10,6 +10,7 @@ using System.Windows;
 using System.Windows.Controls;
 using System.Windows.Input;
 using System.Windows.Media;
+using System.Windows.Shapes;
 
 namespace SourceGit.UI {
 
@@ -41,7 +42,7 @@ namespace SourceGit.UI {
                     }
                 }
             }
-            
+
             public object Page {
                 get { return page; }
                 set {