Merge pull request #9745 from EVAST9919/dashboard-beatmap-panel

Implement DashboardBeatmapListing component for use in Social Overlay

osu.Game.Tests/Visual/UserInterface/TestSceneDashboardBeatmapListing.cs

@@ -0,0 +1,150 @@
+// 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.Overlays.Dashboard.Home;
+using osu.Game.Beatmaps;
+using osu.Game.Overlays;
+using osu.Framework.Allocation;
+using osu.Game.Users;
+using System;
+using osu.Framework.Graphics.Shapes;
+using System.Collections.Generic;
+
+namespace osu.Game.Tests.Visual.UserInterface
+{
+    public class TestSceneDashboardBeatmapListing : OsuTestScene
+    {
+        [Cached]
+        private readonly OverlayColourProvider colourProvider = new OverlayColourProvider(OverlayColourScheme.Purple);
+
+        private readonly Container content;
+
+        public TestSceneDashboardBeatmapListing()
+        {
+            Add(content = new Container
+            {
+                Anchor = Anchor.Centre,
+                Origin = Anchor.Centre,
+                AutoSizeAxes = Axes.Y,
+                Width = 300,
+                Children = new Drawable[]
+                {
+                    new Box
+                    {
+                        RelativeSizeAxes = Axes.Both,
+                        Colour = colourProvider.Background4
+                    },
+                    new Container
+                    {
+                        RelativeSizeAxes = Axes.X,
+                        AutoSizeAxes = Axes.Y,
+                        Padding = new MarginPadding { Horizontal = 10 },
+                        Child = new DashboardBeatmapListing(new_beatmaps, popular_beatmaps)
+                    }
+                }
+            });
+        }
+
+        protected override void LoadComplete()
+        {
+            base.LoadComplete();
+
+            AddStep("Set width to 500", () => content.ResizeWidthTo(500, 500));
+            AddStep("Set width to 300", () => content.ResizeWidthTo(300, 500));
+        }
+
+        private static readonly List<BeatmapSetInfo> new_beatmaps = new List<BeatmapSetInfo>
+        {
+            new BeatmapSetInfo
+            {
+                Metadata = new BeatmapMetadata
+                {
+                    Title = "Very Long Title (TV size) [TATOE]",
+                    Artist = "This artist has a really long name how is this possible",
+                    Author = new User
+                    {
+                        Username = "author",
+                        Id = 100
+                    }
+                },
+                OnlineInfo = new BeatmapSetOnlineInfo
+                {
+                    Covers = new BeatmapSetOnlineCovers
+                    {
+                        Cover = "https://assets.ppy.sh/beatmaps/1189904/covers/cover.jpg?1595456608",
+                    },
+                    Ranked = DateTimeOffset.Now
+                }
+            },
+            new BeatmapSetInfo
+            {
+                Metadata = new BeatmapMetadata
+                {
+                    Title = "Very Long Title (TV size) [TATOE]",
+                    Artist = "This artist has a really long name how is this possible",
+                    Author = new User
+                    {
+                        Username = "author",
+                        Id = 100
+                    }
+                },
+                OnlineInfo = new BeatmapSetOnlineInfo
+                {
+                    Covers = new BeatmapSetOnlineCovers
+                    {
+                        Cover = "https://assets.ppy.sh/beatmaps/1189904/covers/cover.jpg?1595456608",
+                    },
+                    Ranked = DateTimeOffset.MinValue
+                }
+            }
+        };
+
+        private static readonly List<BeatmapSetInfo> popular_beatmaps = new List<BeatmapSetInfo>
+        {
+            new BeatmapSetInfo
+            {
+                Metadata = new BeatmapMetadata
+                {
+                    Title = "Title",
+                    Artist = "Artist",
+                    Author = new User
+                    {
+                        Username = "author",
+                        Id = 100
+                    }
+                },
+                OnlineInfo = new BeatmapSetOnlineInfo
+                {
+                    Covers = new BeatmapSetOnlineCovers
+                    {
+                        Cover = "https://assets.ppy.sh/beatmaps/1079428/covers/cover.jpg?1595295586",
+                    },
+                    FavouriteCount = 100
+                }
+            },
+            new BeatmapSetInfo
+            {
+                Metadata = new BeatmapMetadata
+                {
+                    Title = "Title 2",
+                    Artist = "Artist 2",
+                    Author = new User
+                    {
+                        Username = "someone",
+                        Id = 100
+                    }
+                },
+                OnlineInfo = new BeatmapSetOnlineInfo
+                {
+                    Covers = new BeatmapSetOnlineCovers
+                    {
+                        Cover = "https://assets.ppy.sh/beatmaps/1079428/covers/cover.jpg?1595295586",
+                    },
+                    FavouriteCount = 10
+                }
+            }
+        };
+    }
+}

osu.Game/Overlays/Dashboard/Home/DashboardBeatmapListing.cs

@@ -0,0 +1,43 @@
+// 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;
+using osu.Game.Beatmaps;
+using osuTK;
+
+namespace osu.Game.Overlays.Dashboard.Home
+{
+    public class DashboardBeatmapListing : CompositeDrawable
+    {
+        private readonly List<BeatmapSetInfo> newBeatmaps;
+        private readonly List<BeatmapSetInfo> popularBeatmaps;
+
+        public DashboardBeatmapListing(List<BeatmapSetInfo> newBeatmaps, List<BeatmapSetInfo> popularBeatmaps)
+        {
+            this.newBeatmaps = newBeatmaps;
+            this.popularBeatmaps = popularBeatmaps;
+        }
+
+        [BackgroundDependencyLoader]
+        private void load()
+        {
+            RelativeSizeAxes = Axes.X;
+            AutoSizeAxes = Axes.Y;
+            InternalChild = new FillFlowContainer<DrawableBeatmapList>
+            {
+                RelativeSizeAxes = Axes.X,
+                AutoSizeAxes = Axes.Y,
+                Direction = FillDirection.Vertical,
+                Spacing = new Vector2(0, 10),
+                Children = new DrawableBeatmapList[]
+                {
+                    new DrawableNewBeatmapList(newBeatmaps),
+                    new DrawablePopularBeatmapList(popularBeatmaps)
+                }
+            };
+        }
+    }
+}

osu.Game/Overlays/Dashboard/Home/DashboardBeatmapPanel.cs

@@ -0,0 +1,168 @@
+// 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.Shapes;
+using osu.Framework.Graphics.Sprites;
+using osu.Framework.Input.Events;
+using osu.Game.Beatmaps;
+using osu.Game.Beatmaps.Drawables;
+using osu.Game.Graphics;
+using osu.Game.Graphics.Containers;
+using osu.Game.Graphics.Sprites;
+using osuTK;
+
+namespace osu.Game.Overlays.Dashboard.Home
+{
+    public abstract class DashboardBeatmapPanel : OsuClickableContainer
+    {
+        [Resolved]
+        protected OverlayColourProvider ColourProvider { get; private set; }
+
+        [Resolved(canBeNull: true)]
+        private BeatmapSetOverlay beatmapOverlay { get; set; }
+
+        protected readonly BeatmapSetInfo SetInfo;
+
+        private Box hoverBackground;
+        private SpriteIcon chevron;
+
+        protected DashboardBeatmapPanel(BeatmapSetInfo setInfo)
+        {
+            SetInfo = setInfo;
+        }
+
+        [BackgroundDependencyLoader]
+        private void load()
+        {
+            RelativeSizeAxes = Axes.X;
+            Height = 60;
+            Children = new Drawable[]
+            {
+                new Container
+                {
+                    RelativeSizeAxes = Axes.Both,
+                    Padding = new MarginPadding { Horizontal = -10 },
+                    Child = hoverBackground = new Box
+                    {
+                        RelativeSizeAxes = Axes.Both,
+                        Colour = ColourProvider.Background3,
+                        Alpha = 0
+                    }
+                },
+                new Container
+                {
+                    RelativeSizeAxes = Axes.Both,
+                    Child = new GridContainer
+                    {
+                        RelativeSizeAxes = Axes.Both,
+                        ColumnDimensions = new[]
+                        {
+                            new Dimension(GridSizeMode.Absolute, 70),
+                            new Dimension(),
+                            new Dimension(GridSizeMode.AutoSize)
+                        },
+                        RowDimensions = new[]
+                        {
+                            new Dimension()
+                        },
+                        Content = new[]
+                        {
+                            new Drawable[]
+                            {
+                                new Container
+                                {
+                                    RelativeSizeAxes = Axes.Both,
+                                    Masking = true,
+                                    CornerRadius = 6,
+                                    Child = new UpdateableBeatmapSetCover
+                                    {
+                                        RelativeSizeAxes = Axes.Both,
+                                        Anchor = Anchor.Centre,
+                                        Origin = Anchor.Centre,
+                                        BeatmapSet = SetInfo
+                                    }
+                                },
+                                new Container
+                                {
+                                    RelativeSizeAxes = Axes.Both,
+                                    Padding = new MarginPadding { Horizontal = 10 },
+                                    Child = new FillFlowContainer
+                                    {
+                                        Anchor = Anchor.CentreLeft,
+                                        Origin = Anchor.CentreLeft,
+                                        AutoSizeAxes = Axes.Y,
+                                        RelativeSizeAxes = Axes.X,
+                                        Direction = FillDirection.Vertical,
+                                        Children = new Drawable[]
+                                        {
+                                            new OsuSpriteText
+                                            {
+                                                RelativeSizeAxes = Axes.X,
+                                                Truncate = true,
+                                                Font = OsuFont.GetFont(weight: FontWeight.Regular),
+                                                Text = SetInfo.Metadata.Title
+                                            },
+                                            new OsuSpriteText
+                                            {
+                                                RelativeSizeAxes = Axes.X,
+                                                Truncate = true,
+                                                Font = OsuFont.GetFont(size: 12, weight: FontWeight.Regular),
+                                                Text = SetInfo.Metadata.Artist
+                                            },
+                                            new LinkFlowContainer(f => f.Font = OsuFont.GetFont(size: 10, weight: FontWeight.Regular))
+                                            {
+                                                AutoSizeAxes = Axes.Y,
+                                                RelativeSizeAxes = Axes.X,
+                                                Spacing = new Vector2(3),
+                                                Margin = new MarginPadding { Top = 2 }
+                                            }.With(c =>
+                                            {
+                                                c.AddText("by");
+                                                c.AddUserLink(SetInfo.Metadata.Author);
+                                                c.AddArbitraryDrawable(CreateInfo());
+                                            })
+                                        }
+                                    }
+                                },
+                                chevron = new SpriteIcon
+                                {
+                                    Anchor = Anchor.CentreRight,
+                                    Origin = Anchor.CentreRight,
+                                    Size = new Vector2(16),
+                                    Icon = FontAwesome.Solid.ChevronRight,
+                                    Colour = ColourProvider.Foreground1
+                                }
+                            }
+                        }
+                    }
+                }
+            };
+
+            Action = () =>
+            {
+                if (SetInfo.OnlineBeatmapSetID.HasValue)
+                    beatmapOverlay?.FetchAndShowBeatmapSet(SetInfo.OnlineBeatmapSetID.Value);
+            };
+        }
+
+        protected abstract Drawable CreateInfo();
+
+        protected override bool OnHover(HoverEvent e)
+        {
+            base.OnHover(e);
+            hoverBackground.FadeIn(200, Easing.OutQuint);
+            chevron.FadeColour(ColourProvider.Light1, 200, Easing.OutQuint);
+            return true;
+        }
+
+        protected override void OnHoverLost(HoverLostEvent e)
+        {
+            base.OnHoverLost(e);
+            hoverBackground.FadeOut(200, Easing.OutQuint);
+            chevron.FadeColour(ColourProvider.Foreground1, 200, Easing.OutQuint);
+        }
+    }
+}

osu.Game/Overlays/Dashboard/Home/DashboardNewBeatmapPanel.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 System;
+using osu.Framework.Graphics;
+using osu.Game.Beatmaps;
+using osu.Game.Graphics;
+
+namespace osu.Game.Overlays.Dashboard.Home
+{
+    public class DashboardNewBeatmapPanel : DashboardBeatmapPanel
+    {
+        public DashboardNewBeatmapPanel(BeatmapSetInfo setInfo)
+            : base(setInfo)
+        {
+        }
+
+        protected override Drawable CreateInfo() => new DrawableDate(SetInfo.OnlineInfo.Ranked ?? DateTimeOffset.Now, 10, false)
+        {
+            Colour = ColourProvider.Foreground1
+        };
+    }
+}

osu.Game/Overlays/Dashboard/Home/DashboardPopularBeatmapPanel.cs

@@ -0,0 +1,42 @@
+// 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;
+using osu.Framework.Graphics.Containers;
+using osu.Framework.Graphics.Sprites;
+using osu.Game.Beatmaps;
+using osu.Game.Graphics;
+using osu.Game.Graphics.Sprites;
+using osuTK;
+
+namespace osu.Game.Overlays.Dashboard.Home
+{
+    public class DashboardPopularBeatmapPanel : DashboardBeatmapPanel
+    {
+        public DashboardPopularBeatmapPanel(BeatmapSetInfo setInfo)
+            : base(setInfo)
+        {
+        }
+
+        protected override Drawable CreateInfo() => new FillFlowContainer
+        {
+            AutoSizeAxes = Axes.Both,
+            Direction = FillDirection.Horizontal,
+            Spacing = new Vector2(3, 0),
+            Colour = ColourProvider.Foreground1,
+            Children = new Drawable[]
+            {
+                new SpriteIcon
+                {
+                    Size = new Vector2(10),
+                    Icon = FontAwesome.Solid.Heart
+                },
+                new OsuSpriteText
+                {
+                    Font = OsuFont.GetFont(size: 10, weight: FontWeight.Regular),
+                    Text = SetInfo.OnlineInfo.FavouriteCount.ToString()
+                }
+            }
+        };
+    }
+}

osu.Game/Overlays/Dashboard/Home/DrawableBeatmapList.cs

@@ -0,0 +1,56 @@
+// 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 System.Linq;
+using osu.Framework.Allocation;
+using osu.Framework.Graphics;
+using osu.Framework.Graphics.Containers;
+using osu.Game.Beatmaps;
+using osu.Game.Graphics;
+using osu.Game.Graphics.Sprites;
+using osuTK;
+
+namespace osu.Game.Overlays.Dashboard.Home
+{
+    public abstract class DrawableBeatmapList : CompositeDrawable
+    {
+        private readonly List<BeatmapSetInfo> beatmaps;
+
+        protected DrawableBeatmapList(List<BeatmapSetInfo> beatmaps)
+        {
+            this.beatmaps = beatmaps;
+        }
+
+        [BackgroundDependencyLoader]
+        private void load(OverlayColourProvider colourProvider)
+        {
+            FillFlowContainer flow;
+
+            RelativeSizeAxes = Axes.X;
+            AutoSizeAxes = Axes.Y;
+            InternalChild = flow = new FillFlowContainer
+            {
+                RelativeSizeAxes = Axes.X,
+                AutoSizeAxes = Axes.Y,
+                Direction = FillDirection.Vertical,
+                Spacing = new Vector2(0, 10),
+                Children = new Drawable[]
+                {
+                    new OsuSpriteText
+                    {
+                        Font = OsuFont.GetFont(size: 16, weight: FontWeight.Bold),
+                        Colour = colourProvider.Light1,
+                        Text = Title
+                    }
+                }
+            };
+
+            flow.AddRange(beatmaps.Select(CreateBeatmapPanel));
+        }
+
+        protected abstract string Title { get; }
+
+        protected abstract DashboardBeatmapPanel CreateBeatmapPanel(BeatmapSetInfo setInfo);
+    }
+}

osu.Game/Overlays/Dashboard/Home/DrawableNewBeatmapList.cs

@@ -0,0 +1,20 @@
+// 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.Game.Beatmaps;
+
+namespace osu.Game.Overlays.Dashboard.Home
+{
+    public class DrawableNewBeatmapList : DrawableBeatmapList
+    {
+        public DrawableNewBeatmapList(List<BeatmapSetInfo> beatmaps)
+            : base(beatmaps)
+        {
+        }
+
+        protected override DashboardBeatmapPanel CreateBeatmapPanel(BeatmapSetInfo setInfo) => new DashboardNewBeatmapPanel(setInfo);
+
+        protected override string Title => "New Ranked Beatmaps";
+    }
+}

osu.Game/Overlays/Dashboard/Home/DrawablePopularBeatmapList.cs

@@ -0,0 +1,20 @@
+// 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.Game.Beatmaps;
+
+namespace osu.Game.Overlays.Dashboard.Home
+{
+    public class DrawablePopularBeatmapList : DrawableBeatmapList
+    {
+        public DrawablePopularBeatmapList(List<BeatmapSetInfo> beatmaps)
+            : base(beatmaps)
+        {
+        }
+
+        protected override DashboardBeatmapPanel CreateBeatmapPanel(BeatmapSetInfo setInfo) => new DashboardPopularBeatmapPanel(setInfo);
+
+        protected override string Title => "Popular Beatmaps";
+    }
+}