From b4f179d0805c959664e33e2a5dc9b1cbdb888bf5 Mon Sep 17 00:00:00 2001
From: andy840119 <andy840119@gmail.com>
Date: Sat, 24 Aug 2024 14:16:42 +0800
Subject: [PATCH 1/5] Let the test case able to support the skin with shader.

---
 .../Content/TestSceneInteractableLyric.cs       | 17 ++++++++++++++---
 1 file changed, 14 insertions(+), 3 deletions(-)

diff --git a/osu.Game.Rulesets.Karaoke.Tests/Screens/Edit/Beatmap/Lyrics/Content/TestSceneInteractableLyric.cs b/osu.Game.Rulesets.Karaoke.Tests/Screens/Edit/Beatmap/Lyrics/Content/TestSceneInteractableLyric.cs
index 84d5d11b4..98578b4e7 100644
--- a/osu.Game.Rulesets.Karaoke.Tests/Screens/Edit/Beatmap/Lyrics/Content/TestSceneInteractableLyric.cs
+++ b/osu.Game.Rulesets.Karaoke.Tests/Screens/Edit/Beatmap/Lyrics/Content/TestSceneInteractableLyric.cs
@@ -11,6 +11,7 @@
 using osu.Framework.Graphics.Containers;
 using osu.Framework.Graphics.Cursor;
 using osu.Framework.Graphics.Shapes;
+using osu.Framework.IO.Stores;
 using osu.Framework.Testing;
 using osu.Game.Graphics;
 using osu.Game.Rulesets.Karaoke.Beatmaps;
@@ -24,6 +25,7 @@
 using osu.Game.Rulesets.Karaoke.Screens.Edit.Beatmaps.Lyrics.States.Modes;
 using osu.Game.Rulesets.Karaoke.Tests.Helper;
 using osu.Game.Screens.Edit;
+using osu.Game.Skinning;
 using osu.Game.Tests.Visual;
 using osuTK;
 
@@ -170,7 +172,7 @@ public void TestBlueprintLayer()
     }
 
     [BackgroundDependencyLoader]
-    private void load()
+    private void load(OsuGameBase game)
     {
         Dependencies.CacheAs<ILyricsProvider>(new LyricsProvider().With(Add));
         Dependencies.CacheAs<ILyricsChangeHandler>(new LyricsChangeHandler().With(Add));
@@ -178,6 +180,8 @@ private void load()
         Dependencies.CacheAs<ILyricRubyTagsChangeHandler>(new LyricRubyTagsChangeHandler().With(Add));
         Dependencies.CacheAs<ILyricTimeTagsChangeHandler>(new LyricTimeTagsChangeHandler().With(Add));
         Dependencies.Cache(new KaraokeRulesetLyricEditorConfigManager());
+
+        game.Resources.AddStore(new NamespacedResourceStore<byte[]>(new ShaderResourceStore(), "Resources"));
     }
 
     #region Testing tools
@@ -276,7 +280,6 @@ private void updateInteractableLyric()
             Anchor = Anchor.Centre,
             Origin = Anchor.Centre,
             AutoSizeAxes = Axes.Both,
-            Scale = new Vector2(2),
             Children = new Drawable[]
             {
                 new Box
@@ -288,7 +291,15 @@ private void updateInteractableLyric()
                 {
                     AutoSizeAxes = Axes.Both,
                     Padding = new MarginPadding(48),
-                    Child = createInteractableLyric(loaders.ToArray()),
+                    Child = new SkinProvidingContainer(new LyricEditorSkin(null)
+                    {
+                        FontSize = 48,
+                    })
+                    {
+                        RelativeSizeAxes = Axes.None,
+                        AutoSizeAxes = Axes.Both,
+                        Child = createInteractableLyric(loaders.ToArray()),
+                    },
                 },
             },
         });

From 29250955493ddf31195522a123e6e44172e1e409 Mon Sep 17 00:00:00 2001
From: andy840119 <andy840119@gmail.com>
Date: Sat, 24 Aug 2024 14:55:11 +0800
Subject: [PATCH 2/5] Let edit lyric layer able to suppoer change the over
 recording time-tag index.

---
 .../Lyrics/Content/Components/Lyrics/EditLyricLayer.cs       | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/osu.Game.Rulesets.Karaoke/Screens/Edit/Beatmaps/Lyrics/Content/Components/Lyrics/EditLyricLayer.cs b/osu.Game.Rulesets.Karaoke/Screens/Edit/Beatmaps/Lyrics/Content/Components/Lyrics/EditLyricLayer.cs
index 1d3c6b630..a7ad478c4 100644
--- a/osu.Game.Rulesets.Karaoke/Screens/Edit/Beatmaps/Lyrics/Content/Components/Lyrics/EditLyricLayer.cs
+++ b/osu.Game.Rulesets.Karaoke/Screens/Edit/Beatmaps/Lyrics/Content/Components/Lyrics/EditLyricLayer.cs
@@ -1,6 +1,7 @@
 // Copyright (c) andy840119 <andy840119@gmail.com>. Licensed under the GPL Licence.
 // See the LICENCE file in the repository root for full licence text.
 
+using System.Linq;
 using osu.Framework.Allocation;
 using osu.Framework.Input.Events;
 using osu.Game.Rulesets.Karaoke.Edit.ChangeHandlers.Lyrics;
@@ -125,9 +126,13 @@ protected override void OnDragEnd(DragEndEvent e)
             TypingCaretPositionAlgorithm => previewLyricPositionProvider.GetCharIndicatorByPosition(position),
             NavigateCaretPositionAlgorithm => null,
             CreateRubyTagCaretPositionAlgorithm => previewLyricPositionProvider.GetCharIndexByPosition(position),
+            RecordingTimeTagCaretPositionAlgorithm => getTimeTagByIndex(Lyric, previewLyricPositionProvider.GetCharIndexByPosition(position)),
             CreateRemoveTimeTagCaretPositionAlgorithm => previewLyricPositionProvider.GetCharIndexByPosition(position),
             _ => null,
         };
+
+        TimeTag? getTimeTagByIndex(Lyric lyric, int? charIndex)
+            => lyric.TimeTags.FirstOrDefault(tag => tag.Index.Index == charIndex);
     }
 
     #region Double click

From 68f92d1957436b873ce90eb2df3d276d33dd49b6 Mon Sep 17 00:00:00 2001
From: andy840119 <andy840119@gmail.com>
Date: Sat, 24 Aug 2024 14:55:50 +0800
Subject: [PATCH 3/5] Add a new role in the base range caret index: - if user
 is start dragging the caret, should hide the hover caret.

---
 .../Carets/DrawableCreateRubyTagCaret.cs      | 16 ----------------
 .../Lyrics/Carets/DrawableRangeCaret.cs       | 19 +++++++++++++++++++
 2 files changed, 19 insertions(+), 16 deletions(-)

diff --git a/osu.Game.Rulesets.Karaoke/Screens/Edit/Beatmaps/Lyrics/Content/Components/Lyrics/Carets/DrawableCreateRubyTagCaret.cs b/osu.Game.Rulesets.Karaoke/Screens/Edit/Beatmaps/Lyrics/Content/Components/Lyrics/Carets/DrawableCreateRubyTagCaret.cs
index d146c26d3..b6e9d491a 100644
--- a/osu.Game.Rulesets.Karaoke/Screens/Edit/Beatmaps/Lyrics/Content/Components/Lyrics/Carets/DrawableCreateRubyTagCaret.cs
+++ b/osu.Game.Rulesets.Karaoke/Screens/Edit/Beatmaps/Lyrics/Content/Components/Lyrics/Carets/DrawableCreateRubyTagCaret.cs
@@ -28,9 +28,6 @@ public partial class DrawableCreateRubyTagCaret : DrawableRangeCaret<CreateRubyT
     private const float caret_move_time = 60;
     private const float caret_resize_time = 60;
 
-    [Resolved]
-    private ILyricCaretState lyricCaretState { get; set; } = null!;
-
     private readonly SpriteIcon icon;
 
     public DrawableCreateRubyTagCaret(DrawableCaretState state)
@@ -74,19 +71,6 @@ private void load(OsuColour colours)
 
     protected override void ApplyCaretPosition(CreateRubyTagCaretPosition caret)
     {
-        // should not show the hover caret if already contains the selected range.
-        if (State == DrawableCaretState.Hover)
-        {
-            bool isClickToThisCaret = lyricCaretState.CaretPosition?.Lyric == caret.Lyric;
-            bool isDraggingToThisCaret = lyricCaretState.RangeCaretPosition?.IsInRange(caret.Lyric) ?? false;
-
-            if (isClickToThisCaret || isDraggingToThisCaret)
-            {
-                Hide();
-                return;
-            }
-        }
-
         startCharIndex = caret.CharIndex;
         endCharIndex = caret.CharIndex;
 
diff --git a/osu.Game.Rulesets.Karaoke/Screens/Edit/Beatmaps/Lyrics/Content/Components/Lyrics/Carets/DrawableRangeCaret.cs b/osu.Game.Rulesets.Karaoke/Screens/Edit/Beatmaps/Lyrics/Content/Components/Lyrics/Carets/DrawableRangeCaret.cs
index 4a7ef7f8a..f12fe92db 100644
--- a/osu.Game.Rulesets.Karaoke/Screens/Edit/Beatmaps/Lyrics/Content/Components/Lyrics/Carets/DrawableRangeCaret.cs
+++ b/osu.Game.Rulesets.Karaoke/Screens/Edit/Beatmaps/Lyrics/Content/Components/Lyrics/Carets/DrawableRangeCaret.cs
@@ -2,6 +2,8 @@
 // See the LICENCE file in the repository root for full licence text.
 
 using System;
+using osu.Framework.Allocation;
+using osu.Framework.Bindables;
 using osu.Game.Rulesets.Karaoke.Screens.Edit.Beatmaps.Lyrics.CaretPosition;
 using osu.Game.Rulesets.Karaoke.Screens.Edit.Beatmaps.Lyrics.States;
 
@@ -10,9 +12,26 @@ namespace osu.Game.Rulesets.Karaoke.Screens.Edit.Beatmaps.Lyrics.Content.Compone
 public abstract partial class DrawableRangeCaret<TCaretPosition> : DrawableCaret, ICanAcceptRangeIndex
     where TCaretPosition : struct, IIndexCaretPosition
 {
+    private readonly IBindable<RangeCaretPosition?> bindableRangeCaretPosition = new Bindable<RangeCaretPosition?>();
+
     protected DrawableRangeCaret(DrawableCaretState state)
         : base(state)
     {
+        // should auto hide the hover caret if selecting.
+        bindableRangeCaretPosition.BindValueChanged(x =>
+        {
+            if (State != DrawableCaretState.Hover)
+                return;
+
+            if (x.NewValue != null)
+                Hide();
+        });
+    }
+
+    [BackgroundDependencyLoader]
+    private void load(ILyricCaretState lyricCaretState)
+    {
+        bindableRangeCaretPosition.BindTo(lyricCaretState.BindableRangeCaretPosition);
     }
 
     public sealed override void ApplyCaretPosition(ICaretPosition caret)

From 6cd8bfdce9bae99921fdf22c0d0bd04c9f43a02f Mon Sep 17 00:00:00 2001
From: andy840119 <andy840119@gmail.com>
Date: Sat, 24 Aug 2024 15:27:09 +0800
Subject: [PATCH 4/5] Typing caret's width should be fixed and in the center
 between texts.

---
 .../Lyrics/Carets/DrawableTypingCaret.cs        | 17 ++++++++++++++---
 1 file changed, 14 insertions(+), 3 deletions(-)

diff --git a/osu.Game.Rulesets.Karaoke/Screens/Edit/Beatmaps/Lyrics/Content/Components/Lyrics/Carets/DrawableTypingCaret.cs b/osu.Game.Rulesets.Karaoke/Screens/Edit/Beatmaps/Lyrics/Content/Components/Lyrics/Carets/DrawableTypingCaret.cs
index 377b2973f..bb171185e 100644
--- a/osu.Game.Rulesets.Karaoke/Screens/Edit/Beatmaps/Lyrics/Content/Components/Lyrics/Carets/DrawableTypingCaret.cs
+++ b/osu.Game.Rulesets.Karaoke/Screens/Edit/Beatmaps/Lyrics/Content/Components/Lyrics/Carets/DrawableTypingCaret.cs
@@ -24,7 +24,7 @@ public partial class DrawableTypingCaret : DrawableRangeCaret<TypingCaretPositio
     private const float fading_time = 200;
     private const float caret_move_time = 60;
     private const float caret_resize_time = 60;
-    private const float caret_width = 3;
+    private const float caret_width = 2;
 
     private readonly Box drawableCaret;
     private readonly TypingCaretEventHandler? typingCaretEventHandler;
@@ -75,7 +75,7 @@ protected override void ApplyCaretPosition(TypingCaretPosition caret)
         typingCaretEventHandler?.ChangeCharGapAndOffset(caret.CharGap);
         typingCaretEventHandler?.FocusInputCaretTextBox();
 
-        var rect = LyricPositionProvider.GetRectByCharIndicator(caret.CharGap);
+        var rect = toRectWithFixedWidth(LyricPositionProvider.GetRectByCharIndicator(caret.CharGap));
         changeTheSizeByRect(rect);
     }
 
@@ -88,10 +88,21 @@ protected override void ApplyRangeCaretPosition(RangeCaretPosition<TypingCaretPo
         typingCaretEventHandler?.ChangeCharGapAndOffset(maxGap, maxGap - minGap);
         typingCaretEventHandler?.FocusInputCaretTextBox();
 
-        var rect = RectangleF.Union(LyricPositionProvider.GetRectByCharIndicator(minGap), LyricPositionProvider.GetRectByCharIndicator(maxGap));
+        var minGapRect = toRectWithFixedWidth(LyricPositionProvider.GetRectByCharIndicator(minGap));
+        var maxGapRect = toRectWithFixedWidth(LyricPositionProvider.GetRectByCharIndicator(maxGap));
+
+        var rect = RectangleF.Union(minGapRect, maxGapRect);
         changeTheSizeByRect(rect);
     }
 
+    private RectangleF toRectWithFixedWidth(RectangleF rect)
+    {
+        var position = rect.TopLeft + new Vector2(rect.Width / 2 - caret_width / 2, 0);
+        var size = new Vector2(caret_width, rect.Height);
+
+        return new RectangleF(position, size);
+    }
+
     private void changeTheSizeByRect(RectangleF rect)
     {
         var position = rect.TopLeft - new Vector2(caret_width / 2, 0);

From 65de336d6e8f0643014392406e5a17da709bcfc8 Mon Sep 17 00:00:00 2001
From: andy840119 <andy840119@gmail.com>
Date: Sat, 24 Aug 2024 15:19:41 +0800
Subject: [PATCH 5/5] Make the idol/hover caret state better.

---
 .../DrawableCreateRemoveTimeTagCaret.cs       | 18 ++++--
 .../Lyrics/Carets/DrawableCuttingCaret.cs     |  6 +-
 .../Carets/DrawableRecordingTimeTagCaret.cs   | 55 ++++++++++++-------
 3 files changed, 52 insertions(+), 27 deletions(-)

diff --git a/osu.Game.Rulesets.Karaoke/Screens/Edit/Beatmaps/Lyrics/Content/Components/Lyrics/Carets/DrawableCreateRemoveTimeTagCaret.cs b/osu.Game.Rulesets.Karaoke/Screens/Edit/Beatmaps/Lyrics/Content/Components/Lyrics/Carets/DrawableCreateRemoveTimeTagCaret.cs
index 30bb20291..45541384f 100644
--- a/osu.Game.Rulesets.Karaoke/Screens/Edit/Beatmaps/Lyrics/Content/Components/Lyrics/Carets/DrawableCreateRemoveTimeTagCaret.cs
+++ b/osu.Game.Rulesets.Karaoke/Screens/Edit/Beatmaps/Lyrics/Content/Components/Lyrics/Carets/DrawableCreateRemoveTimeTagCaret.cs
@@ -27,8 +27,8 @@ public partial class DrawableCreateRemoveTimeTagCaret : DrawableCaret<CreateRemo
 {
     private const float border_spacing = 5;
 
-    private readonly TimeTagsInfo startTimeTagInfo;
-    private readonly TimeTagsInfo endTimeTagInfo;
+    private readonly TimeTagsInfo? startTimeTagInfo;
+    private readonly TimeTagsInfo? endTimeTagInfo;
 
     public DrawableCreateRemoveTimeTagCaret(DrawableCaretState state)
         : base(state)
@@ -42,6 +42,7 @@ public DrawableCreateRemoveTimeTagCaret(DrawableCaretState state)
                 BorderThickness = border_spacing,
                 BorderColour = Colour4.White,
                 RelativeSizeAxes = Axes.Both,
+                Alpha = GetAlpha(state),
                 Child = new Box
                 {
                     RelativeSizeAxes = Axes.Both,
@@ -49,6 +50,13 @@ public DrawableCreateRemoveTimeTagCaret(DrawableCaretState state)
                     Alpha = 0.1f,
                 },
             },
+        };
+
+        if (state != DrawableCaretState.Idle)
+            return;
+
+        AddRangeInternal(new[]
+        {
             startTimeTagInfo = new TimeTagsInfo(TextIndex.IndexState.Start)
             {
                 X = 18,
@@ -63,7 +71,7 @@ public DrawableCreateRemoveTimeTagCaret(DrawableCaretState state)
                 Origin = Anchor.CentreLeft,
                 Alpha = GetAlpha(state),
             },
-        };
+        });
     }
 
     protected override void ApplyCaretPosition(CreateRemoveTimeTagCaretPosition caret)
@@ -73,8 +81,8 @@ protected override void ApplyCaretPosition(CreateRemoveTimeTagCaretPosition care
         Position = rect.TopLeft - new Vector2(border_spacing);
         Size = rect.Size + new Vector2(border_spacing * 2);
 
-        startTimeTagInfo.UpdateCaretPosition(caret);
-        endTimeTagInfo.UpdateCaretPosition(caret);
+        startTimeTagInfo?.UpdateCaretPosition(caret);
+        endTimeTagInfo?.UpdateCaretPosition(caret);
     }
 
     protected override void TriggerDisallowEditEffect(OsuColour colour)
diff --git a/osu.Game.Rulesets.Karaoke/Screens/Edit/Beatmaps/Lyrics/Content/Components/Lyrics/Carets/DrawableCuttingCaret.cs b/osu.Game.Rulesets.Karaoke/Screens/Edit/Beatmaps/Lyrics/Content/Components/Lyrics/Carets/DrawableCuttingCaret.cs
index 3809900eb..8c30b2b23 100644
--- a/osu.Game.Rulesets.Karaoke/Screens/Edit/Beatmaps/Lyrics/Content/Components/Lyrics/Carets/DrawableCuttingCaret.cs
+++ b/osu.Game.Rulesets.Karaoke/Screens/Edit/Beatmaps/Lyrics/Content/Components/Lyrics/Carets/DrawableCuttingCaret.cs
@@ -15,13 +15,15 @@ namespace osu.Game.Rulesets.Karaoke.Screens.Edit.Beatmaps.Lyrics.Content.Compone
 
 public partial class DrawableCuttingCaret : DrawableCaret<CuttingCaretPosition>
 {
+    private const float caret_width = 10;
+
     private readonly Container splitter;
     private readonly SpriteIcon splitIcon;
 
     public DrawableCuttingCaret(DrawableCaretState state)
         : base(state)
     {
-        Width = 10;
+        Width = caret_width;
         Origin = Anchor.TopCentre;
 
         InternalChildren = new Drawable[]
@@ -87,7 +89,7 @@ protected override void ApplyCaretPosition(CuttingCaretPosition caret)
     {
         var rect = LyricPositionProvider.GetRectByCharIndicator(caret.CharGap);
 
-        Position = rect.TopLeft;
+        Position = rect.TopLeft + new Vector2(rect.Width / 2 - caret_width / 2, 0);
         Height = rect.Height;
     }
 
diff --git a/osu.Game.Rulesets.Karaoke/Screens/Edit/Beatmaps/Lyrics/Content/Components/Lyrics/Carets/DrawableRecordingTimeTagCaret.cs b/osu.Game.Rulesets.Karaoke/Screens/Edit/Beatmaps/Lyrics/Content/Components/Lyrics/Carets/DrawableRecordingTimeTagCaret.cs
index 4907cc91d..b26f9269a 100644
--- a/osu.Game.Rulesets.Karaoke/Screens/Edit/Beatmaps/Lyrics/Content/Components/Lyrics/Carets/DrawableRecordingTimeTagCaret.cs
+++ b/osu.Game.Rulesets.Karaoke/Screens/Edit/Beatmaps/Lyrics/Content/Components/Lyrics/Carets/DrawableRecordingTimeTagCaret.cs
@@ -21,8 +21,8 @@ public partial class DrawableRecordingTimeTagCaret : DrawableCaret<RecordingTime
     private const float caret_resize_time = 60;
 
     // should be list of indexes.
-    private readonly TextIndexInfo textIndexInfo;
-    private readonly Box indicator;
+    private readonly TextIndexInfo? textIndexInfo;
+    private readonly Box? indicator;
 
     public DrawableRecordingTimeTagCaret(DrawableCaretState state)
         : base(state)
@@ -43,18 +43,25 @@ public DrawableRecordingTimeTagCaret(DrawableCaretState state)
                     Alpha = 0.1f,
                 },
             },
-            textIndexInfo = new TextIndexInfo
-            {
-                Y = -10,
-                Alpha = GetAlpha(state),
-            },
-            indicator = new Box
-            {
-                Width = border_spacing,
-                RelativeSizeAxes = Axes.Y,
-                Alpha = GetAlpha(state),
-            },
         };
+
+        if (state == DrawableCaretState.Idle)
+        {
+            AddRangeInternal(new Drawable[]
+            {
+                textIndexInfo = new TextIndexInfo
+                {
+                    Y = -10,
+                    Alpha = GetAlpha(state),
+                },
+                indicator = new Box
+                {
+                    Width = border_spacing,
+                    RelativeSizeAxes = Axes.Y,
+                    Alpha = GetAlpha(state),
+                },
+            });
+        }
     }
 
     protected override void ApplyCaretPosition(RecordingTimeTagCaretPosition caret)
@@ -67,13 +74,21 @@ protected override void ApplyCaretPosition(RecordingTimeTagCaretPosition caret)
 
         // update the caret.
         changeTheSizeByRect(rect);
-        textIndexInfo.Anchor = TextIndexUtils.GetValueByState(timeTag.Index, Anchor.TopLeft, Anchor.TopRight);
-        textIndexInfo.Origin = TextIndexUtils.GetValueByState(timeTag.Index, Anchor.BottomLeft, Anchor.BottomRight);
-        textIndexInfo.X = TextIndexUtils.GetValueByState(timeTag.Index, -10, 10);
-        textIndexInfo.UpdateCaret(caret);
-        indicator.Colour = Colours.GetRecordingTimeTagCaretColour(timeTag);
-        indicator.Anchor = TextIndexUtils.GetValueByState(timeTag.Index, Anchor.CentreLeft, Anchor.CentreRight);
-        indicator.Origin = TextIndexUtils.GetValueByState(timeTag.Index, Anchor.CentreLeft, Anchor.CentreRight);
+
+        if (textIndexInfo != null)
+        {
+            textIndexInfo.Anchor = TextIndexUtils.GetValueByState(timeTag.Index, Anchor.TopLeft, Anchor.TopRight);
+            textIndexInfo.Origin = TextIndexUtils.GetValueByState(timeTag.Index, Anchor.BottomLeft, Anchor.BottomRight);
+            textIndexInfo.X = TextIndexUtils.GetValueByState(timeTag.Index, -10, 10);
+            textIndexInfo.UpdateCaret(caret);
+        }
+
+        if (indicator != null)
+        {
+            indicator.Colour = Colours.GetRecordingTimeTagCaretColour(timeTag);
+            indicator.Anchor = TextIndexUtils.GetValueByState(timeTag.Index, Anchor.CentreLeft, Anchor.CentreRight);
+            indicator.Origin = TextIndexUtils.GetValueByState(timeTag.Index, Anchor.CentreLeft, Anchor.CentreRight);
+        }
     }
 
     private void changeTheSizeByRect(RectangleF rect)