Display basic statistics on card hover

osu.Game.Tests/Visual/Beatmaps/TestSceneBeatmapCard.cs

@@ -31,11 +31,20 @@ namespace osu.Game.Tests.Visual.Beatmaps
             normal.HasVideo = true;
             normal.HasStoryboard = true;
 
+            var withStatistics = CreateAPIBeatmapSet(Ruleset.Value);
+            withStatistics.Status = BeatmapSetOnlineStatus.Approved;
+            withStatistics.FavouriteCount = 284_239;
+            withStatistics.PlayCount = 999_001;
+            withStatistics.Ranked = DateTimeOffset.Now.AddDays(-45);
+
             var undownloadable = getUndownloadableBeatmapSet();
+            undownloadable.LastUpdated = DateTimeOffset.Now.AddYears(-1);
 
             var someDifficulties = getManyDifficultiesBeatmapSet(11);
             someDifficulties.Title = someDifficulties.TitleUnicode = "some difficulties";
             someDifficulties.Status = BeatmapSetOnlineStatus.Qualified;
+            someDifficulties.HasFavourited = true;
+            someDifficulties.FavouriteCount = 1;
 
             var manyDifficulties = getManyDifficultiesBeatmapSet(100);
             manyDifficulties.Status = BeatmapSetOnlineStatus.Pending;
@@ -59,6 +68,7 @@ namespace osu.Game.Tests.Visual.Beatmaps
             testCases = new[]
             {
                 normal,
+                withStatistics,
                 undownloadable,
                 someDifficulties,
                 manyDifficulties,

osu.Game/Beatmaps/Drawables/Cards/BeatmapCard.cs

@@ -1,6 +1,7 @@
 // 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 System.Collections.Generic;
 using osu.Framework.Allocation;
 using osu.Framework.Graphics;
 using osu.Framework.Graphics.Containers;
@@ -8,6 +9,7 @@ using osu.Framework.Graphics.Shapes;
 using osu.Framework.Graphics.Sprites;
 using osu.Framework.Input.Events;
 using osu.Framework.Localisation;
+using osu.Game.Beatmaps.Drawables.Cards.Statistics;
 using osu.Game.Graphics;
 using osu.Game.Graphics.Containers;
 using osu.Game.Graphics.Sprites;
@@ -40,6 +42,7 @@ namespace osu.Game.Beatmaps.Drawables.Cards
 
         private GridContainer titleContainer;
         private GridContainer artistContainer;
+        private FillFlowContainer<BeatmapCardStatistic> statisticsContainer;
 
         [Resolved]
         private OverlayColourProvider colourProvider { get; set; }
@@ -176,6 +179,15 @@ namespace osu.Game.Beatmaps.Drawables.Cards
                                     d.AddText("mapped by ", t => t.Colour = colourProvider.Content2);
                                     d.AddUserLink(beatmapSet.Author);
                                 }),
+                                statisticsContainer = new FillFlowContainer<BeatmapCardStatistic>
+                                {
+                                    RelativeSizeAxes = Axes.X,
+                                    AutoSizeAxes = Axes.Y,
+                                    Direction = FillDirection.Horizontal,
+                                    Spacing = new Vector2(10, 0),
+                                    Alpha = 0,
+                                    ChildrenEnumerable = createStatistics()
+                                }
                             }
                         },
                         new FillFlowContainer
@@ -265,6 +277,16 @@ namespace osu.Game.Beatmaps.Drawables.Cards
             return BeatmapsetsStrings.ShowDetailsByArtist(romanisableArtist);
         }
 
+        private IEnumerable<BeatmapCardStatistic> createStatistics()
+        {
+            yield return new FavouritesStatistic(beatmapSet);
+            yield return new PlayCountStatistic(beatmapSet);
+
+            var dateStatistic = BeatmapCardDateStatistic.CreateFor(beatmapSet);
+            if (dateStatistic != null)
+                yield return dateStatistic;
+        }
+
         private void updateState()
         {
             float targetWidth = width - height;
@@ -275,6 +297,7 @@ namespace osu.Game.Beatmaps.Drawables.Cards
             mainContentBackground.Dimmed.Value = IsHovered;
 
             leftCover.FadeColour(IsHovered ? OsuColour.Gray(0.2f) : Color4.White, TRANSITION_DURATION, Easing.OutQuint);
+            statisticsContainer.FadeTo(IsHovered ? 1 : 0, TRANSITION_DURATION, Easing.OutQuint);
         }
     }
 }

osu.Game/Beatmaps/Drawables/Cards/Statistics/BeatmapCardDateStatistic.cs

@@ -0,0 +1,55 @@
+// 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.
+
+#nullable enable
+
+using System;
+using osu.Framework.Extensions.LocalisationExtensions;
+using osu.Framework.Graphics.Cursor;
+using osu.Framework.Graphics.Sprites;
+using osu.Game.Graphics;
+
+namespace osu.Game.Beatmaps.Drawables.Cards.Statistics
+{
+    public class BeatmapCardDateStatistic : BeatmapCardStatistic
+    {
+        private readonly DateTimeOffset dateTime;
+
+        private BeatmapCardDateStatistic(DateTimeOffset dateTime)
+        {
+            this.dateTime = dateTime;
+
+            Icon = FontAwesome.Regular.CheckCircle;
+            Text = dateTime.ToLocalisableString(@"d MMM yyyy");
+        }
+
+        public override object TooltipContent => dateTime;
+        public override ITooltip GetCustomTooltip() => new DateTooltip();
+
+        public static BeatmapCardDateStatistic? CreateFor(IBeatmapSetOnlineInfo beatmapSetInfo)
+        {
+            var displayDate = displayDateFor(beatmapSetInfo);
+
+            if (displayDate == null)
+                return null;
+
+            return new BeatmapCardDateStatistic(displayDate.Value);
+        }
+
+        private static DateTimeOffset? displayDateFor(IBeatmapSetOnlineInfo beatmapSetInfo)
+        {
+            // reference: https://github.com/ppy/osu-web/blob/ef432c11719fd1207bec5f9194b04f0033bdf02c/resources/assets/lib/beatmapset-panel.tsx#L36-L44
+            switch (beatmapSetInfo.Status)
+            {
+                case BeatmapSetOnlineStatus.Ranked:
+                case BeatmapSetOnlineStatus.Approved:
+                case BeatmapSetOnlineStatus.Loved:
+                case BeatmapSetOnlineStatus.Qualified:
+                    return beatmapSetInfo.Ranked;
+
+                default:
+                    return beatmapSetInfo.LastUpdated;
+            }
+        }
+    }
+}

osu.Game/Beatmaps/Drawables/Cards/Statistics/BeatmapCardStatistic.cs

@@ -0,0 +1,81 @@
+// 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.Allocation;
+using osu.Framework.Graphics;
+using osu.Framework.Graphics.Containers;
+using osu.Framework.Graphics.Cursor;
+using osu.Framework.Graphics.Sprites;
+using osu.Framework.Localisation;
+using osu.Game.Graphics;
+using osu.Game.Graphics.Sprites;
+using osu.Game.Overlays;
+using osuTK;
+
+namespace osu.Game.Beatmaps.Drawables.Cards.Statistics
+{
+    /// <summary>
+    /// A single statistic shown on a beatmap card.
+    /// </summary>
+    public abstract class BeatmapCardStatistic : CompositeDrawable, IHasTooltip, IHasCustomTooltip
+    {
+        protected IconUsage Icon
+        {
+            get => spriteIcon.Icon;
+            set => spriteIcon.Icon = value;
+        }
+
+        protected LocalisableString Text
+        {
+            get => spriteText.Text;
+            set => spriteText.Text = value;
+        }
+
+        protected LocalisableString TooltipText { get; set; }
+
+        private readonly SpriteIcon spriteIcon;
+        private readonly OsuSpriteText spriteText;
+
+        protected BeatmapCardStatistic()
+        {
+            AutoSizeAxes = Axes.Both;
+
+            InternalChild = new FillFlowContainer
+            {
+                AutoSizeAxes = Axes.Both,
+                Direction = FillDirection.Horizontal,
+                Spacing = new Vector2(5, 0),
+                Children = new Drawable[]
+                {
+                    spriteIcon = new SpriteIcon
+                    {
+                        Anchor = Anchor.CentreLeft,
+                        Origin = Anchor.CentreLeft,
+                        Size = new Vector2(10),
+                        Margin = new MarginPadding { Top = 1 }
+                    },
+                    spriteText = new OsuSpriteText
+                    {
+                        Anchor = Anchor.CentreLeft,
+                        Origin = Anchor.CentreLeft,
+                        Font = OsuFont.Default.With(size: 14)
+                    }
+                }
+            };
+        }
+
+        [BackgroundDependencyLoader]
+        private void load(OverlayColourProvider colourProvider)
+        {
+            spriteIcon.Colour = colourProvider.Content2;
+        }
+
+        #region Tooltip implementation
+
+        LocalisableString IHasTooltip.TooltipText => TooltipText;
+        public virtual ITooltip GetCustomTooltip() => null;
+        public virtual object TooltipContent => null;
+
+        #endregion
+    }
+}

osu.Game/Beatmaps/Drawables/Cards/Statistics/FavouritesStatistic.cs

@@ -0,0 +1,23 @@
+// 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 Humanizer;
+using osu.Framework.Extensions.LocalisationExtensions;
+using osu.Framework.Graphics.Sprites;
+using osu.Game.Resources.Localisation.Web;
+
+namespace osu.Game.Beatmaps.Drawables.Cards.Statistics
+{
+    /// <summary>
+    /// Shows the number of favourites that a beatmap set has received.
+    /// </summary>
+    public class FavouritesStatistic : BeatmapCardStatistic
+    {
+        public FavouritesStatistic(IBeatmapSetOnlineInfo onlineInfo)
+        {
+            Icon = onlineInfo.HasFavourited ? FontAwesome.Solid.Heart : FontAwesome.Regular.Heart;
+            Text = onlineInfo.FavouriteCount.ToMetric(decimals: 1);
+            TooltipText = BeatmapsStrings.PanelFavourites(onlineInfo.FavouriteCount.ToLocalisableString(@"N0"));
+        }
+    }
+}

osu.Game/Beatmaps/Drawables/Cards/Statistics/PlayCountStatistic.cs

@@ -0,0 +1,23 @@
+// 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 Humanizer;
+using osu.Framework.Extensions.LocalisationExtensions;
+using osu.Framework.Graphics.Sprites;
+using osu.Game.Resources.Localisation.Web;
+
+namespace osu.Game.Beatmaps.Drawables.Cards.Statistics
+{
+    /// <summary>
+    /// Shows the number of times the given beatmap set has been played.
+    /// </summary>
+    public class PlayCountStatistic : BeatmapCardStatistic
+    {
+        public PlayCountStatistic(IBeatmapSetOnlineInfo onlineInfo)
+        {
+            Icon = FontAwesome.Regular.PlayCircle;
+            Text = onlineInfo.PlayCount.ToMetric(decimals: 1);
+            TooltipText = BeatmapsStrings.PanelPlaycount(onlineInfo.PlayCount.ToLocalisableString(@"N0"));
+        }
+    }
+}