feat(lyrics)!: scroller sync

AlexanderDotH · May 16, 2023 · 721b1a0 · 721b1a0
1 parent 247f39b
commit 721b1a0
Show file tree

Hide file tree

Showing 6 changed files with 46 additions and 20 deletions.
diff --git a/OpenLyricsClient/Frontend/Models/Custom/Tile/Overlays/TextOverlayViewModel.cs b/OpenLyricsClient/Frontend/Models/Custom/Tile/Overlays/TextOverlayViewModel.cs
@@ -15,6 +15,7 @@
 using OpenLyricsClient.Backend;
 using OpenLyricsClient.Backend.Events.EventArgs;
 using OpenLyricsClient.Backend.Settings.Sections.Lyrics;
+using OpenLyricsClient.Frontend.Structure;
 using OpenLyricsClient.Frontend.Utils;
 using OpenLyricsClient.Shared.Structure.Lyrics;
 using OpenLyricsClient.Shared.Utils;
@@ -29,22 +30,20 @@ public class TextOverlayViewModel : INotifyPropertyChanged
 {
     public event PropertyChangedEventHandler? PropertyChanged;
 
-    private ObservableCollection<(Rect, double, string)> _lines;
+    private ObservableCollection<LyricOverlayElement> _lines;
     private LyricPart _lyricPart;
     private Typeface _typeface;
 
     public ICommand EffectiveViewportChangedCommand { get; }
 
     public TextOverlayViewModel()
     {
-        this._lines = new ObservableCollection<(Rect, double, string)>();
+        this._lines = new ObservableCollection<LyricOverlayElement>();
 
         this._typeface = new Typeface(FontFamily.Parse(
                 "avares://Material.Styles/Fonts/Roboto#Roboto"),
             FontStyle.Normal, this.LyricsWeight);
 
-        this._lyricPart = new LyricPart(0,"");
-
         EffectiveViewportChangedCommand = ReactiveCommand.Create<EffectiveViewportChangedEventArgs>(OnEffectiveViewportChanged);
 
         Core.INSTANCE.SettingsHandler.SettingsChanged += SettingsHandlerOnSettingsChanged;
@@ -62,7 +61,7 @@ private void LyricHandlerOnLyricsPercentageUpdated(object sender, LyricsPercenta
 
     private void OnEffectiveViewportChanged(EffectiveViewportChangedEventArgs e)
     {
-        UpdateLyricsWrapping(e.EffectiveViewport.Width, e.EffectiveViewport.Height);   
+        //UpdateLyricsWrapping(e.EffectiveViewport.Width, e.EffectiveViewport.Height);   
     }
 
     public void UpdateLyricsWrapping(double width, double height)
@@ -72,7 +71,7 @@ public void UpdateLyricsWrapping(double width, double height)
 
         UpdateTextWrappingLines(this.LyricPart.Part, width, height);
     }
-    
+
     private void UpdateTextWrappingLines(string text, double width, double height)
     {
         AList<string> lines = StringUtils.SplitTextToLines(
@@ -83,11 +82,17 @@ private void UpdateTextWrappingLines(string text, double width, double height)
             this.LyricsAlignment,
             this.LyricsSize);
 
-        ObservableCollection<(Rect, double, string)> sizedLines = new ObservableCollection<(Rect, double, string)>();
+        ObservableCollection<LyricOverlayElement> sizedLines = new ObservableCollection<LyricOverlayElement>();
 
         lines.ForEach(l =>
         {
-            sizedLines.Add((MeasureSingleString(l), CalculatePercentage(l, text), l));
+            LyricOverlayElement element = new LyricOverlayElement
+            {
+                Rect = MeasureSingleString(l),
+                Percentage = CalculatePercentage(l, text),
+                Line = l
+            };
+            sizedLines.Add(element);
         });
 
         SetField(ref this._lines, sizedLines);
@@ -97,7 +102,8 @@ private void UpdatePercentage(string text)
     {
         this._lines.ForEach(l =>
         {
-            l.Item2 = CalculatePercentage(l.Item3, text);
+            l.Percentage = CalculatePercentage(l.Line, text);
+            l.Line = l.Line + " " + l.Percentage.ToString();
         });
     }
 
@@ -109,14 +115,14 @@ private double CalculatePercentage(string single, string full)
         return (fullWidth * 0.01) * singleWidth;
     }
 
-    private Rect MeasureSingleString(string line)
+    private Rect MeasureSingleString(string line, TextWrapping wrapping = TextWrapping.NoWrap)
     {
         FormattedText formattedCandidateLine = new FormattedText(
             line, 
             this._typeface, 
             this.LyricsSize, 
             this.LyricsAlignment, 
-            TextWrapping.NoWrap, 
+            wrapping, 
             new Size(double.PositiveInfinity, double.PositiveInfinity));
 
         return formattedCandidateLine.Bounds;
@@ -156,11 +162,10 @@ public LyricPart LyricPart
         set
         {
             SetField(ref this._lyricPart, value);
-            UpdateLyricsWrapping(400, 400);
         }
     }
 
-    public ObservableCollection<(Rect, double, string)> LyricsLines
+    public ObservableCollection<LyricOverlayElement> LyricsLines
     {
         get => this._lines;
     }

diff --git a/OpenLyricsClient/Frontend/Structure/LyricOverlayElement.cs b/OpenLyricsClient/Frontend/Structure/LyricOverlayElement.cs
@@ -0,0 +1,10 @@
+using Avalonia;
+
+namespace OpenLyricsClient.Frontend.Structure;
+
+public class LyricOverlayElement
+{
+    public Rect Rect { get; set; }
+    public double Percentage { get; set; }
+    public string Line { get; set; }
+}
diff --git a/OpenLyricsClient/Frontend/View/Custom/NewLyricsScroller.axaml b/OpenLyricsClient/Frontend/View/Custom/NewLyricsScroller.axaml
@@ -21,7 +21,7 @@
                                IsVisible="False">
                     <ItemsRepeater.ItemTemplate>
                         <DataTemplate DataType="lyrics:LyricPart">
-                            <tile:LyricsTile LyricPart="{Binding}"/>
+                            <tile:LyricsTile LyricPart="{Binding}" Bounds="{}"/>
                         </DataTemplate>
                     </ItemsRepeater.ItemTemplate>
                 </ItemsRepeater>

diff --git a/OpenLyricsClient/Frontend/View/Custom/Tile/LyricsTile.axaml.cs b/OpenLyricsClient/Frontend/View/Custom/Tile/LyricsTile.axaml.cs
@@ -2,6 +2,7 @@
 using Avalonia;
 using Avalonia.Controls;
 using Avalonia.Markup.Xaml;
+using Avalonia.Threading;
 using OpenLyricsClient.Backend;
 using OpenLyricsClient.Backend.Events.EventArgs;
 using OpenLyricsClient.Frontend.View.Custom.Tile.Overlays;
@@ -33,18 +34,17 @@ public LyricsTile()
 
     public void UpdateViewPort(double width, double height)
     {
-        this._overlay.UpdateViewPort(width, height);
+        //this._overlay.UpdateViewPort(width, height);
     }
 
     protected override void OnAttachedToVisualTree(VisualTreeAttachmentEventArgs e)
     {
         base.OnAttachedToVisualTree(e);
-
     }
 
     private void LyricHandlerOnLyricsFound(object sender)
     {
-
+        //Dispatcher.UIThread.InvokeAsync(() => this._overlay.UpdateViewPort(this.Width, this.Height));
     }
 
     private void LyricHandlerOnLyricsPercentageUpdated(object sender, LyricsPercentageUpdatedEventArgs args)

diff --git a/OpenLyricsClient/Frontend/View/Custom/Tile/Overlays/TextOverlay.axaml b/OpenLyricsClient/Frontend/View/Custom/Tile/Overlays/TextOverlay.axaml
@@ -17,14 +17,14 @@
         <i:Interaction.Behaviors>
             <ei:EventTriggerBehavior EventName="EffectiveViewportChanged">
                 <ei:InvokeCommandAction Command="{Binding EffectiveViewportChangedCommand}"
-                                        PassEventArgsToCommand="True" />
+                                        PassEventArgsToCommand="True"/>
             </ei:EventTriggerBehavior>
         </i:Interaction.Behaviors>
 
         <ItemsControl.ItemTemplate>
             <DataTemplate>
                 <TextBlock Name="PART_Block1"
-                           Text="dawdawdawdawdaw"
+                           Text="{Binding Line}"
                            FontSize="{Binding DataContext.LyricsSize, RelativeSource={RelativeSource AncestorType=UserControl}}"
                            FontWeight="{Binding DataContext.LyricsWeight, RelativeSource={RelativeSource AncestorType=UserControl}}"
                            TextAlignment="{Binding DataContext.LyricsAlignment, RelativeSource={RelativeSource AncestorType=UserControl}}"/>

diff --git a/OpenLyricsClient/Frontend/View/Custom/Tile/Overlays/TextOverlay.axaml.cs b/OpenLyricsClient/Frontend/View/Custom/Tile/Overlays/TextOverlay.axaml.cs
@@ -1,8 +1,12 @@
-using Avalonia;
+using System.Diagnostics;
+using Avalonia;
 using Avalonia.Controls;
+using Avalonia.LogicalTree;
 using Avalonia.Markup.Xaml;
+using Avalonia.Threading;
 using OpenLyricsClient.Frontend.Models.Custom.Tile.Overlays;
 using OpenLyricsClient.Shared.Structure.Lyrics;
+using OpenLyricsClient.Shared.Utils;
 
 namespace OpenLyricsClient.Frontend.View.Custom.Tile.Overlays;
 
@@ -29,6 +33,12 @@ private void InitializeComponent()
     {
         AvaloniaXamlLoader.Load(this);
     }
+
+    protected override void OnAttachedToVisualTree(VisualTreeAttachmentEventArgs e)
+    {
+        //this._viewModel.UpdateLyricsWrapping(this.Bounds.Width, this.Bounds.Height);
+        base.OnAttachedToVisualTree(e);
+    }
 
     public void UpdateViewPort(double width, double height)
     {
@@ -44,4 +54,5 @@ public LyricPart LyricPart
             this._viewModel.LyricPart = value;
         }
     }
+
 }