move editor snaps to the bottom

fluXis.Game/Graphics/UserInterface/Color/FluXisColors.cs

@@ -225,6 +225,36 @@ public static int GetLaneColorIndex(int lane, int keyCount)
         };
     }
 
+    public static Colour4 GetSnapColor(int divisor)
+    {
+        switch (divisor)
+        {
+            case 1:
+                return Colour4.FromHex("#FF5555");
+
+            case 2:
+                return Colour4.FromHex("#558EFF");
+
+            case 3:
+                return Colour4.FromHex("#8EFF55");
+
+            case 4:
+                return Colour4.FromHex("#FFE355");
+
+            case 6:
+                return Colour4.FromHex("#C655FF");
+
+            case 8:
+                return Colour4.FromHex("#55FFAA");
+
+            case 12:
+                return Colour4.FromHex("#FF55AA");
+
+            default:
+                return Colour4.FromHex("#BFBFBF");
+        }
+    }
+
     public static Colour4 GetEditorSnapColor(int divisor, int val, int i)
     {
         switch (divisor)

fluXis.Game/Overlay/Mouse/GlobalTooltipContainer.cs

@@ -1,5 +1,5 @@
 using fluXis.Game.Graphics;
-using fluXis.Game.Graphics.Sprites;
+using fluXis.Game.Graphics.UserInterface.Text;
 using osu.Framework.Graphics;
 using osu.Framework.Graphics.Cursor;
 using osu.Framework.Localisation;
@@ -19,7 +19,8 @@ public GlobalTooltipContainer(CursorContainer cursor)
 
     public partial class TextTooltip : CustomTooltipContainer<LocalisableString>
     {
-        private FluXisSpriteText text { get; }
+        private FluXisTextFlow text { get; }
+        private LocalisableString currentText;
 
         public TextTooltip()
         {
@@ -28,19 +29,20 @@ public TextTooltip()
             AutoSizeEasing = Easing.OutQuint;
             EdgeEffect = FluXisStyles.ShadowSmall;
 
-            Child = text = new FluXisSpriteText
+            Child = text = new FluXisTextFlow()
             {
+                AutoSizeAxes = Axes.Both,
                 WebFontSize = 16,
                 Padding = new MarginPadding { Horizontal = 10, Vertical = 6 }
             };
         }
 
         public override void SetContent(LocalisableString content)
         {
-            if (content == text.Text)
+            if (content == currentText)
                 return;
 
-            text.Text = content;
+            text.Text = currentText = content;
             AutoSizeDuration = IsPresent ? 250 : 0;
         }
     }

fluXis.Game/Screens/Edit/BottomBar/EditorBottomBar.cs

@@ -62,6 +62,7 @@ private void load()
                     {
                         new(GridSizeMode.Absolute, 200),
                         new(),
+                        new(GridSizeMode.Absolute, 96),
                         new(GridSizeMode.Absolute, 300),
                         new(GridSizeMode.Absolute, 270)
                     },
@@ -88,6 +89,7 @@ private void load()
                                     }
                                 }
                             },
+                            new SnapControl(),
                             new VariableControl(),
                             new Container
                             {

fluXis.Game/Screens/Edit/BottomBar/Snap/SnapControlPopover.cs

@@ -0,0 +1,109 @@
+using System;
+using System.Linq;
+using fluXis.Game.Audio;
+using fluXis.Game.Graphics.Sprites;
+using fluXis.Game.Skinning;
+using fluXis.Game.Utils;
+using osu.Framework.Allocation;
+using osu.Framework.Extensions;
+using osu.Framework.Graphics;
+using osu.Framework.Graphics.Containers;
+using osu.Framework.Graphics.Shapes;
+using osu.Framework.Input.Events;
+using osuTK;
+
+namespace fluXis.Game.Screens.Edit.BottomBar.Snap;
+
+public partial class SnapControlPopover : CompositeDrawable
+{
+    [Resolved]
+    private EditorSettings settings { get; set; }
+
+    [BackgroundDependencyLoader]
+    private void load()
+    {
+        AutoSizeAxes = Axes.Both;
+
+        InternalChild = new FillFlowContainer
+        {
+            AutoSizeAxes = Axes.Both,
+            Direction = FillDirection.Full,
+            MaximumSize = new Vector2(196, 0),
+            ChildrenEnumerable = SnapControl.DefaultSnaps.Select(snap => new SnapChip(snap, updateSnap))
+        };
+    }
+
+    private void updateSnap(int num)
+    {
+        settings.SnapDivisor = num;
+        this.HidePopover();
+    }
+
+    private partial class SnapChip : CompositeDrawable
+    {
+        [Resolved]
+        private UISamples samples { get; set; }
+
+        private int snap { get; }
+        private Action<int> action { get; }
+
+        private Box hover;
+        private Box flash;
+
+        public SnapChip(int snap, Action<int> action)
+        {
+            this.snap = snap;
+            this.action = action;
+        }
+
+        [BackgroundDependencyLoader]
+        private void load(SkinManager skinManager)
+        {
+            Size = new Vector2(96, 42);
+
+            var idx = Array.IndexOf(SnapControl.DefaultSnaps, snap);
+            Colour = skinManager.SkinJson.SnapColors.GetColor(idx);
+
+            InternalChildren = new Drawable[]
+            {
+                hover = new Box
+                {
+                    RelativeSizeAxes = Axes.Both,
+                    Alpha = 0
+                },
+                flash = new Box
+                {
+                    RelativeSizeAxes = Axes.Both,
+                    Alpha = 0
+                },
+                new FluXisSpriteText
+                {
+                    Text = $"1/{snap.ToOrdinalShort(true)}",
+                    WebFontSize = 14,
+                    Anchor = Anchor.Centre,
+                    Origin = Anchor.Centre
+                }
+            };
+        }
+
+        protected override bool OnHover(HoverEvent e)
+        {
+            hover.FadeTo(.2f, 50);
+            samples.Hover();
+            return true;
+        }
+
+        protected override void OnHoverLost(HoverLostEvent e)
+        {
+            hover.FadeOut(200);
+        }
+
+        protected override bool OnClick(ClickEvent e)
+        {
+            samples.Click();
+            flash.FadeOutFromOne(1000, Easing.OutQuint);
+            action?.Invoke(snap);
+            return true;
+        }
+    }
+}

fluXis.Game/Screens/Edit/BottomBar/SnapControl.cs

@@ -0,0 +1,106 @@
+using System;
+using fluXis.Game.Audio;
+using fluXis.Game.Graphics.Containers;
+using fluXis.Game.Graphics.Sprites;
+using fluXis.Game.Screens.Edit.BottomBar.Snap;
+using fluXis.Game.Skinning;
+using fluXis.Game.Utils;
+using osu.Framework.Allocation;
+using osu.Framework.Extensions;
+using osu.Framework.Graphics;
+using osu.Framework.Graphics.Containers;
+using osu.Framework.Graphics.Cursor;
+using osu.Framework.Graphics.Shapes;
+using osu.Framework.Graphics.UserInterface;
+using osu.Framework.Input.Events;
+using osu.Framework.Localisation;
+
+namespace fluXis.Game.Screens.Edit.BottomBar;
+
+public partial class SnapControl : CompositeDrawable, IHasPopover, IHasTooltip
+{
+    public static int[] DefaultSnaps { get; } = { 1, 2, 3, 4, 6, 8, 12, 16 };
+
+    public LocalisableString TooltipText => "The current beat snap.\nCan also be changed by shift-scrolling.";
+
+    private FluXisSpriteText text;
+
+    [Resolved]
+    private EditorSettings settings { get; set; }
+
+    [Resolved]
+    private UISamples samples { get; set; }
+
+    [Resolved]
+    private SkinManager skinManager { get; set; }
+
+    private Box hover;
+    private Box flash;
+
+    [BackgroundDependencyLoader]
+    private void load()
+    {
+        RelativeSizeAxes = Axes.Both;
+
+        InternalChildren = new Drawable[]
+        {
+            hover = new Box
+            {
+                RelativeSizeAxes = Axes.Both,
+                Alpha = 0
+            },
+            flash = new Box
+            {
+                RelativeSizeAxes = Axes.Both,
+                Alpha = 0
+            },
+            text = new FluXisSpriteText
+            {
+                WebFontSize = 16,
+                Anchor = Anchor.Centre,
+                Origin = Anchor.Centre
+            }
+        };
+    }
+
+    protected override void LoadComplete()
+    {
+        base.LoadComplete();
+
+        settings.SnapDivisorBindable.BindValueChanged(e =>
+        {
+            var snap = e.NewValue;
+            text.Text = $"1/{snap.ToOrdinalShort(true)}";
+
+            var idx = Array.IndexOf(DefaultSnaps, snap);
+            Colour = skinManager.SkinJson.SnapColors.GetColor(idx);
+        }, true);
+    }
+
+    protected override bool OnHover(HoverEvent e)
+    {
+        hover.FadeTo(.2f, 50);
+        samples.Hover();
+        return true;
+    }
+
+    protected override void OnHoverLost(HoverLostEvent e)
+    {
+        hover.FadeOut(200);
+    }
+
+    protected override bool OnClick(ClickEvent e)
+    {
+        samples.Click();
+        flash.FadeOutFromOne(1000, Easing.OutQuint);
+        this.ShowPopover();
+        return true;
+    }
+
+    public Popover GetPopover() => new FluXisPopover
+    {
+        ContentPadding = 0,
+        BodyRadius = 12,
+        Child = new SnapControlPopover()
+    };
+}