From 6bb4b5fdd55490875d13e0cf45d298a7dc77f8d4 Mon Sep 17 00:00:00 2001
From: watsonb8 <watsonb8133@gmail.com>
Date: Sun, 1 Dec 2019 20:20:55 -0800
Subject: [PATCH] More styling

---
 Aurora/Design/Components/Library/Library.css  |  5 ++++
 Aurora/Design/Components/Library/Library.xaml | 14 ++++++++---
 .../Design/Components/MediaPlayer/Player.css  | 10 ++++++++
 .../Design/Components/MediaPlayer/Player.xaml | 16 +++++++++++--
 .../NavigationMenu/NavigationMenu.xaml        |  1 -
 .../NavigationMenu/NavigationMenu.xaml.cs     | 22 +++++++++++++++--
 Aurora/Design/Views/MainView/MainView.css     | 11 +++++++++
 Aurora/Design/Views/MainView/MainView.xaml    | 17 +++++++++----
 Aurora/Design/Views/MainView/MainView.xaml.cs |  4 +---
 Aurora/Design/Views/MainView/MainViewModel.cs | 24 +++++++++++++++++++
 10 files changed, 109 insertions(+), 15 deletions(-)
 create mode 100644 Aurora/Design/Components/MediaPlayer/Player.css

diff --git a/Aurora/Design/Components/Library/Library.css b/Aurora/Design/Components/Library/Library.css
index 60618b0..78da403 100644
--- a/Aurora/Design/Components/Library/Library.css
+++ b/Aurora/Design/Components/Library/Library.css
@@ -4,3 +4,8 @@
     vertical-align: middle;
     word-wrap: break-word;
 }
+
+HeaderLaberStyle {
+    text-align: left;
+    color: red;
+}
diff --git a/Aurora/Design/Components/Library/Library.xaml b/Aurora/Design/Components/Library/Library.xaml
index 568b717..667b502 100644
--- a/Aurora/Design/Components/Library/Library.xaml
+++ b/Aurora/Design/Components/Library/Library.xaml
@@ -14,10 +14,17 @@
              SelectionEnabled="True"
              RowHeight="30"
              BorderColor="#3a3a3a"
-             HeaderFontSize="14"
-             HeaderHeight="45"
-             HeaderTextColor="White"
+             BorderThickness="0"
+             HeaderHeight="40"
              HeaderBackground="#222222">
+            <dg:DataGrid.HeaderLabelStyle>
+                <Style TargetType="Label">
+                    <Setter Property="HorizontalOptions" Value="Start"/>
+                    <Setter Property="FontSize" Value="14"/>
+                    <Setter Property="TextColor" Value="White"/>
+                </Style>
+            </dg:DataGrid.HeaderLabelStyle>
+
             <dg:DataGrid.GestureRecognizers>
                 <TapGestureRecognizer
                      NumberOfTapsRequired="2"/>
@@ -59,6 +66,7 @@
                         </DataTemplate>
                     </dg:DataGridColumn.CellTemplate>
                 </dg:DataGridColumn>
+
                 <dg:DataGridColumn
                      Title="Artist"
                      PropertyName="Metadata.Artist"
diff --git a/Aurora/Design/Components/MediaPlayer/Player.css b/Aurora/Design/Components/MediaPlayer/Player.css
new file mode 100644
index 0000000..6648058
--- /dev/null
+++ b/Aurora/Design/Components/MediaPlayer/Player.css
@@ -0,0 +1,10 @@
+Label {
+    color: darkgray;
+    text-align: left;
+    vertical-align: middle;
+    word-wrap: break-word;
+}
+
+#MediaInfoLayout label {
+    margin-left: 20;
+}
diff --git a/Aurora/Design/Components/MediaPlayer/Player.xaml b/Aurora/Design/Components/MediaPlayer/Player.xaml
index 34a492b..8618c09 100644
--- a/Aurora/Design/Components/MediaPlayer/Player.xaml
+++ b/Aurora/Design/Components/MediaPlayer/Player.xaml
@@ -3,6 +3,10 @@
      xmlns="http://xamarin.com/schemas/2014/forms"
      xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
      x:Class="Aurora.Design.Components.MediaPlayer.Player">
+    <ContentView.Resources>
+        <StyleSheet
+             Source="Player.css"/>
+    </ContentView.Resources>
     <ContentView.Content>
         <Grid>
             <Grid.ColumnDefinitions>
@@ -10,16 +14,24 @@
                      Width="100"/>
                 <ColumnDefinition
                      Width="*"/>
+                <ColumnDefinition
+                     Width="100"/>
             </Grid.ColumnDefinitions>
             <StackLayout
+                 x:Name="MediaInfoLayout"
+                 HorizontalOptions="StartAndExpand"
                  Grid.Column="0">
                 <Label
-                     x:Name="SongTitleLabel"/>
+                     x:Name="SongTitleLabel"
+                     LineBreakMode="TailTruncation"/>
                 <Label
-                     x:Name="ArtistNameLabel"/>
+                     x:Name="ArtistNameLabel"
+                     LineBreakMode="TailTruncation"/>
             </StackLayout>
             <StackLayout
+                 x:Name="PlayerControlLayout"
                  Grid.Column="1"
+                 HorizontalOptions="Center"
                  Orientation="Horizontal">
                 <Button
                      Text="Previous"
diff --git a/Aurora/Design/Components/NavigationMenu/NavigationMenu.xaml b/Aurora/Design/Components/NavigationMenu/NavigationMenu.xaml
index 41cc5ac..71b5394 100644
--- a/Aurora/Design/Components/NavigationMenu/NavigationMenu.xaml
+++ b/Aurora/Design/Components/NavigationMenu/NavigationMenu.xaml
@@ -2,7 +2,6 @@
 <ContentView
      xmlns="http://xamarin.com/schemas/2014/forms"
      xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
-     xmlns:behaviors="clr-namespace:Aurora.Design.Behaviors"
      x:Class="Aurora.Design.Components.NavigationMenu.NavigationMenu">
     <ContentView.Resources>
         <StyleSheet
diff --git a/Aurora/Design/Components/NavigationMenu/NavigationMenu.xaml.cs b/Aurora/Design/Components/NavigationMenu/NavigationMenu.xaml.cs
index f33b698..6bbc0a6 100644
--- a/Aurora/Design/Components/NavigationMenu/NavigationMenu.xaml.cs
+++ b/Aurora/Design/Components/NavigationMenu/NavigationMenu.xaml.cs
@@ -11,16 +11,34 @@ namespace Aurora.Design.Components.NavigationMenu
         {
             InitializeComponent();
             ListView = MenuItemsListView;
-
+            ListView.ItemSelected += ListView_ItemSelected;
         }
 
         private void ListView_ItemSelected(object sender, SelectedItemChangedEventArgs e)
         {
-            throw new NotImplementedException();
+            this.SelectedItem = e.SelectedItem as NavigationItem;
         }
 
         public ListView ListView;
 
+        public static readonly BindableProperty SelectedItemProperty =
+            BindableProperty.Create(propertyName: nameof(SelectedItem),
+            returnType: typeof(NavigationItem),
+            declaringType: typeof(NavigationMenu),
+            defaultBindingMode: BindingMode.OneWayToSource);
+
+        public NavigationItem SelectedItem
+        {
+            get
+            {
+                return (NavigationItem)GetValue(SelectedItemProperty);
+            }
+            set
+            {
+                SetValue(SelectedItemProperty, value);
+            }
+        }
+
 
         public static readonly BindableProperty ItemsProperty =
             BindableProperty.Create(propertyName: nameof(Items),
diff --git a/Aurora/Design/Views/MainView/MainView.css b/Aurora/Design/Views/MainView/MainView.css
index 4a91d6a..d6d97f2 100644
--- a/Aurora/Design/Views/MainView/MainView.css
+++ b/Aurora/Design/Views/MainView/MainView.css
@@ -11,3 +11,14 @@
         margin-top: 2;
         margin-bottom: 2;
     }
+
+#TitleContainer {
+    margin-top: 10;
+}
+
+    #TitleContainer Label {
+        color: white;
+        margin-left: 155;
+        font-size: 18;
+        vertical-align: bottom;
+    }
diff --git a/Aurora/Design/Views/MainView/MainView.xaml b/Aurora/Design/Views/MainView/MainView.xaml
index e632c25..328efd9 100644
--- a/Aurora/Design/Views/MainView/MainView.xaml
+++ b/Aurora/Design/Views/MainView/MainView.xaml
@@ -12,6 +12,7 @@
     </ContentPage.Resources>
     <Grid>
         <Grid.RowDefinitions>
+            <RowDefinition Height="28"/>
             <RowDefinition Height="28"/>
             <RowDefinition Height="*"/>
             <RowDefinition Height="50"/>
@@ -19,12 +20,20 @@
         <!--Header-->
         <StackLayout
             x:Name="Header"
+            Grid.Row="0"
             Orientation="Horizontal">
             <Entry Text="Search"/>
         </StackLayout>
 
+        <!--Title-->
+        <StackLayout
+            Grid.Row="1"
+            x:Name="TitleContainer">
+            <Label Text="{Binding Title}" TextColor="White"/>
+        </StackLayout>
+
         <!--Library Grid-->
-        <Grid Grid.Row="1">
+        <Grid Grid.Row="2">
             <Grid.ColumnDefinitions>
                 <ColumnDefinition Width="150"/>
                 <ColumnDefinition Width="*"/>
@@ -33,7 +42,8 @@
             <navigation:NavigationMenu
              Grid.Column="0"
              x:Name="MasterPage"
-             Items="{Binding Pages}"/>
+             Items="{Binding Pages}"
+             SelectedItem="{Binding SelectedItem}"/>
 
             <views:PageContainer
                  Grid.Column="1"
@@ -45,8 +55,7 @@
         <!--Music Player-->
         <mp:Player
                 x:Name="Player"
-                Grid.Row="2"
-                HorizontalOptions="Center"
+                Grid.Row="3"
                 HeightRequest="50"/>
     </Grid>
 
diff --git a/Aurora/Design/Views/MainView/MainView.xaml.cs b/Aurora/Design/Views/MainView/MainView.xaml.cs
index 15a802f..c09cb8a 100644
--- a/Aurora/Design/Views/MainView/MainView.xaml.cs
+++ b/Aurora/Design/Views/MainView/MainView.xaml.cs
@@ -93,8 +93,6 @@ namespace Aurora.Design.Views.Main
             AssignPlayerControls(vm);
 
             _viewContent.Content = view;
-
-            MasterPage.ListView.SelectedItem = null;
         }
 
         /// <summary>
@@ -129,8 +127,8 @@ namespace Aurora.Design.Views.Main
             vm.OnActive();
 
             _viewContent.Content = view;
+            MasterPage.ListView.SelectedItem = firstNavItem;
 
-            MasterPage.ListView.SelectedItem = screenList.FirstOrDefault();
         }
 
         /// <summary>
diff --git a/Aurora/Design/Views/MainView/MainViewModel.cs b/Aurora/Design/Views/MainView/MainViewModel.cs
index 4048a0f..c2771f1 100644
--- a/Aurora/Design/Views/MainView/MainViewModel.cs
+++ b/Aurora/Design/Views/MainView/MainViewModel.cs
@@ -28,6 +28,30 @@ namespace Aurora.Design.Views.MainView
 
             }
         }
+
+        private NavigationItem _selectedItem;
+        public NavigationItem SelectedItem
+        {
+            get
+            {
+                return _selectedItem;
+            }
+            set
+            {
+                SetProperty(ref _selectedItem, value);
+                OnPropertyChanged("Title");
+            }
+        }
+
+        public string Title
+        {
+            get
+            {
+                return (_selectedItem != null && !string.IsNullOrWhiteSpace(_selectedItem.Title)) ?
+                    _selectedItem.Title : "";
+            }
+        }
+
         public MainViewModel()
         {
             _pages = new ObservableCollection<NavigationItem>(new[]