Create a control for filtering mods on a leaderboard (#5634)

Create a control for filtering mods on a leaderboard

Co-authored-by: Dean Herbert <pe@ppy.sh>

osu.Game.Tests/Visual/Online/TestSceneLeaderboardModSelector.cs

@@ -0,0 +1,77 @@
+// Copyright (c) ppy Pty Ltd <contact@ppy.sh>. Licensed under the MIT Licence.
+// See the LICENCE file in the repository root for full licence text.
+
+using osu.Game.Overlays.BeatmapSet;
+using System;
+using System.Collections.Generic;
+using osu.Framework.Graphics;
+using osu.Game.Rulesets.Osu;
+using osu.Game.Rulesets.Mania;
+using osu.Game.Rulesets.Taiko;
+using osu.Game.Rulesets.Catch;
+using osu.Framework.Graphics.Containers;
+using osu.Framework.Graphics.Sprites;
+using osu.Framework.Extensions.IEnumerableExtensions;
+using osu.Framework.Bindables;
+using osu.Game.Rulesets;
+
+namespace osu.Game.Tests.Visual.Online
+{
+    public class TestSceneLeaderboardModSelector : OsuTestScene
+    {
+        public override IReadOnlyList<Type> RequiredTypes => new[]
+        {
+            typeof(LeaderboardModSelector),
+        };
+
+        public TestSceneLeaderboardModSelector()
+        {
+            LeaderboardModSelector modSelector;
+            FillFlowContainer<SpriteText> selectedMods;
+            var ruleset = new Bindable<RulesetInfo>();
+
+            Add(selectedMods = new FillFlowContainer<SpriteText>
+            {
+                Anchor = Anchor.TopLeft,
+                Origin = Anchor.TopLeft,
+            });
+
+            Add(modSelector = new LeaderboardModSelector
+            {
+                Anchor = Anchor.Centre,
+                Origin = Anchor.Centre,
+                Ruleset = { BindTarget = ruleset }
+            });
+
+            modSelector.SelectedMods.ItemsAdded += mods =>
+            {
+                mods.ForEach(mod => selectedMods.Add(new SpriteText
+                {
+                    Text = mod.Acronym,
+                }));
+            };
+
+            modSelector.SelectedMods.ItemsRemoved += mods =>
+            {
+                mods.ForEach(mod =>
+                {
+                    foreach (var selected in selectedMods)
+                    {
+                        if (selected.Text == mod.Acronym)
+                        {
+                            selectedMods.Remove(selected);
+                            break;
+                        }
+                    }
+                });
+            };
+
+            AddStep("osu ruleset", () => ruleset.Value = new OsuRuleset().RulesetInfo);
+            AddStep("mania ruleset", () => ruleset.Value = new ManiaRuleset().RulesetInfo);
+            AddStep("taiko ruleset", () => ruleset.Value = new TaikoRuleset().RulesetInfo);
+            AddStep("catch ruleset", () => ruleset.Value = new CatchRuleset().RulesetInfo);
+            AddStep("Deselect all", () => modSelector.DeselectAll());
+            AddStep("null ruleset", () => ruleset.Value = null);
+        }
+    }
+}

osu.Game/Overlays/BeatmapSet/LeaderboardModSelector.cs

@@ -0,0 +1,144 @@
+// Copyright (c) ppy Pty Ltd <contact@ppy.sh>. Licensed under the MIT Licence.
+// See the LICENCE file in the repository root for full licence text.
+
+using osu.Framework.Graphics.Containers;
+using osu.Framework.Graphics;
+using osu.Game.Rulesets.Mods;
+using osu.Framework.Bindables;
+using osu.Game.Rulesets;
+using osuTK;
+using osu.Game.Rulesets.UI;
+using osu.Framework.Input.Events;
+using osu.Game.Graphics.UserInterface;
+using osuTK.Graphics;
+using System;
+using System.Linq;
+using osu.Framework.Extensions.IEnumerableExtensions;
+
+namespace osu.Game.Overlays.BeatmapSet
+{
+    public class LeaderboardModSelector : CompositeDrawable
+    {
+        public readonly BindableList<Mod> SelectedMods = new BindableList<Mod>();
+        public readonly Bindable<RulesetInfo> Ruleset = new Bindable<RulesetInfo>();
+
+        private readonly FillFlowContainer<ModButton> modsContainer;
+
+        public LeaderboardModSelector()
+        {
+            AutoSizeAxes = Axes.Both;
+            InternalChild = modsContainer = new FillFlowContainer<ModButton>
+            {
+                Anchor = Anchor.Centre,
+                Origin = Anchor.Centre,
+                AutoSizeAxes = Axes.Both,
+                Direction = FillDirection.Full,
+                Spacing = new Vector2(4),
+            };
+        }
+
+        protected override void LoadComplete()
+        {
+            base.LoadComplete();
+            Ruleset.BindValueChanged(onRulesetChanged, true);
+        }
+
+        private void onRulesetChanged(ValueChangedEvent<RulesetInfo> ruleset)
+        {
+            SelectedMods.Clear();
+            modsContainer.Clear();
+
+            if (ruleset.NewValue == null)
+                return;
+
+            modsContainer.Add(new ModButton(new ModNoMod()));
+            modsContainer.AddRange(ruleset.NewValue.CreateInstance().GetAllMods().Where(m => m.Ranked).Select(m => new ModButton(m)));
+
+            modsContainer.ForEach(button => button.OnSelectionChanged = selectionChanged);
+        }
+
+        protected override bool OnHover(HoverEvent e)
+        {
+            updateHighlighted();
+            return base.OnHover(e);
+        }
+
+        protected override void OnHoverLost(HoverLostEvent e)
+        {
+            base.OnHoverLost(e);
+            updateHighlighted();
+        }
+
+        private void selectionChanged(Mod mod, bool selected)
+        {
+            if (selected)
+                SelectedMods.Add(mod);
+            else
+                SelectedMods.Remove(mod);
+
+            updateHighlighted();
+        }
+
+        private void updateHighlighted()
+        {
+            if (SelectedMods.Any())
+                return;
+
+            modsContainer.Children.Where(button => !button.IsHovered).ForEach(button => button.Highlighted.Value = !IsHovered);
+        }
+
+        public void DeselectAll() => modsContainer.ForEach(mod => mod.Selected.Value = false);
+
+        private class ModButton : ModIcon
+        {
+            private const int duration = 200;
+
+            public readonly BindableBool Highlighted = new BindableBool();
+            public Action<Mod, bool> OnSelectionChanged;
+
+            public ModButton(Mod mod)
+                : base(mod)
+            {
+                Scale = new Vector2(0.4f);
+                Add(new HoverClickSounds());
+            }
+
+            protected override void LoadComplete()
+            {
+                base.LoadComplete();
+
+                Highlighted.BindValueChanged(highlighted =>
+                {
+                    if (Selected.Value)
+                        return;
+
+                    this.FadeColour(highlighted.NewValue ? Color4.White : Color4.DimGray, duration, Easing.OutQuint);
+                }, true);
+
+                Selected.BindValueChanged(selected =>
+                {
+                    OnSelectionChanged?.Invoke(Mod, selected.NewValue);
+                    Highlighted.TriggerChange();
+                }, true);
+            }
+
+            protected override bool OnClick(ClickEvent e)
+            {
+                Selected.Toggle();
+                return true;
+            }
+
+            protected override bool OnHover(HoverEvent e)
+            {
+                Highlighted.Value = true;
+                return false;
+            }
+
+            protected override void OnHoverLost(HoverLostEvent e)
+            {
+                base.OnHoverLost(e);
+                Highlighted.Value = false;
+            }
+        }
+    }
+}

osu.Game/Overlays/Mods/ModButton.cs

@@ -96,7 +96,7 @@ namespace osu.Game.Overlays.Mods
                 }
             }
 
-            foregroundIcon.Highlighted.Value = Selected;
+            foregroundIcon.Selected.Value = Selected;
 
             SelectionChanged?.Invoke(SelectedMod);
             return true;

osu.Game/Rulesets/Mods/ModNoMod.cs

@@ -1,6 +1,8 @@
 // Copyright (c) ppy Pty Ltd <contact@ppy.sh>. Licensed under the MIT Licence.
 // See the LICENCE file in the repository root for full licence text.
 
+using osu.Framework.Graphics.Sprites;
+
 namespace osu.Game.Rulesets.Mods
 {
     /// <summary>
@@ -11,5 +13,7 @@ namespace osu.Game.Rulesets.Mods
         public override string Name => "No Mod";
         public override string Acronym => "NM";
         public override double ScoreMultiplier => 1;
+        public override IconUsage Icon => FontAwesome.Solid.Ban;
+        public override ModType Type => ModType.System;
     }
 }

osu.Game/Rulesets/UI/ModIcon.cs

@@ -17,7 +17,7 @@ namespace osu.Game.Rulesets.UI
 {
     public class ModIcon : Container, IHasTooltip
     {
-        public readonly BindableBool Highlighted = new BindableBool();
+        public readonly BindableBool Selected = new BindableBool();
 
         private readonly SpriteIcon modIcon;
         private readonly SpriteIcon background;
@@ -34,9 +34,11 @@ namespace osu.Game.Rulesets.UI
 
         public virtual string TooltipText { get; }
 
+        protected Mod Mod { get; private set; }
+
         public ModIcon(Mod mod)
         {
-            if (mod == null) throw new ArgumentNullException(nameof(mod));
+            Mod = mod ?? throw new ArgumentNullException(nameof(mod));
 
             type = mod.Type;
 
@@ -98,13 +100,19 @@ namespace osu.Game.Rulesets.UI
                     backgroundColour = colours.Pink;
                     highlightedColour = colours.PinkLight;
                     break;
+
+                case ModType.System:
+                    backgroundColour = colours.Gray6;
+                    highlightedColour = colours.Gray7;
+                    modIcon.Colour = colours.Yellow;
+                    break;
             }
         }
 
         protected override void LoadComplete()
         {
             base.LoadComplete();
-            Highlighted.BindValueChanged(highlighted => background.Colour = highlighted.NewValue ? highlightedColour : backgroundColour, true);
+            Selected.BindValueChanged(selected => background.Colour = selected.NewValue ? highlightedColour : backgroundColour, true);
         }
     }
 }